Merge remote-tracking branch 'origin/master'

罗广辉

2026-01-07 748131d23e54d553d6485202c7b3e0ff9e3a2410

 applications/drone-command/src/views/dataCockpit/index.vue

@@ -1,9 +1,74 @@
<!--
 * @Author       : yuan
 * @Date         : 2026-01-06 16:35:50
 * @LastEditors  : yuan
 * @LastEditTime : 2026-01-07 17:33:02
 * @FilePath     : \applications\drone-command\src\views\dataCockpit\index.vue
 * @Description  : 
 * Copyright 2026 OBKoro1, All Rights Reserved. 
 * 2026-01-06 16:35:50
-->
<template>
  <basic-container>
    维护记录管理
  </basic-container>
  <div class="page-container">
    <MapContainer />  
    <LeftContainer class="left-container" />  
    <RightContainer class="right-container" />  
    <CenterContainer />  
  </div>
</template>

<script setup>
  import MapContainer from './components/MapContainer.vue';
  import LeftContainer from './components/LeftContainer.vue';
  import RightContainer from './components/RightContainer.vue';
  import CenterContainer from './components/CenterContainer.vue';
</script>

<style scoped lang="scss">
  .page-container {
    position: relative;
    width: 100%;
    height: 100%;
  }

  .left-container,
  .right-container {
    position: absolute;
    top: 96px;
    bottom: 0;
    width: 401px;
    z-index: 9;
    backdrop-filter: blur(5px);

    ::v-deep(.wrapper) {
      position: absolute;
      top: 17px;
      bottom: 20px;
      padding: 20px;
      width: 300px;
      background: rgba(0,0,0,0.3);
      border-radius: 10px 10px 10px 10px;
    }
  }

  .left-container {
    top: 96px;
    left: 0;
    background: linear-gradient( 270deg, rgba(17,23,34,0) 0%, rgba(17,23,34,0.56) 50%, rgba(17,23,34,0.96) 100%);

    ::v-deep(.wrapper) {
      left: 17px;
    }
  }

  .right-container {
    top: 54px;
    right: 0;
    background: linear-gradient( 270deg, rgba(17,23,34,0.96) 0.16%, rgba(17,23,34,0.56) 57.57%, rgba(4,30,37,0) 100%);

    ::v-deep(.wrapper) {
      top: 21px;
      right: 17px;
    }
  }
</style>