From f5688d9765782bbb97b3abb8ee99fe7b9834a149 Mon Sep 17 00:00:00 2001
From: wangjuncheng <1>
Date: 星期一, 19 五月 2025 14:39:46 +0800
Subject: [PATCH] change
---
src/components/tools/LayerTree.vue | 58 +++++++++++-------
src/components/tools/Legend_yhgl.vue | 2
src/components/tools/Legend_zhjc.vue | 2
src/components/menu/Device.vue | 2
src/store/simulation.js | 2
src/components/menu/Location.vue | 84 ++++++++++++++++++---------
6 files changed, 96 insertions(+), 54 deletions(-)
diff --git a/src/components/menu/Device.vue b/src/components/menu/Device.vue
index 0f7ceb0..bd23511 100644
--- a/src/components/menu/Device.vue
+++ b/src/components/menu/Device.vue
@@ -77,7 +77,7 @@
item.className = "device";
item.showLabel = true;
// 鎵撳嵃姣忎釜璁惧鐨勫悕绉板拰璁惧绫诲瀷
- console.log(`璁惧鍚嶇О: ${item.id}, 璁惧绫诲瀷: ${item.name}`);
+ // console.log(`璁惧鍚嶇О: ${item.id}, 璁惧绫诲瀷: ${item.name}`);
createPoint(item);
});
deviceEntities.value = list;
diff --git a/src/components/menu/Location.vue b/src/components/menu/Location.vue
index c239e71..7749e80 100644
--- a/src/components/menu/Location.vue
+++ b/src/components/menu/Location.vue
@@ -7,19 +7,8 @@
<div class="left-content district-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>
@@ -29,13 +18,7 @@
<div v-if="loading" class="loading-overlay">
<div class="spinner"></div>
</div>
- <div
- v-else
- v-for="(item, key) in districtList"
- :key="key"
- class="district-item"
- @click="handleClick(item)"
- >
+ <div v-else v-for="(item, key) in districtList" :key="key" class="district-item" @click="handleClick(item)">
<div class="district-item-icon"></div>
<div class="district-item-text">{{ item.hdName }}</div>
</div>
@@ -45,12 +28,25 @@
</template>
<script setup>
-import { ref, onMounted, watch } from "vue";
-import { createPoint } from "@/utils/map";
+import { ref, onMounted, watch, onBeforeUnmount } from "vue";
+import { createPoint, removeEntities } from "@/utils/map";
import { useSimStore } from "@/store/simulation";
-
+import { initeWaterPrimitiveView } from "@/utils/water"; //鐩告満flyTo鍑芥暟锛屽悗缁璷ptions鍒楄〃涓湁瀵瑰簲缁忕含搴﹀悗寮冪敤
+import { useRoute, onBeforeRouteUpdate } from 'vue-router';
const simStore = useSimStore();
+onBeforeRouteUpdate((to, from, next) => {
+ if (to.path !== '/yhgl') {
+ handleCleanup();
+ }
+ next();
+});
+const route = useRoute();
+onBeforeUnmount(() => {
+ if (route.path !== '/yhgl') {
+ handleCleanup();
+ }
+});
const selectValue = ref("瀛欒儭娌�");
const options = ref([
@@ -91,9 +87,27 @@
});
}
}
-
+const handleCleanup = async () => {
+ await Promise.all(districtList.value.map(item => removeEntities(item.hdId)));
+}
+const initializeDevicePoints = async () => {
+ await Promise.all(districtList.value.map(async (item, index) => {
+ // 鏍规嵁闇�姹傚彲澧炲垹
+ item.id = item.hdId;
+ item.name = item.hdName;
+ item.latitude = item.lat;
+ item.longitude = item.lon;
+ item.showBillboard = true;
+ item.type = item.disasterType;
+ item.className = "district";
+ await createPoint(item);
+ // 鎵撳嵃姣忎釜璁惧鐨勫悕绉板拰璁惧绫诲瀷
+ // console.log(`璁惧鍚嶇О: ${item.id}, 璁惧绫诲瀷: ${item.name}`);
+ }));
+};
// 鏍规嵁鍖哄煙鍚嶇О杩囨护鏁版嵁
-const filterDataByArea = (areaName) => {
+const filterDataByArea = async (areaName) => {
+ handleCleanup();
if (!areaName || !simStore.DangerPoint || simStore.DangerPoint.length === 0) {
districtList.value = [];
return;
@@ -102,6 +116,7 @@
districtList.value = simStore.DangerPoint.filter((item) =>
item.position?.includes(areaName)
);
+ await initializeDevicePoints();
};
// 澶勭悊鍖哄煙鍙樺寲浜嬩欢
@@ -111,10 +126,15 @@
ElMessage.warning("璇烽�夋嫨涓�涓尯鍩�");
return;
}
-
filterDataByArea(areaName);
};
-
+watch(() => simStore.DangerShowSwitch, (newValue, oldValue) => {
+ if (newValue) {
+ initializeDevicePoints();
+ } else {
+ handleCleanup()
+ }
+});
// 鐩戝惉 simStore.DangerPoint 鍙樺寲
watch(
() => simStore.DangerPoint,
@@ -123,6 +143,7 @@
filterDataByArea(selectValue.value);
loading.value = false; // 鏁版嵁鍔犺浇瀹屾垚
} else {
+ handleCleanup();
districtList.value = [];
loading.value = true; // 鏁版嵁鏈噯澶囧氨缁�
}
@@ -131,6 +152,8 @@
);
onMounted(() => {
+ handleCleanup()
+ initeWaterPrimitiveView()
// 榛樿鍏堟鏌ヤ竴閬嶆暟鎹�
if (simStore.DangerPoint && simStore.DangerPoint.length > 0) {
filterDataByArea("瀛欒儭娌�");
@@ -148,7 +171,8 @@
left: 0px;
right: 0px;
bottom: 10px;
- background-color: rgba(236, 233, 233, 0.5); /* 鍗婇�忔槑閬僵 */
+ background-color: rgba(236, 233, 233, 0.5);
+ /* 鍗婇�忔槑閬僵 */
display: flex;
align-items: center;
justify-content: center;
@@ -169,6 +193,7 @@
transform: rotate(360deg);
}
}
+
.district {
position: absolute;
width: 345px;
@@ -183,10 +208,12 @@
cursor: pointer;
margin-top: 10px;
}
+
.district-content {
padding: 10px;
box-sizing: border-box;
}
+
.district-item-icon {
background: url("@/assets/img/menu/locationicon.png") no-repeat;
background-position: 5px 5px;
@@ -213,6 +240,7 @@
/deep/ .el-select__placeholder {
color: white;
}
+
/deep/ .el-select-dropdown__item.hover,
.el-select-dropdown__item:hover {
color: white !important;
diff --git a/src/components/tools/LayerTree.vue b/src/components/tools/LayerTree.vue
index c534081..87a046b 100644
--- a/src/components/tools/LayerTree.vue
+++ b/src/components/tools/LayerTree.vue
@@ -196,6 +196,18 @@
}
return;
}
+if (label === "瀛欒儭娌熼殣鎮ｇ偣") {
+ simStore.DangerShowSwitch = checked;
+ if (checked) {
+ if (!treeMap.get("瀛欒儭娌熼殣鎮ｇ偣")) {
+ } else {
+ toggleLayerVisible("瀛欒儭娌熼殣鎮ｇ偣", true);
+ }
+ } else {
+ toggleLayerVisible("瀛欒儭娌熼殣鎮ｇ偣", false);
+ }
+ return;
+}
// 鍏朵粬鍥惧眰鐨勫鐞嗛�昏緫
const list = treeMap.get(label);
@@ -231,7 +243,7 @@
} else if (entityList && typeof entityList.show !== "undefined") {
entityList.show = checked;
} else {
- console.error(`鏃犳硶璁剧疆鍥惧眰 ${name} 鐨勫彲瑙佹�);
+ // console.error(`鏃犳硶璁剧疆鍥惧眰 ${name} 鐨勫彲瑙佹�);
}
}
@@ -264,31 +276,31 @@
}
// 闅愭偅鐐瑰垪琛�
-watchEffect(() => {
- const dangerPoints = simStore.DangerPoint.filter((item) =>
- item.position?.includes("瀛欒儭娌�")
- );
+// watchEffect(() => {
+// const dangerPoints = simStore.DangerPoint.filter((item) =>
+// item.position?.includes("瀛欒儭娌�")
+// );
- if (dangerPoints && dangerPoints.length > 0) {
- const list = [];
+// if (dangerPoints && dangerPoints.length > 0) {
+// const list = [];
- dangerPoints.forEach((item) => {
- // console.log(item, "item");
- item.id = item.hdId;
- item.name = item.hdName;
- item.latitude = item.lat;
- item.longitude = item.lon;
- item.showBillboard = true;
- item.type = item.disasterType;
- item.className = "district";
- const entity = createPoint(item);
- entity.show = false;
- list.push(entity);
- });
+// dangerPoints.forEach((item) => {
+// // console.log(item, "item");
+// item.id = item.hdId;
+// item.name = item.hdName;
+// item.latitude = item.lat;
+// item.longitude = item.lon;
+// item.showBillboard = true;
+// item.type = item.disasterType;
+// item.className = "district";
+// const entity = createPoint(item);
+// entity.show = false;
+// list.push(entity);
+// });
- treeMap.set("瀛欒儭娌熼殣鎮ｇ偣", list);
- }
-});
+// treeMap.set("瀛欒儭娌熼殣鎮ｇ偣", list);
+// }
+// });
let divPointList = [];
/**
diff --git a/src/components/tools/Legend_yhgl.vue b/src/components/tools/Legend_yhgl.vue
index 1fc72d8..c2f2f60 100644
--- a/src/components/tools/Legend_yhgl.vue
+++ b/src/components/tools/Legend_yhgl.vue
@@ -26,7 +26,7 @@
};
onMounted(() => {
- console.log("杩欓噷鏄浘渚嬮泦鍚堬紒");
+ // console.log("杩欓噷鏄浘渚嬮泦鍚堬紒");
});
</script>
diff --git a/src/components/tools/Legend_zhjc.vue b/src/components/tools/Legend_zhjc.vue
index b98d545..1eaa2bf 100644
--- a/src/components/tools/Legend_zhjc.vue
+++ b/src/components/tools/Legend_zhjc.vue
@@ -31,7 +31,7 @@
};
onMounted(() => {
- console.log("杩欓噷鏄浘渚嬮泦鍚堬紒");
+ // console.log("杩欓噷鏄浘渚嬮泦鍚堬紒");
});
</script>
diff --git a/src/store/simulation.js b/src/store/simulation.js
index b9b4a5e..ccd3df7 100644
--- a/src/store/simulation.js
+++ b/src/store/simulation.js
@@ -6,6 +6,7 @@
export const useSimStore = defineStore('simulation', () => {
// 闅愭偅鐐瑰垪琛�
const DeviceShowSwitch = ref(true)
+ const DangerShowSwitch = ref(true)
const DangerPoint = ref([])
const navigationShow = ref(true)
const leftShow = ref(false)
@@ -149,6 +150,7 @@
rainFalls,
DangerPoint,
DeviceShowSwitch,
+ DangerShowSwitch,
// 鏂规鐩稿叧鏂规硶
setSchemCard,
--
Gitblit v1.9.3