透明度0 修改模型数据路径

wangjuncheng

昨天 cf7752d995e09d48eca9a1ca5634a9e71ae46553

 src/components/tools/LayerTree.vue

@@ -1,1074 +1,459 @@
<template>
   <div class="layer-tree">
      <el-tree
         ref="treeRef"
         style="max-width: 600px"
         show-checkbox
         node-key="label"
         :default-checked-keys="defaultSelectedKeys"
         @check-change="handleCheckChange"
         :data="treeData"
      />
   </div>
  <div class="layer-tree">
    <el-tree
      ref="treeRef"
      style="max-width: 600px"
      show-checkbox
      node-key="label"
      :default-checked-keys="defaultSelectedKeys"
      @check-change="handleCheckChange"
      :data="treeData"
    />
  </div>
</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, watch, nextTick, onUnmounted, watchEffect } from "vue";
import {
  createPoint,
  removeEntities,
  addTileset,
  clearAllPoints,
} from "@/utils/map";
import { deviceDictList, getDictName } from "@/constant/dict.js";
import { useRoute } from "vue-router";
import {
  loadAreaPolygon,
  convertToGeoJson,
  clearAreaPolygon,
} from "@/utils/area";
import { checkedKeys } from "@/store/index";
import { getDuanMainData } from "@/api/index.js";
import { useSimStore } from "@/store/simulation";
import { getSafePoint } from "@/api/hpApi";

const simStore = useSimStore();
const route = useRoute();

/**
 * 图层树配置数据
 * 包含三维服务和图层数据两大分类
 */
const treeData = ref([
   {
      label: "三维服务",
      children: [{ label: "模型数据" }, { label: "地形数据" }, { label: "影像数据" }],
   },
   {
      label: "图层数据",
      children: [
         {
            label: "北京市隐患点",
         },
         {
            label: "孙胡沟隐患点",
         },
         // {
         //    label: "泥石流隐患点面数据",
         // },
         {
            label: "综合监测设备信息",
         },
         {
            label: "孙胡沟仿真标注地物",
         },
         {
            label: "避险点",
         },
      ],
   },
])
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)
   if (list) {
      toggleLayerVisible(label, checked)
      return
   }
   switch (label) {
      case "模型数据":
         list.show = checked
         break
      case "北京市隐患点":
         console.log("北京市隐患点", checked, indeterminate)
         break
      case "孙胡沟隐患点":
         console.log("孙胡沟隐患点", checked, indeterminate)
         break
      case "泥石流隐患点面数据":
         console.log("泥石流隐患点面数据", checked, indeterminate)
         break
      case "综合监测设备信息":
         console.log("综合监测设备信息", checked, indeterminate)
         break
      case "孙胡沟仿真标注地物":
         console.log("孙胡沟仿真标注地物", checked, indeterminate)
         break
      case "避险点":
         addTetrahedron()
         break
  {
    label: "三维服务",
    children: [
      { label: "模型数据" },
      { label: "地形数据" },
      { label: "影像数据" },
    ],
  },
  {
    label: "图层数据",
    children: [
      { label: "北京市隐患点" },
      { label: "孙胡沟隐患点" },
      { label: "综合监测设备信息" },
      { label: "孙胡沟断面" },
      { label: "避险场所" },
    ],
  },
]);

   }
}
function initMap() {
   // let modelPromise = addTileset(
   //    `http://106.120.22.26:9103/gisserver/c3dserver/sunhugou3d/tileset.json`
   // )
   // modelPromise.then(model => {
   //    treeMap.set("模型数据", model)
   // })
   // let ImageryLayer = earthCtrl.factory.createImageryLayer({
   //    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",
   })
   // treeMap.set("影像数据", ImageryLayer)
   treeMap.set("地形数据", TerrainLayer)
// 默认选中的节点（地形数据默认开启）
const defaultSelectedKeys = ref(["地形数据"]);

// Tree 实例引用
const treeRef = ref(null);

// 存储图层实体的 Map，用于管理所有图层
const treeMap = new Map();

// 地形数据实例
let TerrainLayer = null;
// 影像数据实例
let ImageryLayer = null;

/**
 * 初始化地形数据图层
 */
async function initTerrainLayer() {
  try {
    TerrainLayer = await earthCtrl.factory.createTerrainLayer({
      sourceType: "ctb",
      url: "http://106.120.22.26:9103/gisserver/ctsserver/sunhugoudem",
      requestVertexNormals: true,
    });
    treeMap.set("地形数据", TerrainLayer);
  } catch (error) {
    console.error("地形数据初始化失败:", error);
  }
}

const devicetList = ref([
   {
      deviceCode: "303A9016",
      deviceId: "1821067878870257666",
      deviceName: "孙胡沟(墒情)",
      dictDeviceType: "1437295822",
      latitude: 40.56476666,
      longitude: 116.5955361,
   },
   {
      deviceCode: "01303A9016",
      deviceId: "1821067850122498049",
      deviceName: "孙胡沟(墒情)",
      dictDeviceType: "14372958380",
      latitude: 40.56476666,
      longitude: 116.5955361,
   },
   {
      deviceCode: "1101161102180100010063",
      deviceId: "1554360510040182786",
      deviceName: "怀柔区琉璃庙镇孙胡沟尹家西沟雨量计0063",
      dictDeviceType: "1437295810",
      latitude: 40.556589,
      longitude: 116.579459,
   },
   {
      deviceCode: "1101161102180100194030",
      deviceId: "1554361328692826114",
      deviceName: "怀柔区琉璃庙镇孙胡沟村上台子河东南沟编码器4030",
      dictDeviceType: "1437295815",
      latitude: 40.554272,
      longitude: 116.592583,
   },
   {
      deviceCode: "1101161102180100031041",
      deviceId: "1554360448702681089",
      deviceName: "怀柔区琉璃庙镇孙胡沟村上台子河东南沟次声仪1041",
      dictDeviceType: "1437295832",
      latitude: 40.553236,
      longitude: 116.592304,
   },
   {
      deviceCode: "1101161102180100022007",
      deviceId: "1554360273959587842",
      deviceName: "怀柔区琉璃庙镇孙胡沟村上台子河东南沟含水率2007",
      dictDeviceType: "1437295822",
      latitude: 40.545821,
      longitude: 116.586354,
   },
   {
      deviceCode: "1101161102180100225406",
      deviceId: "1554360478494822402",
      deviceName: "怀柔区琉璃庙镇孙胡沟村上台子河东南沟流速仪5406",
      dictDeviceType: "1437295821",
      latitude: 40.554368,
      longitude: 116.592989,
   },
   {
      deviceCode: "1101161102180100055006",
      deviceId: "1554360276627165185",
      deviceName: "怀柔区琉璃庙镇孙胡沟村上台子河东南沟泥位计5006",
      dictDeviceType: "1437295811",
      latitude: 40.554398,
      longitude: 116.592929,
   },
   {
      deviceCode: "1101161102180100010064",
      deviceId: "1554360452670492674",
      deviceName: "怀柔区琉璃庙镇孙胡沟村上台子河东南沟雨量计0064",
      dictDeviceType: "1437295810",
      latitude: 40.545741,
      longitude: 116.586304,
   },
   {
      deviceCode: "1101161102180100183030",
      deviceId: "1554360533087883265",
      deviceName: "怀柔区琉璃庙镇孙胡沟村上台子河东南沟摄像头3030",
      dictDeviceType: "1437295825",
      latitude: 40.554272,
      longitude: 116.592583,
   },
   {
      deviceCode: "1101161102180100194031",
      deviceId: "1554361328877375489",
      deviceName: "怀柔区琉璃庙镇孙胡沟椴树底下东沟编码器4031",
      dictDeviceType: "1437295815",
      latitude: 40.554035,
      longitude: 116.59786,
   },
   {
      deviceCode: "1101161102180100055007",
      deviceId: "1554360509775941634",
      deviceName: "怀柔区琉璃庙镇孙胡沟椴树底下东沟泥位计5007",
      dictDeviceType: "1437295811",
      latitude: 40.554729,
      longitude: 116.598165,
   },
   {
      deviceCode: "1101161102180100031042",
      deviceId: "1554360448916590593",
      deviceName: "怀柔区琉璃庙镇孙胡沟椴树底下东沟次声仪1042",
      dictDeviceType: "1437295832",
      latitude: 40.549398,
      longitude: 116.600387,
   },
   {
      deviceCode: "1101161102180100225407",
      deviceId: "1554360478658400257",
      deviceName: "怀柔区琉璃庙镇孙胡沟椴树底下东沟流速仪5407",
      dictDeviceType: "1437295821",
      latitude: 40.55481,
      longitude: 116.598025,
   },
   {
      deviceCode: "1101161102180100022008",
      deviceId: "1554360274165108737",
      deviceName: "怀柔区琉璃庙镇孙胡沟椴树底下东沟含水率2008",
      dictDeviceType: "1437295822",
      latitude: 40.544645,
      longitude: 116.596511,
   },
   {
      deviceCode: "1101161102180100183031",
      deviceId: "1554360533255655426",
      deviceName: "怀柔区琉璃庙镇孙胡沟椴树底下东沟摄像头3031",
      dictDeviceType: "1437295825",
      latitude: 40.554035,
      longitude: 116.59786,
   },
   {
      deviceCode: "1101161102180100010065",
      deviceId: "1554360452888596482",
      deviceName: "怀柔区琉璃庙镇孙胡沟椴树底下东沟雨量计0065",
      dictDeviceType: "1437295810",
      latitude: 40.543104,
      longitude: 116.59585,
   },
   {
      deviceCode: "1101161102180100031040",
      deviceId: "1554360448383913986",
      deviceName: "怀柔区琉璃庙镇孙胡沟村于家西沟次声仪1040",
      dictDeviceType: "1437295832",
      latitude: 40.563822,
      longitude: 116.592648,
   },
   {
      deviceCode: "1101161102180100010062",
      deviceId: "1554360452519497730",
      deviceName: "怀柔区琉璃庙镇孙胡沟村于家西沟雨量计0062",
      dictDeviceType: "1437295810",
      latitude: 40.558778,
      longitude: 116.586892,
   },
   {
      deviceCode: "1101160042160100010005",
      deviceId: "1554360582698110977",
      deviceName: "怀柔区雁栖镇北湾村北林大石门沟雨量计0005",
      dictDeviceType: "1437295810",
      latitude: 40.533623,
      longitude: 116.602406,
   },
])

function initDevicePoint() {
   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

      list.push(entity)
   })
   treeMap.set("综合监测设备信息", list)
/**
 * 初始化影像数据图层
 */
async function initImageryLayer() {
  try {
    ImageryLayer = await earthCtrl.factory.createImageryLayer({
      sourceType: "tms",
      url: "http://106.120.22.26:9103/gisserver/tmsserver/sunhugoudom",
    });
    treeMap.set("影像数据", ImageryLayer);
  } catch (error) {
    console.error("影像数据初始化失败:", error);
  }
}

const districtList = ref([
   {
      activeStatus: "",
      areaCode: "",
      areaName: "",
      brookLength: 0,
      checkId: "",
      city: "北京市",
      codeProvince: "110116",
      county: "怀柔",
      dangerLevel: "",
      disasterStatus: "",
      drainageArea: "",
      elevation: 0,
      featureDes: "",
      groupMonitor: "李桂梅,孙桂和,范满田,秦建权,孙桂江,孙桂伟",
      hasPlan: "",
      id: "110116020058",
      latitude: 40.56652778,
      length: 0,
      district: "琉璃庙镇孙胡沟村尹家西沟尹建燕家屋后",
      longitude: 116.5803889,
      monitor: "",
      monitorAdvice: "",
      name: "尹家西沟尹建燕家屋后崩塌隐患点",
      number: "13716108909,13716029391,13716291714,13716191943,13716427398,13124792612",
      preventionDes: "",
      preventionLevel: "",
      preventionPlan: "定期巡查，预警转移，立警示牌",
      preventionUnit: "乡镇",
      principal: "",
      province: "北京市",
      qp: "",
      reason: "",
      responsibleUnit: "",
      riskLevel: "",
      scale: "小型",
      stableLevel: "",
      status: "",
      thickness: 0,
      threatenFamily: 2,
      threatenMoney: 0,
      threatenPopulation: "3",
      threatenType: "",
      town: "琉璃庙镇",
      trigger: "",
      type: "崩塌",
      village: "孙胡沟村",
      volume: "",
      volumePotential: "",
      width: 0,
   },
   {
      activeStatus: "",
      areaCode: "",
      areaName: "",
      brookLength: 0,
      checkId: "",
      city: "北京市",
      codeProvince: "110116",
      county: "怀柔",
      dangerLevel: "",
      disasterStatus: "",
      drainageArea: "",
      elevation: 0,
      featureDes: "",
      groupMonitor: "李桂梅,孙桂和,范满田,秦建权,孙桂江,孙桂伟",
      hasPlan: "",
      id: "110116020078",
      latitude: 40.56497222,
      length: 0,
      district: "琉璃庙镇孙胡沟村河西于凤英家屋后",
      longitude: 116.5955278,
      monitor: "",
      monitorAdvice: "",
      name: "河西于凤英家屋后崩塌隐患点",
      number: "13716108909,13716029391,13716291714,13716191943,13716427398,13124792612",
      preventionDes: "",
      preventionLevel: "",
      preventionPlan: "定期巡查，预警转移，立警示牌",
      preventionUnit: "乡镇",
      principal: "",
      province: "北京市",
      qp: "",
      reason: "",
      responsibleUnit: "",
      riskLevel: "",
      scale: "小型",
      stableLevel: "",
      status: "",
      thickness: 0,
      threatenFamily: 4,
      threatenMoney: 0,
      threatenPopulation: "6",
      threatenType: "",
      town: "琉璃庙镇",
      trigger: "",
      type: "崩塌",
      village: "孙胡沟村",
      volume: "",
      volumePotential: "",
      width: 0,
   },
   {
      activeStatus: "",
      areaCode: "",
      areaName: "",
      brookLength: 0,
      checkId: "",
      city: "北京市",
      codeProvince: "110116",
      county: "怀柔",
      dangerLevel: "",
      disasterStatus: "",
      drainageArea: "",
      elevation: 0,
      featureDes: "",
      groupMonitor: "李桂梅,孙桂和,范满田,秦建权,孙桂江,孙桂伟",
      hasPlan: "",
      id: "110116030041",
      latitude: 40.55369444,
      length: 0,
      district: "琉璃庙镇孙胡沟公路",
      longitude: 116.6002778,
      monitor: "",
      monitorAdvice: "",
      name: "南梁小东沟泥石流隐患点",
      number: "13716108909,13716029391,13716291714,13716191943,13716427398,13124792612",
      preventionDes: "",
      preventionLevel: "",
      preventionPlan: "定期巡查,立警示牌",
      preventionUnit: "乡镇",
      principal: "",
      province: "北京市",
      qp: "",
      reason: "",
      responsibleUnit: "",
      riskLevel: "",
      scale: "小型",
      stableLevel: "",
      status: "",
      thickness: 0,
      threatenFamily: 0,
      threatenMoney: 0,
      threatenPopulation: "",
      threatenType: "",
      town: "琉璃庙镇",
      trigger: "",
      type: "泥石流",
      village: "孙胡沟村",
      volume: "",
      volumePotential: "",
      width: 0,
   },
   {
      activeStatus: "",
      areaCode: "",
      areaName: "",
      brookLength: 0,
      checkId: "",
      city: "北京市",
      codeProvince: "110116",
      county: "怀柔",
      dangerLevel: "",
      disasterStatus: "",
      drainageArea: "",
      elevation: 0,
      featureDes: "",
      groupMonitor: "李桂梅,孙桂和,范满田,秦建权,孙桂江,孙桂伟",
      hasPlan: "",
      id: "110116030015",
      latitude: 40.55277778,
      length: 0,
      district: "琉璃庙镇孙胡沟村南梁村大窑沟",
      longitude: 116.5994722,
      monitor: "",
      monitorAdvice: "",
      name: "大窑沟泥石流隐患点",
      number: "13716108909,13716029391,13716291714,13716191943,13716427398,13124792612",
      preventionDes: "已监测、已治理",
      preventionLevel: "",
      preventionPlan: "定期巡查，预警转移，立警示牌",
      preventionUnit: "乡镇",
      principal: "",
      province: "北京市",
      qp: "",
      reason: "",
      responsibleUnit: "",
      riskLevel: "",
      scale: "中型",
      stableLevel: "",
      status: "",
      thickness: 0,
      threatenFamily: 5,
      threatenMoney: 0,
      threatenPopulation: "11",
      threatenType: "",
      town: "琉璃庙镇",
      trigger: "",
      type: "泥石流",
      village: "孙胡沟村",
      volume: "",
      volumePotential: "",
      width: 0,
   },
   {
      activeStatus: "",
      areaCode: "",
      areaName: "",
      brookLength: 0,
      checkId: "",
      city: "北京市",
      codeProvince: "110116",
      county: "怀柔",
      dangerLevel: "",
      disasterStatus: "",
      drainageArea: "",
      elevation: 0,
      featureDes: "",
      groupMonitor: "李桂梅,孙桂和,范满田,秦建权,孙桂江,孙桂伟",
      hasPlan: "",
      id: "110116030076",
      latitude: 40.55972222,
      length: 0,
      district: "琉璃庙镇孙胡沟村东坎大东沟",
      longitude: 116.5916667,
      monitor: "",
      monitorAdvice: "",
      name: "大东沟泥石流隐患点",
      number: "13716108909,13716029391,13716291714,13716191943,13716427398,13124792612",
      preventionDes: "已治理",
      preventionLevel: "",
      preventionPlan: "定期巡查，预警转移",
      preventionUnit: "乡镇",
      principal: "",
      province: "北京市",
      qp: "",
      reason: "",
      responsibleUnit: "",
      riskLevel: "",
      scale: "小型",
      stableLevel: "",
      status: "",
      thickness: 0,
      threatenFamily: 1,
      threatenMoney: 0,
      threatenPopulation: "2",
      threatenType: "",
      town: "琉璃庙镇",
      trigger: "",
      type: "泥石流",
      village: "孙胡沟村",
      volume: "",
      volumePotential: "",
      width: 0,
   },
   {
      activeStatus: "",
      areaCode: "",
      areaName: "",
      brookLength: 0,
      checkId: "",
      city: "北京市",
      codeProvince: "110116",
      county: "怀柔",
      dangerLevel: "",
      disasterStatus: "",
      drainageArea: "",
      elevation: 0,
      featureDes: "",
      groupMonitor: "李桂梅,孙桂和,范满田,秦建权,孙桂江,孙桂伟",
      hasPlan: "",
      id: "110116030074",
      latitude: 40.56580556,
      length: 0,
      district: "琉璃庙镇孙胡沟村尹家西沟",
      longitude: 116.59,
      monitor: "",
      monitorAdvice: "",
      name: "尹家西沟泥石流隐患点",
      number: "13716108909,13716029391,13716291714,13716191943,13716427398,13124792612",
      preventionDes: "已监测；灾害体变化：4处坡积物垮塌，堆积至坡脚，方量约20m³。",
      preventionLevel: "",
      preventionPlan: "定期巡查，预警转移",
      preventionUnit: "乡镇",
      principal: "",
      province: "北京市",
      qp: "",
      reason: "",
      responsibleUnit: "",
      riskLevel: "",
      scale: "中型",
      stableLevel: "",
      status: "",
      thickness: 0,
      threatenFamily: 7,
      threatenMoney: 0,
      threatenPopulation: "12",
      threatenType: "",
      town: "琉璃庙镇",
      trigger: "",
      type: "泥石流",
      village: "孙胡沟村",
      volume: "",
      volumePotential: "",
      width: 0,
   },
   {
      activeStatus: "",
      areaCode: "",
      areaName: "",
      brookLength: 0,
      checkId: "",
      city: "北京市",
      codeProvince: "110116",
      county: "怀柔",
      dangerLevel: "",
      disasterStatus: "",
      drainageArea: "",
      elevation: 0,
      featureDes: "",
      groupMonitor: "李桂梅,孙桂和,范满田,秦建权,孙桂江,孙桂伟",
      hasPlan: "",
      id: "110116030053",
      latitude: 40.57361111,
      length: 0,
      district: "琉璃庙镇孙胡沟村北大地西洼子沟",
      longitude: 116.5897222,
      monitor: "",
      monitorAdvice: "",
      name: "北大地西洼子沟泥石流隐患点",
      number: "13716108909,13716029391,13716291714,13716191943,13716427398,13124792612",
      preventionDes: "沟口正对房屋，降雨时出水量大，建议治理，汛期加强巡查",
      preventionLevel: "",
      preventionPlan: "定期巡查，预警转移，立警示牌",
      preventionUnit: "乡镇",
      principal: "",
      province: "北京市",
      qp: "",
      reason: "",
      responsibleUnit: "",
      riskLevel: "",
      scale: "中型",
      stableLevel: "",
      status: "",
      thickness: 0,
      threatenFamily: 6,
      threatenMoney: 0,
      threatenPopulation: "10",
      threatenType: "",
      town: "琉璃庙镇",
      trigger: "",
      type: "泥石流",
      village: "孙胡沟村",
      volume: "",
      volumePotential: "",
      width: 0,
   },
   {
      activeStatus: "",
      areaCode: "",
      areaName: "",
      brookLength: 0,
      checkId: "",
      city: "北京市",
      codeProvince: "110116",
      county: "怀柔",
      dangerLevel: "",
      disasterStatus: "",
      drainageArea: "",
      elevation: 0,
      featureDes: "",
      groupMonitor: "李桂梅,孙桂和,范满田,秦建权,孙桂江,孙桂伟",
      hasPlan: "",
      id: "110116020102",
      latitude: 40.55972222,
      length: 0,
      district: "琉璃庙镇孙胡沟村范家庄王秀莲家屋后",
      longitude: 116.5922222,
      monitor: "",
      monitorAdvice: "",
      name: "范家庄王秀莲家屋后崩塌隐患点",
      number: "13716108909,13716029391,13716291714,13716191943,13716427398,13124792612",
      preventionDes: "边坡较陡，顺向岩层，房屋靠近坡脚，建议尽快治理",
      preventionLevel: "",
      preventionPlan: "定期巡查，预警转移，立警示牌",
      preventionUnit: "乡镇",
      principal: "",
      province: "北京市",
      qp: "",
      reason: "",
      responsibleUnit: "",
      riskLevel: "",
      scale: "小型",
      stableLevel: "",
      status: "",
      thickness: 0,
      threatenFamily: 1,
      threatenMoney: 0,
      threatenPopulation: "3",
      threatenType: "",
      town: "琉璃庙镇",
      trigger: "",
      type: "崩塌",
      village: "孙胡沟村",
      volume: "",
      volumePotential: "",
      width: 0,
   },
   {
      activeStatus: "",
      areaCode: "",
      areaName: "",
      brookLength: 0,
      checkId: "",
      city: "北京市",
      codeProvince: "110116",
      county: "怀柔",
      dangerLevel: "",
      disasterStatus: "",
      drainageArea: "",
      elevation: 0,
      featureDes: "",
      groupMonitor: "李桂梅,孙桂和,范满田,秦建权,孙桂江,孙桂伟",
      hasPlan: "",
      id: "110116020742",
      latitude: 40.57680556,
      length: 0,
      district: "琉璃庙镇孙胡沟村三亩地范忠田家屋后",
      longitude: 116.5887222,
      monitor: "",
      monitorAdvice: "",
      name: "三亩地范忠田家屋后崩塌隐患点",
      number: "13716108909,13716029391,13716291714,13716191943,13716427398,13124792612",
      preventionDes: "",
      preventionLevel: "",
      preventionPlan: "定期巡查，预警转移，更换警示牌",
      preventionUnit: "乡镇",
      principal: "",
      province: "北京市",
      qp: "",
      reason: "",
      responsibleUnit: "",
      riskLevel: "",
      scale: "中型",
      stableLevel: "",
      status: "",
      thickness: 0,
      threatenFamily: 8,
      threatenMoney: 0,
      threatenPopulation: "23",
      threatenType: "",
      town: "琉璃庙镇",
      trigger: "",
      type: "崩塌",
      village: "孙胡沟村",
      volume: "",
      volumePotential: "",
      width: 0,
   },
   {
      activeStatus: "",
      areaCode: "",
      areaName: "",
      brookLength: 0,
      checkId: "",
      city: "北京市",
      codeProvince: "110116",
      county: "怀柔",
      dangerLevel: "",
      disasterStatus: "",
      drainageArea: "",
      elevation: 0,
      featureDes: "",
      groupMonitor: "李桂梅,孙桂和,范满田,秦建权,孙桂江,孙桂伟",
      hasPlan: "",
      id: "110116030040",
      latitude: 40.56344444,
      length: 0,
      district: "琉璃庙镇孙胡沟村河西于家西沟",
      longitude: 116.5953889,
      monitor: "",
      monitorAdvice: "",
      name: "于家西沟泥石流隐患点",
      number: "13716108909,13716029391,13716291714,13716191943,13716427398,13124792612",
      preventionDes: "已监测，2018村已治理；沟口堆积扇明显，正对房屋，建议汛期加强巡查",
      preventionLevel: "",
      preventionPlan: "定期巡查，预警转移",
      preventionUnit: "乡镇",
      principal: "",
      province: "北京市",
      qp: "",
      reason: "",
      responsibleUnit: "",
      riskLevel: "",
      scale: "中型",
      stableLevel: "",
      status: "",
      thickness: 0,
      threatenFamily: 18,
      threatenMoney: 0,
      threatenPopulation: "59",
      threatenType: "",
      town: "琉璃庙镇",
      trigger: "",
      type: "泥石流",
      village: "孙胡沟村",
      volume: "",
      volumePotential: "",
      width: 0,
   },
   {
      activeStatus: "",
      areaCode: "",
      areaName: "",
      brookLength: 0,
      checkId: "",
      city: "北京市",
      codeProvince: "110116",
      county: "怀柔",
      dangerLevel: "",
      disasterStatus: "",
      drainageArea: "",
      elevation: 0,
      featureDes: "",
      groupMonitor: "李桂梅,孙桂和,范满田,秦建权,孙桂江,孙桂伟",
      hasPlan: "",
      id: "110116030055",
      latitude: 40.55283333,
      length: 0,
      district: "琉璃庙镇孙胡沟村椴树底下东沟",
      longitude: 116.5999444,
      monitor: "",
      monitorAdvice: "",
      name: "椴树底下东沟泥石流隐患点",
      number: "13716108909,13716029391,13716291714,13716191943,13716427398,13124792612",
      preventionDes: "已治理：威胁对象重复：与110116030015重复5户11人",
      preventionLevel: "",
      preventionPlan: "定期巡查，预警转移，立警示牌",
      preventionUnit: "乡镇",
      principal: "",
      province: "北京市",
      qp: "",
      reason: "",
      responsibleUnit: "",
      riskLevel: "",
      scale: "中型",
      stableLevel: "",
      status: "",
      thickness: 0,
      threatenFamily: 5,
      threatenMoney: 0,
      threatenPopulation: "11",
      threatenType: "",
      town: "琉璃庙镇",
      trigger: "",
      type: "泥石流",
      village: "孙胡沟村",
      volume: "",
      volumePotential: "",
      width: 0,
   },
   {
      activeStatus: "",
      areaCode: "",
      areaName: "",
      brookLength: 0,
      checkId: "",
      city: "北京市",
      codeProvince: "110116",
      county: "怀柔",
      dangerLevel: "",
      disasterStatus: "",
      drainageArea: "",
      elevation: 0,
      featureDes: "",
      groupMonitor: "李桂梅,孙桂和,范满田,秦建权,孙桂江,孙桂伟",
      hasPlan: "",
      id: "110116030054",
      latitude: 40.56166667,
      length: 0,
      district: "琉璃庙镇孙胡沟村上台子河东南沟",
      longitude: 116.5997222,
      monitor: "",
      monitorAdvice: "",
      name: "河东南沟泥石流隐患点",
      number: "13716108909,13716029391,13716291714,13716191943,13716427398,13124792612",
      preventionDes: "已监测",
      preventionLevel: "",
      preventionPlan: "定期巡查,立警示牌",
      preventionUnit: "乡镇",
      principal: "",
      province: "北京市",
      qp: "",
      reason: "",
      responsibleUnit: "",
      riskLevel: "",
      scale: "小型",
      stableLevel: "",
      status: "",
      thickness: 0,
      threatenFamily: 0,
      threatenMoney: 0,
      threatenPopulation: "",
      threatenType: "",
      town: "琉璃庙镇",
      trigger: "",
      type: "泥石流",
      village: "孙胡沟村",
      volume: "",
      volumePotential: "",
      width: 0,
   },
])
/**
 * 处理树节点勾选变化
 * @param {Object} data - 节点数据
 * @param {Boolean} checked - 是否选中
 * @param {Boolean} indeterminate - 不确定状态
 */
function handleCheckChange(data, checked) {
  const label = data.label;

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)
  // 地形数据处理
  if (label === "地形数据") {
    handleTerrainLayer(checked);
    return;
  }

  // 影像数据处理
  if (label === "影像数据") {
    handleImageryLayer(checked);
    return;
  }

  // 模型数据处理
  if (label === "模型数据") {
    handleModelLayer(checked);
    return;
  }

  // 设备信息处理
  if (label === "综合监测设备信息") {
    simStore.DeviceShowSwitch = checked;
    return;
  }

  // 隐患点处理
  if (label === "孙胡沟隐患点") {
    simStore.DangerShowSwitch = checked;
    return;
  }

  // 其他图层的处理
  const layer = treeMap.get(label);
  if (layer) {
    toggleLayerVisible(label, checked);
  }
}

/**
 * 处理地形图层
 */
function handleTerrainLayer(checked) {
  if (checked) {
    initTerrainLayer();
    toggleLayerVisible("地形数据", true);
  } else {
    const layer = treeMap.get("地形数据");
    if (layer) {
      toggleLayerVisible("地形数据", false);
      layer.removeFromMap();
      treeMap.delete("地形数据");
    }
  }
}

let divPointList = []
/**
 * 处理影像图层
 */
function handleImageryLayer(checked) {
  if (checked) {
    initImageryLayer();
    toggleLayerVisible("影像数据", true);
  } else {
    const layer = treeMap.get("影像数据");
    if (layer) {
      toggleLayerVisible("影像数据", false);
      layer.removeFromMap();
      treeMap.delete("影像数据");
    }
  }
}

/**
 * 处理模型图层
 */
function handleModelLayer(checked) {
  if (checked) {
    addTileset(
      // "http://106.120.22.26:9103/gisserver/c3dserver/sunhugou3d/tileset.json"
      "http://192.168.37.61:9004/tile/model/service/Iakp0nhx/tileset.json?labtoken=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiItMSxUaHUgQXByIDE4IDE1OjMwOjU3IENTVCAyMDI0In0.j_YKsCRsIQtpgOWfFvMwAP65Rlx9uXyVte_xkE95Vdo"
    )
      .then((model) => {
        treeMap.set("模型数据", model);
        toggleLayerVisible("模型数据", true);
      })
      .catch(console.error);
  } else {
    toggleLayerVisible("模型数据", false);
  }
}

/**
 * 切换图层可见性
 * @param {String} name - 图层名称
 * @param {Boolean} visible - 是否可见
 */
function toggleLayerVisible(name, visible) {
  const layer = treeMap.get(name);
  if (!layer) {
    console.warn(`图层 ${name} 不存在`);
    return;
  }

  // 处理不同类型的图层
  if (Array.isArray(layer)) {
    // 实体数组
    layer.forEach((entity) => {
      entity.show = visible;
      if (visible && !viewer.entities.contains(entity)) {
        viewer.entities.add(entity);
      }
    });
  } else if (typeof layer.setVisible === "function") {
    // 自定义图层接口
    layer.setVisible(visible);
  } else if (typeof layer.show === "boolean") {
    // 普通可显示对象
    layer.show = visible;
  }

  viewer.scene.requestRender();
}

/**
 * 清除图层实体
 * @param {String} layerName - 图层名称
 */
// 暂且保留
// async function clearLayerEntities(layerName) {
//   const list = treeMap.get(layerName);
//   if (list && Array.isArray(list)) {
//     for (const item of list) {
//       const entity = await item;
//       if (layerName == "综合监测设备信息") {
//         removeEntities(entity.deviceId);
//       } else if (layerName == "孙胡沟隐患点") {
//         removeEntities(entity.hdId);
//       }
//     }
//   }
//   treeMap.delete(layerName);
// }

/**
 * 清除图层实体
 * @param {String} layerName - 图层名称
 */
// 此函数优化了在模拟仿真页面，如果点击目录树选中取消，泥位计仍显示
async function clearLayerEntities(layerName) {
  const isMnfzPage = route.path === "/mnfz"; // 判断是否为 /mnfz 页面

  const list = treeMap.get(layerName);
  if (list && Array.isArray(list)) {
    for (const item of list) {
      const entity = await item;

      let shouldRemove = true; // 默认要删除

      // 如果是 /mnfz 页面，并且是“泥位计”，则不删除
      if (isMnfzPage && entity.type === "泥位计") {
        shouldRemove = false;
      }

      if (shouldRemove) {
        if (layerName === "综合监测设备信息") {
          removeEntities(entity.deviceId);
        } else if (layerName === "孙胡沟隐患点") {
          removeEntities(entity.hdId);
        }
      }
    }
  }

  treeMap.delete(layerName);
}

watchEffect(async () => {
  clearLayerEntities("综合监测设备信息");

  if (simStore.DeviceShowSwitch) {
    // 使用 Promise.all 等待所有异步操作完成
    const deviceListPromises = simStore.devices
      .filter((item) => item.deviceName?.includes("孙胡沟"))
      .map(async (item) => {
        const entity = viewer.entities.getById(item.deviceId);
        item.type = getDictName(deviceDictList, item.dictDeviceType);
        item.name = item.deviceName.split("孙胡沟")[1];
        item.id = item.deviceId;
        item.className = "device";
        item.showLabel = true;
        await createPoint(item); // 确保 createPoint 返回一个 Promise 或者本身就是异步函数
        return item; // 返回处理后的 item
      });

    // 等待所有异步操作完成
    const deviceList = await Promise.all(deviceListPromises);

    if (deviceList.length) {
      treeMap.set("综合监测设备信息", deviceList);
    }
  }
});

// 监控隐患点开关变化
watchEffect(async () => {
  clearLayerEntities("孙胡沟隐患点");

  if (simStore.DangerShowSwitch) {
    const filteredPoints = simStore.DangerPoint.filter((item) =>
      item.position?.includes("孙胡沟")
    );

    const dangerPointPromises = filteredPoints.map(async (item) => {
      const entity = viewer.entities.getById(item.hdId);
      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); // 确保 createPoint 是异步函数
      return item; // 返回处理好的 item
    });

    try {
      const resolvedPoints = await Promise.all(dangerPointPromises);

      if (resolvedPoints.length) {
        treeMap.set("孙胡沟隐患点", resolvedPoints);
      }
    } catch (error) {
      console.error("创建隐患点时发生错误:", error);
    }
  }
});

/**
 * 初始化断面点数据
 */
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"

         const entity = createPoint(item)
         entity.show = false
         list.push(entity)
         return
         const divPoint = earthCtrl.factory.createDivPoint(
            item.alias,
            { lon: longitude, lat: latitude },
            {
               type: "custom",
               offset: ["c", 60],
               description: `
         <div class="divPoint-custom">
            <p>${item.alias}</p>
         </div>
        `,
               near: 0,
               far: 500000,
            }
         )
         divPoint.item.show = false
         console.log(divPoint)

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

  getDuanMainData().then((res) => {
    const list = res.data.map((item) => {
      const entity = createPoint({
        id: item.id + item.alias,
        name: item.alias,
        latitude: item.lat,
        longitude: item.lon,
        showBillboard: false,
        className: "district",
      });
      entity.show = false;
      return entity;
    });
    treeMap.set("孙胡沟断面", list);
  });
}

function addTetrahedron(visible) {
   const emergencyAreaList = []

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



   let list = [
      {
         name: "尹建华家",
         longitude: 116.593517,
         latitude: 40.568391,
         altitude: 528.45,
      },
      {
         name: "范振江家",
         longitude: 116.591059,
         latitude: 40.574068,
         altitude: 528,
      },
      {
         name: "后坡",
         longitude: 116.597975,
         latitude: 40.558199,
         altitude: 528,
      },
   ]
   list.forEach(item => {
      let point = earthCtrl.factory.addTetrahedron({
         position: {
            lon: item.longitude,
            lat: item.latitude,
            height: item.altitude,
         },
         multiple: 1.0,
         scale: new SmartEarth.Cesium.Cartesian3(20, 20, 20),
      })
      console.log("point", point)
      emergencyAreaList.push(point)

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

}
function toggleLayerVisible(name, checked) {
   const entityList = treeMap.get(name)
   if (Array.isArray(entityList) && entityList.length > 0) {
      entityList.forEach(entity => {
         entity.show = checked
      })
   }
   treeMap.set(name, entityList)
/**
 * 添加避险场所数据
 */
function addTetrahedron() {
  getSafePoint(110116110218).then((res) => {
    const geoJsonData = convertToGeoJson(res.data); // 转换为 GeoJSON
    // 加载 GeoJSON 数据到地图
    loadAreaPolygon(geoJsonData, true).then((entities) => {
      entities.forEach((entity) => (entity.show = false));
      treeMap.set("避险场所", entities);
    });
  });
}

function getData() {
   initDevicePoint()
   initDistrictPoint()
   initDuanmianPoint()
/**
 * 初始化所有数据
 */
function initData() {
  initDuanmianPoint();
  addTetrahedron();
}

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

// 监听 store 中的 checkedKeys 变化
watch(
   () => route.fullPath,
   path => {
      const defaultKeys = defaultSelectedKeys.value
      if (path == "/yhgl") {
         treeRef.value.setCheckedKeys(defaultKeys.concat("孙胡沟隐患点"), true)
         toggleLayerVisible("孙胡沟隐患点", true)
         toggleLayerVisible("综合监测设备信息", false)
         toggleLayerVisible("孙胡沟仿真标注地物", false)
  () => checkedKeys.value,
  (keys) => {
    if (Array.isArray(keys)) {
      treeRef.value?.setCheckedKeys([...defaultSelectedKeys.value, ...keys]);
    }
  }
);

      } else if (path == "/zhjc") {
         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)
// 监听路由变化
watch(
  () => route.fullPath,
  (path) => {
    const defaultKeys = [...defaultSelectedKeys.value];
    const checkedKeys =
      {
        // 页面默认勾选显示在此处
        "/yhgl": [...defaultKeys, "孙胡沟隐患点"],
        "/zhjc": [...defaultKeys, "综合监测设备信息"],
        // "/mnfz": [...defaultKeys, "孙胡沟断面"],
      }[path] || defaultKeys;

      } else {
         treeRef.value.setCheckedKeys(defaultKeys, true)
      }
   }
)
    treeRef.value?.setCheckedKeys(checkedKeys);
  },
  { immediate: true }
);

// 组件挂载时初始化
onMounted(() => {
   initMap()
   getData()
})
  initTerrainLayer();
  initData();
  nextTick(() => {
    treeRef.value?.setCheckedKeys(defaultSelectedKeys.value);
  });
});

// 组件卸载时清理资源
onUnmounted(() => {
   viewer.entities.removeAll()
})
  viewer.entities.removeAll();
  // 清理所有图层引用
  treeMap.forEach((layer) => {
    if (layer.removeFromMap) {
      layer.removeFromMap();
    }
  });
  treeMap.clear();
});
</script>

<style lang="less" scoped>
@import url("../../assets/css/infobox.css");

.layer-tree {
   // position: absolute;
   // top: 11%;
   // right: 25%;
   background: url("@/assets/img/tools/plotting_new.png");
   width: 200px;
   height: 200px;
   z-index: 99;
  background: url("@/assets/img/tools/plotting_new.png");
  width: 200px;
  z-index: 99;
  overflow: hidden;

  :deep(.el-tree) {
    overflow: hidden !important;
  }
}
</style>
</style>