From 986e15a067c2f11563f2f3db8b96dc334dc28842 Mon Sep 17 00:00:00 2001
From: guonan <guonan201020@163.com>
Date: 星期五, 23 五月 2025 09:53:31 +0800
Subject: [PATCH] 提交

---
 src/components/menu/Device.vue |   97 ++++++++++++++++++++++++++++++++----------------
 1 files changed, 64 insertions(+), 33 deletions(-)

diff --git a/src/components/menu/Device.vue b/src/components/menu/Device.vue
index 1ea39aa..b909ffc 100644
--- a/src/components/menu/Device.vue
+++ b/src/components/menu/Device.vue
@@ -6,28 +6,12 @@
     <div class="left-content device-content">
       <div style="margin-left: 5px">
         <span style="color: white">閲嶇偣娌燂細</span>
-        <el-select
-          @change="handleChange"
-          v-model="selectValue"
-          placeholder="Select"
-          size="large"
-          style="width: 240px"
-        >
-          <el-option
-            v-for="item in options"
-            :key="item.value"
-            :label="item.label"
-            :value="item.value"
-          />
+        <el-select @change="handleChange" v-model="selectValue" placeholder="Select" size="large" style="width: 240px">
+          <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
         </el-select>
       </div>
-      <el-tree
-        :data="deviceTree"
-        node-key="deviceId"
-        :props="treeProps"
-        @node-click="handleTreeNodeClick"
-        class="device-tree"
-      >
+      <el-tree :data="deviceTree" node-key="deviceId" :props="treeProps" @node-click="handleTreeNodeClick"
+        class="device-tree">
         <template #default="{ node, data }">
           <span v-if="!data.children" class="device-tree-item">
             <!-- <div class="device-item-icon"></div> -->
@@ -43,30 +27,77 @@
 </template>
 
 <script setup>
-import { ref, computed, onMounted } from "vue";
+import { ref, computed, onMounted, watch, onBeforeUnmount, } from "vue";
+import { useRoute, onBeforeRouteUpdate } from 'vue-router';
+import { createPoint, removeEntities } from "@/utils/map";
 import { deviceDictList, getDictName } from "@/constant/dict.js";
 import { getDeviceInfo } from "@/api/hpApi";
-
-// 瀹氫箟涓�涓搷搴斿紡寮曠敤瀛樺偍璁惧鍒楄〃
-const deviceListAll = ref([]);
-
-// 缁勪欢鎸傝浇鏃惰幏鍙栬澶囦俊鎭紝榛樿杩囨护鈥滃瓩鑳℃矡鈥�
+import { initeWaterPrimitiveView } from "@/utils/water"; //鐩告満flyTo鍑芥暟锛屽悗缁璷ptions鍒楄〃涓湁瀵瑰簲缁忕含搴﹀悗寮冪敤
+import { useSimStore } from "@/store/simulation";
+const simStore = useSimStore();
 onMounted(() => {
   loadDeviceList("瀛欒儭娌�");
+  initeWaterPrimitiveView()
 });
 
+// onBeforeRouteUpdate((to, from, next) => {
+//   if (to.path !== '/zhjc') {
+//     handleCleanup();
+//   }
+//   next();
+// });
+const route = useRoute();
+
+onBeforeUnmount(() => {
+  if (route.path !== '/zhjc') {
+    handleCleanup();
+  }
+});
+watch(() => simStore.DeviceShowSwitch, (newValue, oldValue) => {
+  if (newValue) {
+    initializeDevicePoints();
+  } else {
+    handleCleanup()
+  }
+});
+const deviceListAll = ref([]);
+const deviceEntities = ref([]);
+const handleCleanup = () => {
+  deviceListAll.value.forEach(item => {
+    removeEntities(item.deviceId);
+  });
+}
+const initializeDevicePoints = () => {
+  const list = [];
+  deviceListAll.value.forEach((item, index) => {
+    // 鏍规嵁闇�姹傚彲澧炲垹
+    item.type = getDictName(deviceDictList, item.dictDeviceType);
+    item.name = item.deviceName.split(selectValue.value)[1] || item.deviceName;
+    item.id = item.deviceId;
+    item.className = "device";
+    item.showLabel = true;
+    // 鎵撳嵃姣忎釜璁惧鐨勫悕绉板拰璁惧绫诲瀷
+    // console.log(`璁惧鍚嶇О: ${item.id}, 璁惧绫诲瀷: ${item.name}`);
+    createPoint(item);
+  });
+  deviceEntities.value = list;
+};
 // 鏍规嵁鍖哄煙鍚嶇О鍔犺浇璁惧鍒楄〃
 const loadDeviceList = async (areaName) => {
   try {
-    const res = await getDeviceInfo(); // 璋冩暣getDeviceInfo浠ユ帴鍙楀姩鎬佸弬鏁帮紝濡傛灉闇�瑕佺殑璇�
-    deviceListAll.value = res.data.pageData.filter((item) =>
+    handleCleanup()
+    const res = await getDeviceInfo();
+    const allDevices = res.data.pageData;
+    const devicesInArea = allDevices.filter((item) =>
       item.deviceName?.includes(areaName)
     );
+    deviceListAll.value = devicesInArea;
+    deviceListAll.length = 0;
+    initializeDevicePoints();
   } catch (error) {
     console.error("鍔犺浇璁惧淇℃伅澶辫触", error);
   }
 };
-
 // 澶勭悊鍖哄煙鍙樺寲浜嬩欢
 const handleChange = (item) => {
   if (!item) {
@@ -75,7 +106,7 @@
   }
   // 鏍规嵁鏂板尯鍩熷悕閲嶆柊鍔犺浇璁惧鍒楄〃
   loadDeviceList(item);
-  console.log(deviceListAll.value);
+  // console.log(deviceListAll.value);
 };
 
 const selectValue = ref("瀛欒儭娌�");
@@ -115,12 +146,10 @@
   // 鍏堟寜璁惧绫诲瀷鍒嗙粍
   deviceListAll.value.forEach((device) => {
     const typeName = getDictName(deviceDictList, device.dictDeviceType);
-
     if (!typeName) {
       console.warn("鏈壘鍒拌澶囩被鍨�:", device);
       return;
     }
-
     if (!typeMap[typeName]) {
       typeMap[typeName] = [];
     }
@@ -222,12 +251,14 @@
 :deep(.el-select__placeholder) {
   color: white;
 }
+
 :deep(.el-select-dropdown__item.hover),
 :deep(.el-select-dropdown__item:hover) {
   color: white !important;
   background-color: rgb(38, 124, 124, 0.5);
 }
+
 :deep(.el-tree-node__content) {
-  padding-left: 0px !important ;
+  padding-left: 0px !important;
 }
 </style>

--
Gitblit v1.9.3