【代码优化】商城：拼团装修重构

src/api/mall/promotion/combination/combinationActivity.ts

@@ -17,9 +17,6 @@ export interface CombinationActivityVO {
   status?: number
   limitDuration?: number
   products: CombinationProductVO[]
-  spuName?: string
-  picUrl?: string
-  marketPrice?: number
 }
 
 // 拼团活动所需属性
@@ -39,7 +36,7 @@ export interface SpuExtension extends Spu {
 }
 
 // 查询拼团活动列表
-export const getCombinationActivityPage = async (params) => {
+export const getCombinationActivityPage = async (params: any) => {
   return await request.get({ url: '/promotion/combination-activity/page', params })
 }
 
@@ -48,8 +45,8 @@ export const getCombinationActivity = async (id: number) => {
   return await request.get({ url: '/promotion/combination-activity/get?id=' + id })
 }
 
-// 查询拼团活动详情列表
+// 获得拼团活动列表，基于活动编号数组
-export const getCombinationActivityDetailList = (ids: number[]) => {
+export const getCombinationActivityListByIds = (ids: number[]) => {
   return request.get({ url: `/promotion/combination-activity/list-by-ids?ids=${ids}` })
 }
 

src/components/DiyEditor/components/mobile/PromotionCombination/index.vue

@@ -136,30 +136,20 @@ watch(
       // 新添加的拼团组件，是没有活动ID的
       const activityIds = props.property.activityIds
       // 检查活动ID的有效性
-      if (
+      if (Array.isArray(activityIds) && activityIds.length > 0) {
-        Array.isArray(activityIds) &&
-        activityIds.length > 0 &&
-        activityIds.every((item) => item != null)
-      ) {
         // 获取拼团活动详情列表
         combinationActivityList.value =
-          await CombinationActivityApi.getCombinationActivityDetailList(activityIds)
+          await CombinationActivityApi.getCombinationActivityListByIds(activityIds)
 
-        // 清空之前的数据，防止有重复
+        // 获取拼团活动的 SPU 详情列表
-        spuIdList.value = []
         spuList.value = []
-
-        // 生成有效的 spuId 列表
         spuIdList.value = combinationActivityList.value
           .map((activity) => activity.spuId)
           .filter((spuId): spuId is number => typeof spuId === 'number')
-
-        // 如果存在有效的 spuId，调用 API 获取详细信息
         if (spuIdList.value.length > 0) {
           spuList.value = await ProductSpuApi.getSpuDetailList(spuIdList.value)
-        } else {
-          console.warn('没有用于获取详细信息的有效 spuId。')
         }
+
         // 更新 SPU 的最低价格
         combinationActivityList.value.forEach((activity) => {
           activity.products.forEach((product) => {

src/components/DiyEditor/components/mobile/PromotionCombination/property.vue

@@ -158,7 +158,6 @@ onMounted(async () => {
     status: CommonStatusEnum.ENABLE
   })
   activityList.value = list
-  console.log('formDa', props)
 })
 </script>
 

src/components/DiyEditor/index.vue

@@ -151,13 +151,8 @@
             class="m-[calc(0px-var(--el-card-padding))]"
             view-class="p-[var(--el-card-padding)] p-b-[calc(var(--el-card-padding)+var(--el-card-padding))] property"
           >
-            <!--这里的 key 使用时间戳是为了保证每次点击组件都进行刷新-->
             <component
-              :key="
+              :key="selectedComponent?.uid || selectedComponent?.id"
-                selectedComponent?.uid ||
-                selectedComponent?.id + new Date().getTime() ||
-                new Date().getTime().toString()
-              "
               :is="selectedComponent?.id + 'Property'"
               v-model="selectedComponent.property"
             />

src/views/mall/product/spu/components/SpuShowcase.vue

@@ -85,6 +85,7 @@ const openSpuTableSelect = () => {
 
 /**
  * 选择商品后触发
+ *
  * @param spus 选中的商品列表
  */
 const handleSpuSelected = (spus: ProductSpuApi.Spu | ProductSpuApi.Spu[]) => {
@@ -94,6 +95,7 @@ const handleSpuSelected = (spus: ProductSpuApi.Spu | ProductSpuApi.Spu[]) => {
 
 /**
  * 删除商品
+ *
  * @param index 商品索引
  */
 const handleRemoveSpu = (index: number) => {

src/views/mall/promotion/combination/components/CombinationShowcase.vue

@@ -81,7 +81,7 @@ watch(
       Activitys.value.length === 0 ||
       Activitys.value.some((combinationActivity) => !ids.includes(combinationActivity.id!))
     ) {
-      Activitys.value = await CombinationActivityApi.getCombinationActivityDetailList(ids)
+      Activitys.value = await CombinationActivityApi.getCombinationActivityListByIds(ids)
     }
   },
   { immediate: true }