feat:地图加载

张含笑

2025-10-27 84f687529f8008632e0be10e0054bd1aa12e2888

feat:地图加载

 src/views/layerManagement/components/leftList.vue

@@ -28,12 +28,13 @@
    </div>
    <div class="tableListBox">
      <el-tree
       ref="treeRef"
        v-model="checkedKeys"
        :data="treeData"
        show-checkbox
        node-key="id"
        default-expand-all
        @check-change="changeClick"
 @check="handleCheck"
        :props="{
          label: 'name',
          children: 'children',
@@ -95,21 +96,40 @@
]);

const checkedKeys = ref([]); // 存储勾选的节点key
const treeRef = ref(null); // 获取tree实例

const checkedNodes = ref([]); // 存储勾选的节点数据
// 全选方法
const selectAll = () => {
  const allKeys = [];
  // 递归收集所有节点的id
  const collectKeys = data => {
    data.forEach(item => {
      allKeys.push(item.id);
      if (item.children) {
        collectKeys(item.children);
      }
    });
  };
  collectKeys(treeData.value);
  checkedKeys.value = allKeys;
  if (treeRef.value) {
    // 获取所有节点的key
    const allKeys = treeData.value.flatMap(item => [
      item.id,
      ...item.children.map(child => child.id)
    ]);
    
    if (checkedKeys.value.length === allKeys.length) {
      // 如果已经全选，则取消全选
      treeRef.value.setCheckedKeys([]);
      checkedNodes.value = [];
    } else {
      // 否则全选
      treeRef.value.setCheckedKeys(allKeys);
      // 获取所有节点数据
      checkedNodes.value = treeData.value.flatMap(item => [
        item,
        ...item.children
      ]);
        console.log('所有数据',checkedNodes.value);
    }
  }
};
const handleCheck = (checkedNodesData, checkedKeysData) => {
  checkedNodes.value = checkedNodesData.checkedNodes;

  
//   console.log('选中的节点数据:', checkedNodesData);
//   console.log('选中的节点keys:', checkedKeysData);
};
const changeClick =(val)=>{