diff --git a/src/api/progress/plan/types.ts b/src/api/progress/plan/types.ts index 7a4a6f0..cb625a1 100644 --- a/src/api/progress/plan/types.ts +++ b/src/api/progress/plan/types.ts @@ -30,6 +30,7 @@ export interface ProgressCategoryVO { children: ProgressCategoryVO[]; threeChildren: any[]; hasChildren:any; + detailChildren:any; } export interface ProgressCategoryForm extends BaseEntity { diff --git a/src/views/progress/plan/component/createDailyRate.vue b/src/views/progress/plan/component/createDailyRate.vue index 121d5fa..98cefa8 100644 --- a/src/views/progress/plan/component/createDailyRate.vue +++ b/src/views/progress/plan/component/createDailyRate.vue @@ -61,8 +61,8 @@ @@ -488,18 +488,18 @@ const handleRemove = (row?: any) => { }; // 延期计算 -const filterW = (row: any): number => { - const { finishedNumber, planNumber, endAt } = row; - if (!endAt) return 0; +// const filterW = (row: any): number => { +// const { finishedNumber, planNumber, endAt } = row; +// if (!endAt) return 0; - const endTime = new Date(endAt).getTime(); - const now = new Date().getTime(); +// const endTime = new Date(endAt).getTime(); +// const now = new Date().getTime(); - if (endTime <= now && planNumber > finishedNumber) { - return planNumber - finishedNumber; - } - return 0; -}; +// if (endTime <= now && planNumber > finishedNumber) { +// return planNumber - finishedNumber; +// } +// return 0; +// }; // 暴露给模板的属性和方法 defineExpose({ diff --git a/src/views/progress/progressPaper/index.vue b/src/views/progress/progressPaper/index.vue index 07144a1..8e40273 100644 --- a/src/views/progress/progressPaper/index.vue +++ b/src/views/progress/progressPaper/index.vue @@ -24,10 +24,9 @@ :load="loadNode" node-key="id" lazy - @node-collapse="closeNode" - @node-expand="openNode" :render-content="renderContent" check-strictly + :expand-on-click-node="false" />
@@ -82,7 +81,8 @@ const treeProps = { children: 'children', label: 'name', isLeaf: 'leaf', - hasChildren: 'hasChildren' // 重要 + hasChildren: 'hasChildren', // 重要 + disabled: 'disabled' }; //切换项目 @@ -99,36 +99,76 @@ const handleSelect = (projectId: string) => { /** 进度类别树选中事件 */ const handleCheckChange = (data: any, checked: boolean, indeterminate: boolean) => { const node: Node | undefined = treeRef.value?.getNode(data.id); + + if (node.level === 2) { + //二级节点 展开显示图层 收起删除 + const children = node.childNodes.map((child) => child.data); + children.forEach((child) => { + child.disabled = !checked; + }); + // 让 el-tree 刷新显示 + treeRef.value.updateKeyChildren(data.id, children); + if (checked) { + addPointToMap(data.threeChildren); // 添加点到地图 + clearLevel3Checked(node.level); // 清除三级节点的选中状态 + treeRef.value.setChecked(data.id, true, false); + } else { + data.threeChildren.forEach((child: any) => { + const feature = featureMap[child.id]; + if (feature && sharedSource.hasFeature(feature)) { + sharedSource.removeFeature(feature); + } + }); + } + return; + } if (!checked) return (submitForm.value.id = ''); // 只处理第三级节点的选中事件 const parent = node.parent; if (!parent) return; //消除所有节点的选中状态 - treeRef.value.setCheckedKeys([], false); + clearLevel3Checked(node.level); // 清除三级节点的选中状态 // 设置当前点击项为选中 treeRef.value.setChecked(data.id, true, false); submitForm.value.id = data.id; // 设置提交表单的id }; -/** 关闭节点事件 */ -const closeNode = (node: any) => { - // 清除子节点 - if (node.pid) { - node.threeChildren.forEach((child: any) => { - const feature = featureMap[child.id]; - if (feature && sharedSource.hasFeature(feature)) { - sharedSource.removeFeature(feature); +//清除某一级节点所有选中状态 +const clearLevel3Checked = (level) => { + const rootNodes = treeRef.value.store.root.childNodes; + + const clearChecked = (nodes: any[]) => { + nodes.forEach((node) => { + if (node.level === level) { + treeRef.value.setChecked(node.key, false, false); + } else if (node.childNodes?.length) { + clearChecked(node.childNodes); } }); - } + }; + + clearChecked(rootNodes); }; -/** 打开节点事件 */ -const openNode = (node: any) => { - // 清除子节点 - if (!node.pid) return; - addPointToMap(node.threeChildren); // 添加点到地图 -}; +/** 关闭节点事件 */ +// const closeNode = (node: any) => { +// // 清除子节点 +// if (node.pid) { +// // node.threeChildren.forEach((child: any) => { +// // const feature = featureMap[child.id]; +// // if (feature && sharedSource.hasFeature(feature)) { +// // sharedSource.removeFeature(feature); +// // } +// // }); +// } +// }; + +// /** 打开节点事件 */ +// const openNode = (node: any) => { +// // 清除子节点 +// if (!node.pid) return; +// // addPointToMap(node.threeChildren); // 添加点到地图 +// }; //懒加载子节点 const loadNode = async (node: any, resolve: (data: any[]) => void) => { @@ -153,13 +193,15 @@ const loadNode = async (node: any, resolve: (data: any[]) => void) => { return { ...detail, name: detail.date, // 设置为叶子节点 - leaf: true // 标记为叶子节点 + leaf: true, // 标记为叶子节点 + disabled: true }; }); progressCategoryList.value.forEach((item, i) => { let indexNum = item.children.findIndex((item) => item.id === secondLevelNodeId); if (indexNum !== -1) { item.children[indexNum].threeChildren = res.data.facilityList; // 将子节点添加到当前节点的threeChildren属性中 + // item.children[indexNum].detailChildren = children; // 将子节点添加到当前节点的threeChildren属性中 } }); @@ -193,7 +235,7 @@ const submit = () => { //重置树形结构选中以及图层高亮 const resetTreeAndMap = () => { // 重置树形结构选中状态 - treeRef.value?.setCheckedKeys([]); + clearLevel3Checked(3); //取消加载状态 loading.value = false; // 清除地图上的所有高亮 @@ -216,13 +258,25 @@ const handleChange = (value: number) => { }; //限定部分节点能选择 -const renderContent = (context, { node }) => { +const renderContent = (context, { node, data }) => { if (node.level === 3) { return h('span', { class: 'custom-tree-node' }, [ h(ElCheckbox, { modelValue: node.checked, 'onUpdate:modelValue': (val) => node.setChecked(val), - style: 'margin-right: 8px;margin-left: -20px;' + style: 'margin-right: 8px;', + disabled: data.disabled + }), + h('span', node.label) + ]); + } + if (node.level === 2) { + return h('span', { class: 'custom-tree-node' }, [ + h(ElCheckbox, { + modelValue: node.checked, + 'onUpdate:modelValue': (val) => node.setChecked(val), + style: 'margin-right: 8px;', + disabled: !data.threeChildren || data.threeChildren.length == 0 }), h('span', node.label) ]);