Merge branch 'master' of http://103.135.160.14:9034/r/NslWeb

wangjuncheng

2025-04-18 f82eb01fe65e513fb43342db0e25cafa0e0d2db8

 src/components/tools/LayerTree.vue

@@ -13,18 +13,22 @@
</template>

<script setup>
import { ref, onMounted, onBeforeUnmount, watch, onUnmounted } from "vue"
import { createPoint, removeEntities, addTileset } from "@/utils/map"
import { deviceDictList, getDictName } from "@/constant/dict.js"
import { useRoute } from "vue-router"
import { loadAreaPolygon, clearAreaPolygon } from '@/utils/area'
import { checkedKeys } from '@/store/index'
import { getDuanMainData } from '@/api/index.js'
const route = useRoute()
import { ref, onMounted, onBeforeUnmount, watch, onUnmounted } from "vue";
import { createPoint, removeEntities, addTileset } from "@/utils/map";
import { deviceDictList, getDictName } from "@/constant/dict.js";
import { useRoute } from "vue-router";
import { loadAreaPolygon, clearAreaPolygon } from "@/utils/area";
import { checkedKeys } from "@/store/index";
import { getDuanMainData } from "@/api/index.js";
const route = useRoute();
const treeData = ref([
   {
      label: "三维服务",
      children: [{ label: "模型数据" }, { label: "地形数据" }, { label: "影像数据" }],
    children: [
      { label: "模型数据" },
      { label: "地形数据" },
      { label: "影像数据" },
    ],
   },
   {
      label: "图层数据",
@@ -49,40 +53,39 @@
         },
      ],
   },
])
const treeRef = ref(null)
const treeMap = new Map()
const defaultSelectedKeys = ref(["模型数据", "影像数据", "地形数据"])
]);
const treeRef = ref(null);
const treeMap = new Map();
const defaultSelectedKeys = ref(["模型数据", "影像数据", "地形数据"]);
function handleCheckChange(data, checked, indeterminate) {
   const label = data.label
   const list = treeMap.get(label)
  const label = data.label;
  const list = treeMap.get(label);
   if (list) {
      toggleLayerVisible(label, checked)
      return
    toggleLayerVisible(label, checked);
    return;
   }
   switch (label) {
      case "模型数据":
         list.show = checked
         break
      list.show = checked;
      break;
      case "北京市隐患点":
         console.log("北京市隐患点", checked, indeterminate)
         break
      console.log("北京市隐患点", checked, indeterminate);
      break;
      case "孙胡沟隐患点":
         console.log("孙胡沟隐患点", checked, indeterminate)
         break
      console.log("孙胡沟隐患点", checked, indeterminate);
      break;
      case "泥石流隐患点面数据":
         console.log("泥石流隐患点面数据", checked, indeterminate)
         break
      console.log("泥石流隐患点面数据", checked, indeterminate);
      break;
      case "综合监测设备信息":
         console.log("综合监测设备信息", checked, indeterminate)
         break
      console.log("综合监测设备信息", checked, indeterminate);
      break;
      case "孙胡沟仿真标注地物":
         console.log("孙胡沟仿真标注地物", checked, indeterminate)
         break
      console.log("孙胡沟仿真标注地物", checked, indeterminate);
      break;
      case "避险点":
         addTetrahedron()
         break

      addTetrahedron();
      break;
   }
}
function initMap() {
@@ -96,12 +99,17 @@
   //    sourceType: "tms",
   //    url: "http://106.120.22.26:9103/gisserver/tmsserver/sunhugoudom",
   // })
  //   let TerrainLayer = earthCtrl.factory.createTerrainLayer({
  //     sourceType: "ctb",
  //     url: "http://106.120.22.26:9103/gisserver/ctsserver/sungugoudem",
  //   });
   let TerrainLayer = earthCtrl.factory.createTerrainLayer({
      sourceType: "ctb",
      url: "http://106.120.22.26:9103/gisserver/ctsserver/sungugoudem",
   })
    url: "https://tiles1.geovisearth.com/base/v1/terrain?token=486dac3bec56d7d7c2a581c150be2bd937462f1e8f3bc9c78b5658b396122405",
    requestVertexNormals: true,
  });
   // treeMap.set("影像数据", ImageryLayer)
   treeMap.set("地形数据", TerrainLayer)
  treeMap.set("地形数据", TerrainLayer);
}

const devicetList = ref([
@@ -265,23 +273,23 @@
      latitude: 40.533623,
      longitude: 116.602406,
   },
])
]);

function initDevicePoint() {
   let list = []
  let list = [];

   devicetList.value.forEach(item => {
      item.type = getDictName(deviceDictList, item.dictDeviceType)
      item.name = item.type
      item.id = item.deviceId
      item.className = "device"
      item.showLabel = true
      const entity = createPoint(item)
      entity.show = false
  devicetList.value.forEach((item) => {
    item.type = getDictName(deviceDictList, item.dictDeviceType);
    item.name = item.type;
    item.id = item.deviceId;
    item.className = "device";
    item.showLabel = true;
    const entity = createPoint(item);
    entity.show = false;

      list.push(entity)
   })
   treeMap.set("综合监测设备信息", list)
    list.push(entity);
  });
  treeMap.set("综合监测设备信息", list);
}

const districtList = ref([
@@ -309,7 +317,8 @@
      monitor: "",
      monitorAdvice: "",
      name: "尹家西沟尹建燕家屋后崩塌隐患点",
      number: "13716108909,13716029391,13716291714,13716191943,13716427398,13124792612",
    number:
      "13716108909,13716029391,13716291714,13716191943,13716427398,13124792612",
      preventionDes: "",
      preventionLevel: "",
      preventionPlan: "定期巡查，预警转移，立警示牌",
@@ -360,7 +369,8 @@
      monitor: "",
      monitorAdvice: "",
      name: "河西于凤英家屋后崩塌隐患点",
      number: "13716108909,13716029391,13716291714,13716191943,13716427398,13124792612",
    number:
      "13716108909,13716029391,13716291714,13716191943,13716427398,13124792612",
      preventionDes: "",
      preventionLevel: "",
      preventionPlan: "定期巡查，预警转移，立警示牌",
@@ -411,7 +421,8 @@
      monitor: "",
      monitorAdvice: "",
      name: "南梁小东沟泥石流隐患点",
      number: "13716108909,13716029391,13716291714,13716191943,13716427398,13124792612",
    number:
      "13716108909,13716029391,13716291714,13716191943,13716427398,13124792612",
      preventionDes: "",
      preventionLevel: "",
      preventionPlan: "定期巡查,立警示牌",
@@ -462,7 +473,8 @@
      monitor: "",
      monitorAdvice: "",
      name: "大窑沟泥石流隐患点",
      number: "13716108909,13716029391,13716291714,13716191943,13716427398,13124792612",
    number:
      "13716108909,13716029391,13716291714,13716191943,13716427398,13124792612",
      preventionDes: "已监测、已治理",
      preventionLevel: "",
      preventionPlan: "定期巡查，预警转移，立警示牌",
@@ -513,7 +525,8 @@
      monitor: "",
      monitorAdvice: "",
      name: "大东沟泥石流隐患点",
      number: "13716108909,13716029391,13716291714,13716191943,13716427398,13124792612",
    number:
      "13716108909,13716029391,13716291714,13716191943,13716427398,13124792612",
      preventionDes: "已治理",
      preventionLevel: "",
      preventionPlan: "定期巡查，预警转移",
@@ -564,8 +577,10 @@
      monitor: "",
      monitorAdvice: "",
      name: "尹家西沟泥石流隐患点",
      number: "13716108909,13716029391,13716291714,13716191943,13716427398,13124792612",
      preventionDes: "已监测；灾害体变化：4处坡积物垮塌，堆积至坡脚，方量约20m³。",
    number:
      "13716108909,13716029391,13716291714,13716191943,13716427398,13124792612",
    preventionDes:
      "已监测；灾害体变化：4处坡积物垮塌，堆积至坡脚，方量约20m³。",
      preventionLevel: "",
      preventionPlan: "定期巡查，预警转移",
      preventionUnit: "乡镇",
@@ -615,7 +630,8 @@
      monitor: "",
      monitorAdvice: "",
      name: "北大地西洼子沟泥石流隐患点",
      number: "13716108909,13716029391,13716291714,13716191943,13716427398,13124792612",
    number:
      "13716108909,13716029391,13716291714,13716191943,13716427398,13124792612",
      preventionDes: "沟口正对房屋，降雨时出水量大，建议治理，汛期加强巡查",
      preventionLevel: "",
      preventionPlan: "定期巡查，预警转移，立警示牌",
@@ -666,7 +682,8 @@
      monitor: "",
      monitorAdvice: "",
      name: "范家庄王秀莲家屋后崩塌隐患点",
      number: "13716108909,13716029391,13716291714,13716191943,13716427398,13124792612",
    number:
      "13716108909,13716029391,13716291714,13716191943,13716427398,13124792612",
      preventionDes: "边坡较陡，顺向岩层，房屋靠近坡脚，建议尽快治理",
      preventionLevel: "",
      preventionPlan: "定期巡查，预警转移，立警示牌",
@@ -717,7 +734,8 @@
      monitor: "",
      monitorAdvice: "",
      name: "三亩地范忠田家屋后崩塌隐患点",
      number: "13716108909,13716029391,13716291714,13716191943,13716427398,13124792612",
    number:
      "13716108909,13716029391,13716291714,13716191943,13716427398,13124792612",
      preventionDes: "",
      preventionLevel: "",
      preventionPlan: "定期巡查，预警转移，更换警示牌",
@@ -768,8 +786,10 @@
      monitor: "",
      monitorAdvice: "",
      name: "于家西沟泥石流隐患点",
      number: "13716108909,13716029391,13716291714,13716191943,13716427398,13124792612",
      preventionDes: "已监测，2018村已治理；沟口堆积扇明显，正对房屋，建议汛期加强巡查",
    number:
      "13716108909,13716029391,13716291714,13716191943,13716427398,13124792612",
    preventionDes:
      "已监测，2018村已治理；沟口堆积扇明显，正对房屋，建议汛期加强巡查",
      preventionLevel: "",
      preventionPlan: "定期巡查，预警转移",
      preventionUnit: "乡镇",
@@ -819,7 +839,8 @@
      monitor: "",
      monitorAdvice: "",
      name: "椴树底下东沟泥石流隐患点",
      number: "13716108909,13716029391,13716291714,13716191943,13716427398,13124792612",
    number:
      "13716108909,13716029391,13716291714,13716191943,13716427398,13124792612",
      preventionDes: "已治理：威胁对象重复：与110116030015重复5户11人",
      preventionLevel: "",
      preventionPlan: "定期巡查，预警转移，立警示牌",
@@ -870,7 +891,8 @@
      monitor: "",
      monitorAdvice: "",
      name: "河东南沟泥石流隐患点",
      number: "13716108909,13716029391,13716291714,13716191943,13716427398,13124792612",
    number:
      "13716108909,13716029391,13716291714,13716191943,13716427398,13124792612",
      preventionDes: "已监测",
      preventionLevel: "",
      preventionPlan: "定期巡查,立警示牌",
@@ -897,40 +919,39 @@
      volumePotential: "",
      width: 0,
   },
])
]);

function initDistrictPoint() {
   let list = []
   districtList.value.forEach(item => {
      item.showBillboard = true
      item.className = "district"
      item.type = '泥石流'
      const entity = createPoint(item)
      entity.show = false
      list.push(entity)
   })
   treeMap.set("孙胡沟隐患点", list)
  let list = [];
  districtList.value.forEach((item) => {
    item.showBillboard = true;
    item.className = "district";
    item.type = "泥石流";
    const entity = createPoint(item);
    entity.show = false;
    list.push(entity);
  });
  treeMap.set("孙胡沟隐患点", list);
}


let divPointList = []
let divPointList = [];

function initDuanmianPoint() {
   getDuanMainData().then(res => {
      const duanmianList = res.data
      const list = []
      duanmianList.forEach(item => {
         item.id = item.id + item.alias
         item.name = item.alias
         item.longitude = item.lon
         item.latitude = item.lat
         item.showBillboard = false
         item.className = "district"
  getDuanMainData().then((res) => {
    const duanmianList = res.data;
    const list = [];
    duanmianList.forEach((item) => {
      item.id = item.id + item.alias;
      item.name = item.alias;
      item.longitude = item.lon;
      item.latitude = item.lat;
      item.showBillboard = false;
      item.className = "district";

         const entity = createPoint(item)
         entity.show = false
         list.push(entity)
         return
      const entity = createPoint(item);
      entity.show = false;
      list.push(entity);
      return;
         const divPoint = earthCtrl.factory.createDivPoint(
            item.alias,
            { lon: longitude, lat: latitude },
@@ -945,26 +966,23 @@
               near: 0,
               far: 500000,
            }
         )
         divPoint.item.show = false
         console.log(divPoint)
      );
      divPoint.item.show = false;
      console.log(divPoint);

         divPointList.push(divPoint.item)
      })
      treeMap.set("孙胡沟仿真标注地物", list)
   })

      divPointList.push(divPoint.item);
    });
    treeMap.set("孙胡沟仿真标注地物", list);
  });
}

function addTetrahedron(visible) {
   const emergencyAreaList = []
  const emergencyAreaList = [];

   loadAreaPolygon("/json/emergency_area.geojson", true).then(entities => {
      emergencyAreaList.push(...entities)
   })
  loadAreaPolygon("/json/emergency_area.geojson", true).then((entities) => {
    emergencyAreaList.push(...entities);
  });
   // console.log('polygon', polygon);



   let list = [
      {
@@ -985,8 +1003,8 @@
         latitude: 40.558199,
         altitude: 528,
      },
   ]
   list.forEach(item => {
  ];
  list.forEach((item) => {
      let point = earthCtrl.factory.addTetrahedron({
         position: {
            lon: item.longitude,
@@ -995,70 +1013,78 @@
         },
         multiple: 1.0,
         scale: new SmartEarth.Cesium.Cartesian3(20, 20, 20),
      })
      console.log("point", point)
      emergencyAreaList.push(point)

   })
   treeMap.set("避险点", emergencyAreaList)

    });
    console.log("point", point);
    emergencyAreaList.push(point);
  });
  treeMap.set("避险点", emergencyAreaList);
}
function toggleLayerVisible(name, checked) {
   const entityList = treeMap.get(name)
  const entityList = treeMap.get(name);
   if (Array.isArray(entityList) && entityList.length > 0) {
      entityList.forEach(entity => {
         entity.show = checked
      })
    entityList.forEach((entity) => {
      entity.show = checked;
    });
   }
   treeMap.set(name, entityList)
  treeMap.set(name, entityList);
}

function getData() {
   initDevicePoint()
   initDistrictPoint()
   initDuanmianPoint()
  initDevicePoint();
  initDistrictPoint();
  initDuanmianPoint();
}

// 通过 store 传递需要选中的key
watch(() => checkedKeys.value, (keys) => {
watch(
  () => checkedKeys.value,
  (keys) => {
   if (keys && Array.isArray(keys)) {
      treeRef.value.setCheckedKeys(defaultSelectedKeys.value.concat(keys), true)
      treeRef.value.setCheckedKeys(
        defaultSelectedKeys.value.concat(keys),
        true
      );
   }
})
  }
);

watch(
   () => route.fullPath,
   path => {
      const defaultKeys = defaultSelectedKeys.value
  (path) => {
    const defaultKeys = defaultSelectedKeys.value;
      if (path == "/yhgl") {
         treeRef.value.setCheckedKeys(defaultKeys.concat("孙胡沟隐患点"), true)
         toggleLayerVisible("孙胡沟隐患点", true)
         toggleLayerVisible("综合监测设备信息", false)
         toggleLayerVisible("孙胡沟仿真标注地物", false)

      treeRef.value.setCheckedKeys(defaultKeys.concat("孙胡沟隐患点"), true);
      toggleLayerVisible("孙胡沟隐患点", true);
      toggleLayerVisible("综合监测设备信息", false);
      toggleLayerVisible("孙胡沟仿真标注地物", false);
      } else if (path == "/zhjc") {
         treeRef.value.setCheckedKeys(defaultKeys.concat("综合监测设备信息"), true)
         toggleLayerVisible("综合监测设备信息", true)
         toggleLayerVisible("孙胡沟隐患点", false)
         toggleLayerVisible("孙胡沟仿真标注地物", false)
      treeRef.value.setCheckedKeys(
        defaultKeys.concat("综合监测设备信息"),
        true
      );
      toggleLayerVisible("综合监测设备信息", true);
      toggleLayerVisible("孙胡沟隐患点", false);
      toggleLayerVisible("孙胡沟仿真标注地物", false);
      } else if (path == "/mnfz") {
         treeRef.value.setCheckedKeys(defaultKeys.concat("孙胡沟仿真标注地物"), true)
         toggleLayerVisible("孙胡沟仿真标注地物", true)
         toggleLayerVisible("孙胡沟隐患点", false)
         toggleLayerVisible("综合监测设备信息", false)

      treeRef.value.setCheckedKeys(
        defaultKeys.concat("孙胡沟仿真标注地物"),
        true
      );
      toggleLayerVisible("孙胡沟仿真标注地物", true);
      toggleLayerVisible("孙胡沟隐患点", false);
      toggleLayerVisible("综合监测设备信息", false);
      } else {
         treeRef.value.setCheckedKeys(defaultKeys, true)
      treeRef.value.setCheckedKeys(defaultKeys, true);
      }
   }
)
);
onMounted(() => {
   initMap()
   getData()
})
  initMap();
  getData();
});
onUnmounted(() => {
   viewer.entities.removeAll()
})
  viewer.entities.removeAll();
});
</script>

<style lang="less" scoped>