BJ_ZTEITS-Developers / parking-cloud-yudao

Commit 7d3c59af6d522c7300111a99ca68b23239840706

Authored by xingyu
1 parent 27133e97

fix: tenantpackage tree

Inline Side-by-side
Showing 1 changed file with 16 additions and 16 deletions
yudao-ui-admin-vue3/src/views/system/tenantPackage/index.vue
  View file @7d3c59a
... ... @@ -7,7 +7,7 @@ import { useTable } from '@/hooks/web/useTable'
7 7 import { useI18n } from '@/hooks/web/useI18n'
8 8 import { FormExpose } from '@/components/Form'
9 9 import { TenantPackageVO } from '@/api/system/tenantPackage/types'
10   -import { ElMessage, ElCard, ElCheckbox, ElTree } from 'element-plus'
  10 +import { ElMessage, ElCard, ElSwitch, ElTree } from 'element-plus'
11 11 import { rules, allSchemas } from './tenantPackage.data'
12 12 import * as TenantPackageApi from '@/api/system/tenantPackage'
13 13 import { listSimpleMenusApi } from '@/api/system/menu'
... ... @@ -21,11 +21,15 @@ const defaultProps = {
21 21 // ========== 创建菜单树结构 ==========
22 22 const menuOptions = ref([]) // 树形结构
23 23 const treeRef = ref<InstanceType<typeof ElTree>>()
  24 +const treeNodeAll = ref(false)
  25 +// 全选/全不选
  26 +const handleCheckedTreeNodeAll = () => {
  27 + treeRef.value!.setCheckedNodes(treeNodeAll.value ? menuOptions.value : [])
  28 +}
24 29 const getTree = async () => {
25 30 const res = await listSimpleMenusApi()
26 31 menuOptions.value = handleTree(res)
27 32 }
28   -let menuCheckStrictly = true
29 33 const menuExpand = ref(false)
30 34 const menuNodeAll = ref(false)
31 35  
... ... @@ -42,7 +46,6 @@ const formRef = ref&lt;FormExpose&gt;() // 表单 Ref
42 46 const actionType = ref('') // 操作按钮的类型
43 47 const dialogVisible = ref(false) // 是否显示弹出层
44 48 const dialogTitle = ref('edit') // 弹出层标题
45   -const menuParentId = ref()
46 49  
47 50 // 设置标题
48 51 const setDialogTile = (type: string) => {
... ... @@ -58,7 +61,6 @@ const handleCreate = () =&gt; {
58 61 unref(formRef)?.getElFormRef()?.resetFields()
59 62 //重置菜单树
60 63 unref(treeRef)?.setCheckedKeys([])
61   - menuCheckStrictly = true
62 64 menuExpand.value = false
63 65 menuNodeAll.value = false
64 66 }
... ... @@ -69,13 +71,8 @@ const handleUpdate = async (row: any) =&gt; {
69 71 // 设置数据
70 72 const res = await TenantPackageApi.getTenantPackageApi(row.id)
71 73 unref(formRef)?.setValues(res)
72   - // 设置菜单项
73   - // 设置为严格，避免设置父节点自动选中子节点，解决半选中问题
74   - menuCheckStrictly = true
75 74 // 设置选中
76 75 unref(treeRef)?.setCheckedKeys(res.menuIds)
77   - // 设置为非严格，继续使用半选中
78   - menuCheckStrictly = false
79 76 }
80 77 // 提交按钮
81 78 const submitForm = async () => {
... ... @@ -163,20 +160,23 @@ onMounted(async () =&gt; {
163 160 <el-card class="box-card">
164 161 <template #header>
165 162 <div class="card-header">
166   - <el-checkbox>展开/折叠</el-checkbox>
167   - <el-checkbox>全选/全不选</el-checkbox>
  163 + 全选/全不选:
  164 + <el-switch
  165 + v-model="treeNodeAll"
  166 + inline-prompt
  167 + active-text="是"
  168 + inactive-text="否"
  169 + @change="handleCheckedTreeNodeAll()"
  170 + />
168 171 </div>
169 172 </template>
170   - <!-- default-expand-all-->
171 173 <el-tree
172 174 ref="treeRef"
173 175 node-key="id"
174   - v-model="menuParentId"
  176 + show-checkbox
175 177 :props="defaultProps"
176 178 :data="menuOptions"
177   - show-checkbox
178   - :check-strictly="menuCheckStrictly"
179   - empty-text="加载菜单中..."
  179 + empty-text="加载中，请稍后"
180 180 />
181 181 </el-card>
182 182 </template>
... ...