review：【antd/ele】【mall】营销模块的迁移

2025-12-30 02:22:25 +00:00 · 2025-12-15 19:29:47 +08:00
parent ef0f0a9a9d
commit 4ec82f0fd0
50 changed files with 317 additions and 263 deletions
--- a/apps/web-antd/src/views/bpm/components/simple-process-design/components/nodes/modules/process-instance-modal.vue
+++ b/apps/web-antd/src/views/bpm/components/simple-process-design/components/nodes/modules/process-instance-modal.vue
@@ -30,7 +30,7 @@ const [Modal, modalApi] = useVbenModal({
    try {
      const data = modalApi.getData<any[]>();
      // 填充列表数据
-      await gridApi.setGridOptions({ data });
+      gridApi.setGridOptions({ data });
    } finally {
      modalApi.unlock();
    }
--- a/apps/web-antd/src/views/bpm/components/simple-process-design/components/nodes/modules/task-list-modal.vue
+++ b/apps/web-antd/src/views/bpm/components/simple-process-design/components/nodes/modules/task-list-modal.vue
@@ -33,7 +33,7 @@ const [Modal, modalApi] = useVbenModal({
    try {
      const data = modalApi.getData<any[]>();
      // 填充列表数据
-      await gridApi.setGridOptions({ data });
+      gridApi.setGridOptions({ data });
    } finally {
      modalApi.unlock();
    }
--- a/apps/web-antd/src/views/iot/rule/data/sink/data-sink-form.vue
+++ b/apps/web-antd/src/views/iot/rule/data/sink/data-sink-form.vue
@@ -83,7 +83,6 @@ const [Modal, modalApi] = useVbenModal({
    }
    // 加载数据
    const data = modalApi.getData<any>();
-
    if (!data || !data.id) {
      formData.value = {
        type: IotDataSinkTypeEnum.HTTP,
--- a/apps/web-antd/src/views/mall/product/comment/modules/form.vue
+++ b/apps/web-antd/src/views/mall/product/comment/modules/form.vue
@@ -21,7 +21,6 @@ import { useFormSchema } from '../data';

 const emit = defineEmits(['success']);

-// 初始化 formData，确保始终有值
 const formData = ref<Partial<MallCommentApi.Comment>>({
  descriptionScores: 5,
  benefitScores: 5,
@@ -100,7 +99,6 @@ const [Modal, modalApi] = useVbenModal({
  },
  async onOpenChange(isOpen: boolean) {
    if (!isOpen) {
-      // 重置表单数据
      selectedSku.value = undefined;
      return;
    }
@@ -108,6 +106,7 @@ const [Modal, modalApi] = useVbenModal({
    const data = modalApi.getData<MallCommentApi.Comment>();
    if (!data || !data.id) {
      // 新建模式：重置表单
+      // TODO @puhui999：这里的重置，可以统一到 103 行那么？
      selectedSku.value = undefined;
      await formApi.setValues({ spuId: undefined, skuId: undefined });
      return;
--- a/apps/web-antd/src/views/mall/product/spu/components/spu-and-sku-list.vue
+++ b/apps/web-antd/src/views/mall/product/spu/components/spu-and-sku-list.vue
@@ -127,7 +127,7 @@ watch(
        </SkuList>
      </template>
    </VxeColumn>
-    <VxeColumn field="id" align="center" title="商品编号" />
+    <VxeColumn field="id" align="center" title="商品编号" min-width="30" />
    <VxeColumn title="商品图" min-width="80">
      <template #default="{ row }">
        <Image
--- a/apps/web-antd/src/views/mall/promotion/bargain/activity/index.vue
+++ b/apps/web-antd/src/views/mall/promotion/bargain/activity/index.vue
@@ -41,23 +41,14 @@ function handleEdit(row: MallBargainActivityApi.BargainActivity) {

 /** 关闭砍价活动 */
 async function handleClose(row: MallBargainActivityApi.BargainActivity) {
-  try {
-    await confirm({
-      content: '确认关闭该砍价活动吗？',
-    });
-  } catch {
-    return;
-  }
-
+  await confirm('确认关闭该砍价活动吗？');
  const hideLoading = message.loading({
-    content: '确认关闭该砍价活动吗？',
+    content: '关闭中...',
    duration: 0,
  });
  try {
-    await closeBargainActivity(row.id as number);
-    message.success({
-      content: '关闭成功',
-    });
+    await closeBargainActivity(row.id!);
+    message.success('关闭成功');
    handleRefresh();
  } finally {
    hideLoading();
@@ -71,10 +62,8 @@ async function handleDelete(row: MallBargainActivityApi.BargainActivity) {
    duration: 0,
  });
  try {
-    await deleteBargainActivity(row.id as number);
-    message.success({
-      content: $t('ui.actionMessage.deleteSuccess', [row.name]),
-    });
+    await deleteBargainActivity(row.id!);
+    message.success($t('ui.actionMessage.deleteSuccess', [row.name]));
    handleRefresh();
  } finally {
    hideLoading();
--- a/apps/web-antd/src/views/mall/promotion/bargain/activity/modules/form.vue
+++ b/apps/web-antd/src/views/mall/promotion/bargain/activity/modules/form.vue
@@ -96,17 +96,15 @@ const [Modal, modalApi] = useVbenModal({
      message.error('请选择砍价商品');
      return;
    }
-
    if (!skuId.value) {
      message.error('请选择商品 SKU');
      return;
    }

+    // 提交表单
    modalApi.lock();
    try {
      const values = await formApi.getValues();
-
-      // 构建提交数据，价格字段转换为分
      const data = {
        ...values,
        spuId: spuId.value,
@@ -120,11 +118,10 @@ const [Modal, modalApi] = useVbenModal({
          ? Math.round(values.randomMaxPrice * 100)
          : undefined,
      } as MallBargainActivityApi.BargainActivity;
-
      await (formData.value?.id
        ? updateBargainActivity(data)
        : createBargainActivity(data));
-
+      // 关闭并提示
      await modalApi.close();
      emit('success');
      message.success($t('ui.actionMessage.operationSuccess'));
@@ -141,17 +138,15 @@ const [Modal, modalApi] = useVbenModal({
      skuInfo.value = undefined;
      return;
    }
-
+    // 加载表单数据
    const data = modalApi.getData<MallBargainActivityApi.BargainActivity>();
    if (!data || !data.id) {
      return;
    }
-
    modalApi.lock();
    try {
      formData.value = await getBargainActivity(data.id);
      await nextTick();
-
      // 设置表单值时，价格字段从分转换为元
      await formApi.setValues({
        ...formData.value,
@@ -164,14 +159,12 @@ const [Modal, modalApi] = useVbenModal({
          ? formData.value.randomMaxPrice / 100
          : undefined,
      });
-
      // 加载商品和 SKU 信息
      if (formData.value.spuId) {
        const spu = await getSpu(formData.value.spuId);
        if (spu) {
          spuId.value = spu.id;
          spuName.value = spu.name || '';
-
          if (formData.value.skuId) {
            const selectedSku = spu.skus?.find(
              (sku) => sku.id === formData.value?.skuId,
@@ -214,6 +207,19 @@ const [Modal, modalApi] = useVbenModal({
        <!-- SKU 信息展示 -->
        <div v-if="skuInfo" class="mt-4">
          <table class="w-full border-collapse border border-gray-300">
+            <!-- TODO @puhui999：和 element-plus 有点差别哈；ps：是不是用 grid 组件呀？或者 vxe 组件
+             图片
+颜色
+版本
+商品条码
+销售价(元)
+市场价(元)
+成本价(元)
+库存
+砍价起始价格(元)
+砍价底价(元)
+活动库存
+             -->
            <thead>
              <tr class="bg-gray-100">
                <th class="border border-gray-300 px-4 py-2">商品图片</th>
--- a/apps/web-antd/src/views/mall/promotion/combination/activity/index.vue
+++ b/apps/web-antd/src/views/mall/promotion/combination/activity/index.vue
@@ -43,23 +43,14 @@ function handleEdit(row: MallCombinationActivityApi.CombinationActivity) {
 async function handleClose(
  row: MallCombinationActivityApi.CombinationActivity,
 ) {
-  try {
-    await confirm({
-      content: '确认关闭该拼团活动吗？',
-    });
-  } catch {
-    return;
-  }
-
+  await confirm('确认关闭该拼团活动吗？');
  const hideLoading = message.loading({
    content: '关闭中...',
    duration: 0,
  });
  try {
-    await closeCombinationActivity(row.id as number);
-    message.success({
-      content: '关闭成功',
-    });
+    await closeCombinationActivity(row.id!);
+    message.success('关闭成功');
    handleRefresh();
  } finally {
    hideLoading();
@@ -75,10 +66,8 @@ async function handleDelete(
    duration: 0,
  });
  try {
-    await deleteCombinationActivity(row.id as number);
-    message.success({
-      content: $t('ui.actionMessage.deleteSuccess', [row.name]),
-    });
+    await deleteCombinationActivity(row.id!);
+    message.success($t('ui.actionMessage.deleteSuccess', [row.name]));
    handleRefresh();
  } finally {
    hideLoading();
--- a/apps/web-antd/src/views/mall/promotion/combination/activity/modules/form.vue
+++ b/apps/web-antd/src/views/mall/promotion/combination/activity/modules/form.vue
@@ -92,12 +92,10 @@ const [Modal, modalApi] = useVbenModal({
      message.error('请选择拼团商品');
      return;
    }
-
    if (skuTableData.value.length === 0) {
      message.error('请至少配置一个 SKU');
      return;
    }
-
    // 验证 SKU 配置
    const hasInvalidSku = skuTableData.value.some(
      (sku) => sku.combinationPrice < 0.01,
@@ -107,11 +105,10 @@ const [Modal, modalApi] = useVbenModal({
      return;
    }

+    // 提交表单
    modalApi.lock();
    try {
      const values = await formApi.getValues();
-
-      // 构建提交数据
      const data: any = {
        ...values,
        spuId: spuId.value,
@@ -120,11 +117,10 @@ const [Modal, modalApi] = useVbenModal({
          combinationPrice: Math.round(sku.combinationPrice * 100), // 转换为分
        })),
      };
-
      await (formData.value?.id
        ? updateCombinationActivity(data)
        : createCombinationActivity(data));
-
+      // 关闭并提示
      await modalApi.close();
      emit('success');
      message.success($t('ui.actionMessage.operationSuccess'));
@@ -140,20 +136,19 @@ const [Modal, modalApi] = useVbenModal({
      skuTableData.value = [];
      return;
    }
-
+    // 加载数据
    const data =
      modalApi.getData<MallCombinationActivityApi.CombinationActivity>();
    if (!data || !data.id) {
      return;
    }
-
    modalApi.lock();
    try {
      formData.value = await getCombinationActivity(data.id);
      await nextTick();
      await formApi.setValues(formData.value);
-
      // 加载商品和 SKU 信息
+      // TODO @puhui999：if return，简化括号层级
      if (formData.value.spuId) {
        const spu = await getSpu(formData.value.spuId);
        if (spu) {
@@ -221,6 +216,15 @@ const [Modal, modalApi] = useVbenModal({
                    class="h-16 w-16 object-cover"
                  />
                </td>
+                <!-- TODO @puhui999：这里貌似和 element-plus 没对齐；；ps：是不是用 grid 组件呀？或者 vxe 组件
+                 图片
+                  商品条码
+                  销售价(元)
+                  市场价(元)
+                  成本价(元)
+                  库存
+                  拼团价格(元)
+                 -->
                <td class="border border-gray-300 px-4 py-2">
                  {{ sku.skuName }}
                </td>
@@ -228,6 +232,7 @@ const [Modal, modalApi] = useVbenModal({
                  ¥{{ (sku.price / 100).toFixed(2) }}
                </td>
                <td class="border border-gray-300 px-4 py-2">
+                  <!-- TODO @puhui999：是不是要使用 antd 的哈？ -->
                  <input
                    v-model.number="sku.combinationPrice"
                    type="number"
--- a/apps/web-antd/src/views/mall/promotion/coupon/components/select.vue
+++ b/apps/web-antd/src/views/mall/promotion/coupon/components/select.vue
@@ -57,24 +57,22 @@ const [Grid, gridApi] = useVbenVxeGrid({
 /** 打开弹窗 */
 async function open() {
  visible.value = true;
-  // 重置查询条件并重新加载数据，与老组件行为一致
  await gridApi.query();
 }

+/** 确认选择 */
+function handleConfirm() {
+  const selectedRecords = (gridApi.grid?.getCheckboxRecords() ||
+    []) as MallCouponTemplateApi.CouponTemplate[];
+  emit('change', selectedRecords);
+  closeModal();
+}
+
 /** 关闭弹窗 */
 function closeModal() {
  visible.value = false;
 }

-/** 确认选择 */
-function handleConfirm() {
-  // 从 gridApi 获取选中的记录
-  const selectedRecords = (gridApi.grid?.getCheckboxRecords() ||
-    []) as MallCouponTemplateApi.CouponTemplate[];
-  emit('change', selectedRecords);
-  closeModal();
-}
-
 /** 对外暴露的方法 */
 defineExpose({
  open,
--- a/apps/web-antd/src/views/mall/promotion/discountActivity/index.vue
+++ b/apps/web-antd/src/views/mall/promotion/discountActivity/index.vue
@@ -41,23 +41,14 @@ function handleEdit(row: MallDiscountActivityApi.DiscountActivity) {

 /** 关闭满减活动 */
 async function handleClose(row: MallDiscountActivityApi.DiscountActivity) {
-  try {
-    await confirm({
-      content: '确认关闭该限时折扣活动吗？',
-    });
-  } catch {
-    return;
-  }
-
+  await confirm('确认关闭该限时折扣活动吗？');
  const hideLoading = message.loading({
-    content: '正在关闭中',
+    content: '正在关闭中...',
    duration: 0,
  });
  try {
-    await closeDiscountActivity(row.id as number);
-    message.success({
-      content: '关闭成功',
-    });
+    await closeDiscountActivity(row.id!);
+    message.success('关闭成功');
    handleRefresh();
  } finally {
    hideLoading();
@@ -71,7 +62,7 @@ async function handleDelete(row: MallDiscountActivityApi.DiscountActivity) {
    duration: 0,
  });
  try {
-    await deleteDiscountActivity(row.id as number);
+    await deleteDiscountActivity(row.id!);
    message.success({
      content: $t('ui.actionMessage.deleteSuccess', [row.name]),
    });
--- a/apps/web-antd/src/views/mall/promotion/point/activity/data.ts
+++ b/apps/web-antd/src/views/mall/promotion/point/activity/data.ts
@@ -126,7 +126,6 @@ export function useFormSchema(): VbenFormSchema[] {
      },
      formItemClass: 'col-span-2',
    },
-    // TODO @puhui999：商品图太大了。
    {
      fieldName: 'spuId',
      label: '活动商品',
--- a/apps/web-antd/src/views/mall/promotion/point/activity/modules/form.vue
+++ b/apps/web-antd/src/views/mall/promotion/point/activity/modules/form.vue
@@ -180,7 +180,6 @@ const [Modal, modalApi] = useVbenModal({
  },
  async onOpenChange(isOpen: boolean) {
    if (!isOpen) {
-      // 重置表单数据（新增和编辑模式都需要）
      formData.value = undefined;
      spuList.value = [];
      spuPropertyList.value = [];
--- a/apps/web-antd/src/views/mall/promotion/point/components/point-showcase.vue
+++ b/apps/web-antd/src/views/mall/promotion/point/components/point-showcase.vue
@@ -1,4 +1,5 @@
 <!-- 积分商城活动橱窗组件：用于展示和选择积分商城活动 -->
+<!-- TODO @puhui999：不需要 point- 前缀 --->
 <script lang="ts" setup>
 import type { MallPointActivityApi } from '#/api/mall/promotion/point';

--- a/apps/web-antd/src/views/mall/promotion/point/components/point-table-select.vue
+++ b/apps/web-antd/src/views/mall/promotion/point/components/point-table-select.vue
@@ -1,4 +1,5 @@
 <!-- 积分商城活动选择弹窗组件 -->
+<!-- TODO @puhui999：不需要 point- 前缀 --->
 <script lang="ts" setup>
 import type { VbenFormSchema } from '#/adapter/form';
 import type { VxeGridProps } from '#/adapter/vxe-table';
--- a/apps/web-antd/src/views/mall/promotion/rewardActivity/modules/form.vue
+++ b/apps/web-antd/src/views/mall/promotion/rewardActivity/modules/form.vue
@@ -32,7 +32,6 @@ const formData = ref<Partial<MallRewardActivityApi.RewardActivity>>({
  productScope: PromotionProductScopeEnum.ALL.scope,
  rules: [],
 });
-
 const getTitle = computed(() => {
  return formData.value?.id
    ? $t('ui.actionTitle.edit', ['满减送'])
@@ -76,6 +75,7 @@ const [Modal, modalApi] = useVbenModal({
      });
      // 设置 productScopeValues
      switch (data.productScope) {
+        // TODO @puhui999：这里要不要搞成类似优惠劵的
        case PromotionProductScopeEnum.CATEGORY.scope: {
          const categoryIds = data.productCategoryIds;
          data.productScopeValues = Array.isArray(categoryIds)
@@ -90,7 +90,6 @@ const [Modal, modalApi] = useVbenModal({
          break;
        }
      }
-
      await (data.id
        ? updateRewardActivity(data as MallRewardActivityApi.RewardActivity)
        : createRewardActivity(data as MallRewardActivityApi.RewardActivity));
--- a/apps/web-antd/src/views/mall/promotion/seckill/activity/modules/form.vue
+++ b/apps/web-antd/src/views/mall/promotion/seckill/activity/modules/form.vue
@@ -21,7 +21,6 @@ import { useFormSchema } from '../data';

 const emit = defineEmits(['success']);
 const formData = ref<MallSeckillActivityApi.SeckillActivity>();
-
 const getTitle = computed(() => {
  return formData.value?.id
    ? $t('ui.actionTitle.edit', ['秒杀活动'])
@@ -90,12 +89,10 @@ const [Modal, modalApi] = useVbenModal({
      message.error('请选择秒杀商品');
      return;
    }
-
    if (skuTableData.value.length === 0) {
      message.error('请至少配置一个 SKU');
      return;
    }
-
    // 验证 SKU 配置
    const hasInvalidSku = skuTableData.value.some(
      (sku) => sku.stock < 1 || sku.seckillPrice < 0.01,
@@ -105,11 +102,10 @@ const [Modal, modalApi] = useVbenModal({
      return;
    }

+    // 提交表单
    modalApi.lock();
    try {
      const values = await formApi.getValues();
-
-      // 构建提交数据
      const data: any = {
        ...values,
        spuId: spuId.value,
@@ -119,11 +115,10 @@ const [Modal, modalApi] = useVbenModal({
          seckillPrice: Math.round(sku.seckillPrice * 100), // 转换为分
        })),
      };
-
      await (formData.value?.id
        ? updateSeckillActivity(data)
        : createSeckillActivity(data));
-
+      // 关闭并提示
      await modalApi.close();
      emit('success');
      message.success($t('ui.actionMessage.operationSuccess'));
@@ -140,18 +135,18 @@ const [Modal, modalApi] = useVbenModal({
      return;
    }

+    // 加载数据
    const data = modalApi.getData<MallSeckillActivityApi.SeckillActivity>();
    if (!data || !data.id) {
      return;
    }
-
    modalApi.lock();
    try {
      formData.value = await getSeckillActivity(data.id);
      await nextTick();
      await formApi.setValues(formData.value);
-
      // 加载商品和 SKU 信息
+      // TODO @puhui999：if return 简化括号层级
      if (formData.value.spuId) {
        const spu = await getSpu(formData.value.spuId);
        if (spu) {
@@ -201,6 +196,7 @@ const [Modal, modalApi] = useVbenModal({

        <!-- SKU 配置表格 -->
        <div v-if="skuTableData.length > 0" class="mt-4">
+          <!-- TODO @puhui999：Grid？或者 VXETable 哇？ -->
          <table class="w-full border-collapse border border-gray-300">
            <thead>
              <tr class="bg-gray-100">
--- a/apps/web-antd/src/views/mp/material/index.vue
+++ b/apps/web-antd/src/views/mp/material/index.vue
@@ -23,6 +23,7 @@ import {
 import { UploadType } from './modules/upload';
 import UploadFile from './modules/UploadFile.vue';
 import UploadVideo from './modules/UploadVideo.vue';
+import {$t} from '@vben/locales';

 defineOptions({ name: 'MpMaterial' });

@@ -95,7 +96,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
 // 当 tab 切换时，更新 Grid 的 columns 和 rowConfig
 async function onTabChange() {
  const columns = getColumnsByType();
-  await gridApi.setGridOptions({
+  gridApi.setGridOptions({
    columns,
    rowConfig: {
      keyField: 'id',
@@ -109,7 +110,7 @@ async function onTabChange() {
 async function handleAccountChange(id: number) {
  accountId.value = id;
  // 同步设置表单值
-  gridApi.formApi.setValues({ accountId: id });
+  await gridApi.formApi.setValues({ accountId: id });
  await gridApi.formApi.submitForm();
 }

@@ -127,7 +128,7 @@ async function handleDelete(id: number) {
  try {
    await deletePermanentMaterial(id);
    message.success('删除成功');
-    handleRefresh();
+    await handleRefresh();
  } finally {
    hideLoading();
  }
@@ -205,7 +206,7 @@ async function handleDelete(id: number) {
        </Button>
      </template>

-      <!-- 图片列的slot -->
+      <!-- 图片列的 slot -->
      <template #image="{ row }">
        <div class="flex items-center justify-center" style="height: 192px">
          <img
@@ -216,12 +217,12 @@ async function handleDelete(id: number) {
        </div>
      </template>

-      <!-- 语音列的slot -->
+      <!-- 语音列的 slot -->
      <template #voice="{ row }">
        <audio :src="row.url" controls style="width: 160px"></audio>
      </template>

-      <!-- 视频列的slot -->
+      <!-- 视频列的 slot -->
      <template #video="{ row }">
        <video
          :src="row.url"
@@ -230,16 +231,17 @@ async function handleDelete(id: number) {
        ></video>
      </template>

-      <!-- 操作列的slot -->
+      <!-- 操作列的 slot -->
      <template #actions="{ row }">
        <TableAction
          :actions="[
            {
-              label: '删除',
-              icon: ACTION_ICON.delete,
-              color: 'danger',
+              label: $t('common.delete'),
+              type: 'link',
+              danger: true,
+              icon: ACTION_ICON.DELETE,
              auth: ['mp:material:delete'],
-              onClick: () => handleDelete(row.id),
+              onClick: () => handleDelete(row.id!),
            },
          ]"
        />
--- a/apps/web-ele/src/api/mall/promotion/bargain/bargainActivity.ts
+++ b/apps/web-ele/src/api/mall/promotion/bargain/bargainActivity.ts
@@ -1,7 +1,5 @@
 import type { PageParam, PageResult } from '@vben/request';

-import type { MallSpuApi } from '#/api/mall/product/spu';
-
 import { requestClient } from '#/api/request';

 export namespace MallBargainActivityApi {
@@ -32,17 +30,6 @@ export namespace MallBargainActivityApi {
    bargainMinPrice: number; // 砍价底价
    stock: number; // 活动库存
  }
-
-  // TODO @puhui999：要不要删除？
-  /** 扩展 SKU 配置 */
-  export type SkuExtension = {
-    productConfig: BargainProduct; // 砍价活动配置
-  } & MallSpuApi.Sku;
-
-  /** 扩展 SPU 配置 */
-  export interface SpuExtension extends MallSpuApi.Spu {
-    skus: SkuExtension[]; // SKU 列表
-  }
 }

 /** 查询砍价活动列表 */
--- a/apps/web-ele/src/api/mall/promotion/combination/combinationActivity.ts
+++ b/apps/web-ele/src/api/mall/promotion/combination/combinationActivity.ts
@@ -1,7 +1,5 @@
 import type { PageParam, PageResult } from '@vben/request';

-import type { MallSpuApi } from '#/api/mall/product/spu';
-
 import { requestClient } from '#/api/request';

 export namespace MallCombinationActivityApi {
@@ -23,25 +21,15 @@ export namespace MallCombinationActivityApi {
    limitDuration?: number; // 限制时长
    combinationPrice?: number; // 拼团价格
    products: CombinationProduct[]; // 商品列表
+    picUrl?: any;
  }

-  // TODO @puhui999：要不要删除？
  /** 拼团活动所需属性 */
  export interface CombinationProduct {
    spuId: number; // 商品 SPU 编号
    skuId: number; // 商品 SKU 编号
    combinationPrice: number; // 拼团价格
  }
-
-  /** 扩展 SKU 配置 */
-  export type SkuExtension = {
-    productConfig: CombinationProduct; // 拼团活动配置
-  } & MallSpuApi.Sku;
-
-  /** 扩展 SPU 配置 */
-  export interface SpuExtension extends MallSpuApi.Spu {
-    skus: SkuExtension[]; // SKU 列表
-  }
 }

 /** 查询拼团活动列表 */
--- a/apps/web-ele/src/api/mall/promotion/discount/discountActivity.ts
+++ b/apps/web-ele/src/api/mall/promotion/discount/discountActivity.ts
@@ -1,7 +1,5 @@
 import type { PageParam, PageResult } from '@vben/request';

-import type { MallSpuApi } from '#/api/mall/product/spu';
-
 import { requestClient } from '#/api/request';

 export namespace MallDiscountActivityApi {
@@ -25,17 +23,6 @@ export namespace MallDiscountActivityApi {
    endTime?: Date; // 结束时间
    products?: DiscountProduct[]; // 商品列表
  }
-
-  // TODO @puhui999：要不要删除？
-  /** 扩展 SKU 配置 */
-  export type SkuExtension = {
-    productConfig: DiscountProduct; // 限时折扣配置
-  } & MallSpuApi.Sku;
-
-  /** 扩展 SPU 配置 */
-  export interface SpuExtension extends MallSpuApi.Spu {
-    skus: SkuExtension[]; // SKU 列表
-  }
 }

 /** 查询限时折扣活动列表 */
--- a/apps/web-ele/src/api/mall/promotion/point/index.ts
+++ b/apps/web-ele/src/api/mall/promotion/point/index.ts
@@ -36,17 +36,6 @@ export namespace MallPointActivityApi {
    price: number; // 兑换金额，单位：分
  }

-  // TODO @puhui999：这些还需要么？
-  /** 扩展 SKU 配置 */
-  export type SkuExtension = {
-    productConfig: PointProduct; // 积分商城商品配置
-  } & MallSpuApi.Sku;
-
-  /** 扩展 SPU 配置 */
-  export interface SpuExtension extends MallSpuApi.Spu {
-    skus: SkuExtension[]; // SKU 列表
-  }
-
  /** 扩展 SPU 配置（带积分信息） */
  export interface SpuExtensionWithPoint extends MallSpuApi.Spu {
    pointStock: number; // 积分商城活动库存
--- a/apps/web-ele/src/api/mall/promotion/seckill/seckillActivity.ts
+++ b/apps/web-ele/src/api/mall/promotion/seckill/seckillActivity.ts
@@ -1,7 +1,5 @@
 import type { PageParam, PageResult } from '@vben/request';

-import type { MallSpuApi } from '#/api/mall/product/spu';
-
 import { requestClient } from '#/api/request';

 export namespace MallSeckillActivityApi {
@@ -33,17 +31,7 @@ export namespace MallSeckillActivityApi {
    totalStock?: number; // 秒杀总库存
    seckillPrice?: number; // 秒杀价格
    products?: SeckillProduct[]; // 秒杀商品列表
-  }
-
-  // TODO @puhui999：这些还需要么？
-  /** 扩展 SKU 配置 */
-  export type SkuExtension = {
-    productConfig: SeckillProduct; // 秒杀商品配置
-  } & MallSpuApi.Sku;
-
-  /** 扩展 SPU 配置 */
-  export interface SpuExtension extends MallSpuApi.Spu {
-    skus: SkuExtension[]; // SKU 列表
+    picUrl?: any;
  }
 }

--- a/apps/web-ele/src/views/mall/product/comment/modules/form.vue
+++ b/apps/web-ele/src/views/mall/product/comment/modules/form.vue
@@ -15,6 +15,7 @@ import { useFormSchema } from '../data';

 const emit = defineEmits(['success']);

+// TODO @puhui999：这里和 yudao-ui-admin-vben-v5/apps/web-antd/src/views/mall/product/comment/modules/form.vue 存在差异，是不是还没迁移到呀。
 const formData = ref<MallCommentApi.Comment>();
 const getTitle = computed(() => {
  return formData.value?.id
--- a/apps/web-ele/src/views/mall/promotion/bargain/activity/data.ts
+++ b/apps/web-ele/src/views/mall/promotion/bargain/activity/data.ts
@@ -24,6 +24,7 @@ export function useFormSchema(): VbenFormSchema[] {
        placeholder: '请输入活动名称',
      },
      rules: 'required',
+      // TODO @puhui999：这里和 antd 里的不太一样，可以看看。
    },
    {
      fieldName: 'startTime',
@@ -222,12 +223,14 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
      field: 'bargainFirstPrice',
      title: '起始价格',
      minWidth: 100,
+      // TODO @puhui999：这里和 antd 不太一样，得看看
      formatter: 'formatFenToYuanAmount',
    },
    {
      field: 'bargainMinPrice',
      title: '砍价底价',
      minWidth: 100,
+      // TODO @puhui999：这里和 antd 不太一样，得看看
      formatter: 'formatFenToYuanAmount',
    },
    {
--- a/apps/web-ele/src/views/mall/promotion/bargain/activity/index.vue
+++ b/apps/web-ele/src/views/mall/promotion/bargain/activity/index.vue
@@ -42,9 +42,16 @@ function handleEdit(row: MallBargainActivityApi.BargainActivity) {
 /** 关闭砍价活动 */
 async function handleClose(row: MallBargainActivityApi.BargainActivity) {
  await confirm('确定关闭该砍价活动吗？');
-  await closeBargainActivity(row.id as number);
-  ElMessage.success('关闭成功');
-  handleRefresh();
+  const loadingInstance = ElLoading.service({
+    text: '关闭中...',
+  });
+  try {
+    await closeBargainActivity(row.id!);
+    ElMessage.success('关闭成功');
+    handleRefresh();
+  } finally {
+    loadingInstance.close();
+  }
 }

 /** 删除砍价活动 */
@@ -53,7 +60,7 @@ async function handleDelete(row: MallBargainActivityApi.BargainActivity) {
    text: $t('ui.actionMessage.deleting', [row.name]),
  });
  try {
-    await deleteBargainActivity(row.id as number);
+    await deleteBargainActivity(row.id!);
    ElMessage.success($t('ui.actionMessage.deleteSuccess', [row.name]));
    handleRefresh();
  } finally {
--- a/apps/web-ele/src/views/mall/promotion/bargain/activity/modules/form.vue
+++ b/apps/web-ele/src/views/mall/promotion/bargain/activity/modules/form.vue
@@ -30,6 +30,7 @@ const getTitle = computed(() => {
    : $t('ui.actionTitle.create', ['砍价活动']);
 });

+// ================= 商品选择相关 =================
 const spuId = ref<number>();
 const skuId = ref<number>();
 const spuName = ref<string>('');
@@ -39,12 +40,14 @@ const skuInfo = ref<{
  skuName: string;
 }>();

-const spuSkuSelectRef = ref();
+const spuSkuSelectRef = ref(); // 商品选择弹窗 Ref

+/** 打开商品选择弹窗 */
 const handleSelectProduct = () => {
  spuSkuSelectRef.value?.open();
 };

+/** 选择商品后的回调 */
 async function handleSpuSelected(selectedSpuId: number, skuIds?: number[]) {
  const spu = await getSpu(selectedSpuId);
  if (!spu) return;
@@ -52,6 +55,7 @@ async function handleSpuSelected(selectedSpuId: number, skuIds?: number[]) {
  spuId.value = spu.id;
  spuName.value = spu.name || '';

+  // 砍价活动只选择一个 SKU
  if (skuIds && skuIds.length > 0) {
    const selectedSku = spu.skus?.find((sku) => sku.id === skuIds[0]);
    if (selectedSku) {
@@ -65,6 +69,8 @@ async function handleSpuSelected(selectedSpuId: number, skuIds?: number[]) {
  }
 }

+// ================= end =================
+
 const [Form, formApi] = useVbenForm({
  commonConfig: {
    componentProps: {
@@ -85,6 +91,7 @@ const [Modal, modalApi] = useVbenModal({
      return;
    }

+    // 验证商品和 SKU 选择
    if (!spuId.value) {
      ElMessage.error('请选择砍价商品');
      return;
@@ -94,6 +101,7 @@ const [Modal, modalApi] = useVbenModal({
      return;
    }

+    // 提交表单
    modalApi.lock();
    try {
      const values = await formApi.getValues();
@@ -110,10 +118,10 @@ const [Modal, modalApi] = useVbenModal({
          ? Math.round(values.randomMaxPrice * 100)
          : undefined,
      } as MallBargainActivityApi.BargainActivity;
-
      await (formData.value?.id
        ? updateBargainActivity(data)
        : createBargainActivity(data));
+      // 关闭并提示
      await modalApi.close();
      emit('success');
      ElMessage.success($t('ui.actionMessage.operationSuccess'));
@@ -130,16 +138,16 @@ const [Modal, modalApi] = useVbenModal({
      skuInfo.value = undefined;
      return;
    }
-
+    // 加载表单数据
    const data = modalApi.getData<MallBargainActivityApi.BargainActivity>();
    if (!data || !data.id) {
      return;
    }
-
    modalApi.lock();
    try {
      formData.value = await getBargainActivity(data.id);
      await nextTick();
+      // 设置表单值时，价格字段从分转换为元
      await formApi.setValues({
        ...formData.value,
        bargainFirstPrice: (formData.value.bargainFirstPrice || 0) / 100,
@@ -151,7 +159,7 @@ const [Modal, modalApi] = useVbenModal({
          ? formData.value.randomMaxPrice / 100
          : undefined,
      });
-
+      // 加载商品和 SKU 信息
      if (formData.value.spuId) {
        const spu = await getSpu(formData.value.spuId);
        if (spu) {
@@ -183,6 +191,8 @@ const [Modal, modalApi] = useVbenModal({
  <Modal class="w-3/5" :title="getTitle">
    <div class="mx-4">
      <Form />
+
+      <!-- 商品选择区域 -->
      <div class="mt-4">
        <div class="mb-2 flex items-center">
          <span class="text-sm font-medium">砍价活动商品:</span>
@@ -193,8 +203,23 @@ const [Modal, modalApi] = useVbenModal({
            已选择: {{ spuName }}
          </span>
        </div>
+
+        <!-- SKU 信息展示 -->
        <div v-if="skuInfo" class="mt-4">
          <table class="w-full border-collapse border border-gray-300">
+            <!-- TODO @puhui999：和 element-plus 有点差别哈；ps：是不是用 grid 组件呀？或者 vxe 组件
+             图片
+颜色
+版本
+商品条码
+销售价(元)
+市场价(元)
+成本价(元)
+库存
+砍价起始价格(元)
+砍价底价(元)
+活动库存
+             -->
            <thead>
              <tr class="bg-gray-100">
                <th class="border border-gray-300 px-4 py-2">商品图片</th>
@@ -225,6 +250,8 @@ const [Modal, modalApi] = useVbenModal({
      </div>
    </div>
  </Modal>
+
+  <!-- 商品选择器弹窗（单选模式） -->
  <SpuSkuSelect
    ref="spuSkuSelectRef"
    :is-select-sku="true"
--- a/apps/web-ele/src/views/mall/promotion/bargain/record/data.ts
+++ b/apps/web-ele/src/views/mall/promotion/bargain/record/data.ts
@@ -75,12 +75,14 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
      field: 'activity.bargainMinPrice',
      title: '最低价',
      minWidth: 100,
+      // TODO @puhui999：这里和 antd 不同
      formatter: 'formatFenToYuanAmount',
    },
    {
      field: 'bargainPrice',
      title: '当前价',
      minWidth: 100,
+      // TODO @puhui999：这里和 antd 不同
      formatter: 'formatFenToYuanAmount',
    },
    {
@@ -152,6 +154,7 @@ export function useHelpGridColumns(): VxeTableGridOptions['columns'] {
      field: 'reducePrice',
      title: '砍价金额',
      minWidth: 100,
+      // TODO @puhui999：这里和 antd 不同
      formatter: 'formatFenToYuanAmount',
    },
    {
--- a/apps/web-ele/src/views/mall/promotion/combination/activity/index.vue
+++ b/apps/web-ele/src/views/mall/promotion/combination/activity/index.vue
@@ -43,10 +43,17 @@ function handleEdit(row: MallCombinationActivityApi.CombinationActivity) {
 async function handleClose(
  row: MallCombinationActivityApi.CombinationActivity,
 ) {
-  await confirm('确定关闭该拼团活动吗？');
-  await closeCombinationActivity(row.id as number);
-  ElMessage.success('关闭成功');
-  handleRefresh();
+  await confirm('确认关闭该拼团活动吗？');
+  const loadingInstance = ElLoading.service({
+    text: '关闭中...',
+  });
+  try {
+    await closeCombinationActivity(row.id!);
+    ElMessage.success('关闭成功');
+    handleRefresh();
+  } finally {
+    loadingInstance.close();
+  }
 }

 /** 删除拼团活动 */
@@ -57,7 +64,7 @@ async function handleDelete(
    text: $t('ui.actionMessage.deleting', [row.name]),
  });
  try {
-    await deleteCombinationActivity(row.id as number);
+    await deleteCombinationActivity(row.id!);
    ElMessage.success($t('ui.actionMessage.deleteSuccess', [row.name]));
    handleRefresh();
  } finally {
--- a/apps/web-ele/src/views/mall/promotion/combination/activity/modules/form.vue
+++ b/apps/web-ele/src/views/mall/promotion/combination/activity/modules/form.vue
@@ -91,12 +91,10 @@ const [Modal, modalApi] = useVbenModal({
      ElMessage.error('请选择拼团商品');
      return;
    }
-
    if (skuTableData.value.length === 0) {
      ElMessage.error('请至少配置一个 SKU');
      return;
    }
-
    // 验证 SKU 配置
    const hasInvalidSku = skuTableData.value.some(
      (sku) => sku.combinationPrice < 0.01,
@@ -106,11 +104,10 @@ const [Modal, modalApi] = useVbenModal({
      return;
    }

+    // 提交表单
    modalApi.lock();
    try {
      const values = await formApi.getValues();
-
-      // 构建提交数据
      const data: any = {
        ...values,
        spuId: spuId.value,
@@ -119,11 +116,10 @@ const [Modal, modalApi] = useVbenModal({
          combinationPrice: Math.round(sku.combinationPrice * 100), // 转换为分
        })),
      };
-
      await (formData.value?.id
        ? updateCombinationActivity(data)
        : createCombinationActivity(data));
-
+      // 关闭并提示
      await modalApi.close();
      emit('success');
      ElMessage.success($t('ui.actionMessage.operationSuccess'));
@@ -139,20 +135,19 @@ const [Modal, modalApi] = useVbenModal({
      skuTableData.value = [];
      return;
    }
-
+    // 加载数据
    const data =
      modalApi.getData<MallCombinationActivityApi.CombinationActivity>();
    if (!data || !data.id) {
      return;
    }
-
    modalApi.lock();
    try {
      formData.value = await getCombinationActivity(data.id);
      await nextTick();
      await formApi.setValues(formData.value);
-
      // 加载商品和 SKU 信息
+      // TODO @puhui999：if return，简化括号层级
      if (formData.value.spuId) {
        const spu = await getSpu(formData.value.spuId);
        if (spu) {
@@ -220,6 +215,15 @@ const [Modal, modalApi] = useVbenModal({
                    class="h-16 w-16 object-cover"
                  />
                </td>
+                <!-- TODO @puhui999：这里貌似和 element-plus 没对齐；；ps：是不是用 grid 组件呀？或者 vxe 组件
+                 图片
+                  商品条码
+                  销售价(元)
+                  市场价(元)
+                  成本价(元)
+                  库存
+                  拼团价格(元)
+                 -->
                <td class="border border-gray-300 px-4 py-2">
                  {{ sku.skuName }}
                </td>
@@ -227,6 +231,7 @@ const [Modal, modalApi] = useVbenModal({
                  ¥{{ (sku.price / 100).toFixed(2) }}
                </td>
                <td class="border border-gray-300 px-4 py-2">
+                  <!-- TODO @puhui999：是不是要使用 antd 的哈？ -->
                  <input
                    v-model.number="sku.combinationPrice"
                    type="number"
--- a/apps/web-ele/src/views/mall/promotion/combination/components/showcase.vue
+++ b/apps/web-ele/src/views/mall/promotion/combination/components/showcase.vue
@@ -111,7 +111,6 @@ function emitActivityChange() {
    >
      <ElTooltip :content="activity.name">
        <div class="relative h-full w-full">
-          <!-- TODO @芋艿 -->
          <ElImage
            :src="activity.picUrl"
            class="h-full w-full rounded-lg object-cover"
--- a/apps/web-ele/src/views/mall/promotion/coupon/components/select.vue
+++ b/apps/web-ele/src/views/mall/promotion/coupon/components/select.vue
@@ -57,12 +57,11 @@ const [Grid, gridApi] = useVbenVxeGrid({
 /** 打开弹窗 */
 async function open() {
  visible.value = true;
-  // 重置查询条件并重新加载数据，与 antd 行为一致
  await gridApi.query();
 }

 /** 确认选择 */
-async function handleConfirm() {
+function handleConfirm() {
  const selectedRecords = (gridApi.grid?.getCheckboxRecords() ||
    []) as MallCouponTemplateApi.CouponTemplate[];
  emit('change', selectedRecords);
@@ -74,6 +73,7 @@ function closeModal() {
  visible.value = false;
 }

+/** 对外暴露的方法 */
 defineExpose({
  open,
 });
--- a/apps/web-ele/src/views/mall/promotion/discountActivity/data.ts
+++ b/apps/web-ele/src/views/mall/promotion/discountActivity/data.ts
@@ -70,7 +70,7 @@ export function useFormSchema(): VbenFormSchema[] {
        rows: 4,
      },
    },
-    // TODO
+    // TODO @puhui999：这里和 antd 对应的不太一样；
  ];
 }

--- a/apps/web-ele/src/views/mall/promotion/discountActivity/index.vue
+++ b/apps/web-ele/src/views/mall/promotion/discountActivity/index.vue
@@ -41,11 +41,17 @@ function handleEdit(row: MallDiscountActivityApi.DiscountActivity) {

 /** 关闭满减活动 */
 async function handleClose(row: MallDiscountActivityApi.DiscountActivity) {
-  await confirm('确定关闭该限时折扣活动吗？');
-  await closeDiscountActivity(row.id as number);
-  ElMessage.success('关闭成功');
-  handleRefresh();
-}
+  await confirm('确认关闭该限时折扣活动吗？');
+  const loadingInstance = ElLoading.service({
+    text: '正在关闭中...',
+  });
+  try {
+    await closeDiscountActivity(row.id as number);
+    ElMessage.success('关闭成功');
+    handleRefresh();
+  } finally {
+    loadingInstance.close();
+  }

 /** 删除满减活动 */
 async function handleDelete(row: MallDiscountActivityApi.DiscountActivity) {
--- a/apps/web-ele/src/views/mall/promotion/discountActivity/modules/form.vue
+++ b/apps/web-ele/src/views/mall/promotion/discountActivity/modules/form.vue
@@ -18,6 +18,7 @@ import { useFormSchema } from '../data';

 defineOptions({ name: 'DiscountActivityForm' });

+// TODO @puhui999：这里和 yudao-ui-admin-vben-v5/apps/web-antd/src/views/mall/promotion/discountActivity/modules/form.vue 不太一样
 const emit = defineEmits(['success']);
 const formData = ref<MallDiscountActivityApi.DiscountActivity>();
 const getTitle = computed(() => {
@@ -69,6 +70,7 @@ const [Modal, modalApi] = useVbenModal({
  },
  async onOpenChange(isOpen: boolean) {
    if (!isOpen) {
+      // TODO @puhui999：这里和 yudao-ui-admin-vben-v5/apps/web-antd/src/views/mall/promotion/discountActivity/modules/form.vue 不太一样
      formData.value = undefined;
      return;
    }
@@ -91,6 +93,7 @@ const [Modal, modalApi] = useVbenModal({

 <template>
  <Modal class="w-3/5" :title="getTitle">
+    <!-- TODO @puhui999：这里和 yudao-ui-admin-vben-v5/apps/web-antd/src/views/mall/promotion/discountActivity/modules/form.vue 不太一样 -->
    <Form />
  </Modal>
 </template>
--- a/apps/web-ele/src/views/mall/promotion/point/activity/data.ts
+++ b/apps/web-ele/src/views/mall/promotion/point/activity/data.ts
@@ -127,7 +127,6 @@ export function useFormSchema(): VbenFormSchema[] {
      },
      formItemClass: 'col-span-2',
    },
-    // TODO @puhui999：商品图太大了。
    {
      fieldName: 'spuId',
      label: '活动商品',
--- a/apps/web-ele/src/views/mall/promotion/point/activity/modules/form.vue
+++ b/apps/web-ele/src/views/mall/promotion/point/activity/modules/form.vue
@@ -26,6 +26,7 @@ import {
  SpuAndSkuList,
  SpuSkuSelect,
 } from '#/views/mall/product/spu/components';
+// TODO @puhui999：getPropertyList 在 antd 和 el 导入的路径不同；是不是要统一下哈；
 import { getPropertyList } from '#/views/mall/product/spu/components/property-util';

 import { useFormSchema } from '../data';
@@ -99,6 +100,7 @@ async function getSpuDetails(
    return;
  }

+  // TODO @puhui999：这里的 spuList，是不是直接放到 145 行就 ok 啦；（尾部）；
  spuList.value = [];

  // 筛选指定的 SKU
@@ -132,6 +134,7 @@ async function getSpuDetails(
  });
  res.skus = selectSkus;

+  // TODO @puhui999：这里的逻辑，是不是放到 147 行（尾部）；
  const spuProperties: SpuProperty<MallSpuApi.Spu>[] = [
    {
      spuId: res.id!,
@@ -180,7 +183,6 @@ const [Modal, modalApi] = useVbenModal({
  },
  async onOpenChange(isOpen: boolean) {
    if (!isOpen) {
-      // 重置表单数据（新增和编辑模式都需要）
      formData.value = undefined;
      spuList.value = [];
      spuPropertyList.value = [];
--- a/apps/web-ele/src/views/mall/promotion/point/components/showcase.vue
+++ b/apps/web-ele/src/views/mall/promotion/point/components/showcase.vue
@@ -1,4 +1,5 @@
 <!-- 积分商城活动橱窗组件：用于展示和选择积分商城活动 -->
+<!-- TODO @puhui999：antd 多了一个，看着 ele 要迁移下？ --->
 <script lang="ts" setup>
 import type { MallPointActivityApi } from '#/api/mall/promotion/point';

--- a/apps/web-ele/src/views/mall/promotion/point/components/table-select.vue
+++ b/apps/web-ele/src/views/mall/promotion/point/components/table-select.vue
@@ -1,4 +1,5 @@
 <!-- 积分商城活动选择弹窗组件 -->
+<!-- TODO @puhui999：antd 多了一个，看着 ele 要迁移下？ --->
 <script lang="ts" setup>
 import type { VbenFormSchema } from '#/adapter/form';
 import type { VxeGridProps } from '#/adapter/vxe-table';
--- a/apps/web-ele/src/views/mall/promotion/rewardActivity/data.ts
+++ b/apps/web-ele/src/views/mall/promotion/rewardActivity/data.ts
@@ -12,6 +12,7 @@ import { $t } from '@vben/locales';
 import { z } from '#/adapter/form';
 import { getRangePickerDefaultProps } from '#/utils';

+/** 列表的搜索表单 */
 export function useGridFormSchema(): VbenFormSchema[] {
  return [
    {
@@ -45,6 +46,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
  ];
 }

+/** 列表的表格列 */
 export function useGridColumns(): VxeTableGridOptions['columns'] {
  return [
    {
@@ -97,6 +99,7 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
  ];
 }

+/** 新增/修改的表单 */
 export function useFormSchema(): VbenFormSchema[] {
  return [
    {
@@ -173,6 +176,7 @@ export function useFormSchema(): VbenFormSchema[] {
          return values.productScope === PromotionProductScopeEnum.SPU.scope;
        },
        trigger(values, form) {
+          // 当加载已有数据时，根据 productScopeValues 设置 productSpuIds
          if (
            values.productScope === PromotionProductScopeEnum.SPU.scope &&
            values.productScopeValues
@@ -195,11 +199,13 @@ export function useFormSchema(): VbenFormSchema[] {
          );
        },
        trigger(values, form) {
+          // 当加载已有数据时，根据 productScopeValues 设置 productCategoryIds
          if (
            values.productScope === PromotionProductScopeEnum.CATEGORY.scope &&
            values.productScopeValues
          ) {
            const categoryIds = values.productScopeValues;
+            // 单选时使用数组不能反显，取第一个元素
            form.setFieldValue(
              'productCategoryIds',
              Array.isArray(categoryIds) && categoryIds.length > 0
@@ -219,7 +225,7 @@ export function useFormSchema(): VbenFormSchema[] {
      rules: 'required',
    },
    {
-      fieldName: 'productScopeValues',
+      fieldName: 'productScopeValues', // 隐藏字段：用于自动同步 productScopeValues
      component: 'Input',
      dependencies: {
        triggerFields: ['productScope', 'productSpuIds', 'productCategoryIds'],
--- a/apps/web-ele/src/views/mall/promotion/rewardActivity/index.vue
+++ b/apps/web-ele/src/views/mall/promotion/rewardActivity/index.vue
@@ -25,28 +25,32 @@ const [FormModal, formModalApi] = useVbenModal({
  destroyOnClose: true,
 });

+/** 刷新表格 */
 function handleRefresh() {
  gridApi.query();
 }

+/** 创建满减送活动 */
 function handleCreate() {
  formModalApi.setData(null).open();
 }

+/** 编辑满减送活动 */
 function handleEdit(row: MallRewardActivityApi.RewardActivity) {
  formModalApi.setData({ id: row.id }).open();
 }

+/** 关闭满减送活动 */
 async function handleClose(row: MallRewardActivityApi.RewardActivity) {
-  const loading = ElLoading.service({
+  const loadingInstance = ElLoading.service({
    text: $t('ui.actionMessage.closing', [row.name]),
  });
  try {
-    await closeRewardActivity(row.id as number);
+    await closeRewardActivity(row.id!);
    ElMessage.success($t('ui.actionMessage.closeSuccess', [row.name]));
    handleRefresh();
  } finally {
-    loading.close();
+    loadingInstance.close();
  }
 }

@@ -55,7 +59,7 @@ async function handleDelete(row: MallRewardActivityApi.RewardActivity) {
    text: $t('ui.actionMessage.deleting', [row.name]),
  });
  try {
-    await deleteRewardActivity(row.id as number);
+    await deleteRewardActivity(row.id!);
    ElMessage.success($t('ui.actionMessage.deleteSuccess', [row.name]));
    handleRefresh();
  } finally {
@@ -97,7 +101,6 @@ const [Grid, gridApi] = useVbenVxeGrid({
 <template>
  <Page auto-content-height>
    <FormModal @success="handleRefresh" />
-
    <Grid table-title="满减送活动">
      <template #toolbar-tools>
        <TableAction
@@ -122,6 +125,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
              auth: ['promotion:reward-activity:update'],
              onClick: handleEdit.bind(null, row),
            },
+            // TODO @puhui999：下面两个按钮，type、danger 属性无效，应该是 el 不是这个哈。
            {
              label: '关闭',
              type: 'link',
--- a/apps/web-ele/src/views/mall/promotion/rewardActivity/modules/form.vue
+++ b/apps/web-ele/src/views/mall/promotion/rewardActivity/modules/form.vue
@@ -26,6 +26,7 @@ import { useFormSchema } from '../data';
 import RewardRule from './reward-rule.vue';

 const emit = defineEmits(['success']);
+
 const formData = ref<Partial<MallRewardActivityApi.RewardActivity>>({
  conditionType: PromotionConditionTypeEnum.PRICE.type,
  productScope: PromotionProductScopeEnum.ALL.scope,
@@ -56,6 +57,7 @@ const [Modal, modalApi] = useVbenModal({
      return;
    }
    modalApi.lock();
+    // 提交表单
    try {
      const values = await formApi.getValues();
      const data = { ...formData.value, ...values };
@@ -71,6 +73,7 @@ const [Modal, modalApi] = useVbenModal({
        }
      });
      switch (data.productScope) {
+        // TODO @puhui999：是不是也可以类似优惠劵的处理策略哈；
        case PromotionProductScopeEnum.CATEGORY.scope: {
          const categoryIds = data.productCategoryIds;
          data.productScopeValues = Array.isArray(categoryIds)
@@ -88,6 +91,7 @@ const [Modal, modalApi] = useVbenModal({
      await (data.id
        ? updateRewardActivity(data as MallRewardActivityApi.RewardActivity)
        : createRewardActivity(data as MallRewardActivityApi.RewardActivity));
+      // 关闭并提示
      await modalApi.close();
      emit('success');
      ElMessage.success($t('ui.actionMessage.operationSuccess'));
@@ -100,6 +104,7 @@ const [Modal, modalApi] = useVbenModal({
      formData.value = {};
      return;
    }
+    // 加载数据
    const data = modalApi.getData<MallRewardActivityApi.RewardActivity>();
    if (!data || !data.id) {
      return;
@@ -115,6 +120,7 @@ const [Modal, modalApi] = useVbenModal({
        }
      });
      formData.value = result;
+      // 设置到 values
      await formApi.setValues(result);
    } finally {
      modalApi.unlock();
@@ -126,12 +132,15 @@ const [Modal, modalApi] = useVbenModal({
 <template>
  <Modal :title="getTitle" class="w-2/3">
    <Form class="mx-6">
+      <!-- 自定义插槽：优惠规则 -->
      <template #rules>
        <RewardRule v-model="formData" />
      </template>
+      <!-- 自定义插槽：商品选择 -->
      <template #productSpuIds>
        <SpuShowcase v-model="formData.productSpuIds" />
      </template>
+      <!-- 自定义插槽：分类选择 -->
      <template #productCategoryIds>
        <ProductCategorySelect v-model="formData.productCategoryIds" multiple />
      </template>
--- a/apps/web-ele/src/views/mall/promotion/rewardActivity/modules/reward-rule-coupon-select.vue
+++ b/apps/web-ele/src/views/mall/promotion/rewardActivity/modules/reward-rule-coupon-select.vue
@@ -19,22 +19,26 @@ defineOptions({ name: 'RewardRuleCouponSelect' });
 const props = defineProps<{
  modelValue: MallRewardActivityApi.RewardRule;
 }>();
+
 const emits = defineEmits<{
  (e: 'update:modelValue', v: any): void;
 }>();

+/** 选择赠送的优惠类型拓展 */
 interface GiveCoupon extends MallCouponTemplateApi.CouponTemplate {
  giveCount?: number;
 }

 const rewardRule = useVModel(props, 'modelValue', emits);
-const list = ref<GiveCoupon[]>([]);
+const list = ref<GiveCoupon[]>([]); // 选择的优惠劵列表

+/** 选择优惠券 */
 const selectRef = ref<InstanceType<typeof CouponSelect>>();
 function handleSelect() {
  selectRef.value?.open();
 }

+/** 选择优惠券后的回调 */
 function handleChange(val: any[]) {
  for (const item of val) {
    if (list.value.some((v) => v.id === item.id)) {
@@ -44,11 +48,14 @@ function handleChange(val: any[]) {
  }
 }

+/** 删除优惠券 */
 function handleDelete(index: number) {
  list.value.splice(index, 1);
 }

+/** 初始化赠送的优惠券列表 */
 async function initGiveCouponList() {
+  // 校验优惠券存在
  if (
    !rewardRule.value ||
    !rewardRule.value.giveCouponTemplateCounts ||
@@ -71,13 +78,16 @@ async function initGiveCouponList() {
  });
 }

+/** 监听 list 变化，自动同步到 rewardRule */
 watch(
  list,
  (val) => {
    if (!rewardRule.value) {
      return;
    }
+    // 核心：清空 giveCouponTemplateCounts，解决删除不生效的问题
    rewardRule.value.giveCouponTemplateCounts = {};
+    // 设置优惠券和其数量的对应
    val.forEach((item) => {
      rewardRule.value.giveCouponTemplateCounts![item.id] = item.giveCount!;
    });
@@ -93,6 +103,7 @@ onMounted(async () => {

 <template>
  <div>
+    <!-- 已选优惠券列表 -->
    <div v-if="list.length > 0" class="mb-2 flex flex-col gap-2">
      <div
        v-for="(item, index) in list"
@@ -136,8 +147,10 @@ onMounted(async () => {
      </div>
    </div>

+    <!-- 添加按钮 -->
    <ElButton link class="!pl-0" @click="handleSelect">+ 添加优惠券</ElButton>

+    <!-- 优惠券选择弹窗 -->
    <CouponSelect
      ref="selectRef"
      :take-type="CouponTemplateTakeTypeEnum.ADMIN.type"
--- a/apps/web-ele/src/views/mall/promotion/rewardActivity/modules/reward-rule.vue
+++ b/apps/web-ele/src/views/mall/promotion/rewardActivity/modules/reward-rule.vue
@@ -25,6 +25,7 @@ defineOptions({ name: 'RewardRule' });
 const props = defineProps<{
  modelValue: Partial<MallRewardActivityApi.RewardActivity>;
 }>();
+
 const emits = defineEmits<{
  (e: 'update:modelValue', v: any): void;
 }>();
@@ -37,6 +38,7 @@ const isPriceCondition = computed(() => {
  );
 });

+/** 处理新增 */
 function handleAdd() {
  if (!formData.value.rules) {
    formData.value.rules = [];
@@ -49,19 +51,24 @@ function handleAdd() {
  });
 }

+/** 处理删除 */
 function handleDelete(ruleIndex: number) {
  formData.value.rules?.splice(ruleIndex, 1);
 }
 </script>

 <template>
+  <!-- TODO @puhui999：这里报错了；idea -->
  <ElRow :gutter="[16, 16]">
    <template v-if="formData.rules">
      <ElCol v-for="(rule, index) in formData.rules" :key="index" :span="24">
        <ElCard size="small" class="rounded-lg">
+          <!-- 规则标题 -->
          <template #header>
            <div class="flex items-center justify-between">
-              <span class="text-base font-medium">活动层级 {{ index + 1 }}</span>
+              <span class="text-base font-medium">
+                活动层级 {{ index + 1 }}
+              </span>
              <ElButton
                v-if="index !== 0"
                type="danger"
@@ -75,6 +82,7 @@ function handleDelete(ruleIndex: number) {
          </template>

          <ElForm :model="rule" label-position="left">
+            <!-- 优惠门槛 -->
            <ElFormItem label="优惠门槛:" class="mb-3">
              <div
                class="flex items-center gap-2 rounded-md bg-gray-50 px-3 py-2"
@@ -106,7 +114,9 @@ function handleDelete(ruleIndex: number) {
                <div
                  class="flex items-center gap-2 rounded-md bg-gray-50 px-3 py-2"
                >
-                  <span class="!w-21 shrink-0 text-sm text-gray-500">订单金额优惠</span>
+                  <span class="!w-21 shrink-0 text-sm text-gray-500">
+                    订单金额优惠
+                  </span>
                  <span>减</span>
                  <ElInputNumber
                    v-model="rule.discountPrice"
@@ -118,7 +128,7 @@ function handleDelete(ruleIndex: number) {
                  />
                  <span>元</span>
                </div>
-
+                <!-- 包邮 -->
                <div
                  class="flex items-center gap-2 rounded-md bg-gray-50 px-3 py-2"
                >
@@ -129,7 +139,9 @@ function handleDelete(ruleIndex: number) {
                <div
                  class="flex items-center gap-2 rounded-md bg-gray-50 px-3 py-2"
                >
-                  <span class="w-20 shrink-0 text-sm text-gray-500">送积分</span>
+                  <span class="w-20 shrink-0 text-sm text-gray-500">
+                    送积分
+                  </span>
                  <span>送</span>
                  <ElInputNumber
                    v-model="rule.point"
@@ -140,11 +152,13 @@ function handleDelete(ruleIndex: number) {
                  />
                  <span>积分</span>
                </div>
-
+                <!-- 送优惠券 -->
                <div
                  class="flex flex-col items-start gap-2 rounded-md bg-gray-50 px-3 py-2"
                >
-                  <span class="w-20 shrink-0 text-sm text-gray-500">送优惠券</span>
+                  <span class="w-20 shrink-0 text-sm text-gray-500">
+                    送优惠券
+                  </span>
                  <RewardRuleCouponSelect
                    :model-value="rule"
                    @update:model-value="
@@ -159,10 +173,12 @@ function handleDelete(ruleIndex: number) {
      </ElCol>
    </template>

-    <ElCol :span="24" class="mt-2">
-      <ElButton type="primary" @click="handleAdd">+ 添加优惠规则</ElButton>
-    </ElCol>
+    <!-- 添加规则按钮 -->
+    <Col :span="24" class="mt-2">
+      <Button type="primary" @click="handleAdd">+ 添加优惠规则</Button>
+    </Col>

+    <!-- 提示信息 -->
    <ElCol :span="24" class="mt-2">
      <ElTag type="warning">
        提示：赠送积分为 0 时不赠送；未选择优惠券时不赠送。
--- a/apps/web-ele/src/views/mall/promotion/seckill/activity/data.ts
+++ b/apps/web-ele/src/views/mall/promotion/seckill/activity/data.ts
@@ -7,6 +7,31 @@ import { getDictOptions } from '@vben/hooks';
 import { z } from '#/adapter/form';
 import { getSimpleSeckillConfigList } from '#/api/mall/promotion/seckill/seckillConfig';

+/** 列表的搜索表单 */
+export function useGridFormSchema(): VbenFormSchema[] {
+  return [
+    {
+      fieldName: 'name',
+      label: '活动名称',
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入活动名称',
+        clearable: true,
+      },
+    },
+    {
+      fieldName: 'status',
+      label: '活动状态',
+      component: 'Select',
+      componentProps: {
+        placeholder: '请选择活动状态',
+        clearable: true,
+        options: getDictOptions(DICT_TYPE.COMMON_STATUS, 'number'),
+      },
+    },
+  ];
+}
+
 /** 新增/编辑的表单 */
 export function useFormSchema(): VbenFormSchema[] {
  return [
@@ -115,31 +140,6 @@ export function useFormSchema(): VbenFormSchema[] {
  ];
 }

-/** 列表的搜索表单 */
-export function useGridFormSchema(): VbenFormSchema[] {
-  return [
-    {
-      fieldName: 'name',
-      label: '活动名称',
-      component: 'Input',
-      componentProps: {
-        placeholder: '请输入活动名称',
-        clearable: true,
-      },
-    },
-    {
-      fieldName: 'status',
-      label: '活动状态',
-      component: 'Select',
-      componentProps: {
-        placeholder: '请选择活动状态',
-        clearable: true,
-        options: getDictOptions(DICT_TYPE.COMMON_STATUS, 'number'),
-      },
-    },
-  ];
-}
-
 /** 列表的字段 */
 export function useGridColumns(): VxeTableGridOptions['columns'] {
  return [
--- a/apps/web-ele/src/views/mall/promotion/seckill/activity/formatter.ts
+++ b/apps/web-ele/src/views/mall/promotion/seckill/activity/formatter.ts
@@ -9,7 +9,7 @@ export function setConfigList(list: any[]) {
 }

 /** 格式化配置名称 */
-export function formatConfigNames(configId: number): string {
+export function formatConfigNames(configId: number | string): string {
  const config = configList.find((item) => item.id === configId);
  return config === null || config === undefined
    ? ''
@@ -27,8 +27,11 @@ export function formatSeckillPrice(products: any[]): string {

 /** 格式化活动时间范围 */
 export function formatTimeRange(
-  startTime: Date | string,
-  endTime: Date | string,
+  startTime: Date | string | undefined,
+  endTime: Date | string | undefined,
 ): string {
-  return `${formatDate(startTime, 'YYYY-MM-DD')} ~ ${formatDate(endTime, 'YYYY-MM-DD')}`;
+  if (startTime && endTime) {
+    return `${formatDate(startTime, 'YYYY-MM-DD')} ~ ${formatDate(endTime, 'YYYY-MM-DD')}`;
+  }
+  return '';
 }
--- a/apps/web-ele/src/views/mall/promotion/seckill/activity/index.vue
+++ b/apps/web-ele/src/views/mall/promotion/seckill/activity/index.vue
@@ -84,6 +84,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
        },
      },
    },
+    // TODO @puhui999：antd 没有，是不是要统一哈。
    cellConfig: {
      height: 250,
    },
@@ -164,6 +165,7 @@ onMounted(async () => {
              link: true,
              auth: ['promotion:seckill-activity:close'],
              ifShow: row.status === 0,
+              // TODO @puhui999：antd 这里是 popConfirm，看看要不要统一
              onClick: handleClose.bind(null, row),
            },
            {
--- a/apps/web-ele/src/views/mall/promotion/seckill/activity/modules/form.vue
+++ b/apps/web-ele/src/views/mall/promotion/seckill/activity/modules/form.vue
@@ -27,15 +27,19 @@ const getTitle = computed(() => {
    : $t('ui.actionTitle.create', ['秒杀活动']);
 });

+// ================= 商品选择相关 =================
 const spuId = ref<number>();
 const spuName = ref<string>('');
 const skuTableData = ref<any[]>([]);
-const spuSkuSelectRef = ref();

+const spuSkuSelectRef = ref(); // 商品选择弹窗 Ref
+
+/** 打开商品选择弹窗 */
 const handleSelectProduct = () => {
  spuSkuSelectRef.value?.open();
 };

+/** 选择商品后的回调 */
 async function handleSpuSelected(selectedSpuId: number, skuIds?: number[]) {
  const spu = await getSpu(selectedSpuId);
  if (!spu) return;
@@ -43,6 +47,7 @@ async function handleSpuSelected(selectedSpuId: number, skuIds?: number[]) {
  spuId.value = spu.id;
  spuName.value = spu.name || '';

+  // 筛选指定的 SKU
  const selectedSkus = skuIds
    ? spu.skus?.filter((sku) => skuIds.includes(sku.id!))
    : spu.skus;
@@ -58,6 +63,8 @@ async function handleSpuSelected(selectedSpuId: number, skuIds?: number[]) {
    })) || [];
 }

+// ================= end =================
+
 const [Form, formApi] = useVbenForm({
  commonConfig: {
    componentProps: {
@@ -77,6 +84,7 @@ const [Modal, modalApi] = useVbenModal({
      return;
    }

+    // 验证商品和 SKU 配置
    if (!spuId.value) {
      ElMessage.error('请选择秒杀商品');
      return;
@@ -85,6 +93,7 @@ const [Modal, modalApi] = useVbenModal({
      ElMessage.error('请至少配置一个 SKU');
      return;
    }
+    // 验证 SKU 配置
    const hasInvalidSku = skuTableData.value.some(
      (sku) => sku.stock < 1 || sku.seckillPrice < 0.01,
    );
@@ -93,6 +102,7 @@ const [Modal, modalApi] = useVbenModal({
      return;
    }

+    // 提交表单
    modalApi.lock();
    try {
      const values = await formApi.getValues();
@@ -102,12 +112,13 @@ const [Modal, modalApi] = useVbenModal({
        products: skuTableData.value.map((sku) => ({
          skuId: sku.skuId,
          stock: sku.stock,
-          seckillPrice: Math.round(sku.seckillPrice * 100),
+          seckillPrice: Math.round(sku.seckillPrice * 100), // 转换为分
        })),
      };
      await (formData.value?.id
        ? updateSeckillActivity(data)
        : createSeckillActivity(data));
+      // 关闭并提示
      await modalApi.close();
      emit('success');
      ElMessage.success($t('ui.actionMessage.operationSuccess'));
@@ -123,6 +134,8 @@ const [Modal, modalApi] = useVbenModal({
      skuTableData.value = [];
      return;
    }
+
+    // 加载数据
    const data = modalApi.getData<MallSeckillActivityApi.SeckillActivity>();
    if (!data || !data.id) {
      return;
@@ -130,12 +143,16 @@ const [Modal, modalApi] = useVbenModal({
    modalApi.lock();
    try {
      formData.value = await getSeckillActivity(data.id);
+      // TODO @puhui999：这里需要 nextTick 么？因为 antd 有
      await formApi.setValues(formData.value);
+      // 加载商品和 SKU 信息
+      // TODO @puhui999：if return 简化括号层级
      if (formData.value.spuId) {
        const spu = await getSpu(formData.value.spuId);
        if (spu) {
          spuId.value = spu.id;
          spuName.value = spu.name || '';
+          // 回填 SKU 配置
          const products = formData.value.products || [];
          skuTableData.value =
            spu.skus
@@ -148,7 +165,7 @@ const [Modal, modalApi] = useVbenModal({
                  picUrl: sku.picUrl || spu.picUrl || '',
                  price: sku.price || 0,
                  stock: product?.stock || 0,
-                  seckillPrice: (product?.seckillPrice || 0) / 100,
+                  seckillPrice: (product?.seckillPrice || 0) / 100, // 分转元
                };
              }) || [];
        }
@@ -164,9 +181,12 @@ const [Modal, modalApi] = useVbenModal({
  <Modal class="w-4/5" :title="getTitle">
    <div class="mx-4">
      <Form />
+
+      <!-- 商品选择区域 -->
      <div class="mt-4">
        <div class="mb-2 flex items-center">
          <span class="text-sm font-medium">秒杀活动商品:</span>
+          <!-- TODO @puhui999：使用 ElButton 这种哈 -->
          <el-button class="ml-2" type="primary" @click="handleSelectProduct">
            选择商品
          </el-button>
@@ -174,7 +194,10 @@ const [Modal, modalApi] = useVbenModal({
            已选择: {{ spuName }}
          </span>
        </div>
+
+        <!-- SKU 配置表格 -->
        <div v-if="skuTableData.length > 0" class="mt-4">
+          <!-- TODO @puhui999：Grid？或者 VXETable 哇？ -->
          <table class="w-full border-collapse border border-gray-300">
            <thead>
              <tr class="bg-gray-100">
@@ -225,6 +248,8 @@ const [Modal, modalApi] = useVbenModal({
      </div>
    </div>
  </Modal>
+
+  <!-- 商品选择器弹窗 -->
  <SpuSkuSelect
    ref="spuSkuSelectRef"
    :is-select-sku="true"
--- a/apps/web-ele/src/views/mall/promotion/seckill/components/showcase.vue
+++ b/apps/web-ele/src/views/mall/promotion/seckill/components/showcase.vue
@@ -110,7 +110,6 @@ function emitActivityChange() {
    >
      <ElTooltip :content="activity.name">
        <div class="relative h-full w-full">
-          <!-- TODO @芋艿 -->
          <ElImage
            :src="activity.picUrl"
            class="h-full w-full rounded-lg object-cover"
--- a/apps/web-ele/src/views/mp/material/index.vue
+++ b/apps/web-ele/src/views/mp/material/index.vue
@@ -101,7 +101,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
 // 当 tab 切换时，更新 Grid 的 columns 和 rowConfig
 async function onTabChange() {
  const columns = getColumnsByType();
-  await gridApi.setGridOptions({
+  gridApi.setGridOptions({
    columns,
    rowConfig: {
      keyField: 'id',
@@ -115,7 +115,7 @@ async function onTabChange() {
 async function handleAccountChange(id: number) {
  accountId.value = id;
  // 同步设置表单值
-  gridApi.formApi.setValues({ accountId: id });
+  await gridApi.formApi.setValues({ accountId: id });
  await gridApi.formApi.submitForm();
 }

@@ -133,7 +133,7 @@ async function handleDelete(id: number) {
  try {
    await deletePermanentMaterial(id);
    ElMessage.success('删除成功');
-    handleRefresh();
+    await handleRefresh();
  } finally {
    loadingInstance.close();
  }
@@ -211,7 +211,7 @@ async function handleDelete(id: number) {
        </ElButton>
      </template>

-      <!-- 图片列的slot -->
+      <!-- 图片列的 slot -->
      <template #image="{ row }">
        <div class="flex items-center justify-center" style="height: 192px">
          <img
@@ -222,12 +222,12 @@ async function handleDelete(id: number) {
        </div>
      </template>

-      <!-- 语音列的slot -->
+      <!-- 语音列的 slot -->
      <template #voice="{ row }">
        <audio :src="row.url" controls style="width: 160px"></audio>
      </template>

-      <!-- 视频列的slot -->
+      <!-- 视频列的 slot -->
      <template #video="{ row }">
        <video
          :src="row.url"
@@ -236,16 +236,17 @@ async function handleDelete(id: number) {
        ></video>
      </template>

-      <!-- 操作列的slot -->
+      <!-- 操作列的 slot -->
      <template #actions="{ row }">
        <TableAction
          :actions="[
            {
-              label: '删除',
-              icon: ACTION_ICON.delete,
-              color: 'danger',
+              label: $t('common.delete'),
+              type: 'danger',
+              link: true,
+              icon: ACTION_ICON.DELETE,
              auth: ['mp:material:delete'],
-              onClick: () => handleDelete(row.id),
+              onClick: () => handleDelete(row.id!),
            },
          ]"
        />