fix: mall SeckillActivity

Author: puhui999

src/api/mall/product/spu.ts

@@ -86,6 +86,11 @@ export const getSpu = (id: number) => {
   return request.get({ url: `/product/spu/get-detail?id=${id}` })
 }
 
+// 获得商品 Spu 详情列表
+export const getSpuDetailList = (ids: number[]) => {
+  return request.get({ url: `/product/spu/list?spuIds=${ids}` })
+}
+
 // 删除商品 Spu
 export const deleteSpu = (id: number) => {
   return request.delete({ url: `/product/spu/delete?id=${id}` })

src/views/mall/promotion/components/SpuAndSkuList.vue

@@ -47,17 +47,14 @@
   </el-table>
 </template>
 <script generic="T extends Spu" lang="ts" setup>
-// TODO 后续计划重新封装作为活动商品配置通用组件；可以等其他活动做到的时候，在统一处理 SPU 选择组件哈
 import { formatToFraction } from '@/utils'
 import { createImageViewer } from '@/components/ImageViewer'
 import { Spu } from '@/api/mall/product/spu'
 import { RuleConfig, SkuList } from '@/views/mall/product/spu/components'
-import { SeckillProductVO } from '@/api/mall/promotion/seckill/seckillActivity'
 import { SpuProperty } from '@/views/mall/promotion/components/index'
 
 defineOptions({ name: 'PromotionSpuAndSkuList' })
 
-// TODO @puhui999：是不是改成传递一个 spu 就好啦？ 因为活动商品可以多选所以展示编辑的时候需要展示多个
 const props = defineProps<{
   spuList: T[]
   ruleConfig: RuleConfig[]
@@ -70,12 +67,12 @@ const skuListRef = ref() // 商品属性列表Ref
 const spuPropertyList = ref<SpuProperty<T>[]>([]) // spuId 对应的 sku 的属性列表
 
 /**
- * 获取所有 sku 秒杀配置
+ * 获取所有 sku 活动配置
  * @param extendedAttribute 在 sku 上扩展的属性，例：秒杀活动 sku 扩展属性 productConfig 请参考 seckillActivity.ts
  */
-const getSkuConfigs: <V>(extendedAttribute: string) => V[] = (extendedAttribute: string) => {
+const getSkuConfigs = (extendedAttribute: string) => {
   skuListRef.value.validateSku()
-  const seckillProducts: SeckillProductVO[] = []
+  const seckillProducts = []
   spuPropertyList.value.forEach((item) => {
     item.spuDetail.skus.forEach((sku) => {
       seckillProducts.push(sku[extendedAttribute])

src/views/mall/promotion/seckill/activity/SeckillActivityForm.vue

@@ -30,8 +30,8 @@ import { SpuAndSkuList, SpuProperty, SpuSelect } from '../../components'
 import { allSchemas, rules } from './seckillActivity.data'
 
 import * as SeckillActivityApi from '@/api/mall/promotion/seckill/seckillActivity'
-import { getPropertyList, RuleConfig } from '@/views/mall/product/spu/components'
 import * as ProductSpuApi from '@/api/mall/product/spu'
+import { getPropertyList, RuleConfig } from '@/views/mall/product/spu/components'
 
 defineOptions({ name: 'PromotionSeckillActivityForm' })
 
@@ -62,7 +62,7 @@ const open = async (type: string, id?: number) => {
   dialogVisible.value = true
   dialogTitle.value = t('action.' + type)
   formType.value = type
-  resetForm()
+  await resetForm()
   // 修改时，设置数据 TODO 没测试估计有问题
   if (id) {
     formLoading.value = true
@@ -89,34 +89,30 @@ const selectSpu = (spuIds: number[]) => {
  */
 const getSpuDetails = async (spuIds: number[]) => {
   const spuProperties: SpuProperty<SeckillActivityApi.SpuExtension>[] = []
+  const res = (await ProductSpuApi.getSpuDetailList(spuIds)) as SeckillActivityApi.SpuExtension[]
   spuList.value = []
-  // TODO puhui999: 考虑后端添加通过 spuIds 批量获取
-  for (const spuId of spuIds) {
-    // 获取 SPU 详情
-    const res = (await ProductSpuApi.getSpu(spuId)) as SeckillActivityApi.SpuExtension
-    if (!res) {
-      continue
-    }
-    spuList.value.push(res)
+  res?.forEach((spu) => {
     // 初始化每个 sku 秒杀配置
-    res.skus?.forEach((sku) => {
+    spu.skus?.forEach((sku) => {
       const config: SeckillActivityApi.SeckillProductVO = {
-        spuId,
+        spuId: spu.id!,
         skuId: sku.id!,
         stock: 0,
         seckillPrice: 0
       }
       sku.productConfig = config
     })
-    spuProperties.push({ spuId, spuDetail: res, propertyList: getPropertyList(res) })
-  }
+    spuProperties.push({ spuId: spu.id!, spuDetail: spu, propertyList: getPropertyList(spu) })
+  })
+  spuList.value.push(...res)
   spuPropertyList.value = spuProperties
 }
 
 /** 重置表单 */
-const resetForm = () => {
+const resetForm = async () => {
   spuList.value = []
   spuPropertyList.value = []
+  await nextTick()
   formRef.value.getElFormRef().resetFields()
 }
 /** 提交表单 */