✨ 商品详情：接入营销活动 API

pages/goods/components/detail/detail-activity-tip.vue

@@ -1,52 +1,57 @@
 <template>
   <su-fixed bottom placeholder :val="44">
     <view>
-      <view v-for="activity in data.activities" :key="activity.id">
+      <view v-for="activity in props.activityList" :key="activity.id">
+        <!-- TODO 芋艿：拼团 -->
         <view
           class="activity-box ss-p-x-38 ss-flex ss-row-between ss-col-center"
-          :class="activity.type == 'seckill' ? 'seckill-box' : 'groupon-box'"
+          :class="activity.type === 1 ? 'seckill-box' : 'groupon-box'"
         >
           <view class="activity-title ss-flex">
             <view class="ss-m-r-16">
               <image
+                v-if="activity.type === 1"
                 :src="sheep.$url.static('/static/img/shop/goods/seckill-icon.png')"
-                v-if="activity.type == 'seckill'"
                 class="activity-icon"
-              ></image>
+              />
+              <!-- TODO 芋艿：拼团 -->
               <image
+                v-else-if="activity.type === 3"
                 :src="sheep.$url.static('/static/img/shop/goods/groupon-icon.png')"
                 class="activity-icon"
-                v-else
-              ></image>
+              />
             </view>
-            <view>该商品正在参与{{ activity.type_text }}活动</view>
+            <view>该商品正在参与{{ activity.name }}活动</view>
           </view>
           <button class="ss-reset-button activity-go" @tap="onActivity(activity)"> GO </button>
         </view>
-        <!-- <button @tap="onActivity(activity)">{{ activity.title }} {{ activity.type_text }}</button> -->
       </view>
     </view>
   </su-fixed>
 </template>
 
 <script setup>
-  import { ref, reactive } from 'vue';
   import sheep from '@/sheep';
 
+  // TODO 芋艿：这里要迁移下；
   const seckillBg = sheep.$url.css('/static/img/shop/goods/seckill-tip-bg.png');
   const grouponBg = sheep.$url.css('/static/img/shop/goods/groupon-tip-bg.png');
 
   const props = defineProps({
-    data: {
-      type: Object,
-      default() {},
-    },
+    activityList: {
+      type: Array,
+      default() {
+        return [];
+      }
+    }
   });
+
   function onActivity(activity) {
-    let type = activity.type;
-    if (type === 'groupon_ladder') type = 'groupon';
-    sheep.$router.go(`/pages/goods/${type}`, {
-      id: props.data.id,
+    const type = activity.type;
+    const typePath = type === 1 ? 'seckill' :
+      type === 2 ? 'TODO 拼团' : 'groupon';
+    sheep.$router.go(`/pages/goods/${typePath}`, {
+      id: activity.spuId,
       activity_id: activity.id,
     });
   }

pages/goods/index.vue

@@ -30,9 +30,9 @@
 								{{ formatSales('exact', state.goodsInfo.salesCount) }}
 							</view>
 						</view>
-            <!-- TODO 芋艿：promos 未写 -->
 						<view class="discounts-box ss-flex ss-row-between ss-m-b-28">
-							<div class="tag-content">
+              <!-- 满减送/限时折扣活动的提示 TODO 芋艿：promos 未写 -->
+              <div class="tag-content">
 								<view class="tag-box ss-flex">
 									<view class="tag ss-m-r-10" v-for="promos in state.goodsInfo.promos" :key="promos.id" @tap="onActivity">
 										{{ promos.title }}
@@ -40,7 +40,7 @@
 								</view>
 							</div>
 
-              <!-- TODO 芋艿：couponInfo 优惠劵 -->
+              <!-- 优惠劵 -->
 							<view class="get-coupon-box ss-flex ss-col-center ss-m-l-20" @tap="state.showModel = true"
 								v-if="state.couponInfo.length">
 								<view class="discounts-title ss-m-r-8">领券</view>
@@ -70,8 +70,8 @@
 				<!-- 详情 -->
 				<detail-content-card class="detail-content-selector" :content="state.goodsInfo.description" />
 
-				<!-- TODO 芋艿：活动跳转 -->
-				<detail-activity-tip v-if="state.goodsInfo.activities" :data="state.goodsInfo" />
+				<!-- 活动跳转：拼团/秒杀/砍价活动 -->
+				<detail-activity-tip v-if="state.activityList.length > 0" :activity-list="state.activityList" />
 
 				<!-- 详情 tabbar -->
 				<detail-tabbar v-model="state.goodsInfo">
@@ -92,7 +92,7 @@
 				<s-coupon-get v-model="state.couponInfo" :show="state.showModel" @close="state.showModel = false"
                       @get="onGet" />
 
-        <!-- TODO 芋艿：待接入 -->
+        <!-- 满减送/限时折扣活动弹窗 -->
 				<s-activity-pop v-model="state.activityInfo" :show="state.showActivityModel"
                         @close="state.showActivityModel = false" />
 			</block>
@@ -105,6 +105,7 @@
 	import { onLoad, onPageScroll } from '@dcloudio/uni-app';
 	import sheep from '@/sheep';
   import CouponApi from '@/sheep/api/promotion/coupon';
+  import ActivityApi from '@/sheep/api/promotion/activity';
   import { formatSales, formatGoodsSwiper, fen2yuan, } from '@/sheep/hooks/useGoods';
 	import detailNavbar from './components/detail/detail-navbar.vue';
 	import detailCellSku from './components/detail/detail-cell-sku.vue';
@@ -115,9 +116,7 @@
 	import detailCommentCard from './components/detail/detail-comment-card.vue';
 	import detailContentCard from './components/detail/detail-content-card.vue';
 	import detailActivityTip from './components/detail/detail-activity-tip.vue';
-	import {
-		isEmpty
-	} from 'lodash';
+	import { isEmpty } from 'lodash';
 
 	onPageScroll(() => {});
 
@@ -129,11 +128,12 @@
 		selectedSku: {}, // 选中的 SKU
 		showModel: false, // 是否展示 Coupon 优惠劵的弹窗
 		couponInfo: [], // 可领取的 Coupon 优惠劵的列表
-		showActivityModel: false,
-		activityInfo: [],
+		showActivityModel: false, // 【满减送/限时折扣】是否展示 Activity 营销活动的弹窗
+		activityInfo: [], // 【满减送/限时折扣】可参与的 Activity 营销活动的列表
+    activityList: [], // 【秒杀/拼团/砍价】可参与的 Activity 营销活动的列表
 	});
 
-	// 规格变更 TODO 芋艿：待测试
+	// 规格变更
 	function onSkuChange(e) {
 		state.selectedSku = e;
 	}
@@ -225,6 +225,14 @@
       }
       state.couponInfo = res.data;
     });
+
+    // 3. 加载营销活动信息
+    ActivityApi.getActivityListBySpuId(state.goodsId).then((res) => {
+      if (res.code !== 0) {
+        return;
+      }
+      state.activityList = res.data;
+    });
 	});
 </script>
 

sheep/api/promotion/activity.js

@@ -0,0 +1,16 @@
+import request2 from '@/sheep/request2';
+
+const ActivityApi = {
+  // 获得单个商品，近期参与的每个活动
+  getActivityListBySpuId: (spuId) => {
+    return request2({
+      url: '/app-api/promotion/activity/list-by-spu-id',
+      method: 'GET',
+      params: {
+        spuId,
+      },
+    });
+  },
+};
+
+export default ActivityApi;