fix: 树形 展开 关闭 功能 bug

This commit is contained in:
xingyu 2023-01-04 16:04:17 +08:00
parent c98965cd55
commit e63e5ffe4c
2 changed files with 10 additions and 11 deletions

View File

@ -1,7 +1,7 @@
<template> <template>
<ContentWrap> <ContentWrap>
<!-- 列表 --> <!-- 列表 -->
<XTable @register="registerTable" show-overflow> <XTable ref="xGrid" @register="registerTable" show-overflow>
<template #toolbar_buttons> <template #toolbar_buttons>
<!-- 操作新增 --> <!-- 操作新增 -->
<XButton <XButton
@ -11,8 +11,8 @@
v-hasPermi="['system:dept:create']" v-hasPermi="['system:dept:create']"
@click="handleCreate()" @click="handleCreate()"
/> />
<XButton title="展开所有" @click="xGrid?.setAllTreeExpand(true)" /> <XButton title="展开所有" @click="xGrid?.Ref.setAllTreeExpand(true)" />
<XButton title="关闭所有" @click="xGrid?.clearTreeExpand()" /> <XButton title="关闭所有" @click="xGrid?.Ref.clearTreeExpand()" />
</template> </template>
<template #leaderUserId_default="{ row }"> <template #leaderUserId_default="{ row }">
<span>{{ userNicknameFormat(row) }}</span> <span>{{ userNicknameFormat(row) }}</span>
@ -77,7 +77,6 @@
<script setup lang="ts" name="Dept"> <script setup lang="ts" name="Dept">
import { nextTick, onMounted, ref, unref } from 'vue' import { nextTick, onMounted, ref, unref } from 'vue'
import { ElSelect, ElTreeSelect, ElOption } from 'element-plus' import { ElSelect, ElTreeSelect, ElOption } from 'element-plus'
import { VxeGridInstance } from 'vxe-table'
import { handleTree, defaultProps } from '@/utils/tree' import { handleTree, defaultProps } from '@/utils/tree'
import { useI18n } from '@/hooks/web/useI18n' import { useI18n } from '@/hooks/web/useI18n'
import { useMessage } from '@/hooks/web/useMessage' import { useMessage } from '@/hooks/web/useMessage'
@ -90,7 +89,7 @@ import { getListSimpleUsersApi, UserVO } from '@/api/system/user'
const { t } = useI18n() // const { t } = useI18n() //
const message = useMessage() // const message = useMessage() //
// //
const xGrid = ref<VxeGridInstance>() // Grid Ref const xGrid = ref<any>() // Grid Ref
const treeConfig = { const treeConfig = {
transform: true, transform: true,
rowField: 'id', rowField: 'id',

View File

@ -1,7 +1,7 @@
<template> <template>
<ContentWrap> <ContentWrap>
<!-- 列表 --> <!-- 列表 -->
<XTable @register="registerTable" show-overflow> <XTable ref="xGrid" @register="registerTable" show-overflow>
<template #toolbar_buttons> <template #toolbar_buttons>
<!-- 操作新增 --> <!-- 操作新增 -->
<XButton <XButton
@ -11,8 +11,8 @@
v-hasPermi="['system:menu:create']" v-hasPermi="['system:menu:create']"
@click="handleCreate()" @click="handleCreate()"
/> />
<XButton title="展开所有" @click="xGrid?.setAllTreeExpand(true)" /> <XButton title="展开所有" @click="xGrid?.Ref.setAllTreeExpand(true)" />
<XButton title="关闭所有" @click="xGrid?.clearTreeExpand()" /> <XButton title="关闭所有" @click="xGrid?.Ref.clearTreeExpand()" />
</template> </template>
<template #name_default="{ row }"> <template #name_default="{ row }">
<Icon :icon="row.icon" /> <Icon :icon="row.icon" />
@ -194,7 +194,6 @@ import {
} from 'element-plus' } from 'element-plus'
import { Tooltip } from '@/components/Tooltip' import { Tooltip } from '@/components/Tooltip'
import { IconSelect } from '@/components/Icon' import { IconSelect } from '@/components/Icon'
import { VxeGridInstance } from 'vxe-table'
// import // import
import { DICT_TYPE, getIntDictOptions } from '@/utils/dict' import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
import { SystemMenuTypeEnum, CommonStatusEnum } from '@/utils/constants' import { SystemMenuTypeEnum, CommonStatusEnum } from '@/utils/constants'
@ -206,9 +205,10 @@ import { useXTable } from '@/hooks/web/useXTable'
const { t } = useI18n() // const { t } = useI18n() //
const message = useMessage() // const message = useMessage() //
const { wsCache } = useCache() const { wsCache } = useCache()
const xGrid = ref<any>(null)
// //
//
const xGrid = ref<VxeGridInstance>() // Grid Ref
const treeConfig = { const treeConfig = {
transform: true, transform: true,
rowField: 'id', rowField: 'id',