refactor: 重构扫码结果页面状态展示

This commit is contained in:
davy 2025-04-09 14:04:46 +08:00
parent 9671183043
commit 912ec5f693
4 changed files with 698 additions and 402 deletions

View File

@ -5,8 +5,15 @@
<view class="section">
<view class="section-title">累计进度</view>
<view class="progress-content">
<!-- 状态提示信息 -->
<view class="status-tip" v-if="activity.activityStatus >= 2">
<text class="tip-text" v-if="activity.activityStatus == 2">累计目标已完成请耐心等待品牌方兑付奖励</text>
<text class="tip-text" v-if="activity.activityStatus == 3">品牌方已发起兑付奖励快递单号{{activity.expressNo || '暂无'}}请注意查收</text>
<text class="tip-text" v-if="activity.activityStatus == 4">累计活动已结束兑付时间{{activity.claimTime || '-'}}</text>
</view>
<!-- 剩余目标显示 -->
<view class="target-display">
<view class="target-display" v-if="activity.activityStatus < 2">
<text class="target-label">剩余累计目标</text>
<view class="target-number">
<text class="number">{{activity.remainingBeerCount || 0}}</text>
@ -15,7 +22,7 @@
</view>
<!-- 倒计时区域 -->
<view class="countdown-container">
<view class="countdown-container" v-if="activity.activityStatus < 2">
<view class="countdown-item">
<text class="number">{{remainingDays}}</text>
<text class="unit"></text>
@ -154,22 +161,29 @@
<view class="status-info">
<text class="label">活动状态</text>
<text class="status" :class="{
'status-ongoing': !reward,
'status-pending': reward && reward.rewardStatus == 0,
'status-completed': reward && reward.rewardStatus == 1
'status-ongoing': activity.activityStatus == 1,
'status-pending': activity.activityStatus == 2 || activity.activityStatus == 3,
'status-completed': activity.activityStatus == 4
}">
{{!reward ? '累计中' : (reward.rewardStatus == 0 ? '待确认' : '已确认')}}
{{activity.activityStatus == 0 ? '未参与' :
activity.activityStatus == 1 ? '累计中' :
activity.activityStatus == 2 ? '待兑付' :
activity.activityStatus == 3 ? '待确认' : '已完成'}}
</text>
</view>
<view class="action-button"
:class="{
'scan-btn': !reward,
'confirm-btn': reward && reward.rewardStatus == 0,
'completed-btn': reward && reward.rewardStatus == 1
'scan-btn': activity.activityStatus == 1,
'confirm-btn': activity.activityStatus == 3,
'completed-btn': activity.activityStatus == 2 || activity.activityStatus == 4
}"
@click="!reward ? toScan() : (reward.rewardStatus == 0 ? confirmPay() : null)">
<text class="cuIcon-qr_code" v-if="!reward"></text>
<text>{{!reward ? '扫码累计' : (reward.rewardStatus == 0 ? '确认兑付完成' : '兑付已确认')}}</text>
@click="activity.activityStatus == 1 ? toScan() :
activity.activityStatus == 3 ? confirmPay() : null">
<text class="cuIcon-qr_code" v-if="activity.activityStatus == 1"></text>
<text>{{activity.activityStatus == 0 ? '未参与' :
activity.activityStatus == 1 ? '扫码累计' :
activity.activityStatus == 2 ? '累计目标已完成' :
activity.activityStatus == 3 ? '确认兑付完成' : '已完成'}}</text>
</view>
</view>
</view>
@ -299,18 +313,17 @@
content: '确认兑付完成?',
success: (res) => {
if (res.confirm) {
confirmPayApi(this.reward.id).then(res => {
uni.showToast({
title: '确认成功',
icon: 'success',
})
this.init()
// 4
this.activity.activityStatus = 4
})
}
},
})
},
toScan() {
uni.switchTab({
@ -392,6 +405,21 @@
padding: 32rpx;
}
.status-tip {
text-align: center;
margin-bottom: 32rpx;
padding: 24rpx;
background: rgba(25, 54, 122, 0.05);
border-radius: 12rpx;
.tip-text {
font-size: 28rpx;
color: #19367A;
line-height: 1.5;
display: block;
}
}
.target-display {
text-align: center;
margin-bottom: 32rpx;

File diff suppressed because it is too large Load Diff

1
static/information.svg Normal file

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 14 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 4.0 KiB