feat：【mall 商城】优惠劵-模版（50% antd）

apps/web-antd/src/views/mall/promotion/coupon/template/index.vue

@@ -2,13 +2,11 @@
 import type { VxeTableGridOptions } from '#/adapter/vxe-table';
 import type { MallCouponTemplateApi } from '#/api/mall/promotion/coupon/couponTemplate';
 
-import { ref } from 'vue';
-
-import { DocAlert, Page, useVbenModal } from '@vben/common-ui';
+import { confirm, DocAlert, Page, useVbenModal } from '@vben/common-ui';
 import { CommonStatusEnum } from '@vben/constants';
 import { $t } from '@vben/locales';
 
-import { message, Switch } from 'ant-design-vue';
+import { message } from 'ant-design-vue';
 
 import { ACTION_ICON, TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
 import {
@@ -49,47 +47,38 @@ async function handleDelete(row: MallCouponTemplateApi.CouponTemplate) {
     duration: 0,
   });
   try {
-    await deleteCouponTemplate(row.id as number);
-    message.success({
-      content: $t('ui.actionMessage.deleteSuccess', [row.name]),
-    });
+    await deleteCouponTemplate(row.id!);
+    message.success($t('ui.actionMessage.deleteSuccess', [row.name]));
     handleRefresh();
   } finally {
     hideLoading();
   }
 }
 
-const checkedIds = ref<number[]>([]);
-function handleRowCheckboxChange({
-  records,
-}: {
-  records: MallCouponTemplateApi.CouponTemplate[];
-}) {
-  checkedIds.value = records.map((item) => item.id!);
-}
-
 /** 优惠券模板状态修改 */
-async function handleStatusChange(row: MallCouponTemplateApi.CouponTemplate) {
-  const text = row.status === CommonStatusEnum.ENABLE ? '启用' : '停用';
-  const hideLoading = message.loading({
-    content: `正在${text}优惠券模板...`,
-    key: 'status_key_msg',
+async function handleStatusChange(
+  newStatus: number,
+  row: MallCouponTemplateApi.CouponTemplate,
+): Promise<boolean | undefined> {
+  return new Promise((resolve, reject) => {
+    confirm({
+      content: `你要将${row.name}的状态切换为【${newStatus === CommonStatusEnum.ENABLE ? '启用' : '停用'}】吗？`,
+    })
+      .then(async () => {
+        // 更新优惠券模板状态
+        const res = await updateCouponTemplateStatus(row.id!, newStatus);
+        if (res) {
+          // 提示并返回成功
+          message.success($t('ui.actionMessage.operationSuccess'));
+          resolve(true);
+        } else {
+          reject(new Error('更新失败'));
+        }
+      })
+      .catch(() => {
+        reject(new Error('取消操作'));
+      });
   });
-  try {
-    await updateCouponTemplateStatus(row.id, row.status as 0 | 1);
-    message.success({
-      content: `${text}成功`,
-      key: 'status_key_msg',
-    });
-  } catch {
-    // 异常时，需要将 row.status 状态重置回之前的
-    row.status =
-      row.status === CommonStatusEnum.ENABLE
-        ? CommonStatusEnum.DISABLE
-        : CommonStatusEnum.ENABLE;
-  } finally {
-    hideLoading();
-  }
 }
 
 const [Grid, gridApi] = useVbenVxeGrid({
@@ -97,7 +86,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
     schema: useGridFormSchema(),
   },
   gridOptions: {
-    columns: useGridColumns(),
+    columns: useGridColumns(handleStatusChange),
     height: 'auto',
     keepSource: true,
     proxyConfig: {
@@ -120,10 +109,6 @@ const [Grid, gridApi] = useVbenVxeGrid({
       search: true,
     },
   } as VxeTableGridOptions<MallCouponTemplateApi.CouponTemplate>,
-  gridEvents: {
-    checkboxAll: handleRowCheckboxChange,
-    checkboxChange: handleRowCheckboxChange,
-  },
 });
 </script>
 
@@ -151,15 +136,6 @@ const [Grid, gridApi] = useVbenVxeGrid({
           ]"
         />
       </template>
-      <template #status="{ row }">
-        <Switch
-          v-model:checked="row.status"
-          :checked-value="CommonStatusEnum.ENABLE"
-          :un-checked-value="CommonStatusEnum.DISABLE"
-          @change="handleStatusChange(row)"
-        />
-      </template>
-
       <template #actions="{ row }">
         <TableAction
           :actions="[