master
lion 3 months ago
parent 18ba345185
commit 86faa3be9b

@ -28,6 +28,7 @@
clearable clearable
placeholder="选择预算类型" placeholder="选择预算类型"
style="width: 130px" style="width: 130px"
popper-class="budget-type-tree-select"
@change="changeType" @change="changeType"
> >
<el-option disabled value="" style="height:150px;overflow: scroll;"> <el-option disabled value="" style="height:150px;overflow: scroll;">
@ -36,7 +37,7 @@
style="width:300px" style="width:300px"
default-expand-all default-expand-all
:default-checked-keys="checkArr" :default-checked-keys="checkArr"
:check-strictly="true" :check-strictly="false"
:data="types" :data="types"
show-checkbox show-checkbox
node-key="id" node-key="id"
@ -921,10 +922,65 @@ export default {
if (!e) { if (!e) {
this.select.type = '' this.select.type = ''
this.select.typeName = '' this.select.typeName = ''
this.checkArr = []
if (this.$refs.tree1) {
this.$refs.tree1.setCheckedKeys([])
}
}
},
// id
getAllChildrenIds(node) {
let ids = []
if (node.children && node.children.length > 0) {
node.children.forEach(child => {
ids.push(child.id) // id
ids = ids.concat(this.getAllChildrenIds(child)) //
})
} }
return ids
}, },
getSelectedNodes(data, node, ref) { getSelectedNodes(data, node, ref) {
const ref_data = ref || 'tree' const ref_data = ref || 'tree1'
// tree1使
if (ref_data === 'tree1') {
// check-strictly="false"
const checkedNodes = this.$refs[ref_data].getCheckedNodes()
// id
// id + id
// idid
let allSelectedIds = []
//
checkedNodes.forEach(checkedNode => {
//
if (checkedNode.children && checkedNode.children.length > 0) {
// id + id
allSelectedIds.push(checkedNode.id) // id
// id
const childrenIds = this.getAllChildrenIds(checkedNode)
allSelectedIds = allSelectedIds.concat(childrenIds)
} else {
// id
allSelectedIds.push(checkedNode.id)
}
})
//
allSelectedIds = [...new Set(allSelectedIds)]
//
this.checkArr = allSelectedIds
// id this.select.type
this.select.type = allSelectedIds.join(',')
//
const selectedNames = checkedNodes.map(n => n.name).filter((name, index, self) => self.indexOf(name) === index)
this.select.typeName = selectedNames.join(', ')
} else {
//
this.$refs[ref_data].setCheckedKeys([]) this.$refs[ref_data].setCheckedKeys([])
this.checkArr = [] this.checkArr = []
if (data.children && data.children.length > 0) { if (data.children && data.children.length > 0) {
@ -945,6 +1001,7 @@ export default {
this.select.type = data.id this.select.type = data.id
this.select.typeName = data.name this.select.typeName = data.name
} }
}
console.log('checkarr', this.select.typeName, this.$refs[ref_data].getCheckedNodes()) console.log('checkarr', this.select.typeName, this.$refs[ref_data].getCheckedNodes())
this.$forceUpdate() this.$forceUpdate()
}, },
@ -1196,7 +1253,9 @@ export default {
} }
} }
</script> </script>
<!-- ::v-deep .el-checkbox__input .el-checkbox__inner {
border-radius: 50%;
} -->
<style lang="scss" scoped> <style lang="scss" scoped>
.xy-table-item-label { .xy-table-item-label {
width: 160px; width: 160px;
@ -1219,7 +1278,5 @@ export default {
z-index: 2; z-index: 2;
} }
} }
::v-deep .el-checkbox__input .el-checkbox__inner {
border-radius: 50%;
}
</style> </style>

@ -34,7 +34,7 @@
style="width:300px" style="width:300px"
default-expand-all default-expand-all
:default-checked-keys="checkArr" :default-checked-keys="checkArr"
:check-strictly="true" :check-strictly="false"
:data="types" :data="types"
show-checkbox show-checkbox
node-key="id" node-key="id"
@ -287,23 +287,56 @@ export default {
} }
} }
}, },
// id
getAllChildrenIds(node) {
let ids = []
if (node.children && node.children.length > 0) {
node.children.forEach(child => {
ids.push(child.id) // id
ids = ids.concat(this.getAllChildrenIds(child)) //
})
}
return ids
},
// //
getSelectedNodes(data, node, ref) { getSelectedNodes(data, node, ref) {
const ref_data = ref || 'tree1' const ref_data = ref || 'tree1'
this.$refs[ref_data].setCheckedKeys([]) // check-strictly="false"
this.checkArr = [] const checkedNodes = this.$refs[ref_data].getCheckedNodes()
if (data.children && data.children.length > 0) {
this.$Message.warning('当前节点不可选择') // id
this.select.type = '' // id + id
this.select.typeName = '' // idid
this.$refs[ref_data].setCheckedKeys([]) let allSelectedIds = []
return
//
checkedNodes.forEach(checkedNode => {
//
if (checkedNode.children && checkedNode.children.length > 0) {
// id + id
allSelectedIds.push(checkedNode.id) // id
// id
const childrenIds = this.getAllChildrenIds(checkedNode)
allSelectedIds = allSelectedIds.concat(childrenIds)
} else {
// id
allSelectedIds.push(checkedNode.id)
} }
this.$refs[ref_data].setCheckedKeys([]) // })
this.$refs[ref_data].setCheckedNodes([data]) //
this.select.type = data.id //
this.select.typeName = data.name allSelectedIds = [...new Set(allSelectedIds)]
this.checkArr = [data.id]
//
this.checkArr = allSelectedIds
// id this.select.type
this.select.type = allSelectedIds.join(',')
//
const selectedNames = checkedNodes.map(n => n.name).filter((name, index, self) => self.indexOf(name) === index)
this.select.typeName = selectedNames.join(', ')
this.$forceUpdate() this.$forceUpdate()
}, },
// //
@ -464,9 +497,7 @@ export default {
} }
} }
::v-deep .el-checkbox__input .el-checkbox__inner {
border-radius: 50%;
}
</style> </style>
<style lang="scss"> <style lang="scss">

@ -44,7 +44,7 @@
style="width:300px" style="width:300px"
default-expand-all default-expand-all
:default-checked-keys="checkArr" :default-checked-keys="checkArr"
:check-strictly="true" :check-strictly="false"
:data="types" :data="types"
show-checkbox show-checkbox
node-key="id" node-key="id"
@ -273,17 +273,50 @@ export default {
await this.getDepartment() await this.getDepartment()
this.select.department = Number(this.$route.query.departmentId) || '' this.select.department = Number(this.$route.query.departmentId) || ''
const routeType = Number(this.$route.query.type) || '' const routeType = this.$route.query.type || ''
if (routeType) { if (routeType) {
this.select.type = routeType // id
// type ID const typeIds = routeType.split(',').map(id => Number(id.trim())).filter(id => !isNaN(id))
const typeItem = this.typesbefore.find(item => item.id === routeType) if (typeIds.length > 0) {
// id
let allSelectedIds = []
const selectedNames = []
// id
typeIds.forEach(id => {
const node = this.findNodeById(this.types, id)
if (node) {
selectedNames.push(node.name)
// id
if (node.children && node.children.length > 0) {
allSelectedIds.push(node.id) // id
const childrenIds = this.getAllChildrenIds(node)
allSelectedIds = allSelectedIds.concat(childrenIds)
} else {
//
allSelectedIds.push(node.id)
}
} else {
//
const typeItem = this.typesbefore.find(item => item.id === id)
if (typeItem) { if (typeItem) {
this.select.typeName = typeItem.name selectedNames.push(typeItem.name)
this.checkArr = [routeType] allSelectedIds.push(id)
}
}
})
//
allSelectedIds = [...new Set(allSelectedIds)]
// id this.select.type
this.select.type = allSelectedIds.join(',')
this.select.typeName = selectedNames.join(', ')
this.checkArr = allSelectedIds
this.$nextTick(() => { this.$nextTick(() => {
if (this.$refs.tree1) { if (this.$refs.tree1) {
this.$refs.tree1.setCheckedKeys([routeType]) this.$refs.tree1.setCheckedKeys(allSelectedIds)
} }
}) })
} }
@ -386,22 +419,69 @@ export default {
} }
} }
}, },
// id
findNodeById(nodes, id) {
if (!nodes || !Array.isArray(nodes)) return null
for (const node of nodes) {
if (node.id === id) {
return node
}
if (node.children && node.children.length > 0) {
const found = this.findNodeById(node.children, id)
if (found) return found
}
}
return null
},
// id
getAllChildrenIds(node) {
let ids = []
if (node.children && node.children.length > 0) {
node.children.forEach(child => {
ids.push(child.id)
ids = ids.concat(this.getAllChildrenIds(child))
})
}
return ids
},
getSelectedNodes(data, node, ref) { getSelectedNodes(data, node, ref) {
const ref_data = ref || 'tree1' const ref_data = ref || 'tree1'
this.$refs[ref_data].setCheckedKeys([]) // check-strictly="false"
this.checkArr = [] const checkedNodes = this.$refs[ref_data].getCheckedNodes()
if (data.children && data.children.length > 0) {
this.$Message.warning('当前节点不可选择') // id
this.select.type = '' // id + id
this.select.typeName = '' // idid
this.$refs[ref_data].setCheckedKeys([]) let allSelectedIds = []
return
//
checkedNodes.forEach(checkedNode => {
//
if (checkedNode.children && checkedNode.children.length > 0) {
// id + id
allSelectedIds.push(checkedNode.id) // id
// id
const childrenIds = this.getAllChildrenIds(checkedNode)
allSelectedIds = allSelectedIds.concat(childrenIds)
} else {
// id
allSelectedIds.push(checkedNode.id)
} }
this.$refs[ref_data].setCheckedKeys([]) // })
this.$refs[ref_data].setCheckedNodes([data]) //
this.select.type = data.id //
this.select.typeName = data.name allSelectedIds = [...new Set(allSelectedIds)]
this.checkArr = [data.id]
//
this.checkArr = allSelectedIds
// id this.select.type
this.select.type = allSelectedIds.join(',')
//
const selectedNames = checkedNodes.map(n => n.name).filter((name, index, self) => self.indexOf(name) === index)
this.select.typeName = selectedNames.join(', ')
this.$forceUpdate() this.$forceUpdate()
}, },
resetSelect() { resetSelect() {
@ -519,9 +599,7 @@ export default {
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
::v-deep .el-checkbox__input .el-checkbox__inner {
border-radius: 50%;
}
</style> </style>
<style lang="scss" scoped> <style lang="scss" scoped>

Loading…
Cancel
Save