活动弹窗有部分问题

pages/goods/index.vue

@@ -15,16 +15,16 @@
 					<su-swiper class="ss-m-b-14" isPreview :list="formatGoodsSwiper(state.goodsInfo.sliderPicUrls)"
 						otStyle="tag" imageMode="widthFix" dotCur="bg-mask-40" :seizeHeight="750" />
 					<!-- 限时折扣 -->
-					<view class="discount">
+					<view class="discount" v-if="setShow">
 						<image class="disImg" src="../../static/images/dis.png"></image>
 						<view class="discountCont">
 							<view class="disContT">
 								<view class="disContT1">
 									<view class="disContT1P">
-										￥0.7
+										￥{{fen2yuan(settleData.price)}}
 									</view>
 									<view class="disContT1End">
-										限时到手￥0.4
+										直降￥{{fen2yuan( state.goodsInfo.price - settleData.price)}}
 									</view>
 								</view>
 								<view class="disContT2">
@@ -33,12 +33,12 @@
 							</view>
 							<view class="disContB">
 								<view class="disContB1">
-									价格：￥1 丨 剩余：100
+									价格：￥{{fen2yuan(state.goodsInfo.price)}} 丨 剩余：{{settleData.stock}}
 								</view>
 								<view class="disContB2">
 									距结束仅剩
 									<countDown :tipText="' '" :bgColor="bgColor" :dayText="':'" :hourText="':'"
-										:minuteText="':'" :secondText="' '" :datatime="1725033600000 / 1000"
+										:minuteText="':'" :secondText="' '" :datatime="settleData.endTime / 1000"
 										:isDay="false" />
 								</view>
 							</view>
@@ -47,7 +47,7 @@
 					<!-- 限时折扣 -->
 					<!-- 价格+标题 -->
 					<view class="title-card detail-card ss-p-y-40 ss-p-x-20">
-						<view class="ss-flex ss-row-between ss-col-center ss-m-b-26">
+						<view class="ss-flex ss-row-between ss-col-center ss-m-b-26" v-if="!setShow">
 							<view class="price-box ss-flex ss-col-bottom">
 								<view class="price-text ss-m-r-16">
 									{{ fen2yuan(state.selectedSku.price || state.goodsInfo.price) }}
@@ -121,8 +121,8 @@
 					@get="onGet" /> -->
 
 				<!-- 满减送/限时折扣活动弹窗 -->
-				<s-activity-pop v-model="state.activityInfo" :show="state.showActivityModel"
+				<s-activity-pop v-model="state" :show="state.showActivityModel"
-					@close="state.showActivityModel = false" />
+					@close="state.showActivityModel = false" @get="onGet" />
 			</block>
 		</s-layout>
 	</view>
@@ -261,15 +261,38 @@
 		} = await CouponApi.getCouponTemplateList(state.goodsId, 2, 10);
 		if (code === 0) {
 			state.couponInfo = data;
+			console.log('优惠券',state)
 		}
 	}
 	//获取结算信息
+	const setShow = ref(false)
 	const settleData = ref()
 	async function getSettlementByIds(ids) {
 	  const { data } = await SpuApi.getSettlementProduct(ids);
-	  settleData.value = data
+	  settleData.value = handle(data)
 	  console.log('结算信息',data)
-	  return data;
+	  console.log('处理后数据',settleData.value)
+	}
+	//判断是否有限时折扣信息
+	function handle(array){
+		let setList = {}
+		array.forEach(item => {
+			item.skus.forEach(items => {
+				if(items.type == 4){
+					setShow.value = true
+					setList = items
+					return;
+				}
+			})
+		})
+		// 将库存信息加入
+		state.goodsInfo.skus.forEach(item =>{
+			if(item.id == setList.skuId){
+				setList.stock = item.stock
+			}
+		})
+		
+		return setList
 	}
 	onLoad((options) => {
 		// 非法参数

sheep/components/s-activity-pop/s-activity-pop.vue

@@ -3,20 +3,17 @@
 	<su-popup :show="show" type="bottom" round="20" @close="emits('close')" showClose>
 		<view class="model-box">
 			<view class="title ss-m-t-16 ss-m-l-20 ss-flex">优惠</view>
-      <scroll-view
+			<view class="titleLi">促销</view>
-        class="model-content ss-m-t-50"
+			<scroll-view class="model-content" scroll-y :scroll-with-animation="false"
-        scroll-y
+				:enable-back-to-top="true">
-        :scroll-with-animation="false"
-        :enable-back-to-top="true"
-      >
 				<view class="actBox" v-for="item in state.activityInfo" :key="item.id">
 					<view class="boxCont ss-flex ss-col-top ss-m-b-40" @tap="onGoodsList(item)">
-            <view class="model-content-tag ss-flex ss-row-center">活动</view>
+						<view class="model-content-tag ss-flex ss-row-center">{{item.name}}</view>
-            <view class="ss-m-l-20 model-content-title ss-flex-1">
+						<view class="model-content-title">
-              <view class="contBu ss-m-b-24" v-for="rule in state.activityMap[item.id]?.rules" :key="rule">
+							<view class="contBu" v-for="rule in state.activityMap[item.id]?.rules" :key="rule">
 								{{ formatRewardActivityRule(state.activityMap[item.id], rule) }}
 							</view>
-			  <view class="contBu ss-m-b-24">
+							<view class="ss-m-b-24 cotBu-txt">
 								2024.08.05-2025.10.10
 							</view>
 						</view>
@@ -24,15 +21,50 @@
 					</view>
 				</view>
 			</scroll-view>
+			<view class="titleLi">可领优惠券</view>
+			<scroll-view class="model-content" scroll-y :scroll-with-animation="false"
+				:enable-back-to-top="true">
+				<view class="actBox" v-for="item in state.couponInfo" :key="item.id">
+					<view class="boxCont ss-flex ss-col-top ss-m-b-40">
+						<view class="model-content-tag2">
+							<view class="usePrice">
+							￥{{fen2yuan(item.discountPrice)}}
+							</view>
+							<view class="impose">
+								满￥{{fen2yuan(item.usePrice)}}可用
+							</view>
+						</view>
+						<view class="model-content-title2">
+							<view class="contBu">
+								{{item.name}}
+							</view>
+							<view class="ss-m-b-24 cotBu-txt">
+								2024.08.05-2025.10.10
+							</view>
+						</view>
+						<view class="coupon" @click.stop="getBuy(item.id)" v-if="item.canTake">
+							立即领取
+						</view>
+						<view class="coupon2" v-else>
+							已领取
+						</view>
+					</view>
+				</view>
+			</scroll-view>
 		</view>
 	</su-popup>
 </template>
 <script setup>
 	import sheep from '@/sheep';
-  import { computed, reactive, watch } from 'vue';
+	import {
+		computed,
+		reactive,
+		watch
+	} from 'vue';
 	import RewardActivityApi from '@/sheep/api/promotion/rewardActivity';
-  import { formatRewardActivityRule } from '@/sheep/hooks/useGoods';
+	import {
-
+		formatRewardActivityRule,fen2yuan
+	} from '@/sheep/hooks/useGoods';
 	const props = defineProps({
 		modelValue: {
 			type: Object,
@@ -45,8 +77,9 @@
 	});
 	const emits = defineEmits(['close']);
 	const state = reactive({
-    activityInfo: computed(() => props.modelValue),
+		activityInfo: computed(() => props.modelValue.activityInfo),
-    activityMap: {}
+		activityMap: {},
+		couponInfo:computed(() => props.modelValue.couponInfo)
 	});
 	console.log('shuju', state)
 	watch(
@@ -65,7 +98,10 @@
 			}
 		},
 	);
-
+ // 领取优惠劵
+  const getBuy = (id) => {
+    emits('get', id);
+  };
 	function onGoodsList(e) {
 		sheep.$router.go('/pages/activity/index', {
 			activityId: e.id,
@@ -75,6 +111,7 @@
 <style lang="scss" scoped>
 	.model-box {
 		height: 60vh;
+
 		.title {
 			justify-content: center;
 			font-size: 36rpx;
@@ -83,37 +120,47 @@
 			color: #333333;
 		}
 	}
+
 	.model-content {
-	  height: 300rpx;
+		height:fit-content;
+		max-height: 350rpx;
 		padding: 0 20rpx;
 		box-sizing: border-box;
-	background-color: red;
+		margin-top: 20rpx;
+
 		.model-content-tag {
 			// background: rgba(#ff6911, 0.1);
 			font-size: 35rpx;
 			font-weight: 500;
 			color: #ff6911;
 			line-height: 150rpx;
-      width: 150rpx;
+			width: 200rpx;
 			height: 150rpx;
 			text-align: center;
+			
 			// border-radius: 5rpx;
 		}
 		.model-content-title {
+			width: 470rpx;
 			height: 150rpx;
 			font-size: 26rpx;
 			font-weight: 500;
 			color: #333333;
-	  background-color: gold;
 			overflow: hidden;
 		}
+
 		.cicon-forward {
 			font-size: 28rpx;
 			color: #999999;
+			margin: 0 auto;
 		}
 	}
 
 	// 新增的
+	.titleLi{
+		margin:10rpx 0 10rpx 20rpx;
+		font-size: 26rpx;
+	}
 	.actBox {
 		width: 700rpx;
 		height: 150rpx;
@@ -121,13 +168,75 @@
 		margin: 10rpx auto;
 		border-radius: 10rpx;
 	}
+
 	.boxCont {
 		width: 700rpx;
 		height: 150rpx;
 		align-items: center;
 	}
+
 	.contBu {
-	  height: 75rpx;
+		height: 80rpx;
-	  line-height: 75rpx;
+		line-height: 80rpx;
+		overflow: hidden;
+		font-size: 30rpx;
+		white-space: nowrap;
+		text-overflow: ellipsis;
+		-o-text-overflow: ellipsis;
+	}
+	.cotBu-txt{
+		height: 70rpx;
+		line-height: 70rpx;
+		font-size: 25rpx;
+		color: #999999;
+	}
+	.model-content-tag2 {
+		font-size: 35rpx;
+		font-weight: 500;
+		color: #ff6911;
+		width: 200rpx;
+		height: 150rpx;
+		text-align: center;
+	}
+	.usePrice{
+		width: 200rpx;
+		height: 90rpx;
+		line-height: 100rpx;
+		// background-color: red;
+	}
+	.impose{
+		width: 200rpx;
+		height: 50rpx;
+		// line-height: 75rpx;
+		font-size: 23rpx;
+		// background-color: gold;
+	}
+	.model-content-title2 {
+		width: 330rpx;
+		height: 150rpx;
+		font-size: 26rpx;
+		font-weight: 500;
+		color: #333333;
+		overflow: hidden;
+	}
+	.coupon{
+		width: 150rpx;
+		height: 50rpx;
+		line-height: 50rpx;
+		background-color: rgb(255, 68, 68);
+		color: white;
+		border-radius: 30rpx;
+		text-align: center;
+		font-size: 25rpx;
+	}
+	.coupon2{
+		width: 150rpx;
+		height: 50rpx;
+		line-height: 50rpx;
+		background-color: rgb(203, 192, 191);
+		color: white;
+		border-radius: 30rpx;
+		text-align: center;
+		font-size: 25rpx;
 	}
 </style>