| | |
| | | |
| | | <script setup> |
| | | import { ref, onMounted, watch, onBeforeUnmount } from "vue"; |
| | | import { createPoint, removeEntities } from "@/utils/map"; |
| | | import { createPoint,clearAllPoints } from "@/utils/map"; |
| | | import { useSimStore } from "@/store/simulation"; |
| | | import { initeWaterPrimitiveView } from "@/utils/water"; //相机flyTo函数,后续options列表中有对应经纬度后弃用 |
| | | import { useRoute, onBeforeRouteUpdate } from "vue-router"; |
| | | import { Loading } from "@element-plus/icons-vue"; |
| | | |
| | | const districtList = ref([]); |
| | | |
| | | |
| | | const simStore = useSimStore(); |
| | | // onBeforeRouteUpdate((to, from, next) => { |
| | | // if (to.path !== "/yhgl") { |
| | | // handleCleanup(); |
| | | // } |
| | | // next(); |
| | | // }); |
| | | |
| | | const route = useRoute(); |
| | | |
| | | onBeforeUnmount(() => { |
| | | if (route.path !== "/yhgl") { |
| | | handleCleanup(); |
| | | clearAllPoints(); |
| | | } |
| | | }); |
| | | const selectValue = ref("孙胡沟"); |
| | |
| | | }, |
| | | ]); |
| | | |
| | | const districtList = ref([]); |
| | | const loading = ref(true); // 控制加载状态 |
| | | |
| | | function handleClick(district) { |
| | | // 此处调用是因为GisView页面会在点击下一乡镇之前把上一个选择的区域的隐患点清除掉(如果刚好选择了孙胡沟,那么下一个点击将会清空孙胡沟的隐患点) |
| | | initializeDevicePoints(); |
| | | const entity = viewer.entities.getById(district.hdId); |
| | | if (entity) { |
| | | viewer.flyTo(entity, { |
| | |
| | | }); |
| | | } |
| | | } |
| | | 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) => { |
| | |
| | | }) |
| | | ); |
| | | }; |
| | | // 根据区域名称过滤数据 |
| | | |
| | | const filterDataByArea = async (areaName) => { |
| | | handleCleanup(); |
| | | clearAllPoints(); |
| | | if (!areaName || !simStore.DangerPoint || simStore.DangerPoint.length === 0) { |
| | | districtList.value = []; |
| | | return; |
| | |
| | | |
| | | if (JSON.stringify(districtList.value) !== JSON.stringify(filteredData)) { |
| | | districtList.value = filteredData; |
| | | |
| | | await initializeDevicePoints(); |
| | | } |
| | | }; |
| | |
| | | }; |
| | | let isInitialized = false; |
| | | |
| | | watch( |
| | | () => simStore.DangerShowSwitch, |
| | | async (newValue, oldValue) => { |
| | | console.log("当前状态:", newValue); |
| | | // watch( |
| | | // () => simStore.DangerShowSwitch, |
| | | // async (newValue, oldValue) => { |
| | | // console.log("当前状态:", newValue); |
| | | |
| | | if (newValue) { |
| | | if (!isInitialized) { |
| | | await initializeDevicePoints(); |
| | | isInitialized = true; |
| | | } |
| | | } else { |
| | | handleCleanup(); |
| | | isInitialized = false; |
| | | } |
| | | } |
| | | ); |
| | | // if (newValue) { |
| | | // if (!isInitialized) { |
| | | // await initializeDevicePoints(); |
| | | // isInitialized = true; |
| | | // } |
| | | // } else { |
| | | // clearAllPoints(); |
| | | // isInitialized = false; |
| | | // } |
| | | // } |
| | | // ); |
| | | // 监听 simStore.DangerPoint 变化 |
| | | watch( |
| | | () => simStore.DangerPoint, |
| | |
| | | filterDataByArea(selectValue.value); |
| | | loading.value = false; // 数据加载完成 |
| | | } else { |
| | | handleCleanup(); |
| | | clearAllPoints(); |
| | | districtList.value = []; |
| | | loading.value = true; // 数据未准备就绪 |
| | | } |
| | |
| | | ); |
| | | |
| | | onMounted(() => { |
| | | handleCleanup(); |
| | | clearAllPoints(); |
| | | // initeWaterPrimitiveView(); |
| | | // 默认先检查一遍数据 |
| | | if (simStore.DangerPoint && simStore.DangerPoint.length > 0) { |