From b0a688df3658a4eb29b15d3848bdbde5b72bb753 Mon Sep 17 00:00:00 2001
From: davy <davy@example.com>
Date: Wed, 9 Apr 2025 15:52:33 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E4=BC=98=E5=8C=96=E6=89=AB=E7=A0=81?=
 =?UTF-8?q?=E7=BB=93=E6=9E=9C=E9=A1=B5=E9=9D=A2=20-=20=E4=BF=AE=E5=A4=8D?=
 =?UTF-8?q?=E5=80=92=E8=AE=A1=E6=97=B6=E6=98=BE=E7=A4=BA=E9=97=AE=E9=A2=98?=
 =?UTF-8?q?=20-=20=E8=B0=83=E6=95=B4=E6=8B=9B=E5=8B=9F=E6=B4=BB=E5=8A=A8?=
 =?UTF-8?q?=E6=A0=87=E7=AD=BE=E4=BD=8D=E7=BD=AE=E5=88=B0=E5=8F=B3=E4=B8=8A?=
 =?UTF-8?q?=E8=A7=92=20-=20=E4=BC=98=E5=8C=96=E9=A1=B5=E9=9D=A2=E5=B8=83?=
 =?UTF-8?q?=E5=B1=80=E5=92=8C=E6=BB=9A=E5=8A=A8=E6=95=88=E6=9E=9C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 pagesActivity/scanResult.vue | 1858 +++++++++++++++-------------------
 1 file changed, 829 insertions(+), 1029 deletions(-)

diff --git a/pagesActivity/scanResult.vue b/pagesActivity/scanResult.vue
index 2636265..d5f8c15 100644
--- a/pagesActivity/scanResult.vue
+++ b/pagesActivity/scanResult.vue
@@ -1,486 +1,374 @@
 <template>
-	<view class="page">
-		<!-- 错误状态页面 -->
-		<template v-if="showError || info.qrcode.qrcodeStatus == 2">
-			<view class="error-page">
-				<!-- 位置错误 -->
-				<template v-if="errorType === 'location'">
-					<image src="/static/information.svg" class="status-icon"></image>
-					<view class="status-title">您现在未在您门店定位的范围</view>
-					<view class="status-desc">请在门店范围100米内重新扫码</view>
-				</template>
-				
-				<!-- 已失效 -->
-				<template v-if="errorType === 'expired' || info.qrcode.qrcodeStatus == 2">
-					<image src="/static/information.svg" class="status-icon"></image>
-					<view class="status-title">{{ info.qrcode.statusDesc || '二维码已失效' }}</view>
-					<view class="status-desc">{{ info.qrcode.statusMessage || '该二维码已超出可用范围' }}</view>
-				</template>
+	<view class="scan-result">
+		<!-- 已失效状态 -->
+		<template v-if="errorType === 'expired' || info.qrcode.qrcodeStatus == 2">
+			<view class="scan-result__header">
+				<image src="/static/information.svg" class="scan-result__icon"></image>
+				<text class="scan-result__title">该二维码无法领取品牌返利</text>
+				<text class="scan-result__desc">失效原因：{{ info.qrcode.remark}}</text>
+			</view>
 
-				<!-- 识别产品 -->
-				<view class="product-section">
-					<view class="section-header">
-						<image src="/static/scan.svg" class="section-icon"></image>
-						<text>识别产品</text>
-					</view>
-					
-					<!-- 商品信息卡片 -->
-					<view v-if="beer" class="product-card">
-						<view class="product-content">
-							<view class="product-image">
-								<image :src="beer.cover" class="cover"></image>
-							</view>	
-							<view class="product-info">
-								<view class="product-name">{{ beer.beerName }}</view>
-								<view class="product-brand">{{ beer.brandName }}</view>
-								<view class="product-rating">
-									<text class="rating-value">{{ beer.beerOverallRating || '4.9' }}</text>
-									<text class="rating-count">{{ beer.beerReviewsCount || '20' }} reviews</text>
+			<view class="scan-result__content">
+				<view class="scan-result__section">
+					<text class="scan-result__section-title">商品详细</text>
+					<view class="product-card" v-if="beer">
+						<view class="product-card__image">
+							<image :src="beer.cover" mode="aspectFill"></image>
+						</view>
+						<view class="product-card__info">
+							<text class="product-card__name">{{ beer.beerName }}</text>
+							<text class="product-card__brand">{{ beer.brandName }}</text>
+							<view class="product-card__detail">
+								<text class="product-card__label">生产日期：</text>
+								<text class="product-card__value">{{ beer.launchDate }}</text>
+							</view>
+							<view class="product-card__detail">
+								<text class="product-card__label">净含量：</text>
+								<text class="product-card__value">{{ beer.netContent }}</text>
+							</view>
+							<view class="product-card__rating">
+								<view class="rating-stars">
+									<text class="cuIcon-favorfill"></text>
+									<text class="rating-value">{{ beer.beerOverallRating }}</text>
 								</view>
+								<text class="rating-count">{{ beer.beerReviewsCount }} 条评论</text>
 							</view>
 						</view>
 					</view>
 				</view>
-
-				<!-- 返回按钮 -->
-				<view class="error-action">
-					<view class="action-btn" @click="back">
-						<image src="/static/undo.svg" class="btn-icon"></image>
-						<text>返回</text>
-					</view>
-				</view>
+			</view>
+
+			<view class="scan-result__footer">
+				<button class="scan-result__btn scan-result__btn--back" @click="back">
+					<image src="/static/undo.svg"></image>
+					<text>返回</text>
+				</button>
+				<button class="scan-result__btn scan-result__btn--share" @click="share">
+					<image src="/static/send-2.svg"></image>
+					<text>分享上新</text>
+				</button>
 			</view>
 		</template>
 
-		<!-- 正常状态页面 -->
-		<template v-else>
-			<!-- 待领取状态 -->
-			<template v-if="info.qrcode.qrcodeStatus == 0">
-				<view class="flex-1" style="overflow-y: auto;">
-					<!-- 扫码成功提示 -->
-					<view class="scs-state-box">
-						<image src="/static/tick-circle.svg" class="img"></image>
-						<text>扫码成功！</text>
-					</view>
-					
-					<!-- 产品信息卡片 -->
-					<view v-if="beer" class="product-card">
-						<view class="section-title">
-							<text>商品详细</text>
-						</view>
-						<view class="product-content">
-							<view class="product-image">
-								<image :src="beer.cover" class="cover"></image>
-							</view>	
-							<view class="product-info">
-								<view class="product-name">{{ beer.beerName }}</view>
-								<view class="product-brand">{{ beer.brandName }}</view>
-								<view class="product-details">
-									<view class="detail-item">
-										<text class="detail-label">生产日期：</text>
-										<text class="detail-value">{{ beer.launchDate }}</text>
-									</view>
-									<view class="detail-item">
-										<text class="detail-label">净含量：</text>
-										<text class="detail-value">{{ beer.netContent }}</text>
-									</view>
-								</view>
-								<view class="product-rating">
-									<view class="rating-stars">
-										<text class="cuIcon-favorfill" style="color: #FFBC11;"></text>
-										<text class="rating-value">{{ beer.beerOverallRating }}</text>
-									</view>
-									<text class="rating-count">{{beer.beerReviewsCount}} 条评论</text>
-								</view>
-							</view>
-						</view>
-					</view>
-					
-					<!-- 品牌福利卡片 -->
-					<view v-if="beer && beer.scanCoinCount" class="benefit-card">
-						<view class="section-title">
-							<text>品牌福利</text>
-						</view>
-						<view class="benefit-content">
-							<view class="benefit-title">{{ beer.scanCoinCount}}枚 {{beer.brandName}} 啤酒币待领取</view>
-							<text class="benefit-subtitle">品牌啤酒币可用于兑换好礼</text>
-						</view>
-					</view>
-					
-					<!-- 活动选择提示 -->
-					<view v-if="activitySum > 1" class="activity-tip">
-						<text class="tip-icon">!</text>
-						<text class="tip-text">该产品有多个进行中活动重叠，请<text class="highlight">选择要计入的活动</text></text>
-					</view>
-					
-					<!-- 待领取状态活动列表 -->
-					<template>
-						<!-- 品牌活动 -->
-						<view v-for="(it, index) in activity" :key="index" 
-							class="activity-card"
-							:class="{'activity-card-active': activityId === it.id}"
-							@click="selectPPF(it)">
-							<view class="activity-content">
-								<view class="activity-left">
-									<view v-if="it.brandLogo" class="brand-logo-container">
-										<image :src="it.brandLogo" class="brand-logo"></image>
-									</view>
-									<view v-else class="brand-logo-placeholder">
-										<text class="placeholder-text">品牌图标</text>
-									</view>
-									<view class="progress-info">
-										<text class="progress-label">距离达成差</text>
-										<view class="progress-value">
-											<text v-if="it.remainingBeerCount <= 0" class="completed">已达标</text>
-											<text v-else class="remaining">{{ it.remainingBeerCount}}桶</text>
-										</view>
-									</view>
-								</view>
-								<view class="activity-right">
-									<view class="activity-header">
-										<view class="activity-name">{{ it.breweryName }}</view>
-										<view class="activity-tag" v-if="it.activityType == 1">指定门店</view>
-										<view class="activity-tag" v-if="it.activityType == 2">招募活动</view>
-									</view>
-									<view class="activity-details">
-										<view class="detail-row">
-											<text class="detail-label">活动时间：</text>
-											<text class="detail-value">首次扫码开始计时 <text class="highlight">{{it.duration}}天内</text></text>
-										</view>
-										<view class="detail-row">
-											<text class="detail-label">活动目标：</text>
-											<text class="detail-value">{{ it.beer_scope === 0 ? '全系列酒款' : '指定酒款' }}累计扫码≥{{ it.activityTarget}}桶</text>
-										</view>
-									</view>
-									<scroll-view v-if="it.beers" scroll-x="true" class="beer-scroll">
-										<view class="beer-item" v-for="(beer, beerIndex) in it.beers" :key="beerIndex">
-											<image v-if="beer.cover" :src="beer.cover" class="beer-cover"></image>
-										</view>
-									</scroll-view>
-									<view v-else class="beer-scroll-placeholder">
-										<text class="placeholder-text">暂无酒款信息</text>
-									</view>
-									<view class="reward-info">
-										<text class="reward-label">赠</text>
-										<text v-if="it.activityRewardType == 1 && it.activityRewardGoods" class="reward-value">
-											{{it.activityRewardGoods.goodsName}} * {{it.activityRewardCount}}
-										</text>
-										<text v-else-if="it.activityRewardType == 2" class="reward-value">
-											啤酒币 * {{it.activityRewardCount}}个
-										</text>
-										<text v-else class="reward-value error-text">奖励内容获取失败</text>
-									</view>
-								</view>
-							</view>
-						</view>
+		<!-- 领取成功状态 - 刚刚领取成功 -->
+		<template v-if="info.qrcode.qrcodeStatus == 1 && isJustReceived">
+			<view class="scan-result__header scan-result__header--success">
+				<image src="/static/tick-circle.svg" class="scan-result__icon"></image>
+				<text class="scan-result__title">领取成功！</text>
+			</view>
 
-						<!-- 平台活动 -->
-						<view v-for="(it, index) in platformActivity" :key="index"
-							class="activity-card"
-							:class="{'activity-card-active': platformActivityId === it.id}"
-							@click="selectPlatform(it)">
-							<view class="activity-content">
-								<view class="activity-left">
-									<view v-if="it.brandLogo" class="brand-logo-container">
-										<image :src="it.brandLogo" class="brand-logo"></image>
-									</view>
-									<view v-else class="brand-logo-placeholder">
-										<text class="placeholder-text">品牌图标</text>
-									</view>
-									<view class="progress-info">
-										<text class="progress-label">距离达成还剩</text>
-										<view class="progress-value">
-											<text v-if="it.remainingBeerCount <= 0" class="completed">已达标</text>
-											<text v-else class="remaining">{{ it.remainingBeerCount}}桶</text>
-										</view>
-									</view>
-								</view>
-								<view class="activity-right">
-									<view class="activity-header">
-										<view class="activity-name">{{ it.breweryName }}</view>
-										<view class="activity-tag" v-if="it.activityRewardType == 1">实物奖励</view>
-										<view class="activity-tag" v-if="it.activityRewardType == 2">啤酒币</view>
-									</view>
-									<view class="activity-details">
-										<view class="detail-row">
-											<text class="detail-label">活动时间：</text>
-											<text class="detail-value">首次扫码开始计时 <text class="highlight">{{it.duration}}天内</text></text>
-										</view>
-										<view class="detail-row">
-											<text class="detail-label">活动目标：</text>
-											<text class="detail-value">{{ it.beer_scope === 0 ? '全系列酒款' : '以下酒款' }}累计扫码 ≥ {{ it.activityTarget}}桶</text>
-										</view>
-									</view>
-									<scroll-view scroll-x="true" class="beer-scroll">
-										<view class="beer-item" v-for="(beer, beerIndex) in it.beers" :key="beerIndex">
-											<image v-if="beer.cover" :src="beer.cover" class="beer-cover"></image>
-										</view>
-									</scroll-view>
-									<view v-else class="beer-scroll-placeholder">
-										<text class="placeholder-text">暂无酒款信息</text>
-									</view>
-									<view class="reward-info">
-										<text class="reward-label">奖励</text>
-										<text v-if="it.activityRewardType == 1 && it.activityRewardGoods" class="reward-value">
-											{{it.activityRewardGoods.goodsName}} * {{it.activityRewardCount}}
-										</text>
-										<text v-else-if="it.activityRewardType == 2" class="reward-value">
-											啤酒币 * {{it.activityRewardCount}}个
-										</text>
-										<text v-else class="reward-value error-text">奖励内容获取失败</text>
-									</view>
-								</view>
+			<view class="scan-result__content">
+				<view class="scan-result__section">
+					<text class="scan-result__section-title">商品详细</text>
+					<view class="product-card" v-if="beer">
+						<view class="product-card__image">
+							<image :src="beer.cover" mode="aspectFill"></image>
+						</view>
+						<view class="product-card__info">
+							<text class="product-card__name">{{ beer.beerName }}</text>
+							<text class="product-card__brand">{{ beer.brandName }}</text>
+							<view class="product-card__detail">
+								<text class="product-card__label">生产日期：</text>
+								<text class="product-card__value">{{ beer.launchDate }}</text>
+							</view>
+							<view class="product-card__detail">
+								<text class="product-card__label">净含量：</text>
+								<text class="product-card__value">{{ beer.netContent }}</text>
+							</view>
+							<view class="product-card__rating">
+								<view class="rating-stars">
+									<text class="cuIcon-favorfill"></text>
+									<text class="rating-value">{{ beer.beerOverallRating }}</text>
+								</view>
+								<text class="rating-count">{{ beer.beerReviewsCount }} 条评论</text>
 							</view>
-						</view>
-					</template>
-				</view>
-				
-				<!-- 待领取状态底部操作区 -->
-				<view class="footer">
-					<view class="action-buttons">
-						<view class="action-btn cancel-btn" @click="back">
-							<image src="/static/undo.svg" class="btn-icon"></image>
-							<text>回头再说</text>
-						</view>
-						<view class="action-btn primary-btn" @click="handleReceive">
-							<image src="/static/send-2.svg" class="btn-icon"></image>
-							<text>立即领取</text>
 						</view>
 					</view>
 				</view>
-			</template>
 
-			<!-- 领取成功状态 -->
-			<template v-if="info.qrcode.qrcodeStatus == 1">
-				<view class="flex-1" style="overflow-y: auto;">
-					<!-- 领取成功提示 -->
-					<view class="lq-state-box">
-						<image src="/static/information.svg" class="img"></image>
-						<text>该桶产品已于 {{ info.qrcode.verifyTime }} 扫码领取返利</text>
-					</view>
-					
-					<!-- 领取成功状态提示 -->
-					<view class="scs-state-box">
-						<image src="/static/tick-circle.svg" class="img"></image>
-						<text>领取成功！</text>
-					</view>
-					
-					<!-- 产品信息卡片 -->
-					<view v-if="beer" class="product-card">
-						<view class="section-title">
-							<text>商品详细</text>
-						</view>
-						<view class="product-content">
-							<view class="product-image">
-								<image :src="beer.cover" class="cover"></image>
-							</view>	
-							<view class="product-info">
-								<view class="product-name">{{ beer.beerName }}</view>
-								<view class="product-brand">{{ beer.brandName }}</view>
-								<view class="product-details">
-									<view class="detail-item">
-										<text class="detail-label">生产日期：</text>
-										<text class="detail-value">{{ beer.launchDate }}</text>
-									</view>
-									<view class="detail-item">
-										<text class="detail-label">净含量：</text>
-										<text class="detail-value">{{ beer.netContent }}</text>
-									</view>
-								</view>
-								<view class="product-rating">
-									<view class="rating-stars">
-										<text class="cuIcon-favorfill" style="color: #FFBC11;"></text>
-										<text class="rating-value">{{ beer.beerOverallRating }}</text>
-									</view>
-									<text class="rating-count">{{beer.beerReviewsCount}} 条评论</text>
-								</view>
-							</view>
-						</view>
-					</view>
-					
-					<!-- 品牌福利卡片 -->
+				<view class="scan-result__section">
+					<text class="scan-result__section-title">品牌福利</text>
 					<view class="benefit-card">
-						<view class="section-title">
-							<text>品牌福利已领取</text>
-						</view>
-						<view class="benefit-content">
-							<view class="benefit-title">{{ beer.scanCoinCount}}枚（{{beer.brandName}}）品牌啤酒币已到账</view>
-							<text class="benefit-subtitle">品牌啤酒币可用于兑换好礼</text>
-						</view>
+						<view class="benefit-card__title">{{ beer.scanCoinCount}}枚（{{beer.brandName}}）品牌啤酒币已到账</view>
+						<text class="benefit-card__subtitle">品牌啤酒币可用于兑换好礼</text>
 					</view>
-					
-					<!-- 已选择的活动列表 -->
-					<template>
-						<!-- 已选择的品牌活动 -->
-						<view v-for="(it, index) in activity.filter(item => item.id === activityId)" :key="index" 
-							class="activity-card">
-							<view class="activity-content">
-								<view class="activity-left">
-									<image :src="it.brandLogo" class="brand-logo"></image>
-									<view class="progress-info">
-										<text class="progress-label">距离达成还剩</text>
-										<view class="progress-value">
-											<text v-if="it.remainingBeerCount <= 0" class="completed">已达标</text>
-											<text v-else class="remaining">{{ it.remainingBeerCount}}桶</text>
-										</view>
-									</view>
-								</view>
-								<view class="activity-right">
-									<view class="activity-header">
-										<view class="activity-name">{{ it.breweryName }}</view>
-										<view class="activity-tag" v-if="it.activityRewardType == 1">实物奖励</view>
-										<view class="activity-tag" v-if="it.activityRewardType == 2">啤酒币</view>
-									</view>
-									<view class="activity-details">
-										<view class="detail-row">
-											<text class="detail-label">活动时间：</text>
-											<text class="detail-value">首次扫码开始计时 <text class="highlight">{{it.duration}}天内</text></text>
-										</view>
-										<view class="detail-row">
-											<text class="detail-label">活动目标：</text>
-											<text class="detail-value">{{ it.beer_scope === 0 ? '全系列酒款' : '以下酒款' }}累计扫码 ≥ {{ it.activityTarget}}桶</text>
-										</view>
-									</view>
-									<scroll-view v-if="it.beers" scroll-x="true" class="beer-scroll">
-										<view class="beer-item" v-for="(beer, beerIndex) in it.beers" :key="beerIndex">
-											<image v-if="beer.cover" :src="beer.cover" class="beer-cover"></image>
-										</view>
-									</scroll-view>
-									<view class="reward-info">
-										<text class="reward-label">奖励</text>
-										<text v-if="it.activityRewardType == 1 && it.activityRewardGoods" class="reward-value">
-											{{it.activityRewardGoods.goodsName}} * {{it.activityRewardCount}}
-										</text>
-										<text v-if="it.activityRewardType == 2" class="reward-value">
-											啤酒币 * {{it.activityRewardCount}}个
-										</text>
-									</view>
-								</view>
-							</view>
-						</view>
+				</view>
+			</view>
 
-						<!-- 已选择的平台活动 -->
-						<view v-for="(it, index) in platformActivity.filter(item => item.id === platformActivityId)" :key="index"
-							class="activity-card">
-							<view class="activity-content">
-								<view class="activity-left">
-									<image :src="it.brandLogo" class="brand-logo"></image>
-									<view class="progress-info">
-										<text class="progress-label">距离达成还剩</text>
-										<view class="progress-value">
-											<text v-if="it.remainingBeerCount <= 0" class="completed">已达标</text>
-											<text v-else class="remaining">{{ it.remainingBeerCount}}桶</text>
-										</view>
-									</view>
-								</view>
-								<view class="activity-right">
-									<view class="activity-header">
-										<view class="activity-name">{{ it.breweryName }}</view>
-										<view class="activity-tag" v-if="it.activityRewardType == 1">实物奖励</view>
-										<view class="activity-tag" v-if="it.activityRewardType == 2">啤酒币</view>
-									</view>
-									<view class="activity-details">
-										<view class="detail-row">
-											<text class="detail-label">活动时间：</text>
-											<text class="detail-value">首次扫码开始计时 <text class="highlight">{{it.duration}}天内</text></text>
-										</view>
-										<view class="detail-row">
-											<text class="detail-label">活动目标：</text>
-											<text class="detail-value">{{ it.beer_scope === 0 ? '全系列酒款' : '以下酒款' }}累计扫码 ≥ {{ it.activityTarget}}桶</text>
-										</view>
-									</view>
-									<scroll-view scroll-x="true" class="beer-scroll">
-										<view class="beer-item" v-for="(beer, beerIndex) in it.beers" :key="beerIndex">
-											<image v-if="beer.cover" :src="beer.cover" class="beer-cover"></image>
-										</view>
-									</scroll-view>
-									<view class="reward-info">
-										<text class="reward-label">奖励</text>
-										<text v-if="it.activityRewardType == 1 && it.activityRewardGoods" class="reward-value">
-											{{it.activityRewardGoods.goodsName}} * {{it.activityRewardCount}}
-										</text>
-										<text v-if="it.activityRewardType == 2" class="reward-value">
-											啤酒币 * {{it.activityRewardCount}}个
-										</text>
-									</view>
-								</view>
-							</view>
-						</view>
-					</template>
-				</view>
-				
-				<!-- 领取成功状态底部操作区 -->
-				<view class="footer">
-					<view class="action-buttons">
-						<view class="action-btn cancel-btn" @click="toWinelist">
-							<image src="@/static/document.png" class="btn-icon"></image>
-							<text>生成酒单</text>
-						</view>
-						<view class="action-btn primary-btn" @click="share">
-							<image src="/static/send-2.svg" class="btn-icon"></image>
-							<text>分享上新</text>
-						</view>
-					</view>
-				</view>
-			</template>
+			<view class="scan-result__footer">
+				<button class="scan-result__btn scan-result__btn--back" @click="toWinelist">
+					<image src="@/static/document.png"></image>
+					<text>生成酒单</text>
+				</button>
+				<button class="scan-result__btn scan-result__btn--share" @click="share">
+					<image src="/static/send-2.svg"></image>
+					<text>分享上新</text>
+				</button>
+			</view>
+		</template>
 
-			<!-- 转为赠品状态 -->
-			<template v-if="info.qrcode.qrcodeStatus == 3">
-				<view class="flex-1" style="overflow-y: auto;">
-					<!-- 赠品状态提示 -->
-					<view class="lq-state-box gift-state">
-						<image src="/static/gift.png" class="img"></image>
-						<text>该桶产品已转为赠品</text>
-					</view>
-					
-					<!-- 产品信息卡片 -->
-					<view v-if="beer" class="product-card">
-						<view class="section-title">
-							<text>商品详细</text>
+		<!-- 再次扫码已领取的商品 -->
+		<template v-if="info.qrcode.qrcodeStatus == 1 && !isJustReceived">
+			<view class="scan-result__header">
+				<image src="/static/information.svg" class="scan-result__icon"></image>
+				<text class="scan-result__title">该桶产品已于 {{ info.qrcode.verifyTime }} 扫码领取成功</text>
+			</view>
+
+			<view class="scan-result__content">
+				<view class="scan-result__section">
+					<text class="scan-result__section-title">商品详细</text>
+					<view class="product-card" v-if="beer">
+						<view class="product-card__image">
+							<image :src="beer.cover" mode="aspectFill"></image>
 						</view>
-						<view class="product-content">
-							<view class="product-image">
-								<image :src="beer.cover" class="cover"></image>
-							</view>	
-							<view class="product-info">
-								<view class="product-name">{{ beer.beerName }}</view>
-								<view class="product-brand">{{ beer.brandName }}</view>
-								<view class="product-details">
-									<view class="detail-item">
-										<text class="detail-label">生产日期：</text>
-										<text class="detail-value">{{ beer.launchDate }}</text>
-									</view>
-									<view class="detail-item">
-										<text class="detail-label">净含量：</text>
-										<text class="detail-value">{{ beer.netContent }}</text>
-									</view>
+						<view class="product-card__info">
+							<text class="product-card__name">{{ beer.beerName }}</text>
+							<text class="product-card__brand">{{ beer.brandName }}</text>
+							<view class="product-card__detail">
+								<text class="product-card__label">生产日期：</text>
+								<text class="product-card__value">{{ beer.launchDate }}</text>
+							</view>
+							<view class="product-card__detail">
+								<text class="product-card__label">净含量：</text>
+								<text class="product-card__value">{{ beer.netContent }}</text>
+							</view>
+							<view class="product-card__rating">
+								<view class="rating-stars">
+									<text class="cuIcon-favorfill"></text>
+									<text class="rating-value">{{ beer.beerOverallRating }}</text>
 								</view>
-								<view class="product-rating">
-									<view class="rating-stars">
-										<text class="cuIcon-favorfill" style="color: #FFBC11;"></text>
-										<text class="rating-value">{{ beer.beerOverallRating }}</text>
+								<text class="rating-count">{{ beer.beerReviewsCount }} 条评论</text>
+							</view>
+						</view>
+					</view>
+				</view>
+			</view>
+
+			<view class="scan-result__footer">
+				<button class="scan-result__btn scan-result__btn--back" @click="toWinelist">
+					<image src="@/static/document.png"></image>
+					<text>生成酒单</text>
+				</button>
+				<button class="scan-result__btn scan-result__btn--share" @click="share">
+					<image src="/static/send-2.svg"></image>
+					<text>分享上新</text>
+				</button>
+			</view>
+		</template>
+
+		<!-- 待领取状态 -->
+		<template v-if="info.qrcode.qrcodeStatus == 0">
+			<view class="scan-result__content">
+				<view class="scan-result__section">
+					<text class="scan-result__section-title">商品详细</text>
+					<view class="product-card" v-if="beer">
+						<view class="product-card__image">
+							<image :src="beer.cover" mode="aspectFill"></image>
+						</view>
+						<view class="product-card__info">
+							<text class="product-card__name">{{ beer.beerName }}</text>
+							<text class="product-card__brand">{{ beer.brandName }}</text>
+							<view class="product-card__detail">
+								<text class="product-card__label">生产日期：</text>
+								<text class="product-card__value">{{ beer.launchDate }}</text>
+							</view>
+							<view class="product-card__detail">
+								<text class="product-card__label">净含量：</text>
+								<text class="product-card__value">{{ beer.netContent }}</text>
+							</view>
+							<view class="product-card__rating">
+								<view class="rating-stars">
+									<text class="cuIcon-favorfill"></text>
+									<text class="rating-value">{{ beer.beerOverallRating }}</text>
+								</view>
+								<text class="rating-count">{{ beer.beerReviewsCount }} 条评论</text>
+							</view>
+						</view>
+					</view>
+				</view>
+
+				<view class="scan-result__section">
+					<text class="scan-result__section-title">品牌福利</text>
+					<view class="benefit-card">
+						<view class="benefit-card__title">可获得 {{ beer.scanCoinCount }}枚{{beer.brandName}}品牌啤酒币</view>
+						<text class="benefit-card__subtitle">品牌啤酒币可用于兑换好礼</text>
+					</view>
+				</view>
+
+				<view class="activity-notice" v-if="activitySum > 1">
+					<image src="/static/warning.svg" mode="aspectFit"></image>
+					<text>该产品有多个进行中活动重叠，请选择要计入的活动</text>
+				</view>
+
+				<view class="scan-result__section" v-if="activity && activity.length > 0">
+					<text class="scan-result__section-title">品牌活动</text>
+					<view class="activity-list">
+						<view 
+							class="activity-item" 
+							v-for="(item, index) in activity" 
+							:key="index"
+							:class="{'activity-item--selected': activityId === item.id}"
+							@click="selectPPF(item)"
+						>
+							<!-- <view class="activity-item__header">
+								<text class="activity-item__title">{{ item.breweryName }}</text>
+							</view> -->
+							<view class="activity-item__tag-container">
+								<text class="activity-item__tag activity-item__tag--store" v-if="item.activityType === 1">指定门店</text>
+								<text class="activity-item__tag activity-item__tag--new" v-if="item.activityType === 2">招募活动</text>
+							</view>
+							<view class="activity-item__content">
+								<view class="activity-item__progress">
+									<text>距离累计目标达成还剩</text>
+									<text class="activity-item__remaining-count">{{item.remainingBeerCount}}桶</text>
+								</view>
+								<view class="activity-item__time">
+									<text>时间：首次扫码开始累计</text>
+									<text class="activity-item__duration">{{item.duration}}天内</text>
+								</view>
+								<view class="activity-item__deadline" v-if="item.remainingDays">
+									<text>活动截止还剩</text>
+									<text class="activity-item__remaining-days">{{item.remainingDays}}天</text>
+								</view>
+								<view class="activity-item__target">
+									<text>目标：{{item.beerScope === 0 ? '品牌全系' : '以下'}}酒款累积扫码 ≥ </text>
+									<text class="activity-item__count">{{ item.activityTarget}}桶</text>
+								</view>
+								<scroll-view v-if="item.beers && item.beers.length > 0" 
+									scroll-x="true" 
+									class="activity-item__beers" 
+									enhanced 
+									show-scrollbar="false"
+								>
+									<view 
+										class="activity-item__beer" 
+										v-for="(beer, beerIndex) in item.beers" 
+										:key="beerIndex"
+									>
+										<image v-if="beer.cover" :src="beer.cover" mode="aspectFit"></image>
+									</view>
+								</scroll-view>
+								<view class="activity-item__reward">
+									<text class="activity-item__reward-tag">赠</text>
+									<view class="activity-item__reward-content" v-if="item.activityRewardType == 1 && item.activityRewardGoods">
+										<image 
+											v-if="item.activityRewardGoods.cover" 
+											:src="item.activityRewardGoods.cover" 
+											class="activity-item__reward-image"
+											mode="aspectFit"
+										></image>
+										<view class="activity-item__reward-info">
+											<text class="activity-item__reward-name">{{item.activityRewardGoods.goodsName}}</text>
+											<text class="activity-item__reward-specs">规格：{{item.activityRewardGoods.specs}}</text>
+											<text class="activity-item__reward-count">数量：{{item.activityRewardCount}}份</text>
+										</view>
+									</view>
+									<view class="activity-item__reward-content" v-if="item.activityRewardType == 2">
+										<image 
+											src="/static/coin.png" 
+											class="activity-item__reward-image"
+											mode="aspectFit"
+										></image>
+										<view class="activity-item__reward-info">
+											<text class="activity-item__reward-name">品牌啤酒币</text>
+											<text class="activity-item__reward-count">数量：{{item.activityRewardCount}}枚</text>
+										</view>
 									</view>
-									<text class="rating-count">{{beer.beerReviewsCount}} 条评论</text>
 								</view>
 							</view>
 						</view>
 					</view>
 				</view>
-				
-				<!-- 赠品状态底部操作区 -->
-				<view class="footer">
-					<view class="action-buttons">
-						<view class="action-btn cancel-btn" @click="toWinelist">
-							<image src="@/static/document.png" class="btn-icon"></image>
-							<text>生成酒单</text>
-						</view>
-						<view class="action-btn gift-btn" @click="share">
-							<image src="/static/send-2.svg" class="btn-icon"></image>
-							<text>分享赠品</text>
+
+				<view class="scan-result__section" v-if="platformActivity && platformActivity.length > 0">
+					<text class="scan-result__section-title">平台活动</text>
+					<view class="activity-list">
+						<view 
+							class="activity-item" 
+							v-for="(item, index) in platformActivity" 
+							:key="index"
+							:class="{'activity-item--selected': platformActivityId === item.id}"
+							@click="selectPlatform(item)"
+						>
+							<view class="activity-item__header">
+								<text class="activity-item__title">{{ item.activityName }}</text>
+							</view>
+							<view class="activity-item__tag-container">
+								<text class="activity-item__tag activity-item__tag--store" v-if="item.activityType === 1">指定门店</text>
+								<text class="activity-item__tag activity-item__tag--new" v-if="item.activityType === 2">招募活动</text>
+							</view>
+							<view class="activity-item__content">
+								<view class="activity-item__progress">
+									<text>距离达成还剩</text>
+									<text class="activity-item__remaining-count">{{item.remainingBeerCount}}桶</text>
+								</view>
+								<view class="activity-item__time">
+									<text>时间：首次扫码开始累计</text>
+									<text class="activity-item__duration">{{item.duration}}天内</text>
+								</view>
+								<view class="activity-item__deadline" v-if="item.remainingDays">
+									<text>活动截止还剩</text>
+									<text class="activity-item__remaining-days">{{item.remainingDays}}天</text>
+								</view>
+								<view class="activity-item__target">
+									<text>目标：{{item.beerScope === 0 ? '品牌全系' : '以下'}}酒款累积扫码 ≥ </text>
+									<text class="activity-item__count">{{ item.activityTarget}}桶</text>
+								</view>
+								<view class="activity-item__reward">
+									<text class="activity-item__reward-tag">赠</text>
+									<view class="activity-item__reward-content" v-if="item.activityRewardType == 1 && item.activityRewardGoods">
+										<image 
+											v-if="item.activityRewardGoods.cover" 
+											:src="item.activityRewardGoods.cover" 
+											class="activity-item__reward-image"
+											mode="aspectFit"
+										></image>
+										<view class="activity-item__reward-info">
+											<text class="activity-item__reward-name">{{item.activityRewardGoods.goodsName}}</text>
+											<text class="activity-item__reward-specs">规格：{{item.activityRewardGoods.specs}}</text>
+											<text class="activity-item__reward-count">数量：{{item.activityRewardCount}}份</text>
+										</view>
+									</view>
+									<view class="activity-item__reward-content" v-if="item.activityRewardType == 2">
+										<image 
+											src="/static/coin.png" 
+											class="activity-item__reward-image"
+											mode="aspectFit"
+										></image>
+										<view class="activity-item__reward-info">
+											<text class="activity-item__reward-name">品牌啤酒币</text>
+											<text class="activity-item__reward-count">数量：{{item.activityRewardCount}}枚</text>
+										</view>
+									</view>
+								</view>
+							</view>
 						</view>
 					</view>
 				</view>
-			</template>
+			</view>
+
+			<view class="scan-result__footer">
+				<button class="scan-result__btn scan-result__btn--back" @click="back">
+					<image src="/static/undo.svg"></image>
+					<text>回头再说</text>
+				</button>
+				<button class="scan-result__btn scan-result__btn--share" @click="showConfirmPopup">
+					<image src="/static/send-2.svg"></image>
+					<text>立即领取</text>
+				</button>
+			</view>
+
+			<!-- 确认弹窗 -->
+			<uni-popup ref="confirmPopup" type="dialog">
+				<uni-popup-dialog
+					type="info"
+					title="领取确认"
+					content="每款酒品仅可领取一次，领取后将获得相应的品牌福利，是否确认领取？"
+					:before-close="true"
+					@confirm="confirmReceive"
+					@close="closePopup"
+				></uni-popup-dialog>
+			</uni-popup>
 		</template>
 	</view>
 </template>
@@ -515,6 +403,7 @@
 				latitude: null,
 				longitude: null,
 				errorType: null, // 错误类型: location-位置错误, expired-已失效
+				isJustReceived: false, // 是否刚刚领取成功
 			};
 		},
 		onLoad({
@@ -525,6 +414,7 @@
 			this.result = result
 			this.latitude = latitude
 			this.longitude = longitude
+			this.isJustReceived = false // 重置领取状态
 			// 查询二维码信息
 			this.getQrcodeInfoFun(result)
 		},
@@ -568,6 +458,21 @@
 					}
 				})
 			},
+			// 显示确认弹窗
+			showConfirmPopup() {
+				this.$refs.confirmPopup.open();
+			},
+			
+			// 关闭弹窗
+			closePopup() {
+				this.$refs.confirmPopup.close();
+			},
+			
+			// 确认领取
+			confirmReceive() {
+				this.handleReceive();
+				this.closePopup();
+			},
 			// 立即领取
 			handleReceive() {
 				const data = {
@@ -581,21 +486,55 @@
 				if (this.platformActivityId) {
 					data.platformActivityId = this.platformActivityId
 				}
+				
+				// 显示加载提示
+				uni.showLoading({
+					title: '领取中...',
+					mask: true
+				})
+				
 				consumeCode(data).then(res => {
-					console.log(res)
-					uni.showToast({
-						title: '领取成功',
-						icon: 'success'
-					})
-					this.getQrcodeInfoFun(this.result)
+					console.log('领取响应:', res)
+					// 验证响应数据
+					if (res.code === 200 && res.data) {
+						uni.hideLoading()
+						uni.showToast({
+							title: '领取成功',
+							icon: 'success'
+						})
+						// 设置刚刚领取成功状态
+						this.isJustReceived = true
+						// 延迟刷新数据，确保后端数据已更新
+						setTimeout(() => {
+							this.getQrcodeInfoFun(this.result)
+						}, 1000)
+					} else {
+						throw new Error('领取失败：响应数据异常')
+					}
 				}).catch(err => {
 					console.error('领取失败:', err)
+					uni.hideLoading()
+					
 					if (err.code === 500 && err.msg === '请在酒吧附近100米范围内扫码') {
 						this.showError = true
+						this.errorType = 'location'
+					} else if (err.code === 500 && err.msg.includes('reward_sn')) {
+						uni.showToast({
+							title: '系统维护中，请稍后再试',
+							icon: 'none',
+							duration: 2000
+						})
+					} else if (err.code === 500 && err.msg.includes('已领取')) {
+						uni.showToast({
+							title: '该酒品已领取过，请勿重复领取',
+							icon: 'none',
+							duration: 2000
+						})
 					} else {
 						uni.showToast({
-							title: err.msg || '领取失败',
-							icon: 'none'
+							title: err.msg || '领取失败，请重试',
+							icon: 'none',
+							duration: 2000
 						})
 					}
 				})
@@ -645,585 +584,446 @@
 						// #endif
 					}
 				})
+			},
+			formatTime(timestamp) {
+				const date = new Date(timestamp);
+				return date.toLocaleString();
 			}
 		}
 	}
 </script>
 
 <style lang="scss" scoped>
-	.page {
-		height: 100vh;
-		background-color: #F5F7FA;
-		display: flex;
-		flex-direction: column;
-		justify-content: space-between;
-		padding: 0rpx 26rpx 60rpx;
-		
-		.error-page {
-			padding: 120rpx 32rpx;
-			display: flex;
-			flex-direction: column;
-			align-items: center;
-			
-			.status-icon {
-				width: 160rpx;
-				height: 160rpx;
-				margin-bottom: 32rpx;
-			}
-			
-			.status-title {
-				font-size: 36rpx;
-				color: #333333;
-				font-weight: 600;
-				margin-bottom: 16rpx;
-				text-align: center;
-			}
-			
-			.status-desc {
-				font-size: 28rpx;
-				color: #666666;
-				margin-bottom: 8rpx;
-				text-align: center;
-			}
-		}
-		
-		.product-section {
-			margin-top: 48rpx;
-			padding: 0 32rpx;
-			
-			.section-header {
-				display: flex;
-				align-items: center;
-				gap: 12rpx;
-				margin-bottom: 24rpx;
-				
-				.section-icon {
-					width: 40rpx;
-					height: 40rpx;
-				}
-				
-				text {
-					font-size: 32rpx;
-					color: #333333;
-					font-weight: 500;
-				}
-			}
-		}
-		
-		.product-card {
-			background: #FFFFFF;
-			border-radius: 16rpx;
-			padding: 24rpx;
-			box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.04);
-			margin-bottom: 32rpx;
-			
-			.product-content {
-				display: flex;
-				gap: 24rpx;
-				
-				.product-image {
-					width: 160rpx;
-					height: 240rpx;
-					border-radius: 12rpx;
-					overflow: hidden;
-					flex-shrink: 0;
-					
-					.cover {
-						width: 100%;
-						height: 100%;
-						object-fit: cover;
-					}
-				}
-				
-				.product-info {
-					flex: 1;
-					display: flex;
-					flex-direction: column;
-					justify-content: space-between;
-					
-					.product-name {
-						font-size: 32rpx;
-						color: #333333;
-						font-weight: 600;
-						margin-bottom: 12rpx;
-					}
-					
-					.product-brand {
-						font-size: 28rpx;
-						color: #666666;
-						margin-bottom: 16rpx;
-					}
-					
-					.product-details {
-						margin-bottom: 16rpx;
-						
-						.detail-item {
-							display: flex;
-							align-items: center;
-							margin-bottom: 8rpx;
-							
-							.detail-label {
-								font-size: 26rpx;
-								color: #999999;
-								margin-right: 8rpx;
-							}
-							
-							.detail-value {
-								font-size: 26rpx;
-								color: #333333;
-							}
-						}
-					}
-					
-					.product-rating {
-						display: flex;
-						align-items: center;
-						gap: 12rpx;
-						
-						.rating-stars {
-							display: flex;
-							align-items: center;
-							gap: 8rpx;
-							
-							.rating-value {
-								font-size: 26rpx;
-								color: #333333;
-								font-weight: 500;
-							}
-						}
-						
-						.rating-count {
-							font-size: 24rpx;
-							color: #999999;
-						}
-					}
-				}
-			}
-		}
-		
-		.lq-state-box {
-			display: flex;
-			flex-direction: column;
-			align-items: center;
-			margin-bottom: 92rpx;
-			padding-top: 116rpx;
+.scan-result {
+	min-height: 100vh;
+	background: #F5F7FA;
+	padding: 32rpx 26rpx 160rpx;
+	display: flex;
+	flex-direction: column;
+	box-sizing: border-box;
+	position: relative;
 
-			.img {
-				width: 160rpx;
-				height: 160rpx;
-				margin-bottom: 26rpx;
-			}
-			
-			text {
-				font-size: 32rpx;
-				color: #5F5F63;
-				font-weight: 400;
-			}
-		}
+	&__header {
+		text-align: center;
+		margin-bottom: 40rpx;
+		padding-top: 40rpx;
 
-		.scs-state-box {
+		&--success {
 			display: flex;
+			align-items: center;
 			justify-content: center;
-			align-items: center;
-			margin-bottom: 40rpx;
-			padding-top: 40rpx;
-			font-size: 36rpx;
-			color: #1E2019;
-			font-weight: 600;
-
-			.img {
-				width: 160rpx;
-				height: 160rpx;
-				margin-right: 48rpx;
-			}
-		}
-		
-		/* 卡片通用样式 */
-		.section-title {
-			margin-bottom: 28rpx;
-			
-			text {
-				font-size: 36rpx;
-				color: #0B0E26;
-				font-weight: 600;
-				position: relative;
-				padding-left: 24rpx;
-				
-				&::before {
-					content: '';
-					position: absolute;
-					left: 0;
-					top: 50%;
-					transform: translateY(-50%);
-					width: 6rpx;
-					height: 32rpx;
-					background: linear-gradient(180deg, #D42E78 0%, #19367A 100%);
-					border-radius: 3rpx;
-				}
-			}
-		}
-		
-		/* 福利卡片样式 */
-		.benefit-card {
-			background: #FFFFFF;
-			border-radius: 24rpx;
-			box-shadow: 0px 8rpx 24rpx rgba(0, 0, 0, 0.08);
-			padding: 36rpx;
-			margin-bottom: 40rpx;
-			
-			.benefit-content {
-				.benefit-title {
-					font-size: 32rpx;
-					font-weight: 600;
-					color: #3D3D3D;
-					margin-bottom: 12rpx;
-				}
-				
-				.benefit-subtitle {
-					font-size: 24rpx;
-					color: rgba(151, 151, 151, 0.75);
-					font-weight: 400;
-				}
-			}
-		}
-		
-		/* 活动提示样式 */
-		.activity-tip {
-			display: flex;
-			align-items: center;
-			background: rgba(254, 224, 52, 0.2);
-			border-radius: 16rpx;
-			padding: 20rpx 28rpx;
-			margin-bottom: 32rpx;
-			box-shadow: 0px 4rpx 12rpx rgba(0, 0, 0, 0.05);
-			
-			.tip-icon {
-				width: 40rpx;
-				height: 40rpx;
-				background: #FEE034;
-				color: #0B0E26;
-				border-radius: 50%;
-				display: flex;
-				align-items: center;
-				justify-content: center;
-				font-weight: 500;
-				margin-right: 16rpx;
-			}
-			
-			.tip-text {
-				font-size: 24rpx;
-				color: #5E5F60;
-				font-weight: 400;
-				
-				.highlight {
-					color: #DE3C4B;
-					font-weight: 500;
-				}
-			}
-		}
-		
-		/* 活动卡片样式 */
-		.activity-card {
-			background: #FFFFFF;
-			border-radius: 24rpx;
-			box-shadow: 0px 8rpx 24rpx rgba(0, 0, 0, 0.08);
-			padding: 28rpx;
-			margin-bottom: 32rpx;
-			border: 2rpx solid transparent;
-			transition: all 0.3s;
-			
-			&.activity-card-active {
-				border-color: #FEE034;
-				background: rgba(254, 224, 52, 0.05);
-				box-shadow: 0px 12rpx 32rpx rgba(0, 0, 0, 0.12);
-			}
-			
-			.activity-content {
-				display: flex;
-				
-				.activity-left {
-					width: 180rpx;
-					display: flex;
-					flex-direction: column;
-					align-items: center;
-					padding: 20rpx;
-					background: #F9F9F9;
-					border-radius: 16rpx;
-					margin-right: 28rpx;
-					box-shadow: 0px 4rpx 12rpx rgba(0, 0, 0, 0.05);
-					
-					.brand-logo-container {
-						width: 140rpx;
-						height: 140rpx;
-						border-radius: 16rpx;
-						margin-bottom: 20rpx;
-						overflow: hidden;
-						
-						.brand-logo {
-							width: 100%;
-							height: 100%;
-							object-fit: cover;
-						}
-					}
-					
-					.brand-logo-placeholder {
-						width: 140rpx;
-						height: 140rpx;
-						border-radius: 16rpx;
-						margin-bottom: 20rpx;
-						background: #EEEEEE;
-						display: flex;
-						align-items: center;
-						justify-content: center;
-						border: 2rpx dashed #CCCCCC;
-						
-						.placeholder-text {
-							font-size: 24rpx;
-							color: #999999;
-						}
-					}
-					
-					.progress-info {
-						display: flex;
-						flex-direction: column;
-						align-items: center;
-						text-align: center;
-						
-						.progress-label {
-							margin-top: 12rpx;
-							font-size: 24rpx;
-							color: #9E9E9E;
-							font-weight: 400;
-							margin-bottom: 32rpx;
-						}
-						
-						.progress-value {
-							.completed {
-								font-size: 32rpx;
-								color: #DE3C4B;
-								font-weight: 600;
-							}
-							
-							.remaining {
-								font-size: 40rpx;
-								color: #DE3C4B;
-								font-weight: 600;
-							}
-						}
-					}
-				}
-				
-				.activity-right {
-					flex: 1;
-					
-					.activity-header {
-						display: flex;
-						align-items: center;
-						justify-content: space-between;
-						margin-bottom: 20rpx;
-						
-						.activity-name {
-							font-size: 32rpx;
-							font-weight: 600;
-							color: #0B0E26;
-						}
-						
-						.activity-tag {
-							font-size: 24rpx;
-							color: #FFFFFF;
-							background: #DE3C4B;
-							padding: 4rpx 12rpx;
-							border-radius: 8rpx;
-						}
-					}
-					
-					.activity-details {
-						margin-bottom: 20rpx;
-						
-						.detail-row {
-							display: flex;
-							align-items: center;
-							margin-bottom: 12rpx;
-							
-							.detail-label {
-								font-size: 26rpx;
-								color: #999999;
-								margin-right: 8rpx;
-								flex-shrink: 0;
-							}
-							
-							.detail-value {
-								font-size: 26rpx;
-								color: #333333;
-								white-space: nowrap;
-								overflow: hidden;
-								text-overflow: ellipsis;
-								
-								.highlight {
-									color: #DE3C4B;
-									font-weight: 500;
-								}
-							}
-						}
-					}
-					
-					.beer-scroll {
-						width: 100%;
-						white-space: nowrap;
-						margin-bottom: 20rpx;
-						
-						.beer-item {
-							display: inline-block;
-							margin-right: 16rpx;
-							
-							.beer-cover {
-								width: 100rpx;
-								height: 144rpx;
-								border-radius: 8rpx;
-								box-shadow: 0px 4rpx 8rpx rgba(0, 0, 0, 0.1);
-							}
-						}
-					}
-					
-					.beer-scroll-placeholder {
-						width: 100%;
-						height: 144rpx;
-						background: #F5F5F5;
-						border-radius: 8rpx;
-						display: flex;
-						align-items: center;
-						justify-content: center;
-						margin-bottom: 20rpx;
-						
-						.placeholder-text {
-							font-size: 24rpx;
-							color: #999999;
-						}
-					}
-					
-					.reward-info {
-						display: flex;
-						align-items: center;
-						
-						.reward-label {
-							background: #FEE034;
-							color: #0B0E26;
-							font-size: 24rpx;
-							font-weight: 500;
-							padding: 6rpx 12rpx;
-							border-radius: 8rpx;
-							margin-right: 12rpx;
-						}
-						
-						.reward-value {
-							font-size: 26rpx;
-							color: #0B0E26;
-							font-weight: 400;
-						}
-					}
-					
-					.error-text {
-						color: #DE3C4B;
-						font-style: italic;
-					}
-				}
-			}
-		}
-		
-		/* 底部区域样式 */
-		.footer {
-			margin-top: 40rpx;
-			
-			.warning-tip {
-				display: flex;
-				align-items: center;
-				background: rgba(233, 233, 233, 0.38);
-				border-radius: 16rpx;
-				padding: 20rpx 28rpx;
-				margin-bottom: 32rpx;
-				box-shadow: 0px 4rpx 12rpx rgba(0, 0, 0, 0.05);
-				
-				.warning-icon {
-					width: 30rpx;
-					height: 30rpx;
-					margin-right: 12rpx;
-				}
-				
-				text {
-					font-size: 24rpx;
-					color: #5E5F60;
-					font-weight: 400;
-				}
-			}
-			
-			.action-buttons {
-				display: flex;
-				justify-content: space-between;
-				gap: 24rpx;
-				padding: 0 12rpx;
-				
-				.action-btn {
-					display: flex;
-					align-items: center;
-					justify-content: center;
-					width: calc(50% - 12rpx);
-					height: 96rpx;
-					border-radius: 12rpx;
-					font-size: 28rpx;
-					font-weight: 500;
-					box-shadow: 0px 4rpx 12rpx rgba(0, 0, 0, 0.1);
-					
-					.btn-icon {
-						width: 40rpx;
-						height: 40rpx;
-						margin-right: 12rpx;
-					}
-					
-					&.cancel-btn {
-						background-color: #D42E78;
-						color: #FFFFFF;
-						font-weight: 500;
-						
-						.btn-icon {
-							filter: brightness(0) invert(1);
-						}
-					}
-					
-					&.primary-btn {
-						background-color: #19367A;
-						color: #FFFFFF;
-						font-weight: 600;
-						
-						.btn-icon {
-							filter: brightness(0) invert(1);
-						}
-					}
-					
-					&.gift-btn {
-						background-color: #DE3C4B;
-						color: #FFFFFF;
-						font-weight: 500;
-						
-						.btn-icon {
-							filter: brightness(0) invert(1);
-						}
-					}
-				}
-			}
-		}
-		
-		/* 赠品状态样式 */
-		.gift-state {
-			.img {
-				width: 160rpx;
-				height: 160rpx;
-				margin-bottom: 26rpx;
-			}
-			text {
-				color: #DE3C4B;
-				font-size: 32rpx;
-				font-weight: 500;
-			}
+			gap: 20rpx;
 		}
 	}
+
+	&__icon {
+		width: 120rpx;
+		height: 120rpx;
+		margin-bottom: 24rpx;
+	}
+
+	&__title {
+		display: block;
+		font-size: 32rpx;
+		color: #333;
+		font-weight: 500;
+		margin-bottom: 16rpx;
+	}
+
+	&__desc {
+		display: block;
+		font-size: 28rpx;
+		color: #666;
+	}
+
+	&__content {
+		flex: 1;
+		overflow-y: auto;
+		-webkit-overflow-scrolling: touch;
+	}
+
+	&__section {
+		background: #FFF;
+		border-radius: 16rpx;
+		padding: 24rpx;
+		margin-bottom: 24rpx;
+	}
+
+	&__section-title {
+		font-size: 32rpx;
+		font-weight: 500;
+		color: #333;
+		margin-bottom: 24rpx;
+		display: block;
+		position: relative;
+		padding-left: 24rpx;
+
+		&::before {
+			content: '';
+			position: absolute;
+			left: 0;
+			top: 50%;
+			transform: translateY(-50%);
+			width: 6rpx;
+			height: 32rpx;
+			background: linear-gradient(180deg, #D42E78 0%, #19367A 100%);
+			border-radius: 3rpx;
+		}
+	}
+
+	&__footer {
+		margin-top: auto;
+		display: flex;
+		justify-content: space-between;
+		gap: 24rpx;
+		padding: 24rpx 32rpx env(safe-area-inset-bottom);
+		background: #fff;
+		position: fixed;
+		left: 0;
+		right: 0;
+		bottom: 0;
+		box-shadow: 0 -4rpx 20rpx rgba(0, 0, 0, 0.1);
+		z-index: 99;
+	}
+
+	&__btn {
+		flex: 1;
+		height: 88rpx;
+		border-radius: 44rpx;
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		font-size: 28rpx;
+		border: none;
+		padding: 0;
+
+		image {
+			width: 40rpx;
+			height: 40rpx;
+			margin-right: 8rpx;
+		}
+
+		&--back {
+			background: #F7F8FA;
+			color: #4E63E0;
+		}
+
+		&--share {
+			background: #19367A;
+			color: #FFF;
+		}
+
+		&:active {
+			transform: scale(0.98);
+			opacity: 0.9;
+		}
+	}
+}
+
+.product-card {
+	display: flex;
+	gap: 24rpx;
+
+	&__image {
+		width: 200rpx;
+		height: 280rpx;
+		border-radius: 12rpx;
+		overflow: hidden;
+
+		image {
+			width: 100%;
+			height: 100%;
+			object-fit: cover;
+		}
+	}
+
+	&__info {
+		flex: 1;
+	}
+
+	&__name {
+		font-size: 32rpx;
+		font-weight: 500;
+		color: #333;
+		margin-bottom: 8rpx;
+		display: block;
+	}
+
+	&__brand {
+		font-size: 28rpx;
+		color: #666;
+		margin-bottom: 16rpx;
+		display: block;
+	}
+
+	&__detail {
+		display: flex;
+		margin-bottom: 8rpx;
+	}
+
+	&__label {
+		font-size: 26rpx;
+		color: #999;
+	}
+
+	&__value {
+		font-size: 26rpx;
+		color: #333;
+	}
+
+	&__rating {
+		display: flex;
+		align-items: center;
+		margin-top: 16rpx;
+
+		.rating-stars {
+			display: flex;
+			align-items: center;
+			margin-right: 16rpx;
+
+			.cuIcon-favorfill {
+				color: #FFBC11;
+				margin-right: 4rpx;
+			}
+
+			.rating-value {
+				font-size: 28rpx;
+				color: #333;
+			}
+		}
+
+		.rating-count {
+			font-size: 24rpx;
+			color: #999;
+		}
+	}
+}
+
+.benefit-card {
+	background: #FFF;
+	padding: 24rpx;
+	border-radius: 16rpx;
+
+	&__title {
+		font-size: 32rpx;
+		font-weight: 600;
+		color: #3D3D3D;
+		margin-bottom: 12rpx;
+		display: block;
+	}
+
+	&__subtitle {
+		font-size: 24rpx;
+		color: rgba(151, 151, 151, 0.75);
+		font-weight: 400;
+	}
+}
+
+.activity-notice {
+	display: flex;
+	align-items: center;
+	background: #FFF9E6;
+	padding: 20rpx 24rpx;
+	border-radius: 12rpx;
+	margin-bottom: 24rpx;
+
+	image {
+		width: 32rpx;
+		height: 32rpx;
+		margin-right: 12rpx;
+	}
+
+	text {
+		font-size: 26rpx;
+		color: #FF9900;
+	}
+}
+
+.activity-list {
+	display: flex;
+	flex-direction: column;
+	gap: 24rpx;
+}
+
+.activity-item {
+	background: #FFFFFF;
+	border-radius: 20rpx;
+	padding: 32rpx;
+	border: 1px solid #EFEDE9;
+	box-shadow: 0 8rpx 16rpx rgba(0, 0, 0, 0.08);
+	transition: all 0.3s;
+	position: relative;
+
+	&--selected {
+		border-color: #19367A;
+		background: rgba(25, 54, 122, 0.05);
+	}
+
+	&__header {
+		display: flex;
+		align-items: center;
+		margin-bottom: 20rpx;
+	}
+
+	&__title {
+		font-size: 36rpx;
+		font-weight: bold;
+		color: #0B0E26;
+	}
+
+	&__tag-container {
+		position: absolute;
+		top: 32rpx;
+		left: 32rpx;
+		display: flex;
+		gap: 8rpx;
+		z-index: 1;
+	}
+
+	&__tag {
+		font-size: 20rpx;
+		color: #FFFFFF;
+		padding: 6rpx 16rpx;
+		border-radius: 8rpx;
+		box-shadow: 0 2rpx 6rpx rgba(0, 0, 0, 0.3);
+
+		&--store {
+			background-color: #D42E78;
+		}
+
+		&--new {
+			background-color: #19367A;
+		}
+
+		&--limited {
+			background-color: #FF6B35;
+		}
+	}
+
+	&__content {
+		padding-top: 48rpx;
+		display: flex;
+		flex-direction: column;
+		gap: 20rpx;
+	}
+
+	&__progress {
+		font-size: 28rpx;
+		font-weight: 500;
+		color: #0B0E26;
+		line-height: 44rpx;
+		display: flex;
+		justify-content: space-between;
+		align-items: center;
+	}
+
+	&__time, &__target {
+		font-size: 28rpx;
+		font-weight: 500;
+		color: #0B0E26;
+		line-height: 44rpx;
+	}
+
+	&__duration, &__count {
+		color: #D42E78;
+		font-weight: bold;
+	}
+
+	&__beers {
+		width: 100%;
+		display: flex;
+		flex-direction: row;
+		white-space: nowrap;
+		height: 200rpx;
+		margin: 4rpx 0 24rpx;
+		overflow-x: auto;
+	}
+
+	&__beer {
+		width: 120rpx;
+		height: 170rpx;
+		background: #FFFFFF;
+		margin-right: 8rpx;
+		display: inline-flex;
+		align-items: center;
+		justify-content: center;
+		border-radius: 12rpx;
+		overflow: hidden;
+
+		image {
+			width: 100%;
+			height: 100%;
+			border-radius: 12rpx;
+			box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.1);
+			object-fit: contain;
+		}
+	}
+
+	&__deadline {
+		font-size: 28rpx;
+		font-weight: 500;
+		color: #0B0E26;
+		line-height: 44rpx;
+		display: flex;
+		justify-content: space-between;
+		align-items: center;
+	}
+
+	&__remaining-days {
+		color: #FF6B35;
+		font-weight: bold;
+	}
+
+	&__remaining-count {
+		color: #19367A;
+		font-weight: bold;
+		font-size: 32rpx;
+	}
+
+	&__reward {
+		background: #F7F8FA;
+		border-radius: 16rpx;
+		padding: 24rpx;
+		margin-top: 20rpx;
+	}
+
+	&__reward-content {
+		display: flex;
+		align-items: center;
+		gap: 20rpx;
+		margin-top: 16rpx;
+	}
+
+	&__reward-image {
+		width: 120rpx;
+		height: 120rpx;
+		border-radius: 12rpx;
+		background: #FFFFFF;
+		box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.1);
+	}
+
+	&__reward-info {
+		flex: 1;
+		display: flex;
+		flex-direction: column;
+		gap: 8rpx;
+	}
+
+	&__reward-name {
+		font-size: 28rpx;
+		font-weight: 500;
+		color: #0B0E26;
+	}
+
+	&__reward-specs {
+		font-size: 24rpx;
+		color: #666666;
+	}
+
+	&__reward-count {
+		font-size: 24rpx;
+		color: #D42E78;
+		font-weight: 500;
+	}
+}
 </style>
\ No newline at end of file