From 98e9d9fbfc7e5d95181f0d988c0b7f68c2be4ef8 Mon Sep 17 00:00:00 2001
From: puhui999 <puhui999@163.com>
Date: Mon, 19 May 2025 12:53:10 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E3=80=90ANTD=E3=80=91=E6=96=B0?=
 =?UTF-8?q?=E5=A2=9E=E4=BB=A3=E7=A0=81=E7=94=9F=E6=88=90=E6=89=B9=E9=87=8F?=
 =?UTF-8?q?=E5=88=A0=E9=99=A4=E6=8E=A5=E5=8F=A3=E7=A4=BA=E4=BE=8B=20demo01?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/api/infra/demo/demo01/index.ts        |  9 +++-
 .../src/views/infra/demo/demo01/data.ts       |  2 +-
 .../src/views/infra/demo/demo01/index.vue     | 54 +++++++++++++++++--
 packages/@core/base/icons/src/lucide.ts       |  1 +
 4 files changed, 60 insertions(+), 6 deletions(-)

diff --git a/apps/web-antd/src/api/infra/demo/demo01/index.ts b/apps/web-antd/src/api/infra/demo/demo01/index.ts
index 5a940a61..0fbd3141 100644
--- a/apps/web-antd/src/api/infra/demo/demo01/index.ts
+++ b/apps/web-antd/src/api/infra/demo/demo01/index.ts
@@ -9,7 +9,7 @@ export namespace Demo01ContactApi {
   export interface Demo01Contact {
     id: number; // 编号
     name?: string; // 名字
-    sex?: boolean; // 性别
+    sex?: number; // 性别
     birthday?: Dayjs | string; // 出生年
     description?: string; // 简介
     avatar: string; // 头像
@@ -46,6 +46,13 @@ export function deleteDemo01Contact(id: number) {
   return requestClient.delete(`/infra/demo01-contact/delete?id=${id}`);
 }
 
+// 批量删除示例联系人
+export function deleteDemo01ContactByIds(ids: number[]) {
+  return requestClient.delete(
+    `/infra/demo01-contact/delete-batch?ids=${ids.join(',')}`,
+  );
+}
+
 /** 导出示例联系人 */
 export function exportDemo01Contact(params: any) {
   return requestClient.download('/infra/demo01-contact/export-excel', params);
diff --git a/apps/web-antd/src/views/infra/demo/demo01/data.ts b/apps/web-antd/src/views/infra/demo/demo01/data.ts
index 6406806f..ac29a04c 100644
--- a/apps/web-antd/src/views/infra/demo/demo01/data.ts
+++ b/apps/web-antd/src/views/infra/demo/demo01/data.ts
@@ -103,6 +103,7 @@ export function useGridColumns(
   onActionClick?: OnActionClickFn<Demo01ContactApi.Demo01Contact>,
 ): VxeTableGridOptions<Demo01ContactApi.Demo01Contact>['columns'] {
   return [
+    { type: 'checkbox', width: 40 },
     {
       field: 'id',
       title: '编号',
@@ -150,7 +151,6 @@ export function useGridColumns(
       minWidth: 200,
       align: 'center',
       fixed: 'right',
-      // TODO @puhui999：headerAlign 要使用 headerAlign: 'center' 么？看着现在分成了 align 和 headerAlign 两种
       headerAlign: 'center',
       showOverflow: false,
       cellRender: {
diff --git a/apps/web-antd/src/views/infra/demo/demo01/index.vue b/apps/web-antd/src/views/infra/demo/demo01/index.vue
index ab796bd0..49df4616 100644
--- a/apps/web-antd/src/views/infra/demo/demo01/index.vue
+++ b/apps/web-antd/src/views/infra/demo/demo01/index.vue
@@ -5,17 +5,18 @@ import type {
 } from '#/adapter/vxe-table';
 import type { Demo01ContactApi } from '#/api/infra/demo/demo01';
 
-import { h } from 'vue';
+import { computed, h, ref } from 'vue';
 
 import { Page, useVbenModal } from '@vben/common-ui';
-import { Download, Plus } from '@vben/icons';
-import { downloadFileFromBlobPart } from '@vben/utils';
+import { Download, Plus, Trash2 } from '@vben/icons';
+import { downloadFileFromBlobPart, isEmpty } from '@vben/utils';
 
 import { Button, message } from 'ant-design-vue';
 
 import { useVbenVxeGrid } from '#/adapter/vxe-table';
 import {
   deleteDemo01Contact,
+  deleteDemo01ContactByIds,
   exportDemo01Contact,
   getDemo01ContactPage,
 } from '#/api/infra/demo/demo01';
@@ -55,7 +56,25 @@ async function onDelete(row: Demo01ContactApi.Demo01Contact) {
     await deleteDemo01Contact(row.id as number);
     message.success($t('ui.actionMessage.deleteSuccess', [row.id]));
     onRefresh();
-  } catch {
+  } finally {
+    hideLoading();
+  }
+}
+
+const deleteIds = ref<number[]>([]); // 待删除示例联系人 ID
+const showDeleteBatchBtn = computed(() => isEmpty(deleteIds.value));
+/** 批量删除示例联系人 */
+async function onDeleteBatch() {
+  const hideLoading = message.loading({
+    content: $t('ui.actionMessage.deleting'),
+    duration: 0,
+    key: 'action_process_msg',
+  });
+  try {
+    await deleteDemo01ContactByIds(deleteIds.value);
+    message.success($t('ui.actionMessage.deleteSuccess'));
+    onRefresh();
+  } finally {
     hideLoading();
   }
 }
@@ -113,6 +132,22 @@ const [Grid, gridApi] = useVbenVxeGrid({
       search: true,
     },
   } as VxeTableGridOptions<Demo01ContactApi.Demo01Contact>,
+  gridEvents: {
+    checkboxAll: ({
+      records,
+    }: {
+      records: Demo01ContactApi.Demo01Contact[];
+    }) => {
+      deleteIds.value = records.map((item) => item.id);
+    },
+    checkboxChange: ({
+      records,
+    }: {
+      records: Demo01ContactApi.Demo01Contact[];
+    }) => {
+      deleteIds.value = records.map((item) => item.id);
+    },
+  },
 });
 </script>
 
@@ -139,6 +174,17 @@ const [Grid, gridApi] = useVbenVxeGrid({
         >
           {{ $t('ui.actionTitle.export') }}
         </Button>
+        <Button
+          :icon="h(Trash2)"
+          type="primary"
+          danger
+          class="ml-2"
+          :disabled="showDeleteBatchBtn"
+          @click="onDeleteBatch"
+          v-access:code="['infra:demo01-contact:delete']"
+        >
+          批量删除
+        </Button>
       </template>
     </Grid>
   </Page>
diff --git a/packages/@core/base/icons/src/lucide.ts b/packages/@core/base/icons/src/lucide.ts
index a4e6f050..a6afa568 100644
--- a/packages/@core/base/icons/src/lucide.ts
+++ b/packages/@core/base/icons/src/lucide.ts
@@ -68,6 +68,7 @@ export {
   Sun,
   SunMoon,
   SwatchBook,
+  Trash2,
   Upload,
   UserRoundPen,
   X,