Commit 2da9fc1960fb8460c55b7a78d965989d9a4a1630

Authored by ww
1 parent 33944534

fix: 修复菜单管理无法批量删除

Showing 1 changed file with 37 additions and 17 deletions
... ... @@ -2,12 +2,12 @@
2 2 <div class="p-4">
3 3 <BasicTable @register="registerTable" @fetch-success="onFetchSuccess">
4 4 <template #toolbar>
5   - <a-button type="primary" @click="handleCreate">
  5 + <Button type="primary" @click="handleCreate">
6 6 {{ getI18nCreateMenu }}
7   - </a-button>
8   - <a-button color="error" @click="handleDeleteOrBatchDelete(null)" :disabled="hasBatchDelete">
  7 + </Button>
  8 + <Button type="primary" danger :disabled="getCanBatchDelete" @click="handleBatchDelete">
9 9 批量删除
10   - </a-button>
  10 + </Button>
11 11 </template>
12 12 <template #action="{ record }">
13 13 <TableAction
... ... @@ -55,23 +55,23 @@
55 55 // 导入列 属性,和搜索栏内容
56 56 import { columns } from './menu.data';
57 57 import { useI18n } from '/@/hooks/web/useI18n';
58   - import { notification } from 'ant-design-vue';
59   - import { useBatchDelete } from '/@/hooks/web/useBatchDelete';
60   -
  58 + import { Button, notification } from 'ant-design-vue';
  59 + import { useSyncConfirm } from '/@/hooks/component/useSyncConfirm';
  60 + import { isArray } from '/@/utils/is';
61 61 // 自定义表格组件和属性
62 62 export default defineComponent({
63 63 name: 'MenuManagement',
64   - components: { BasicTable, MenuDrawer, TableAction },
  64 + components: { BasicTable, MenuDrawer, TableAction, Button },
65 65 setup() {
66 66 const [registerDrawer, { openDrawer }] = useDrawer(); //使用右侧弹出框
67 67 const { t } = useI18n(); //加载国际化
68 68 // 新增菜单
69 69 const getI18nCreateMenu = computed(() => t('routes.common.system.pageSystemTitleCreateMenu'));
70   - const { hasBatchDelete, handleDeleteOrBatchDelete, selectionOptions } = useBatchDelete(
71   - delMenu,
72   - handleSuccess
73   - );
74   - const [registerTable, { reload, collapseAll }] = useTable({
  70 +
  71 + const [
  72 + registerTable,
  73 + { reload, collapseAll, getRowSelection, getSelectRowKeys, setSelectedRowKeys },
  74 + ] = useTable({
75 75 title: t('routes.common.system.pageSystemTitleMenuList'), //'菜单列表'
76 76 api: getMenuList, //加载数据
77 77 columns, //加载列
... ... @@ -89,9 +89,29 @@
89 89 slots: { customRender: 'action' },
90 90 fixed: 'right',
91 91 },
92   - ...selectionOptions,
  92 + rowSelection: {
  93 + type: 'checkbox',
  94 + },
93 95 });
94 96
  97 + const getCanBatchDelete = computed(() => {
  98 + const rowSelection = getRowSelection();
  99 + return !rowSelection.selectedRowKeys?.length;
  100 + });
  101 + const { createSyncConfirm } = useSyncConfirm();
  102 + const handleBatchDelete = async () => {
  103 + const rowKeys = getSelectRowKeys();
  104 + try {
  105 + await createSyncConfirm({
  106 + iconType: 'warning',
  107 + content: '确认后所有选中的菜单将被删除',
  108 + });
  109 + await handleDelete({ id: rowKeys });
  110 + setSelectedRowKeys([]);
  111 + reload();
  112 + } catch (error) {}
  113 + };
  114 +
95 115 /**
96 116 * 获得删除提示框的文字
97 117 */
... ... @@ -126,7 +146,7 @@
126 146 */
127 147 async function handleDelete(record: Recordable) {
128 148 try {
129   - let ids = [record.id];
  149 + let ids = isArray(record.id) ? record.id : [record.id];
130 150 await delMenu(ids);
131 151 notification.success({
132 152 message: '成功',
... ... @@ -161,8 +181,8 @@
161 181 handleDelete,
162 182 handleSuccess,
163 183 onFetchSuccess,
164   - hasBatchDelete,
165   - handleDeleteOrBatchDelete,
  184 + getCanBatchDelete,
  185 + handleBatchDelete,
166 186 };
167 187 },
168 188 });
... ...