fix:角色勾选根节点获取失败问题
This commit is contained in:
@@ -80,10 +80,18 @@ async function init() {
|
|||||||
function clearChecks() {
|
function clearChecks() {
|
||||||
menuIds.value = [];
|
menuIds.value = [];
|
||||||
}
|
}
|
||||||
|
const rootIds = ref([]);
|
||||||
|
function fnModalTreeChecked(keys: any, info: any ) {
|
||||||
|
let ids = Array.isArray(keys) ? keys : keys.checked;
|
||||||
|
// ids = ids.concat(info.halfCheckedKeys);
|
||||||
|
rootIds.value = info.halfCheckedKeys;
|
||||||
|
menuIds.value = ids;
|
||||||
|
}
|
||||||
defineExpose({
|
defineExpose({
|
||||||
clearChecks,
|
clearChecks,
|
||||||
checkedKeys: menuIds,
|
checkedKeys: ()=> {
|
||||||
|
return menuIds.value.concat(rootIds.value).concat()
|
||||||
|
},
|
||||||
tree
|
tree
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
@@ -92,13 +100,15 @@ defineExpose({
|
|||||||
<div class="border-0.5 border-gray-300 rounded-md p-2 transition-all dark:border-dark-300" hover="border-gray-500">
|
<div class="border-0.5 border-gray-300 rounded-md p-2 transition-all dark:border-dark-300" hover="border-gray-500">
|
||||||
<SimpleScrollbar>
|
<SimpleScrollbar>
|
||||||
<ATree
|
<ATree
|
||||||
v-model:checked-keys="menuIds"
|
|
||||||
:selectable="false"
|
|
||||||
:virtual="false"
|
|
||||||
:tree-data="tree"
|
|
||||||
checkable
|
checkable
|
||||||
block-node
|
block-node
|
||||||
/>
|
:selectable="false"
|
||||||
|
@check="fnModalTreeChecked"
|
||||||
|
v-model:checked-keys="menuIds"
|
||||||
|
:check-strictly="false"
|
||||||
|
:tree-data="tree"
|
||||||
|
>
|
||||||
|
</ATree>
|
||||||
</SimpleScrollbar>
|
</SimpleScrollbar>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|||||||
@@ -1,9 +1,9 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { SimpleScrollbar } from '@sa/materials';
|
import {SimpleScrollbar} from '@sa/materials';
|
||||||
import { useAntdForm, useFormRules } from '@/hooks/common/form';
|
import {useAntdForm, useFormRules} from '@/hooks/common/form';
|
||||||
import { $t } from '@/locales';
|
import {$t} from '@/locales';
|
||||||
import { enableStatusOptions } from '@/constants/business';
|
import {enableStatusOptions} from '@/constants/business';
|
||||||
import { doPostRole, doPutRole } from '@/service/api/role';
|
import {doPostRole, doPutRole} from '@/service/api/role';
|
||||||
import MenuAuth from './menu-auth.vue';
|
import MenuAuth from './menu-auth.vue';
|
||||||
|
|
||||||
defineOptions({
|
defineOptions({
|
||||||
@@ -32,8 +32,8 @@ const menuAuthRef = ref<InstanceType<typeof MenuAuth> | null>(null);
|
|||||||
|
|
||||||
const authStore = useAuthStore();
|
const authStore = useAuthStore();
|
||||||
|
|
||||||
const { formRef, validate, resetFields } = useAntdForm();
|
const {formRef, validate, resetFields} = useAntdForm();
|
||||||
const { defaultRequiredRule } = useFormRules();
|
const {defaultRequiredRule} = useFormRules();
|
||||||
|
|
||||||
const title = computed(() => {
|
const title = computed(() => {
|
||||||
const titles: Record<AntDesign.TableOperateType, string> = {
|
const titles: Record<AntDesign.TableOperateType, string> = {
|
||||||
@@ -73,7 +73,7 @@ function handleUpdateModelWhenEdit() {
|
|||||||
}
|
}
|
||||||
|
|
||||||
if (props.operateType === 'edit' && props.rowData) {
|
if (props.operateType === 'edit' && props.rowData) {
|
||||||
model.value = { ...props.rowData, menuIds: [] };
|
model.value = {...props.rowData, menuIds: []};
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -83,9 +83,9 @@ function closeDrawer() {
|
|||||||
|
|
||||||
async function handleSubmit() {
|
async function handleSubmit() {
|
||||||
await validate();
|
await validate();
|
||||||
const menuIds = transformMenuChildWithRootIds(menuAuthRef.value?.tree || [], model.value.menuIds);
|
const menuIds = menuAuthRef.value?.checkedKeys();
|
||||||
|
|
||||||
const { error } = await (props.operateType === 'edit' ? doPutRole : doPostRole)({
|
const {error} = await (props.operateType === 'edit' ? doPutRole : doPostRole)({
|
||||||
...model.value,
|
...model.value,
|
||||||
menuIds,
|
menuIds,
|
||||||
menuCheckStrictly: true
|
menuCheckStrictly: true
|
||||||
@@ -122,10 +122,10 @@ watch(
|
|||||||
<SimpleScrollbar>
|
<SimpleScrollbar>
|
||||||
<AForm ref="formRef" py-20px pr-20px layout="vertical" :model="model" :rules="rules">
|
<AForm ref="formRef" py-20px pr-20px layout="vertical" :model="model" :rules="rules">
|
||||||
<AFormItem :label="$t('page.manage.role.roleName')" name="roleName">
|
<AFormItem :label="$t('page.manage.role.roleName')" name="roleName">
|
||||||
<AInput v-model:value="model.roleName" :placeholder="$t('page.manage.role.form.roleName')" />
|
<AInput v-model:value="model.roleName" :placeholder="$t('page.manage.role.form.roleName')"/>
|
||||||
</AFormItem>
|
</AFormItem>
|
||||||
<AFormItem :label="$t('page.manage.role.roleCode')" name="roleKey">
|
<AFormItem :label="$t('page.manage.role.roleCode')" name="roleKey">
|
||||||
<AInput v-model:value="model.roleKey" :placeholder="$t('page.manage.role.form.roleCode')" />
|
<AInput v-model:value="model.roleKey" :placeholder="$t('page.manage.role.form.roleCode')"/>
|
||||||
</AFormItem>
|
</AFormItem>
|
||||||
<AFormItem :label="$t('page.manage.role.roleStatus')" name="status">
|
<AFormItem :label="$t('page.manage.role.roleStatus')" name="status">
|
||||||
<ARadioGroup v-model:value="model.status">
|
<ARadioGroup v-model:value="model.status">
|
||||||
@@ -135,7 +135,7 @@ watch(
|
|||||||
</ARadioGroup>
|
</ARadioGroup>
|
||||||
</AFormItem>
|
</AFormItem>
|
||||||
<AFormItem :label="$t('page.manage.role.roleDesc')" name="roleDesc">
|
<AFormItem :label="$t('page.manage.role.roleDesc')" name="roleDesc">
|
||||||
<AInput v-model:value="model.remark" :placeholder="$t('page.manage.role.form.roleDesc')" />
|
<AInput v-model:value="model.remark" :placeholder="$t('page.manage.role.form.roleDesc')"/>
|
||||||
</AFormItem>
|
</AFormItem>
|
||||||
|
|
||||||
<AFormItem>
|
<AFormItem>
|
||||||
|
|||||||
Reference in New Issue
Block a user