From d72bfc760302c524622e4484ad5175d03ca45ce7 Mon Sep 17 00:00:00 2001
From: wangjuncheng <1>
Date: 星期一, 19 五月 2025 12:08:24 +0800
Subject: [PATCH] change
---
src/components/menu/Device.vue | 74 +++++++++++++++++++++---------------
1 files changed, 43 insertions(+), 31 deletions(-)
diff --git a/src/components/menu/Device.vue b/src/components/menu/Device.vue
index 1ea39aa..e3d7932 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,56 @@
</template>
<script setup>
-import { ref, computed, onMounted } from "vue";
+import { createPoint, removeEntities } from "@/utils/map";
+import { ref, computed, onMounted, watch } from "vue";
import { deviceDictList, getDictName } from "@/constant/dict.js";
import { getDeviceInfo } from "@/api/hpApi";
-
-// 瀹氫箟涓�涓搷搴斿紡寮曠敤瀛樺偍璁惧鍒楄〃
+import { initeWaterPrimitiveView } from "@/utils/water"; //鐩告満flyTo鍑芥暟锛屽悗缁璷ptions鍒楄〃涓湁瀵瑰簲缁忕含搴﹀悗寮冪敤
+import { useSimStore } from "@/store/simulation";
+const simStore = useSimStore();
const deviceListAll = ref([]);
-
-// 缁勪欢鎸傝浇鏃惰幏鍙栬澶囦俊鎭紝榛樿杩囨护鈥滃瓩鑳℃矡鈥�
onMounted(() => {
loadDeviceList("瀛欒儭娌�");
+ initeWaterPrimitiveView()
});
-
+watch(() => simStore.DeviceShowSwitch, (newValue, oldValue) => {
+ if (newValue) {
+ initializeDevicePoints();
+ } else {
+ removeEntities();
+ }
+});
+const deviceEntities = ref([]);
+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.deviceName}, 璁惧绫诲瀷: ${item.dictDeviceType}`);
+ createPoint(item);
+ });
+ deviceEntities.value = list;
+};
// 鏍规嵁鍖哄煙鍚嶇О鍔犺浇璁惧鍒楄〃
const loadDeviceList = async (areaName) => {
try {
- const res = await getDeviceInfo(); // 璋冩暣getDeviceInfo浠ユ帴鍙楀姩鎬佸弬鏁帮紝濡傛灉闇�瑕佺殑璇�
- deviceListAll.value = res.data.pageData.filter((item) =>
+ const res = await getDeviceInfo();
+ const allDevices = res.data.pageData;
+ const devicesInArea = allDevices.filter((item) =>
item.deviceName?.includes(areaName)
);
+ deviceListAll.value = devicesInArea;
+ removeEntities();
+ initializeDevicePoints();
} catch (error) {
console.error("鍔犺浇璁惧淇℃伅澶辫触", error);
}
};
-
// 澶勭悊鍖哄煙鍙樺寲浜嬩欢
const handleChange = (item) => {
if (!item) {
@@ -75,7 +85,7 @@
}
// 鏍规嵁鏂板尯鍩熷悕閲嶆柊鍔犺浇璁惧鍒楄〃
loadDeviceList(item);
- console.log(deviceListAll.value);
+ // console.log(deviceListAll.value);
};
const selectValue = ref("瀛欒儭娌�");
@@ -222,12 +232,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