1

wangjuncheng

3 天以前 0f71572b095e40c6e49cdaac632492819278aea4

 src/components/tools/LayerTree.vue

@@ -1,5 +1,10 @@
<template>
  <div class="layer-tree">
    <!-- 添加按钮
    <el-button @click="printCurrentView" type="primary" style="margin-bottom: 10px;">
      打印当前视图信息
    </el-button> -->
    <!-- 图层树 -->
    <el-tree
      ref="treeRef"
      style="max-width: 600px"
@@ -13,23 +18,60 @@
</template>

<script setup>
import { ref, onMounted, watch, nextTick,onUnmounted } from "vue";
import { createPoint, removeEntities, addTileset } from "@/utils/map";
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, clearAreaPolygon } from "@/utils/area";
import {
  loadAreaPolygon,
  convertToGeoJson,
  clearAreaPolygon,
} from "@/utils/area";
import { checkedKeys } from "@/store/index";
import { getDuanMainData, getDevicetListData, getDistrictListData } from "@/api/index.js";
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([
/**
 * 打印当前视图的相机状态
 */
 function printCurrentView() {
  window.Viewer = earthCtrl.viewer;// 假设你已经在 data 或 setup 中定义了 viewer
    const camera = earthCtrl.viewer.camera;

    const view = {
      destination: {
        x: camera.position.x,
        y: camera.position.y,
        z: camera.position.z,
      },
      orientation: {
        pitch: camera.pitch,
        roll: camera.roll,
        heading: camera.heading,
      },
    };

    console.log('当前视图参数：', view);
}
/**
 * 图层树配置数据
 * 包含三维服务和图层数据两大分类
 */
 const treeData = ref([
  {
    label: "三维服务",
    children: [
      { label: "模型数据" },
      { label: "地形数据" }, // 确保这里的 label 是 "地形数据"
      { label: "地形数据" },
      { label: "影像数据" },
    ],
  },
@@ -40,242 +82,661 @@
      { label: "孙胡沟隐患点" },
      { label: "综合监测设备信息" },
      { label: "孙胡沟断面" },
      { label: "避险点" },
      { label: "避险场所" },
    ],
  },
  {
    label: "南窖乡",
    children: [
      { 
        label: "南窖乡影像", 
        type: "imagery", 
        url: "/imagery/tile/image/wmts/pTkjV3J9/{z}/{x}/{y}?labtoken=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiItMSxUaHUgQXByIDE4IDE1OjMwOjU3IENTVCAyMDI0In0.j_YKsCRsIQtpgOWfFvMwAP65Rlx9uXyVte_xkE95Vdo" 
      },
      { 
        label: "南窖乡地形", 
        type: "terrain", 
        url: "/imagery/tile/terrain/TBKJCcqO?labtoken=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiItMSxUaHUgQXByIDE4IDE1OjMwOjU3IENTVCAyMDI0In0.j_YKsCRsIQtpgOWfFvMwAP65Rlx9uXyVte_xkE95Vdo",
        view: {
          destination: { x: -2148291.712223941, y: 4429896.46897996, z: 4055778.9577251095 },
          orientation: { pitch: -0.7094729926433327, roll: 6.2829983479026374, heading: 6.228640490951177 }
        }
      },
      { 
        label: "南窖乡地形模型1", 
        type: "model", 
        url: "/imagery/tile/model/service/LSR5ezfl/tileset.json?labtoken=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiItMSxUaHUgQXByIDE4IDE1OjMwOjU3IENTVCAyMDI0In0.j_YKsCRsIQtpgOWfFvMwAP65Rlx9uXyVte_xkE95Vdo",
        view: {
          destination: { x: -2146689.939461115, y: 4426047.413821165, z: 4057984.6498454507 },
          orientation: { pitch: -0.9541138124492012, roll: 0.00031687828366511184, heading: 6.140422591164119 }
        }
      },
      { 
        label: "南窖乡地形模型2", 
        type: "model", 
        url: "/imagery/tile/model/service/uNsdeKPc/tileset.json?labtoken=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiItMSxUaHUgQXByIDE4IDE1OjMwOjU3IENTVCAyMDI0In0.j_YKsCRsIQtpgOWfFvMwAP65Rlx9uXyVte_xkE95Vdo",
        view: {
          destination: { x: -2145340.8188580503, y: 4424796.321883301, z: 4059623.85371558 },
          orientation: { pitch: -0.9541017116169872, roll: 0.000313870753641865, heading: 6.140425044701509 }
        }
      }
    ]
  },
  {
    label: "金鸡台村",
    children: [
      { 
        label: "金鸡台村影像", 
        type: "imagery", 
        url: "/imagery/tile/image/wmts/qEToHR5Z/{z}/{x}/{y}?labtoken=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiItMSxUaHUgQXByIDE4IDE1OjMwOjU3IENTVCAyMDI0In0.j_YKsCRsIQtpgOWfFvMwAP65Rlx9uXyVte_xkE95Vdo" 
      },
      { 
        label: "金鸡台村地形", 
        type: "terrain", 
        url: "/imagery/tile/terrain/aEIeI21o?labtoken=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiItMSxUaHUgQXByIDE4IDE1OjMwOjU3IENTVCAyMDI0In0.j_YKsCRsIQtpgOWfFvMwAP65Rlx9uXyVte_xkE95Vdo",
        view: {
          destination: { x: -2130224.9623079575, y: 4426008.165349956, z: 4068795.580264238 },
          orientation: { pitch: -0.9127940858026111, roll: 6.282740114172059, heading: 0.08207325160381274 }
        }
      },
      { 
        label: "金鸡台村模型1", 
        type: "model", 
        url: "/imagery/tile/model/service/1J2wMbnU/tileset.json?labtoken=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiItMSxUaHUgQXByIDE4IDE1OjMwOjU3IENTVCAyMDI0In0.j_YKsCRsIQtpgOWfFvMwAP65Rlx9uXyVte_xkE95Vdo",
        view: {
          destination: { x: -2133104.794919741, y: 4425812.523913443, z: 4069478.3137610652 },
          orientation: { pitch: -0.9541137913665527, roll: 0.00031687304371175173, heading: 6.140422595438931 }
        }
      },
      { 
        label: "金鸡台村模型2", 
        type: "model", 
        url: "/imagery/tile/model/service/gaeULxdB/tileset.json?labtoken=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiItMSxUaHUgQXByIDE4IDE1OjMwOjU3IENTVCAyMDI0In0.j_YKsCRsIQtpgOWfFvMwAP65Rlx9uXyVte_xkE95Vdo",
        view: {
          destination: { x: -2130956.971562582, y: 4426818.080505688, z: 4069740.7525420994 },
          orientation: { pitch: -0.9541137309940142, roll: 0.0003168580385137787, heading: 6.140422607680212 }
        }
      },
      { 
        label: "金鸡台村模型3", 
        type: "model", 
        url: "/imagery/tile/model/service/haujMGBj/tileset.json?labtoken=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiItMSxUaHUgQXByIDE4IDE1OjMwOjU3IENTVCAyMDI0In0.j_YKsCRsIQtpgOWfFvMwAP65Rlx9uXyVte_xkE95Vdo",
        view: {
          destination: { x: -2132142.087145638, y: 4425161.123976678, z: 4070278.934587119 },
          orientation: { pitch: -0.9541140402489301, roll: 0.0003169349017886347, heading: 6.140422544975061 }
        }
      },
      { 
        label: "金鸡台村模型4", 
        type: "model", 
        url: "/imagery/tile/model/service/qMRvXo9Q/tileset.json?labtoken=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiItMSxUaHUgQXByIDE4IDE1OjMwOjU3IENTVCAyMDI0In0.j_YKsCRsIQtpgOWfFvMwAP65Rlx9uXyVte_xkE95Vdo",
        view: {
          destination: { x: -2127321.106886179, y: 4421820.211235223, z: 4068832.7651704233 },
          orientation: { pitch: -0.9541063907093843, roll: 0.00031503367875540533, heading: 6.140424095992006 }
        }
      }
    ]
  },
  {
    label: "龙泉庄村",
    children: [
      { 
        label: "龙泉庄村影像", 
        type: "imagery", 
        url: "/imagery/tile/image/wmts/Tdjg608Z/{z}/{x}/{y}?labtoken=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiItMSxUaHUgQXByIDE4IDE1OjMwOjU3IENTVCAyMDI0In0.j_YKsCRsIQtpgOWfFvMwAP65Rlx9uXyVte_xkE95Vdo" 
      },
      { 
        label: "龙泉庄村地形", 
        type: "terrain", 
        url: "/imagery/tile/terrain/pLtaLGeZ?labtoken=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiItMSxUaHUgQXByIDE4IDE1OjMwOjU3IENTVCAyMDI0In0.j_YKsCRsIQtpgOWfFvMwAP65Rlx9uXyVte_xkE95Vdo",
        view: {
          destination: { x: -2168757.031244387, y: 4352617.776664691, z: 4114967.541317504 },
          orientation: { pitch: -0.4435676845783054, roll: 6.283154708563269, heading: 5.537612876549447 }
        }
      },
      { 
        label: "龙泉庄村模型", 
        type: "model", 
        url: "/imagery/tile/model/service/vv0P5FuH/tileset.json?labtoken=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiItMSxUaHUgQXByIDE4IDE1OjMwOjU3IENTVCAyMDI0In0.j_YKsCRsIQtpgOWfFvMwAP65Rlx9uXyVte_xkE95Vdo",
        view: {
          destination: { x: -2168663.968240228, y: 4355261.718587015, z: 4115712.067191204 },
          orientation: { pitch: -0.9540906570127872, roll: 0.00031112334289318255, heading: 6.140427286015401 }
        }
      }
    ]
  },
  {
    label: "峪沟村",
    children: [
      { 
        label: "峪沟村影像", 
        type: "imagery", 
        url: "/imagery/tile/image/wmts/okRsdbWk/{z}/{x}/{y}?labtoken=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiItMSxUaHUgQXByIDE4IDE1OjMwOjU3IENTVCAyMDI0In0.j_YKsCRsIQtpgOWfFvMwAP65Rlx9uXyVte_xkE95Vdo" 
      },
      { 
        label: "峪沟村地形", 
        type: "terrain", 
        url: "/imagery/tile/terrain/2LBx9e7E?labtoken=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiItMSxUaHUgQXByIDE4IDE1OjMwOjU3IENTVCAyMDI0In0.j_YKsCRsIQtpgOWfFvMwAP65Rlx9uXyVte_xkE95Vdo",
        view: {
          destination: { x: -2170854.0167420367, y: 4358200.634596329, z: 4110425.3427262204 },
          orientation: { pitch: -0.847848874762068, roll: 0.00008577448108137986, heading: 0.4679505123692884 }
        }
      },
      { 
        label: "峪沟村模型", 
        type: "model", 
        url: "/imagery/tile/model/service/4QnI3jUW/tileset.json?labtoken=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiItMSxUaHUgQXByIDE4IDE1OjMwOjU3IENTVCAyMDI0In0.j_YKsCRsIQtpgOWfFvMwAP65Rlx9uXyVte_xkE95Vdo",
        view: {
          destination: { x: -2173100.959020146, y: 4359294.155857249, z: 4110691.2853415837 },
          orientation: { pitch: -0.9540973990229973, roll: 0.00031279893049074303, heading: 6.140425919087564 }
        }
      }
    ]
  },
  {
    label: "灵水村",
    children: [
      { 
        label: "灵水村影像", 
        type: "imagery", 
        url: "/imagery/tile/image/wmts/sxVRibjH/{z}/{x}/{y}?labtoken=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiItMSxUaHUgQXByIDE4IDE1OjMwOjU3IENTVCAyMDI0In0.j_YKsCRsIQtpgOWfFvMwAP65Rlx9uXyVte_xkE95Vdo" 
      },
      { 
        label: "灵水村地形", 
        type: "terrain", 
        url: "/imagery/tile/terrain/N0INPZIN?labtoken=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiItMSxUaHUgQXByIDE4IDE1OjMwOjU3IENTVCAyMDI0In0.j_YKsCRsIQtpgOWfFvMwAP65Rlx9uXyVte_xkE95Vdo",
        view: {
          destination: { x: -2127000.0250662216, y: 4408369.621939603, z: 4078610.664222384 },
          orientation: { pitch: -0.4326441481504202, roll: 0.000025937982368162693, heading: 4.9973143963984015 }
        }
      },
      { 
        label: "灵水村模型", 
        type: "model", 
        url: "/imagery/tile/model/service/hj3Ipgwk/tileset.json?labtoken=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiItMSxUaHUgQXByIDE4IDE1OjMwOjU3IENTVCAyMDI0In0.j_YKsCRsIQtpgOWfFvMwAP65Rlx9uXyVte_xkE95Vdo",
        view: {
          destination: { x: -2128232.405466075, y: 4415420.0330180405, z: 4079261.2309530703 },
          orientation: { pitch: -0.9541075114138131, roll: 0.00031531221697900236, heading: 6.140423868761242 }
        }
      }
    ]
  },
  {
    label: "田庄村",
    children: [
      { 
        label: "田庄村影像", 
        type: "imagery", 
        url: "/imagery/tile/image/wmts/EDtElo3U/{z}/{x}/{y}?labtoken=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiItMSxUaHUgQXByIDE4IDE1OjMwOjU3IENTVCAyMDI0In0.j_YKsCRsIQtpgOWfFvMwAP65Rlx9uXyVte_xkE95Vdo" 
      },
      { 
        label: "田庄村地形", 
        type: "terrain", 
        url: "/imagery/tile/terrain/sDpC3pM8?labtoken=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiItMSxUaHUgQXByIDE4IDE1OjMwOjU3IENTVCAyMDI0In0.j_YKsCRsIQtpgOWfFvMwAP65Rlx9uXyVte_xkE95Vdo",
        view: {
          destination: { x: -2136032.9273641515, y: 4399423.940210319, z: 4084681.6412534667 },
          orientation: { pitch: -0.6380935762087248, roll: 6.283155058648237, heading: 6.117892190518964 }
        }
      },
      { 
        label: "田庄村模型", 
        type: "model", 
        url: "/imagery/tile/model/service/Iakp0nhx/tileset.json?labtoken=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiItMSxUaHUgQXByIDE4IDE1OjMwOjU3IENTVCAyMDI0In0.j_YKsCRsIQtpgOWfFvMwAP65Rlx9uXyVte_xkE95Vdo",
        view: {
          destination: { x: -2138006.584911224, y: 4402665.343671573, z: 4086466.2821442005 },
          orientation: { pitch: -0.9541030942818041, roll: 0.0003142143946410769, heading: 6.140424764361058 }
        }
      }
    ]
  }
]);

// 默认选中的节点
const defaultSelectedKeys = ref(["地形数据"]); // 确保与 treeData 的 label 完全匹配
// 默认选中的节点（地形数据默认开启）
const defaultSelectedKeys = ref(["地形数据"]);

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

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

/**
 * 初始化地图
 */
function initMap() {
  // 初始化地形数据
  let TerrainLayer = earthCtrl.factory.createTerrainLayer({
    sourceType: "ctb",
    url: "http://106.120.22.26:9103/gisserver/ctsserver/sungugoudem",
  });
  treeMap.set("地形数据", TerrainLayer);
    // 初始化模型数据
  // let modelPromise = addTileset(
  //   "http://106.120.22.26:9103/gisserver/c3dserver/sunhugou3d/tileset.json"
  // );
  // modelPromise.then((model) => {
  //   treeMap.set("模型数据", model);
  // });
// 地形数据实例
let TerrainLayer = null;
// 影像数据实例
let ImageryLayer = null;

  // 初始化影像数据
  // let ImageryLayer = earthCtrl.factory.createImageryLayer({
  //   sourceType: "tms",
  //   url: "http://106.120.22.26:9103/gisserver/tmsserver/sunhugoudom",
  // });
  // treeMap.set("影像数据", ImageryLayer);
/**
 * 初始化地形数据图层
 */
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);
  }
}

/**
 * 处理复选框状态变化
 * 初始化影像数据图层
 */
function handleCheckChange(data, checked, indeterminate) {
async function initImageryLayer() {
  try {
    ImageryLayer = await earthCtrl.factory.createImageryLayer({
      sourceType: "wmts",
      url: "http://106.120.22.26:9103/gisserver/tmsserver/sunhugoudom",
      // url: "/imagery/tile/image/wmts/pTkjV3J9/{z}/{x}/{y}?labtoken=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiItMSxUaHUgQXByIDE4IDE1OjMwOjU3IENTVCAyMDI0In0.j_YKsCRsIQtpgOWfFvMwAP65Rlx9uXyVte_xkE95Vdo",
    });
    treeMap.set("影像数据", ImageryLayer);
  } catch (error) {
    console.error("影像数据初始化失败:", error);
  }
}
// async function initImageryLayerByName(name, url) {
//   try {
//     // 创建影像图层
//     const imageryLayer = await earthCtrl.factory.createImageryLayer({
//       sourceType: "wmts", // 根据实际情况调整sourceType
//       url: url,
//     });

//     // 将创建的影像图层添加到Cesium Viewer中
//     // if (imageryLayer) {
//     //   viewer.imageryLayers.add(imageryLayer);
//     // }

//     // 将图层实例保存到treeMap中
//     treeMap.set(name, imageryLayer);

//     console.log(`${name} 影像数据初始化成功`);
//   } catch (error) {
//     console.error(`${name} 影像数据初始化失败:`, error);
//   }
// }
/**
 * 处理树节点勾选变化
 * @param {Object} data - 节点数据
 * @param {Boolean} checked - 是否选中
 * @param {Boolean} indeterminate - 不确定状态
 */
 function handleCheckChange(data, checked) {
  const label = data.label;

  // 地形数据处理
  if (label === "地形数据") {
    handleTerrainLayer(checked);
    return;
  }

  // 影像数据处理
  if (label === "影像数据") {
    if (checked) {
      // 加载影像数据
      console.log("开始加载影像数据...");
      let ImageryLayer = earthCtrl.factory.createImageryLayer({
        sourceType: "tms",
        url: "http://106.120.22.26:9103/gisserver/tmsserver/sunhugoudom",
      });
      treeMap.set("影像数据", ImageryLayer);
      toggleLayerVisible("影像数据", true); // 显示影像数据
    } else {
      // 移除影像数据
      const layer = treeMap.get("影像数据");
      if (layer) {
        toggleLayerVisible("影像数据", false); // 隐藏影像数据
        ImageryLayer.removeFromMap(); // 从 Map 中移除
        console.log("影像数据已移除");
      }
    }
    handleImageryLayer(checked);
    return;
  }

  // 模型数据处理
  if (label === "模型数据") {
    if (checked) {
      // 动态加载模型数据
      console.log("开始加载模型数据...");
      let modelPromise = addTileset(
        "http://106.120.22.26:9103/gisserver/c3dserver/sunhugou3d/tileset.json"
      );

      modelPromise.then((model) => {
        console.log("模型数据加载完成");
        treeMap.set("模型数据", model); // 将模型数据存储到 treeMap
        toggleLayerVisible("模型数据", true); // 显示模型数据
      }).catch((error) => {
        console.error("模型数据加载失败:", error);
      });
    } else {
      // 隐藏模型数据
      toggleLayerVisible("模型数据", false);
    }
    handleModelLayer(checked);
    return;
  }

  // 其他图层的处理逻辑
  const list = treeMap.get(label);
  if (list) {
  // 设备信息处理
  if (label === "综合监测设备信息") {
    simStore.DeviceShowSwitch = checked;
    return;
  }

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

  // 村庄图层处理
// if (data.type === "imagery") {
//     if (checked) {
//       initImageryLayerByName(label, data.url);
//     } else {
//       const layer = treeMap.get(label);
//       if (layer) {
//         viewer.imageryLayers.remove(layer);
//         treeMap.delete(label);
//       }
//     }
//     return;
//   }
  if (data.type === "terrain") {
  handleTerrainLayerByName(label, data.url, checked, data.view);
  return;
}

if (data.type === "model") {
  handleModelLayerByUrl(label, data.url, checked, data.view);
  return;
}

  // 其他图层的处理
  const layer = treeMap.get(label);
  if (layer) {
    toggleLayerVisible(label, checked);
    return;
  }
}
async function handleTerrainLayerByName(name, url, checked, view) {
  if (checked) {
    try {
      const layer = await earthCtrl.factory.createTerrainLayer({
        sourceType: "ctb",
        url,
        requestVertexNormals: true,
      });
      treeMap.set(name, layer);
      viewer.terrain = layer;

  switch (label) {
    case "影像数据":
    case "地形数据":
    case "北京市隐患点":
    case "孙胡沟隐患点":
    case "泥石流隐患点面数据":
    case "综合监测设备信息":
    case "孙胡沟断面":
    case "避险点":
      console.log(label, checked, indeterminate);
      break;
      console.log(view, 'zhelishi shuju'); // 现在应该有数据了

      if (view && view.destination && view.orientation) {
        viewer.scene.camera.flyTo({
          destination: new Cesium.Cartesian3(
            view.destination.x,
            view.destination.y,
            view.destination.z
          ),
          orientation: {
            heading: view.orientation.heading,
            pitch: view.orientation.pitch,
            roll: view.orientation.roll
          }
        });
      }

    } catch (error) {
      console.error(`地形图层 ${name} 加载失败:`, error);
    }
  } else {
    const layer = treeMap.get(name);
    if (layer) {
      toggleLayerVisible(name, false);
      layer.removeFromMap();
      treeMap.delete(name);
    }
  }
}

async function handleModelLayerByUrl(name, url, checked, view) {
  if (checked) {
    try {
      const model = await addTileset(url);
      treeMap.set(name, model);
      viewer.scene.primitives.add(model);

      if (view && view.destination && view.orientation) {
        viewer.scene.camera.flyTo({
          destination: new Cesium.Cartesian3(
            view.destination.x,
            view.destination.y,
            view.destination.z
          ),
          orientation: {
            heading: view.orientation.heading,
            pitch: view.orientation.pitch,
            roll: view.orientation.roll
          }
        });
      }

    } catch (error) {
      console.error(`模型图层 ${name} 加载失败:`, error);
    }
  } else {
    const model = treeMap.get(name);
    if (model) {
      viewer.scene.primitives.remove(model);
      treeMap.delete(name);
    }
  }
}
/**
 * 处理地形图层
 */
function handleTerrainLayer(checked) {
  if (checked) {
    initTerrainLayer();
    toggleLayerVisible("地形数据", true);
  } else {
    const layer = treeMap.get("地形数据");
    if (layer) {
      toggleLayerVisible("地形数据", false);
      layer.removeFromMap();
      treeMap.delete("地形数据");
    }
  }
}

/**
 * 处理影像图层
 */
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"
      "/imagery/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, checked) {
  const entityList = treeMap.get(name);

  console.log(`Toggling visibility for ${name}:`, checked);

  if (Array.isArray(entityList)) {
    entityList.forEach((entity) => {
      console.log(`Setting entity show to:`, checked);
      entity.show = checked;
    });
  } else if (entityList && typeof entityList.show !== 'undefined') {
    console.log(`Setting layer show to:`, checked);
    entityList.show = checked;
  } else {
    console.error(`无法设置图层 ${name} 的可见性`);
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();
}

// 设备列表
const devicetList = ref([]);

/**
 * 获取设备列表并初始化设备点
 * 清除图层实体
 * @param {String} layerName - 图层名称
 */
const getDevicetList = async () => {
  await getDevicetListData().then((res) => {
    console.log(res.data, 'devicetList.value2');
    devicetList.value = res.data;
  });
};

async function initDevicePoint() {
  let list = [];
  await getDevicetList();
  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);
}

// 区域列表
const districtList = ref([]);
// 暂且保留
// 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 - 图层名称
 */
const getDistrictList = async () => {
  await getDistrictListData().then((res) => {
    districtList.value = res.data;
  });
};
// 此函数优化了在模拟仿真页面，如果点击目录树选中取消，泥位计仍显示
async function clearLayerEntities(layerName) {
  const isMnfzPage = route.path === "/mnfz"; // 判断是否为 /mnfz 页面

async function initDistrictPoint() {
  let list = [];
  await getDistrictList();
  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);
  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);
}

let divPointList = [];
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);
    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;
      list.push(entity);
      return entity;
    });
    treeMap.set("孙胡沟断面", list);
  });
}

/**
 * 添加避险点
 * 添加避险场所数据
 */
function addTetrahedron(visible) {
  const emergencyAreaList = [];
  // 加载避险点底层面片
  loadAreaPolygon("/json/emergency_area.geojson", true).then((entities) => {
    emergencyAreaList.push(...entities);

    // 默认隐藏避险点
    entities.forEach((entity) => {
      entity.show = false;
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);
    });

    // 将避险点实体存储到 treeMap
    treeMap.set("避险点", entities);
  });
}

/**
 * 初始化所有数据
 */
function getData() {
  initDevicePoint();
  initDistrictPoint();
function initData() {
  initDuanmianPoint();
  addTetrahedron();
}
@@ -284,11 +745,8 @@
watch(
  () => checkedKeys.value,
  (keys) => {
    if (keys && Array.isArray(keys)) {
      treeRef.value.setCheckedKeys(
        defaultSelectedKeys.value.concat(keys),
        true
      );
    if (Array.isArray(keys)) {
      treeRef.value?.setCheckedKeys([...defaultSelectedKeys.value, ...keys]);
    }
  }
);
@@ -297,55 +755,53 @@
watch(
  () => route.fullPath,
  (path) => {
    const defaultKeys = defaultSelectedKeys.value;
    if (path == "/yhgl") {
      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);
    } else if (path == "/mnfz") {
      treeRef.value.setCheckedKeys(
        defaultKeys.concat("孙胡沟断面"),
        false
      );
      toggleLayerVisible("孙胡沟断面", false);
      toggleLayerVisible("孙胡沟隐患点", false);
      toggleLayerVisible("综合监测设备信息", false);
    } else {
      treeRef.value.setCheckedKeys(defaultKeys, true);
    }
  }
    const defaultKeys = [...defaultSelectedKeys.value];
    const checkedKeys =
      {
        // 页面默认勾选显示在此处
        "/yhgl": [...defaultKeys, "孙胡沟隐患点"],
        "/zhjc": [...defaultKeys, "综合监测设备信息"],
        // "/mnfz": [...defaultKeys, "孙胡沟断面"],
      }[path] || defaultKeys;

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

// 组件挂载时初始化
onMounted(() => {
  initMap();
  getData();
  initTerrainLayer();
  initData();
  nextTick(() => {
    // 确保树组件渲染完成后设置默认选中项
    treeRef.value.setCheckedKeys(defaultSelectedKeys.value, true);
    treeRef.value?.setCheckedKeys(defaultSelectedKeys.value);
  });
});

// 组件卸载时清理资源
onUnmounted(() => {
  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 {
  background: url("@/assets/img/tools/plotting_new.png");
  width: 200px;
  height: 200px;
  z-index: 99;
  overflow: hidden;

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