| | |
| | | </div> |
| | | <div class="btnGroups"> |
| | | <el-button v-if="activeName !== '国土空间规划'" class="ztzf-button" @click="addFence">{{ |
| | | props.activeName === '自定义识别区' ? '新增围栏' : '新增禁飞区' |
| | | props.activeName === '自定义识别区' ? '新增识别区' : '新增禁飞区' |
| | | }}</el-button> |
| | | <el-button v-if="activeName !== '国土空间规划'" class="ztzf-button" @click="addFolder" |
| | | >新增文件夹</el-button |
| | |
| | | <el-button v-else class="ztzf-button" @click="synchronize"> 同步 </el-button> |
| | | </template> --> |
| | | |
| | | <el-button class="ztzf-button" @click="selectAll">全选</el-button> |
| | | <!-- <el-button class="ztzf-button" @click="selectAll">全选</el-button> --> |
| | | <el-button class="ztzf-button" @click="selectAll"> |
| | | {{ checkedKeys.length === getAllFenceKeys().length ? '取消全选' : '全选' }} |
| | | </el-button> |
| | | </div> |
| | | <div |
| | | class="tableListBox" |
| | |
| | | emit('update:coverData', coverData.value); |
| | | }; |
| | | // 全选方法 |
| | | const getAllFenceKeys = () => { |
| | | return treeData.value.flatMap( |
| | | folder => folder.children.map(fence => fence.id) |
| | | ); |
| | | }; |
| | | const selectAll = () => { |
| | | if (treeRef.value) { |
| | | const allFenceKeys = treeData.value.flatMap( |
| | | folder => folder.children.map(fence => fence.id) // folder 是 level 2,children 是 level 3 |
| | | ); |
| | | const allFenceKeys = getAllFenceKeys(); |
| | | const allFenceNodes = treeData.value.flatMap(folder => folder.children); |
| | | |
| | | if (checkedKeys.value.length === allFenceKeys.length) { |
| | | // 取消全选:清空 keys 和数据 |
| | | // 取消全选 |
| | | treeRef.value.setCheckedKeys([]); |
| | | checkedKeys.value = []; |
| | | checkedNodes.value = []; |
| | | coverData.value = []; |
| | | } else { |
| | | // 全选:仅设置 level 3 节点的 id |
| | | // 全选 |
| | | treeRef.value.setCheckedKeys(allFenceKeys); |
| | | checkedKeys.value = allFenceKeys; |
| | | checkedNodes.value = allFenceNodes; |
| | |
| | | } |
| | | }; |
| | | // 定位按钮事件 |
| | | // const handleLocation = node => { |
| | | // // checkedKeys.value = []; |
| | | // // checkedNodes.value = []; |
| | | // // coverData.value = []; |
| | | // if (node.data.level === 2) { |
| | | // const folderChildren = node.data.children || []; |
| | | // const childrenIds = folderChildren.map(child => child.id); |
| | | // treeRef.value.setCheckedKeys(childrenIds); |
| | | // checkedKeys.value = childrenIds; |
| | | // checkedNodes.value = folderChildren; |
| | | // coverData.value = folderChildren; |
| | | // emit('update:coverData', coverData.value); |
| | | // } else { |
| | | // const currentNodeId = node.data.id; |
| | | // treeRef.value.setCheckedKeys([currentNodeId]); |
| | | // checkedKeys.value = [currentNodeId]; |
| | | // checkedNodes.value = [node.data]; |
| | | |
| | | // coverData.value = [node.data]; |
| | | // emit('update:coverData', coverData.value); |
| | | // } |
| | | // }; |
| | | const handleLocation = node => { |
| | | const currentCheckedKeys = Array.isArray(checkedKeys.value) ? [...checkedKeys.value] : []; |
| | | const currentCheckedNodes = Array.isArray(checkedNodes.value) ? [...checkedNodes.value] : []; |
| | | // 触发定位逻辑(通知父组件) |
| | | EventBus.emit('focusOnNode', node.data); |
| | | checkedKeys.value = []; |
| | | checkedNodes.value = []; |
| | | coverData.value = []; |
| | | if (node.data.level === 2) { |
| | | const folderChildren = node.data.children || []; |
| | | const childrenIds = folderChildren.map(child => child.id); |
| | | // 合并已选中的节点(去重) |
| | | const newCheckedKeys = [...new Set([...currentCheckedKeys, ...childrenIds])]; |
| | | const newCheckedNodes = [...currentCheckedNodes, ...folderChildren]; |
| | | treeRef.value.setCheckedKeys(newCheckedKeys); |
| | | checkedKeys.value = newCheckedKeys; |
| | | checkedNodes.value = newCheckedNodes; |
| | | coverData.value = newCheckedNodes; |
| | | } |
| | | else { |
| | | const currentNodeId = node.data.id; |
| | | if (!currentCheckedKeys.includes(currentNodeId)) { |
| | | currentCheckedKeys.push(currentNodeId); |
| | | currentCheckedNodes.push(node.data); |
| | | console.log(' currentCheckedNodes', currentCheckedNodes); |
| | | |
| | | } |
| | | treeRef.value.setCheckedKeys(currentCheckedKeys); |
| | | checkedKeys.value = currentCheckedKeys; |
| | | checkedNodes.value = currentCheckedNodes; |
| | | coverData.value = currentCheckedNodes; |
| | | console.log('currentCheckedNodes',currentCheckedNodes); |
| | | |
| | | console.log('coverData.value',node.data); |
| | | |
| | | // const childrenIds = folderChildren.map(child => child.id); |
| | | // treeRef.value.setCheckedKeys(childrenIds); |
| | | // checkedKeys.value = childrenIds; |
| | | // checkedNodes.value = folderChildren; |
| | | coverData.value = folderChildren; |
| | | emit('update:coverData', coverData.value); |
| | | } else { |
| | | // const currentNodeId = node.data.id; |
| | | // treeRef.value.setCheckedKeys([currentNodeId]); |
| | | // checkedKeys.value = [currentNodeId]; |
| | | // checkedNodes.value = [node.data]; |
| | | coverData.value = [node.data]; |
| | | emit('update:coverData', coverData.value); |
| | | } |
| | | |
| | | emit('update:coverData', coverData.value); |
| | | }; |
| | | |
| | | // 编辑按钮事件 |
| | | const handleEdit = node => { |
| | | if (node.data.level == 2) { |