feat: 菜单级联删除
This commit is contained in:
parent
c45eed90d9
commit
6daedd1de5
@ -81,3 +81,12 @@ export function tenantPackageMenuTreeSelect(packageId: ID) {
|
|||||||
`${Api.tenantPackageMenuTreeselect}/${packageId}`,
|
`${Api.tenantPackageMenuTreeselect}/${packageId}`,
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 批量删除菜单
|
||||||
|
* @param menuIds 菜单ids
|
||||||
|
* @returns void
|
||||||
|
*/
|
||||||
|
export function menuCascadeRemove(menuIds: IDS) {
|
||||||
|
return requestClient.deleteWithMsg<void>(`${Api.root}/cascade/${menuIds}`);
|
||||||
|
}
|
||||||
|
@ -219,6 +219,7 @@ export const drawerSchema: FormSchemaGetter = () => [
|
|||||||
fieldName: 'orderNum',
|
fieldName: 'orderNum',
|
||||||
help: '排序, 数字越小越靠前',
|
help: '排序, 数字越小越靠前',
|
||||||
label: '显示排序',
|
label: '显示排序',
|
||||||
|
defaultValue: 0,
|
||||||
rules: 'required',
|
rules: 'required',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
|
@ -4,16 +4,16 @@ import type { VbenFormProps } from '@vben/common-ui';
|
|||||||
import type { VxeGridProps } from '#/adapter/vxe-table';
|
import type { VxeGridProps } from '#/adapter/vxe-table';
|
||||||
import type { Menu } from '#/api/system/menu/model';
|
import type { Menu } from '#/api/system/menu/model';
|
||||||
|
|
||||||
import { computed } from 'vue';
|
import { computed, ref } from 'vue';
|
||||||
|
|
||||||
import { useAccess } from '@vben/access';
|
import { useAccess } from '@vben/access';
|
||||||
import { Fallback, Page, useVbenDrawer } from '@vben/common-ui';
|
import { Fallback, Page, useVbenDrawer } from '@vben/common-ui';
|
||||||
import { eachTree, getVxePopupContainer } from '@vben/utils';
|
import { eachTree, getVxePopupContainer, treeToList } from '@vben/utils';
|
||||||
|
|
||||||
import { Popconfirm, Space } from 'ant-design-vue';
|
import { Popconfirm, Space, Switch, Tooltip } from 'ant-design-vue';
|
||||||
|
|
||||||
import { preserveTreeTableState, useVbenVxeGrid } from '#/adapter/vxe-table';
|
import { preserveTreeTableState, useVbenVxeGrid } from '#/adapter/vxe-table';
|
||||||
import { menuList, menuRemove } from '#/api/system/menu';
|
import { menuCascadeRemove, menuList, menuRemove } from '#/api/system/menu';
|
||||||
|
|
||||||
import { columns, querySchema } from './data';
|
import { columns, querySchema } from './data';
|
||||||
import menuDrawer from './menu-drawer.vue';
|
import menuDrawer from './menu-drawer.vue';
|
||||||
@ -111,13 +111,35 @@ async function handleEdit(record: Menu) {
|
|||||||
drawerApi.open();
|
drawerApi.open();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 是否级联删除
|
||||||
|
*/
|
||||||
|
const cascadingDeletion = ref(false);
|
||||||
async function handleDelete(row: Menu) {
|
async function handleDelete(row: Menu) {
|
||||||
await preserveTreeTableState(tableApi, async () => {
|
await preserveTreeTableState(tableApi, async () => {
|
||||||
await menuRemove([row.menuId]);
|
if (cascadingDeletion.value) {
|
||||||
|
// 级联删除
|
||||||
|
const menuAndChildren: Menu[] = treeToList([row], { id: 'menuId' });
|
||||||
|
await menuCascadeRemove(menuAndChildren.map((item) => item.menuId));
|
||||||
|
} else {
|
||||||
|
// 单删除
|
||||||
|
await menuRemove([row.menuId]);
|
||||||
|
}
|
||||||
await tableApi.query();
|
await tableApi.query();
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function removeConfirmTitle(row: Menu) {
|
||||||
|
if (!cascadingDeletion.value) {
|
||||||
|
return `是否确认删除 [${row.menuName}] ?`;
|
||||||
|
}
|
||||||
|
const menuAndChildren = treeToList([row], { id: 'menuId' });
|
||||||
|
if (menuAndChildren.length === 1) {
|
||||||
|
return `是否确认删除 [${row.menuName}] ?`;
|
||||||
|
}
|
||||||
|
return `是否确认删除 [${row.menuName}] 及 [${menuAndChildren.length - 1}]个子项目 ?`;
|
||||||
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 编辑/添加成功后刷新表格
|
* 编辑/添加成功后刷新表格
|
||||||
*/
|
*/
|
||||||
@ -149,6 +171,12 @@ const isAdmin = computed(() => {
|
|||||||
<BasicTable table-title="菜单列表" table-title-help="双击展开/收起子菜单">
|
<BasicTable table-title="菜单列表" table-title-help="双击展开/收起子菜单">
|
||||||
<template #toolbar-tools>
|
<template #toolbar-tools>
|
||||||
<Space>
|
<Space>
|
||||||
|
<Tooltip title="删除菜单以及子菜单">
|
||||||
|
<div>
|
||||||
|
<span class="mr-1 text-sm text-[#666666]">级联删除</span>
|
||||||
|
<Switch v-model:checked="cascadingDeletion" />
|
||||||
|
</div>
|
||||||
|
</Tooltip>
|
||||||
<a-button @click="setExpandOrCollapse(false)">
|
<a-button @click="setExpandOrCollapse(false)">
|
||||||
{{ $t('pages.common.collapse') }}
|
{{ $t('pages.common.collapse') }}
|
||||||
</a-button>
|
</a-button>
|
||||||
@ -184,7 +212,7 @@ const isAdmin = computed(() => {
|
|||||||
<Popconfirm
|
<Popconfirm
|
||||||
:get-popup-container="getVxePopupContainer"
|
:get-popup-container="getVxePopupContainer"
|
||||||
placement="left"
|
placement="left"
|
||||||
title="确认删除?"
|
:title="removeConfirmTitle(row)"
|
||||||
@confirm="handleDelete(row)"
|
@confirm="handleDelete(row)"
|
||||||
>
|
>
|
||||||
<ghost-button
|
<ghost-button
|
||||||
|
Loading…
Reference in New Issue
Block a user