From 1d46e10e2a56b2cf56d5453d908e06d2ba24ef3e Mon Sep 17 00:00:00 2001
From: 罗广辉 <guanghui.luo@foxmail.com>
Date: Tue, 13 Jan 2026 14:44:43 +0800
Subject: [PATCH] feat: 校验调整

---
 applications/drone-command/src/views/dataCockpit/index.vue |   89 +++++++++++++++++++++++++++++++++++++++++++-
 1 files changed, 86 insertions(+), 3 deletions(-)

diff --git a/applications/drone-command/src/views/dataCockpit/index.vue b/applications/drone-command/src/views/dataCockpit/index.vue
index 68546d2..5226ea0 100644
--- a/applications/drone-command/src/views/dataCockpit/index.vue
+++ b/applications/drone-command/src/views/dataCockpit/index.vue
@@ -1,9 +1,92 @@
+<!--
+ * @Author       : yuan
+ * @Date         : 2026-01-06 16:35:50
+ * @LastEditors  : yuan
+ * @LastEditTime : 2026-01-09 16:34:39
+ * @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 :online-devices="onlineDevices" :left-collapsed="leftCollapsed" />  
+    <LeftContainer class="left-container" v-model:activeId="leftActiveId" v-model:collapsed="leftCollapsed" />  
+    <RightContainer class="right-container" v-model:collapsed="rightCollapsed" v-model:onlineDevices="onlineDevices" />  
+    <CenterContainer @select-warning="onSelectWarning" @select-equipment="onSelectEquipment" />  
+  </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';
+
+  const leftActiveId = ref(1);
+  const leftCollapsed = ref(false);
+
+  const rightCollapsed = ref(false);
+  const onlineDevices = ref([]);
+
+  const onSelectWarning = (type) => {
+    leftActiveId.value = type;
+    leftCollapsed.value = false;
+  };
+
+  const onSelectEquipment = () => {
+    rightCollapsed.value = false;
+  };
 </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(2px);
+
+    ::v-deep(.wrapper) {
+      display: flex;
+      flex-direction: column;
+      position: absolute;
+      top: 17px;
+      bottom: 20px;
+      padding: 20px;
+      width: 300px;
+      background: rgba(0,0,0,0.3);
+      backdrop-filter: blur(16px);
+      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>

--
Gitblit v1.9.3