|
@@ -8,7 +8,6 @@
|
|
|
:check-strictly="isStrictly"
|
|
|
show-checkbox
|
|
|
@check="ElTreeCheckChange"
|
|
|
- @check-change="ElTreeCheckChange1"
|
|
|
>
|
|
|
<template #default="{ node, data }">
|
|
|
<div class="custom-tree-node">
|
|
@@ -67,6 +66,10 @@ const props = defineProps({
|
|
|
type: [String, Number],
|
|
|
default: '',
|
|
|
},
|
|
|
+ onlyChildrenCheck: {
|
|
|
+ type: Boolean,
|
|
|
+ default: false,
|
|
|
+ },
|
|
|
})
|
|
|
|
|
|
//事件
|
|
@@ -96,8 +99,6 @@ watch(() => [
|
|
|
projectId.value = pid
|
|
|
contractId.value = cid
|
|
|
isStrictly.value = strictly
|
|
|
- console.log(strictly, 'strictly')
|
|
|
-
|
|
|
wbsId.value = wid
|
|
|
isCustom.value = cus
|
|
|
|
|
@@ -106,8 +107,6 @@ watch(() => [
|
|
|
//渲染完成
|
|
|
onMounted(() => {
|
|
|
ElTreeLoadNode()
|
|
|
-
|
|
|
-
|
|
|
})
|
|
|
|
|
|
//树形结构异步加载数据
|
|
@@ -161,53 +160,51 @@ const ElTreeLoadNode = async () => {
|
|
|
}
|
|
|
|
|
|
//被选择的
|
|
|
-const ElTreeCheckChange = (_, nodes) => {
|
|
|
- console.log(nodes, 'nodes')
|
|
|
-
|
|
|
-
|
|
|
- if (isStrictly.value) {
|
|
|
- const checkedNodes = ElTreeRef.value?.treeRef?.getCheckedNodes() || []
|
|
|
-
|
|
|
- // console.log(uncheckedNodes, 'uncheckedNodes')
|
|
|
-
|
|
|
- // 处理选中节点的子节点
|
|
|
- checkedNodes.forEach(node => {
|
|
|
- if (node.children && node.children.length > 0) {
|
|
|
- node.children.forEach(child => {
|
|
|
- ElTreeRef.value?.treeRef?.setChecked(child.pKeyId, true, false)
|
|
|
- })
|
|
|
+const ElTreeCheckChange = (data, nodes) => {
|
|
|
+ if (props.onlyChildrenCheck) {
|
|
|
+ const treeRef = ElTreeRef.value?.treeRef
|
|
|
+ if (treeRef) {
|
|
|
+ const currentNode = treeRef.getNode(data.pKeyId)
|
|
|
+ const isChecked = currentNode.checked
|
|
|
+
|
|
|
+ // 递归获取所有子节点的ID
|
|
|
+ const getAllChildrenKeys = (node) => {
|
|
|
+ const keys = []
|
|
|
+ if (node.childNodes && node.childNodes.length > 0) {
|
|
|
+ node.childNodes.forEach(child => {
|
|
|
+ keys.push(child.data.pKeyId)
|
|
|
+ keys.push(...getAllChildrenKeys(child))
|
|
|
+ })
|
|
|
+ }
|
|
|
+ return keys
|
|
|
+ }
|
|
|
+
|
|
|
+ if (!isChecked) {
|
|
|
+ // 取消选中时
|
|
|
+ if (!data.notExsitChild) {
|
|
|
+ // 如果是父节点,递归取消选中当前节点及其所有子节点
|
|
|
+ const allChildKeys = getAllChildrenKeys(currentNode)
|
|
|
+ treeRef.setCheckedKeys([])
|
|
|
+ } else {
|
|
|
+ // 如果是最底层节点,只取消选中当前节点
|
|
|
+ treeRef.setCheckedKeys([])
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ // 选中时
|
|
|
+ if (!data.notExsitChild) {
|
|
|
+ // 如果是父节点,递归选中当前节点及其所有子节点
|
|
|
+ const allChildKeys = getAllChildrenKeys(currentNode)
|
|
|
+ treeRef.setCheckedKeys([data.pKeyId, ...allChildKeys])
|
|
|
+ } else {
|
|
|
+ // 如果是最底层节点,只选中当前节点
|
|
|
+ treeRef.setCheckedKeys([data.pKeyId])
|
|
|
+ }
|
|
|
}
|
|
|
- })
|
|
|
-
|
|
|
-
|
|
|
- }
|
|
|
- const checkedNodes = ElTreeRef.value?.treeRef?.getCheckedNodes() || []
|
|
|
- const checkedKeys = ElTreeRef.value?.treeRef?.getCheckedKeys() || []
|
|
|
- const halfCheckedKeys = ElTreeRef.value?.treeRef?.getHalfCheckedKeys() || []
|
|
|
- const halfCheckedNodes = ElTreeRef.value?.treeRef?.getHalfCheckedNodes() || []
|
|
|
- console.log(checkedNodes, 'checkedNodes')
|
|
|
- let objArr = {
|
|
|
- checkedNodes: checkedNodes,
|
|
|
- halfCheckedNodes:halfCheckedNodes,
|
|
|
- halfCheckedKeys: halfCheckedKeys,
|
|
|
- checkedKeys: checkedKeys,
|
|
|
- }
|
|
|
-
|
|
|
-
|
|
|
- emit('check-change', objArr)
|
|
|
-}
|
|
|
-const ElTreeCheckChange1 = (a, b, c) => {
|
|
|
- if (!b && isStrictly.value) {
|
|
|
- const uncheckedNodes = ElTreeRef.value?.treeRef?.getNode(a.pKeyId)?.data || null
|
|
|
- // // 处理取消选中节点的子节点
|
|
|
- if (uncheckedNodes && uncheckedNodes.children && uncheckedNodes.children.length > 0) {
|
|
|
- uncheckedNodes.children.forEach(child => {
|
|
|
- ElTreeRef.value?.treeRef?.setChecked(child.pKeyId, false, false)
|
|
|
- })
|
|
|
}
|
|
|
}
|
|
|
-
|
|
|
+ emit('check-change', nodes)
|
|
|
}
|
|
|
+
|
|
|
//处理节点
|
|
|
const ElTreeCheckedKeys = () => {
|
|
|
const Nodes = ElTreeRef.value?.treeRef?.getCheckedNodes() || []
|