mirror of
https://github.com/continew-org/continew-admin-ui.git
synced 2025-09-09 08:57:14 +08:00
feat: 修改角色支持衔接新增角色时的父子联动
This commit is contained in:
@@ -70,6 +70,8 @@ export interface RoleDetailResp {
|
|||||||
dataScope: number
|
dataScope: number
|
||||||
deptIds: Array<number>
|
deptIds: Array<number>
|
||||||
isSystem: boolean
|
isSystem: boolean
|
||||||
|
menuCheckStrictly: boolean
|
||||||
|
deptCheckStrictly: boolean
|
||||||
createUserString: string
|
createUserString: string
|
||||||
createTime: string
|
createTime: string
|
||||||
updateUserString: string
|
updateUserString: string
|
||||||
|
@@ -39,7 +39,7 @@
|
|||||||
<a-space>
|
<a-space>
|
||||||
<a-checkbox v-model="isMenuExpanded" @change="onExpanded('menu')">展开/折叠</a-checkbox>
|
<a-checkbox v-model="isMenuExpanded" @change="onExpanded('menu')">展开/折叠</a-checkbox>
|
||||||
<a-checkbox v-model="isMenuCheckAll" @change="onCheckAll('menu')">全选/全不选</a-checkbox>
|
<a-checkbox v-model="isMenuCheckAll" @change="onCheckAll('menu')">全选/全不选</a-checkbox>
|
||||||
<a-checkbox v-model="isMenuCheckStrictly">父子联动</a-checkbox>
|
<a-checkbox v-model="form.menuCheckStrictly">父子联动</a-checkbox>
|
||||||
</a-space>
|
</a-space>
|
||||||
<template #extra>
|
<template #extra>
|
||||||
<a-tree
|
<a-tree
|
||||||
@@ -48,7 +48,7 @@
|
|||||||
class="w-full"
|
class="w-full"
|
||||||
:data="menuList"
|
:data="menuList"
|
||||||
:default-expand-all="isMenuExpanded"
|
:default-expand-all="isMenuExpanded"
|
||||||
:check-strictly="!isMenuCheckStrictly"
|
:check-strictly="!form.menuCheckStrictly"
|
||||||
:virtual-list-props="{ height: 400 }"
|
:virtual-list-props="{ height: 400 }"
|
||||||
checkable
|
checkable
|
||||||
/>
|
/>
|
||||||
@@ -68,7 +68,7 @@
|
|||||||
<a-space>
|
<a-space>
|
||||||
<a-checkbox v-model="isDeptExpanded" @change="onExpanded('dept')">展开/折叠</a-checkbox>
|
<a-checkbox v-model="isDeptExpanded" @change="onExpanded('dept')">展开/折叠</a-checkbox>
|
||||||
<a-checkbox v-model="isDeptCheckAll" @change="onCheckAll('dept')">全选/全不选</a-checkbox>
|
<a-checkbox v-model="isDeptCheckAll" @change="onCheckAll('dept')">全选/全不选</a-checkbox>
|
||||||
<a-checkbox v-model="isDeptCheckStrictly">父子联动</a-checkbox>
|
<a-checkbox v-model="form.deptCheckStrictly">父子联动</a-checkbox>
|
||||||
</a-space>
|
</a-space>
|
||||||
<template #extra>
|
<template #extra>
|
||||||
<a-tree
|
<a-tree
|
||||||
@@ -77,7 +77,7 @@
|
|||||||
class="w-full"
|
class="w-full"
|
||||||
:data="deptList"
|
:data="deptList"
|
||||||
:default-expand-all="isDeptExpanded"
|
:default-expand-all="isDeptExpanded"
|
||||||
:check-strictly="!isDeptCheckStrictly"
|
:check-strictly="!form.deptCheckStrictly"
|
||||||
:virtual-list-props="{ height: 350 }"
|
:virtual-list-props="{ height: 350 }"
|
||||||
checkable
|
checkable
|
||||||
/>
|
/>
|
||||||
@@ -128,6 +128,8 @@ const rules: FormInstance['rules'] = {
|
|||||||
}
|
}
|
||||||
|
|
||||||
const { form, resetForm } = useForm({
|
const { form, resetForm } = useForm({
|
||||||
|
menuCheckStrictly: true,
|
||||||
|
deptCheckStrictly: true,
|
||||||
sort: 999,
|
sort: 999,
|
||||||
dataScope: 4
|
dataScope: 4
|
||||||
})
|
})
|
||||||
@@ -138,8 +140,6 @@ const isMenuExpanded = ref(false)
|
|||||||
const isDeptExpanded = ref(true)
|
const isDeptExpanded = ref(true)
|
||||||
const isMenuCheckAll = ref(false)
|
const isMenuCheckAll = ref(false)
|
||||||
const isDeptCheckAll = ref(false)
|
const isDeptCheckAll = ref(false)
|
||||||
const isMenuCheckStrictly = ref(true)
|
|
||||||
const isDeptCheckStrictly = ref(true)
|
|
||||||
// 重置
|
// 重置
|
||||||
const reset = () => {
|
const reset = () => {
|
||||||
isMenuExpanded.value = false
|
isMenuExpanded.value = false
|
||||||
@@ -160,8 +160,6 @@ const onAdd = () => {
|
|||||||
getMenuList()
|
getMenuList()
|
||||||
}
|
}
|
||||||
reset()
|
reset()
|
||||||
isMenuCheckStrictly.value = true
|
|
||||||
isDeptCheckStrictly.value = true
|
|
||||||
dataId.value = ''
|
dataId.value = ''
|
||||||
visible.value = true
|
visible.value = true
|
||||||
if (!deptList.value.length) {
|
if (!deptList.value.length) {
|
||||||
@@ -197,8 +195,6 @@ const onUpdate = async (id: string) => {
|
|||||||
await getDeptList()
|
await getDeptList()
|
||||||
}
|
}
|
||||||
reset()
|
reset()
|
||||||
isMenuCheckStrictly.value = false
|
|
||||||
isDeptCheckStrictly.value = false
|
|
||||||
dataId.value = id
|
dataId.value = id
|
||||||
const res = await getRole(id)
|
const res = await getRole(id)
|
||||||
Object.assign(form, res.data)
|
Object.assign(form, res.data)
|
||||||
@@ -274,8 +270,8 @@ const onCheckAll = (type) => handleTreeAction(type, 'check')
|
|||||||
// 确认时
|
// 确认时
|
||||||
const onClickOk = () => {
|
const onClickOk = () => {
|
||||||
if (unref(current) === 3) {
|
if (unref(current) === 3) {
|
||||||
const isSaved = save()
|
save()
|
||||||
if (isSaved) visible.value = false
|
visible.value = false
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
defineExpose({ onAdd, onUpdate })
|
defineExpose({ onAdd, onUpdate })
|
||||||
|
@@ -36,15 +36,14 @@
|
|||||||
<a-space>
|
<a-space>
|
||||||
<a-checkbox v-model="isMenuExpanded" @change="onExpanded('menu')">展开/折叠</a-checkbox>
|
<a-checkbox v-model="isMenuExpanded" @change="onExpanded('menu')">展开/折叠</a-checkbox>
|
||||||
<a-checkbox v-model="isMenuCheckAll" @change="onCheckAll('menu')">全选/全不选</a-checkbox>
|
<a-checkbox v-model="isMenuCheckAll" @change="onCheckAll('menu')">全选/全不选</a-checkbox>
|
||||||
<a-checkbox v-model="isMenuCheckStrictly">父子联动</a-checkbox>
|
<a-checkbox v-model="form.menuCheckStrictly">父子联动</a-checkbox>
|
||||||
</a-space>
|
</a-space>
|
||||||
<template #extra>
|
<template #extra>
|
||||||
<a-tree
|
<a-tree
|
||||||
ref="menuTreeRef"
|
ref="menuTreeRef"
|
||||||
v-model:checked-keys="form.menuIds"
|
|
||||||
:data="menuList"
|
:data="menuList"
|
||||||
:default-expand-all="isMenuExpanded"
|
:default-expand-all="isMenuExpanded"
|
||||||
:check-strictly="!isMenuCheckStrictly"
|
:check-strictly="!form.menuCheckStrictly"
|
||||||
checkable
|
checkable
|
||||||
/>
|
/>
|
||||||
</template>
|
</template>
|
||||||
@@ -64,15 +63,14 @@
|
|||||||
<a-space>
|
<a-space>
|
||||||
<a-checkbox v-model="isDeptExpanded" @change="onExpanded('dept')">展开/折叠</a-checkbox>
|
<a-checkbox v-model="isDeptExpanded" @change="onExpanded('dept')">展开/折叠</a-checkbox>
|
||||||
<a-checkbox v-model="isDeptCheckAll" @change="onCheckAll('dept')">全选/全不选</a-checkbox>
|
<a-checkbox v-model="isDeptCheckAll" @change="onCheckAll('dept')">全选/全不选</a-checkbox>
|
||||||
<a-checkbox v-model="isDeptCheckStrictly">父子联动</a-checkbox>
|
<a-checkbox v-model="form.deptCheckStrictly">父子联动</a-checkbox>
|
||||||
</a-space>
|
</a-space>
|
||||||
<template #extra>
|
<template #extra>
|
||||||
<a-tree
|
<a-tree
|
||||||
ref="deptTreeRef"
|
ref="deptTreeRef"
|
||||||
v-model:checked-keys="form.deptIds"
|
|
||||||
:data="deptList"
|
:data="deptList"
|
||||||
:default-expand-all="isDeptExpanded"
|
:default-expand-all="isDeptExpanded"
|
||||||
:check-strictly="!isDeptCheckStrictly"
|
:check-strictly="!form.deptCheckStrictly"
|
||||||
checkable
|
checkable
|
||||||
/>
|
/>
|
||||||
</template>
|
</template>
|
||||||
@@ -109,6 +107,8 @@ const rules: FormInstance['rules'] = {
|
|||||||
}
|
}
|
||||||
|
|
||||||
const { form, resetForm } = useForm({
|
const { form, resetForm } = useForm({
|
||||||
|
menuCheckStrictly: true,
|
||||||
|
deptCheckStrictly: true,
|
||||||
sort: 999,
|
sort: 999,
|
||||||
dataScope: 4
|
dataScope: 4
|
||||||
})
|
})
|
||||||
@@ -119,8 +119,6 @@ const isMenuExpanded = ref(false)
|
|||||||
const isDeptExpanded = ref(true)
|
const isDeptExpanded = ref(true)
|
||||||
const isMenuCheckAll = ref(false)
|
const isMenuCheckAll = ref(false)
|
||||||
const isDeptCheckAll = ref(false)
|
const isDeptCheckAll = ref(false)
|
||||||
const isMenuCheckStrictly = ref(true)
|
|
||||||
const isDeptCheckStrictly = ref(true)
|
|
||||||
// 重置
|
// 重置
|
||||||
const reset = () => {
|
const reset = () => {
|
||||||
isMenuExpanded.value = false
|
isMenuExpanded.value = false
|
||||||
@@ -140,8 +138,6 @@ const onAdd = () => {
|
|||||||
getMenuList()
|
getMenuList()
|
||||||
}
|
}
|
||||||
reset()
|
reset()
|
||||||
isMenuCheckStrictly.value = true
|
|
||||||
isDeptCheckStrictly.value = true
|
|
||||||
dataId.value = ''
|
dataId.value = ''
|
||||||
visible.value = true
|
visible.value = true
|
||||||
if (!deptList.value.length) {
|
if (!deptList.value.length) {
|
||||||
@@ -158,11 +154,19 @@ const onUpdate = async (id: string) => {
|
|||||||
await getDeptList()
|
await getDeptList()
|
||||||
}
|
}
|
||||||
reset()
|
reset()
|
||||||
isMenuCheckStrictly.value = false
|
|
||||||
isDeptCheckStrictly.value = false
|
|
||||||
dataId.value = id
|
dataId.value = id
|
||||||
const res = await getRole(id)
|
const { data } = await getRole(id)
|
||||||
Object.assign(form, res.data)
|
Object.assign(form, data)
|
||||||
|
data.menuIds?.forEach((node) => {
|
||||||
|
nextTick(() => {
|
||||||
|
menuTreeRef.value?.checkNode(node, true, true)
|
||||||
|
})
|
||||||
|
})
|
||||||
|
data.deptIds?.forEach((node) => {
|
||||||
|
nextTick(() => {
|
||||||
|
deptTreeRef.value?.checkNode(node, true, true)
|
||||||
|
})
|
||||||
|
})
|
||||||
visible.value = true
|
visible.value = true
|
||||||
}
|
}
|
||||||
|
|
||||||
|
Reference in New Issue
Block a user