review：【antd】【mall】商品发布相关

apps/web-antd/src/api/mall/promotion/reward/rewardActivity.ts

@@ -18,6 +18,7 @@ export namespace MallRewardActivityApi {
   export interface RewardActivity {
     id?: number; // 活动编号
     name?: string; // 活动名称
+    status?: number; // 活动状态
     startTime?: Date; // 开始时间
     endTime?: Date; // 结束时间
     startAndEndTime?: Date[]; // 开始和结束时间（仅前端使用）

apps/web-antd/src/views/mall/product/spu/components/sku-table-select.vue

@@ -8,8 +8,6 @@ import { computed, ref } from 'vue';
 import { useVbenModal } from '@vben/common-ui';
 import { fenToYuan } from '@vben/utils';
 
-import { message } from 'ant-design-vue';
-
 import { useVbenVxeGrid } from '#/adapter/vxe-table';
 import { getSpu } from '#/api/mall/product/spu';
 
@@ -61,6 +59,7 @@ const gridColumns = computed<VxeGridProps['columns']>(() => [
   },
 ]);
 
+// TODO @芋艿：要不要直接非 pager？
 const [Grid, gridApi] = useVbenVxeGrid({
   gridOptions: {
     columns: gridColumns.value,
@@ -76,17 +75,11 @@ const [Grid, gridApi] = useVbenVxeGrid({
           if (!spuId.value) {
             return { items: [], total: 0 };
           }
-          try {
+          const spu = await getSpu(spuId.value);
-            const spu = await getSpu(spuId.value);
+          return {
-            return {
+            items: spu.skus || [],
-              items: spu.skus || [],
+            total: spu.skus?.length || 0,
-              total: spu.skus?.length || 0,
+          };
-            };
-          } catch (error) {
-            message.error('加载 SKU 数据失败');
-            console.error(error);
-            return { items: [], total: 0 };
-          }
         },
       },
     },
@@ -113,12 +106,10 @@ const [Modal, modalApi] = useVbenModal({
       spuId.value = undefined;
       return;
     }
-
     const data = modalApi.getData<SpuData>();
     if (!data?.spuId) {
       return;
     }
-
     spuId.value = data.spuId;
     await gridApi.query();
   },

apps/web-antd/src/views/mall/product/spu/components/spu-showcase.vue

@@ -28,17 +28,19 @@ const emit = defineEmits(['update:modelValue', 'change']);
 
 const productSpus = ref<MallSpuApi.Spu[]>([]);
 const spuTableSelectRef = ref<InstanceType<typeof SpuTableSelect>>();
+const isMultiple = computed(() => props.limit !== 1); // 是否为多选模式
 
 /** 计算是否可以添加 */
 const canAdd = computed(() => {
-  if (props.disabled) return false;
+  if (props.disabled) {
-  if (!props.limit) return true;
+    return false;
+  }
+  if (!props.limit) {
+    return true;
+  }
   return productSpus.value.length < props.limit;
 });
 
-/** 是否为多选模式 */
-const isMultiple = computed(() => props.limit !== 1);
-
 /** 监听 modelValue 变化，加载商品详情 */
 watch(
   () => props.modelValue,

apps/web-antd/src/views/mall/product/spu/components/spu-table-select.vue

@@ -26,6 +26,7 @@ const emit = defineEmits<{
   change: [spu: MallSpuApi.Spu | MallSpuApi.Spu[]];
 }>();
 
+// TODO @芋艿：要不要加类型；
 const categoryList = ref<any[]>([]);
 const categoryTreeList = ref<any[]>([]);
 
@@ -71,13 +72,11 @@ const formSchema = computed<VbenFormSchema[]>(() => [
 /** 表格列配置 */
 const gridColumns = computed<VxeGridProps['columns']>(() => {
   const columns: VxeGridProps['columns'] = [];
-
   if (props.multiple) {
     columns.push({ type: 'checkbox', width: 55 });
   } else {
     columns.push({ type: 'radio', width: 55 });
   }
-
   columns.push(
     {
       field: 'id',
@@ -109,7 +108,6 @@ const gridColumns = computed<VxeGridProps['columns']>(() => {
       },
     },
   );
-
   return columns;
 });
 
@@ -129,14 +127,15 @@ const [Grid, gridApi] = useVbenVxeGrid({
           reserve: true,
         }
       : undefined,
-    radioConfig: !props.multiple
+    radioConfig: props.multiple
-      ? {
+      ? undefined
+      : {
           reserve: true,
-        }
+        },
-      : undefined,
     proxyConfig: {
       ajax: {
         async query({ page }: any, formValues: any) {
+          // TODO @芋艿：怎么简化下。
           const data = await getSpuPage({
             pageNo: page.currentPage,
             pageSize: page.pageSize,
@@ -145,7 +144,6 @@ const [Grid, gridApi] = useVbenVxeGrid({
             categoryId: formValues.categoryId || undefined,
             createTime: formValues.createTime || undefined,
           });
-
           return {
             items: data.list || [],
             total: data.total || 0,
@@ -165,6 +163,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
 });
 
 /** 多选：处理选中变化 */
+// TODO @芋艿：要不要清理掉？
 function handleCheckboxChange() {
   // vxe-table 自动管理选中状态，无需手动处理
 }
@@ -180,13 +179,16 @@ function handleRadioChange() {
 
 const [Modal, modalApi] = useVbenModal({
   destroyOnClose: true,
+  // TODO @芋艿：看看怎么简化
   onConfirm: props.multiple
     ? () => {
-        const selectedRows = gridApi.grid.getCheckboxRecords() as MallSpuApi.Spu[];
+        const selectedRows =
+          gridApi.grid.getCheckboxRecords() as MallSpuApi.Spu[];
         emit('change', selectedRows);
         modalApi.close();
       }
     : undefined,
+  // TODO @芋艿：看看怎么简化？
   async onOpenChange(isOpen: boolean) {
     if (!isOpen) {
       gridApi.grid.clearCheckboxRow();

apps/web-antd/src/views/mall/product/spu/form/data.ts

@@ -102,6 +102,7 @@ export function useInfoFormSchema(): VbenFormSchema[] {
 }
 
 /** 价格库存的表单 */
+// TODO @puhui999：貌似太宽了。。。屏幕小的，整个 table 展示补全哈~~
 export function useSkuFormSchema(
   propertyList: any[] = [],
   isDetail: boolean = false,

apps/web-antd/src/views/mall/product/spu/form/modules/sku-list.vue

@@ -212,7 +212,9 @@ function build(
     const result: MallSpuApi.Property[][] = [];
     const rest = build(propertyValuesList.slice(1));
     const firstList = propertyValuesList[0];
-    if (!firstList) return [];
+    if (!firstList) {
+      return [];
+    }
 
     for (const element of firstList) {
       for (const element_ of rest) {
@@ -289,8 +291,6 @@ defineExpose({
 <template>
   <div>
     <!-- 情况一：添加/修改 -->
-    <!-- TODO @puhui999：有可以通过 grid 来做么？主要考虑，这样不直接使用 vxe 标签，抽象程度更高； -->
-    <!-- TODO 还是先这样吧 🤣🤣   -->
     <VxeTable
       v-if="!isDetail && !isActivityComponent"
       :data="isBatch ? skuList : formData?.skus || []"

apps/web-antd/src/views/mall/promotion/coupon/components/coupon-select.vue

@@ -37,6 +37,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
     keepSource: true,
     proxyConfig: {
       ajax: {
+        // TODO @芋艿：要不要 ele 和 antd 统一下；
         query: async ({ page }, formValues) => {
           const params: any = {
             pageNo: page.currentPage,

apps/web-antd/src/views/mall/promotion/rewardActivity/data.ts

@@ -102,7 +102,6 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
 /** 新增/修改的表单 */
 export function useFormSchema(): VbenFormSchema[] {
   return [
-    // 隐藏 ID 字段
     {
       fieldName: 'id',
       component: 'Input',
@@ -111,7 +110,6 @@ export function useFormSchema(): VbenFormSchema[] {
         show: () => false,
       },
     },
-    // 活动名称
     {
       fieldName: 'name',
       label: '活动名称',
@@ -122,7 +120,6 @@ export function useFormSchema(): VbenFormSchema[] {
         allowClear: true,
       },
     },
-    // 活动时间
     {
       fieldName: 'startAndEndTime',
       label: '活动时间',
@@ -135,7 +132,6 @@ export function useFormSchema(): VbenFormSchema[] {
         allowClear: true,
       },
     },
-    // 条件类型
     {
       fieldName: 'conditionType',
       label: '条件类型',
@@ -147,7 +143,6 @@ export function useFormSchema(): VbenFormSchema[] {
       },
       rules: z.number().default(PromotionConditionTypeEnum.PRICE.type),
     },
-    // 活动范围
     {
       fieldName: 'productScope',
       label: '活动范围',
@@ -159,7 +154,6 @@ export function useFormSchema(): VbenFormSchema[] {
       },
       rules: z.number().default(PromotionProductScopeEnum.ALL.scope),
     },
-    // 备注
     {
       fieldName: 'remark',
       label: '备注',
@@ -170,14 +164,12 @@ export function useFormSchema(): VbenFormSchema[] {
         allowClear: true,
       },
     },
-    // 优惠规则（自定义组件插槽）
     {
       fieldName: 'rules',
       label: '优惠设置',
       component: 'Input',
       formItemClass: 'items-start',
     },
-    // 商品范围选择（自定义组件插槽）
     {
       fieldName: 'productSpuIds',
       label: '选择商品',

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

@@ -3,6 +3,7 @@ import type { VxeTableGridOptions } from '#/adapter/vxe-table';
 import type { MallRewardActivityApi } from '#/api/mall/promotion/reward/rewardActivity';
 
 import { Page, useVbenModal } from '@vben/common-ui';
+import { CommonStatusEnum } from '@vben/constants';
 
 import { message } from 'ant-design-vue';
 
@@ -41,6 +42,7 @@ function handleEdit(row: MallRewardActivityApi.RewardActivity) {
 
 /** 关闭满减送活动 */
 async function handleClose(row: MallRewardActivityApi.RewardActivity) {
+  // TODO @puhui999：这个国际化，需要加下哈；closing、closeSuccess；
   const hideLoading = message.loading({
     content: $t('ui.actionMessage.closing', [row.name]),
     duration: 0,
@@ -104,7 +106,6 @@ const [Grid, gridApi] = useVbenVxeGrid({
   <Page auto-content-height>
     <FormModal @success="handleRefresh" />
     <Grid table-title="满减送活动">
-      <!-- 工具栏按钮 -->
       <template #toolbar-tools>
         <TableAction
           :actions="[
@@ -118,8 +119,6 @@ const [Grid, gridApi] = useVbenVxeGrid({
           ]"
         />
       </template>
-
-      <!-- 行操作按钮 -->
       <template #actions="{ row }">
         <TableAction
           :actions="[
@@ -136,7 +135,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
               danger: true,
               icon: ACTION_ICON.CLOSE,
               auth: ['promotion:reward-activity:close'],
-              ifShow: row.status === 0,
+              ifShow: row.status === CommonStatusEnum.ENABLE,
               popConfirm: {
                 title: '确认关闭该满减送活动吗？',
                 confirm: handleClose.bind(null, row),

apps/web-antd/src/views/mall/promotion/rewardActivity/modules/form.vue

@@ -1,5 +1,4 @@
 <script lang="ts" setup>
-import type { VbenFormProps } from '#/adapter/form';
 import type { MallRewardActivityApi } from '#/api/mall/promotion/reward/rewardActivity';
 
 import { computed, nextTick, ref } from 'vue';
@@ -45,7 +44,7 @@ const [Form, formApi] = useVbenForm({
       class: 'w-full',
     },
     labelWidth: 100,
-  } as VbenFormProps['commonConfig'],
+  },
   layout: 'horizontal',
   schema: useFormSchema(),
   showDefaultActions: false,
@@ -53,6 +52,7 @@ const [Form, formApi] = useVbenForm({
 
 const rewardRuleRef = ref<InstanceType<typeof RewardRule>>();
 
+// TODO @芋艿：这里需要在简化下；
 const [Modal, modalApi] = useVbenModal({
   async onConfirm() {
     const { valid } = await formApi.validate();

apps/web-antd/src/views/mall/promotion/seckill/activity/data.ts

@@ -35,7 +35,6 @@ export function useGridFormSchema(): VbenFormSchema[] {
 /** 新增/编辑的表单 */
 export function useFormSchema(): VbenFormSchema[] {
   return [
-    // 隐藏的 ID 字段
     {
       component: 'Input',
       fieldName: 'id',