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