| | |
| | | </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; |
| | |
| | | coverData.value = folderChildren; |
| | | emit('update:coverData', coverData.value); |
| | | } else { |
| | | emit('update:coverData', [node.data]); |
| | | // 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 handleEdit = node => { |
| | | if (node.data.level == 2) { |
| | | layerParams.value.editFolder = true; |
| | | layerParams.value.addAnEditingFolder = 2; |
| | | if (props.activeName === '电子围栏') { |
| | | if (props.activeName === '自定义识别区') { |
| | | layerParams.value.fileType = 1; |
| | | } else if (props.activeName === '自定义禁飞区') { |
| | | layerParams.value.fileType = 2; |
| | |
| | | coverData.value = []; |
| | | layerParams.value.editNest = true; |
| | | layerParams.value.decideWhetherToAddOrEdit = 2; |
| | | if (props.activeName === '电子围栏') { |
| | | if (props.activeName === '自定义识别区') { |
| | | layerParams.value.fenceType = 1; // 电子围栏类型标识 |
| | | } else if (props.activeName === '自定义禁飞区') { |
| | | layerParams.value.fenceType = 2; // 自定义禁飞区类型标识 |
| | | layerParams.value.fenceType = 2; // 自定义禁飞区类型标识 |
| | | } |
| | | emit('update:deitData', node.data); |
| | | } |
| | |
| | | const addFence = () => { |
| | | layerParams.value.addNest = true; |
| | | layerParams.value.decideWhetherToAddOrEdit = 1; |
| | | if (props.activeName === '电子围栏') { |
| | | if (props.activeName === '自定义识别区') { |
| | | layerParams.value.fenceType = 1; // 电子围栏类型标识 |
| | | } else if (props.activeName === '自定义禁飞区') { |
| | | layerParams.value.fenceType = 2; // 自定义禁飞区类型标识 |
| | |
| | | const addFolder = () => { |
| | | layerParams.value.addFolder = true; |
| | | layerParams.value.addAnEditingFolder = 1; |
| | | if (props.activeName === '电子围栏') { |
| | | if (props.activeName === '自定义识别区') { |
| | | layerParams.value.fileType = 1; |
| | | } else if (props.activeName === '自定义禁飞区') { |
| | | layerParams.value.fileType = 2; |
| | |
| | | position: absolute; |
| | | top: 0; |
| | | left: 0; |
| | | height: 95%; |
| | | height: calc(100% - 32px); |
| | | z-index: 99; |
| | | width: 382px; |
| | | overflow: hidden; |
| | | background: rgba(0, 0, 0, 0.8); |
| | | border-radius: 8px 8px 8px 8px; |
| | | padding: 16px 12px; |
| | | padding: 16px 0 16px 12px; |
| | | display: flex; |
| | | flex-direction: column; |
| | | } |
| | |
| | | .searchBox { |
| | | display: flex; |
| | | margin-top: 10px; |
| | | padding-right: 12px; |
| | | .inputName { |
| | | width: 184px; |
| | | height: 32px; |
| | |
| | | margin: 12px 0 14px 0; |
| | | display: flex; |
| | | gap: 0 10px; |
| | | |
| | | padding-right: 12px; |
| | | .el-button { |
| | | margin: 0 !important; |
| | | } |
| | | } |
| | | .tableListBox { |
| | | overflow-y: scroll; |
| | | height: 0; |
| | | flex-grow: 1; |
| | | padding-right: 12px; |
| | | :deep(.el-tree-node__content) { |
| | | height: 38px !important; |
| | | line-height: 38px !important; |
| | | } |
| | | overflow-y: scroll; |
| | | height: 0; |
| | | flex-grow: 1; |
| | | |
| | | .isTheTerritory { |
| | | :deep() { |
| | | .el-tree-node__expand-icon { |