feat: 组织树多次点击后展开下级消失修复
This commit is contained in:
@ -9,13 +9,11 @@
|
|||||||
@search="searchDepart">
|
@search="searchDepart">
|
||||||
</a-input-search>
|
</a-input-search>
|
||||||
<div class="select-department-tree">
|
<div class="select-department-tree">
|
||||||
<a-tree v-model:expandedKeys="expandedKeys" v-model:selectedKeys="selectedKeys" v-model:checkedKeys="checkedKeys"
|
<a-tree v-model:expandedKeys="expandedKeys" :key="treeKey" v-model:selectedKeys="selectedKeys" v-model:checkedKeys="checkedKeys"
|
||||||
:selectable="props.selectable" :multiple="props.multiple" v-model:checkable="checkable"
|
:selectable="props.selectable" :multiple="props.multiple" v-model:checkable="checkable"
|
||||||
v-model:tree-data="treeData" :load-data="loadData" @select="selectData">
|
v-model:tree-data="treeData" :load-data="loadData" @select="selectData">
|
||||||
<template #title="{ title, key }">
|
<template #title="{ title, key }">
|
||||||
<span v-html="highLightSearch(title)"></span>
|
<span v-html="highLightSearch(title)"></span>
|
||||||
<!-- <span v-if="key === '0-0-1-0'" style="color: #1890ff">{{key}}{{ title }}</span>
|
|
||||||
<template v-else>{{ title }}</template> -->
|
|
||||||
</template>
|
</template>
|
||||||
</a-tree>
|
</a-tree>
|
||||||
</div>
|
</div>
|
||||||
@ -61,6 +59,7 @@ const selectedKeys = ref([]);
|
|||||||
const checkedKeys = ref([]);
|
const checkedKeys = ref([]);
|
||||||
const checkable = ref(false)
|
const checkable = ref(false)
|
||||||
const treeData = ref([])
|
const treeData = ref([])
|
||||||
|
const treeKey = ref(0)
|
||||||
const params = ref({
|
const params = ref({
|
||||||
id: '',
|
id: '',
|
||||||
code: '',
|
code: '',
|
||||||
@ -109,9 +108,11 @@ function searchDepart() {
|
|||||||
async function getList(type = 'default') {
|
async function getList(type = 'default') {
|
||||||
if (props.parentNode) {
|
if (props.parentNode) {
|
||||||
params.value.id = props.parentNode
|
params.value.id = props.parentNode
|
||||||
|
|
||||||
}
|
}
|
||||||
let list = resetTreeList(await getQueryDeptTrees(params.value), type, true)
|
let list = resetTreeList(await getQueryDeptTrees(params.value), type, true)
|
||||||
treeData.value = list
|
treeData.value = list
|
||||||
|
treeKey.value++
|
||||||
emit('query-completed');
|
emit('query-completed');
|
||||||
}
|
}
|
||||||
function resetTreeList(list, type='default', isFirst = false) {
|
function resetTreeList(list, type='default', isFirst = false) {
|
||||||
@ -119,14 +120,14 @@ function resetTreeList(list, type='default', isFirst = false) {
|
|||||||
expandedKeys.value = []
|
expandedKeys.value = []
|
||||||
}
|
}
|
||||||
const result = list.map(item => {
|
const result = list.map(item => {
|
||||||
if(type == 'search' && item.children && item.children.length) {
|
if(type == 'search' && item.children && item.children.length && params.value.name) {
|
||||||
expandedKeys.value.push(item.id)
|
expandedKeys.value.push(item.id)
|
||||||
}
|
}
|
||||||
return {
|
return {
|
||||||
...item,
|
...item,
|
||||||
...{
|
...{
|
||||||
key: item.id,
|
key: item.id,
|
||||||
children: resetTreeList(item.children, type),
|
children: item.children.length ? resetTreeList(item.children, type) : [],
|
||||||
title: item.name
|
title: item.name
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user