zm/taimed-international-app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

更新：增加活动充值金额模块

Browse Source
This commit is contained in:
fuchao
2025-12-05 08:58:56 +08:00
parent 50743184ff
commit 063dac39e4
1 changed files with 28 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

35
pages/user/recharge/index.vue
View File

@@ -2,16 +2,31 @@
<view class="recharge-page"> <view class="recharge-page">
<!-- 自定义导航栏 --> <!-- 自定义导航栏 -->
<nav-bar :title="$t('order.recharge')"></nav-bar> <nav-bar :title="$t('order.recharge')"></nav-bar>
<!-- 活动充值金额 -->
<view class="block" v-if="eventAmountList.length > 0">
<!-- <view class="text">{{$t('order.rechargeAmount')}}</view> -->
<view class="text">活动充值金额</view>
<view class="recharge">
<view class="recharge_block" @click="chosPric(item)"
:class="aloneItem.priceTypeId === item.priceTypeId ? 'selected' : ''"
v-for="item in eventAmountList" :key="item.priceTypeId">
<view class="recharge_money">NZ${{item.realMoney}}</view>
<view style="font-size: 26rpx;">{{item.money}}{{ $t('global.coin') }}</view>
<span class="activity-label" v-if="item.givejf >0">{{item.description}}</span>
<text class="recharge_give"
v-if="item.givejf >0">（{{$t('order.give')}}{{item.givejf}}{{$t('order.points')}}）</text>
</view>
</view>
</view>
<!-- 标准充值金额 -->
<view class="block"> <view class="block">
<view class="text">{{$t('order.rechargeAmount')}}</view> <view class="text">{{$t('order.rechargeAmount')}}</view>
<view class="recharge"> <view class="recharge">
<view class="recharge_block" @click="chosPric(item)" <view class="recharge_block" @click="chosPric(item)"
:class="aloneItem.priceTypeId === item.priceTypeId ? 'selected' : ''" :class="aloneItem.priceTypeId === item.priceTypeId ? 'selected' : ''"
v-for="item in rechargeList.bookBuyConfigList" :key="item.priceTypeId"> v-for="item in standardAmountList" :key="item.priceTypeId">
<view class="recharge_money">NZ${{item.realMoney}}</view> <view class="recharge_money">NZ${{item.realMoney}}</view>
<view style="font-size: 26rpx;">{{item.money}}{{ $t('global.coin') }}</view> <view style="font-size: 26rpx;">{{item.money}}{{ $t('global.coin') }}</view>
<!-- 红框位置的618活动标签 -->
<!-- <view class="activity-tag">618活动</view> -->
<span class="activity-label" v-if="item.givejf >0">{{item.description}}</span> <span class="activity-label" v-if="item.givejf >0">{{item.description}}</span>
<text class="recharge_give" <text class="recharge_give"
v-if="item.givejf >0">（{{$t('order.give')}}{{item.givejf}}{{$t('order.points')}}）</text> v-if="item.givejf >0">（{{$t('order.give')}}{{item.givejf}}{{$t('order.points')}}）</text>
@@ -116,7 +131,10 @@
const purchaseToken = ref() const purchaseToken = ref()
// 订单编号 // 订单编号
const orderSn = ref('') const orderSn = ref('')
// 活动充值数据
const eventAmountList = ref([])
//正常金额数据
const standardAmountList = ref([])
/** /**
* 获取使用环境 * 获取使用环境
@@ -140,8 +158,11 @@
try { try {
rechargeList.value = await getBookBuyConfigList(type.value, qudao.value) rechargeList.value = await getBookBuyConfigList(type.value, qudao.value)
console.log(rechargeList.value.bookBuyConfigList, '充值列表'); console.log(rechargeList.value.bookBuyConfigList, '充值列表');
const data = rechargeList.value.bookBuyConfigList
// 默认选择第一个金额 // 默认选择第一个金额
aloneItem.value = rechargeList.value.bookBuyConfigList[0] aloneItem.value = data[0]
eventAmountList.value = data.filter(item => item.givejf > 0)
standardAmountList.value = data.filter(item => item.givejf <= 0)
} catch (error) { } catch (error) {
console.error('获取订单列表失败:', error) console.error('获取订单列表失败:', error)
} }
@@ -382,7 +403,7 @@
color: #007bff; color: #007bff;
padding: 30rpx 0 20rpx 30rpx; padding: 30rpx 0 20rpx 30rpx;
} }
.recharge { .recharge {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
@@ -546,7 +567,7 @@
.active_block { .active_block {
background-color: rgba(37, 143, 235, 0.2); background-color: rgba(37, 143, 235, 0.2);
margin: 0 30rpx 20rpx 30rpx; margin: 0 30rpx 20rpx 30rpx;
border-radius: 10rpx; border-radius: 10rpx;
padding: 15rpx; padding: 15rpx;
font-size: 28rpx; font-size: 28rpx;
color: #333; color: #333;