|
|
|
|
@ -5,7 +5,7 @@
|
|
|
|
|
<view class="balance-card">
|
|
|
|
|
<view class="balance-info">
|
|
|
|
|
<view class="balance-label">当前余额</view>
|
|
|
|
|
<view class="balance-amount">¥{{ currentBalance }}</view>
|
|
|
|
|
<view class="balance-amount">¥{{ memberInfo.wallet_balance || 0 }}</view>
|
|
|
|
|
</view>
|
|
|
|
|
<view class="balance-icon">
|
|
|
|
|
<uv-icon name="empty-coupon" color="#4285f4" size="40"></uv-icon>
|
|
|
|
|
@ -17,13 +17,8 @@
|
|
|
|
|
<view class="recharge-section">
|
|
|
|
|
<view class="section-title">选择充值金额</view>
|
|
|
|
|
<view class="amount-grid">
|
|
|
|
|
<view
|
|
|
|
|
class="amount-item"
|
|
|
|
|
:class="{ active: selectedAmount === item.value }"
|
|
|
|
|
v-for="item in rechargeAmounts"
|
|
|
|
|
:key="item.value"
|
|
|
|
|
@click="selectAmount(item.value)"
|
|
|
|
|
>
|
|
|
|
|
<view class="amount-item" :class="{ active: selectedAmount === item.value }"
|
|
|
|
|
v-for="item in rechargeAmounts" :key="item.value" @click="selectAmount(item.value)">
|
|
|
|
|
<view class="amount-value">¥{{ item.value }}</view>
|
|
|
|
|
<!-- <view v-if="item.bonus" class="amount-bonus">送{{ item.bonus }}元</view> -->
|
|
|
|
|
</view>
|
|
|
|
|
@ -34,15 +29,10 @@
|
|
|
|
|
<view class="custom-label">自定义金额</view>
|
|
|
|
|
<view class="custom-input">
|
|
|
|
|
<text class="currency">¥</text>
|
|
|
|
|
<input
|
|
|
|
|
class="amount-input"
|
|
|
|
|
v-model="customAmount"
|
|
|
|
|
type="number"
|
|
|
|
|
placeholder="请输入充值金额"
|
|
|
|
|
@input="onCustomAmountInput"
|
|
|
|
|
/>
|
|
|
|
|
<input class="amount-input" v-model="customAmount" type="digit" placeholder="请输入充值金额"
|
|
|
|
|
@input="onCustomAmountInput" />
|
|
|
|
|
</view>
|
|
|
|
|
<view class="amount-tips">充值金额范围：¥1 - ¥50000</view>
|
|
|
|
|
<!-- <view class="amount-tips">充值金额范围：¥0.01 - ¥50000</view> -->
|
|
|
|
|
</view>
|
|
|
|
|
</view>
|
|
|
|
|
|
|
|
|
|
@ -51,11 +41,8 @@
|
|
|
|
|
<view class="section-title">选择支付方式</view>
|
|
|
|
|
<view class="payment-list">
|
|
|
|
|
<!-- 微信支付 -->
|
|
|
|
|
<view
|
|
|
|
|
class="payment-item"
|
|
|
|
|
:class="{ active: selectedPayment === 'wechat' }"
|
|
|
|
|
@click="selectPayment('wechat')"
|
|
|
|
|
>
|
|
|
|
|
<view class="payment-item" :class="{ active: selectedPayment === 'wechat' }"
|
|
|
|
|
@click="selectPayment('wechat')">
|
|
|
|
|
<view class="payment-info">
|
|
|
|
|
<uv-icon name="weixin-fill" color="#07c160" size="28"></uv-icon>
|
|
|
|
|
<view class="payment-details">
|
|
|
|
|
@ -63,20 +50,13 @@
|
|
|
|
|
<view class="payment-desc">安全快捷，支持零钱和银行卡</view>
|
|
|
|
|
</view>
|
|
|
|
|
</view>
|
|
|
|
|
<uv-icon
|
|
|
|
|
name="checkmark-circle-fill"
|
|
|
|
|
:color="selectedPayment === 'wechat' ? '#4285f4' : '#ccc'"
|
|
|
|
|
size="20"
|
|
|
|
|
></uv-icon>
|
|
|
|
|
<uv-icon name="checkmark-circle-fill" :color="selectedPayment === 'wechat' ? '#4285f4' : '#ccc'"
|
|
|
|
|
size="20"></uv-icon>
|
|
|
|
|
</view>
|
|
|
|
|
|
|
|
|
|
<!-- 支付宝支付 - 仅H5显示 -->
|
|
|
|
|
<view
|
|
|
|
|
v-if="showAlipay"
|
|
|
|
|
class="payment-item"
|
|
|
|
|
:class="{ active: selectedPayment === 'alipay' }"
|
|
|
|
|
@click="selectPayment('alipay')"
|
|
|
|
|
>
|
|
|
|
|
<view v-if="showAlipay" class="payment-item" :class="{ active: selectedPayment === 'alipay' }"
|
|
|
|
|
@click="selectPayment('alipay')">
|
|
|
|
|
<view class="payment-info">
|
|
|
|
|
<uv-icon name="/static/imgs/alipay.png" color="#1677ff" size="28"></uv-icon>
|
|
|
|
|
<view class="payment-details">
|
|
|
|
|
@ -84,11 +64,8 @@
|
|
|
|
|
<view class="payment-desc">便民生活，轻松支付</view>
|
|
|
|
|
</view>
|
|
|
|
|
</view>
|
|
|
|
|
<uv-icon
|
|
|
|
|
name="checkmark-circle-fill"
|
|
|
|
|
:color="selectedPayment === 'alipay' ? '#4285f4' : '#ccc'"
|
|
|
|
|
size="20"
|
|
|
|
|
></uv-icon>
|
|
|
|
|
<uv-icon name="checkmark-circle-fill" :color="selectedPayment === 'alipay' ? '#4285f4' : '#ccc'"
|
|
|
|
|
size="20"></uv-icon>
|
|
|
|
|
</view>
|
|
|
|
|
</view>
|
|
|
|
|
</view>
|
|
|
|
|
@ -118,13 +95,8 @@
|
|
|
|
|
<text class="recharge-text">充值金额：¥{{ finalAmount }}</text>
|
|
|
|
|
<!-- <text v-if="bonusAmount > 0" class="bonus-text">（含赠送¥{{ bonusAmount }}）</text> -->
|
|
|
|
|
</view>
|
|
|
|
|
<uv-button
|
|
|
|
|
type="primary"
|
|
|
|
|
size="large"
|
|
|
|
|
@click="confirmRecharge"
|
|
|
|
|
:loading="recharging"
|
|
|
|
|
:disabled="finalAmount <= 0"
|
|
|
|
|
>
|
|
|
|
|
<uv-button type="primary" size="large" @click="confirmRecharge" :loading="recharging"
|
|
|
|
|
:disabled="finalAmount <= 0">
|
|
|
|
|
立即充值
|
|
|
|
|
</uv-button>
|
|
|
|
|
</view>
|
|
|
|
|
@ -132,57 +104,95 @@
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
|
|
<script setup>
|
|
|
|
|
import { ref, computed, onMounted } from "vue";
|
|
|
|
|
import { onShow } from "@dcloudio/uni-app";
|
|
|
|
|
import { useAuthStore, useUserStore } from "@/store";
|
|
|
|
|
import RPC from "@/utils/request";
|
|
|
|
|
|
|
|
|
|
const authStore = useAuthStore();
|
|
|
|
|
const userStore = useUserStore();
|
|
|
|
|
|
|
|
|
|
// 响应式数据
|
|
|
|
|
const currentBalance = ref(50.00);
|
|
|
|
|
const selectedAmount = ref(0);
|
|
|
|
|
const customAmount = ref('');
|
|
|
|
|
const selectedPayment = ref('wechat');
|
|
|
|
|
const recharging = ref(false);
|
|
|
|
|
const showAlipay = ref(true);
|
|
|
|
|
|
|
|
|
|
// 充值金额选项
|
|
|
|
|
const rechargeAmounts = ref([
|
|
|
|
|
{ value: 10, bonus: 0 },
|
|
|
|
|
{ value: 50, bonus: 0 },
|
|
|
|
|
{ value: 100, bonus: 0 },
|
|
|
|
|
{ value: 200, bonus: 0 },
|
|
|
|
|
{ value: 500, bonus: 0 },
|
|
|
|
|
{ value: 1000, bonus: 0 }
|
|
|
|
|
]);
|
|
|
|
|
|
|
|
|
|
// 计算最终充值金额
|
|
|
|
|
const finalAmount = computed(() => {
|
|
|
|
|
import {
|
|
|
|
|
ref,
|
|
|
|
|
computed,
|
|
|
|
|
onMounted
|
|
|
|
|
} from "vue";
|
|
|
|
|
import {
|
|
|
|
|
onShow
|
|
|
|
|
} from "@dcloudio/uni-app";
|
|
|
|
|
import {
|
|
|
|
|
useAuthStore,
|
|
|
|
|
useUserStore
|
|
|
|
|
} from "@/store";
|
|
|
|
|
import RPC from "@/utils/request";
|
|
|
|
|
|
|
|
|
|
const authStore = useAuthStore();
|
|
|
|
|
const userStore = useUserStore();
|
|
|
|
|
|
|
|
|
|
const memberInfo = ref({})
|
|
|
|
|
const getMemberInfo = () => {
|
|
|
|
|
uni.showLoading();
|
|
|
|
|
RPC.post('/membership/user/info', {
|
|
|
|
|
user_id: userStore.userInfo.id
|
|
|
|
|
}).then(res => {
|
|
|
|
|
memberInfo.value = res || {}
|
|
|
|
|
}).finally(() => {
|
|
|
|
|
uni.hideLoading();
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// 响应式数据
|
|
|
|
|
const currentBalance = ref(0);
|
|
|
|
|
const selectedAmount = ref(0);
|
|
|
|
|
const customAmount = ref('');
|
|
|
|
|
const selectedPayment = ref('wechat');
|
|
|
|
|
const recharging = ref(false);
|
|
|
|
|
const showAlipay = ref(true);
|
|
|
|
|
|
|
|
|
|
// 充值金额选项
|
|
|
|
|
const rechargeAmounts = ref([{
|
|
|
|
|
value: 10,
|
|
|
|
|
bonus: 0
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
value: 50,
|
|
|
|
|
bonus: 0
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
value: 100,
|
|
|
|
|
bonus: 0
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
value: 200,
|
|
|
|
|
bonus: 0
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
value: 500,
|
|
|
|
|
bonus: 0
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
value: 1000,
|
|
|
|
|
bonus: 0
|
|
|
|
|
}
|
|
|
|
|
]);
|
|
|
|
|
|
|
|
|
|
// 计算最终充值金额
|
|
|
|
|
const finalAmount = computed(() => {
|
|
|
|
|
if (customAmount.value && parseFloat(customAmount.value) > 0) {
|
|
|
|
|
return parseFloat(customAmount.value);
|
|
|
|
|
}
|
|
|
|
|
return selectedAmount.value;
|
|
|
|
|
});
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
// 计算赠送金额
|
|
|
|
|
const bonusAmount = computed(() => {
|
|
|
|
|
// 计算赠送金额
|
|
|
|
|
const bonusAmount = computed(() => {
|
|
|
|
|
if (selectedAmount.value > 0) {
|
|
|
|
|
const selected = rechargeAmounts.value.find(item => item.value === selectedAmount.value);
|
|
|
|
|
return selected ? selected.bonus : 0;
|
|
|
|
|
}
|
|
|
|
|
return 0;
|
|
|
|
|
});
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
// 选择充值金额
|
|
|
|
|
const selectAmount = (amount) => {
|
|
|
|
|
// 选择充值金额
|
|
|
|
|
const selectAmount = (amount) => {
|
|
|
|
|
selectedAmount.value = amount;
|
|
|
|
|
customAmount.value = '';
|
|
|
|
|
};
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
// 自定义金额输入
|
|
|
|
|
const onCustomAmountInput = () => {
|
|
|
|
|
// 自定义金额输入
|
|
|
|
|
const onCustomAmountInput = () => {
|
|
|
|
|
selectedAmount.value = 0;
|
|
|
|
|
|
|
|
|
|
// 限制输入范围
|
|
|
|
|
@ -194,15 +204,15 @@ const onCustomAmountInput = () => {
|
|
|
|
|
icon: 'none'
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
};
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
// 选择支付方式
|
|
|
|
|
const selectPayment = (payment) => {
|
|
|
|
|
// 选择支付方式
|
|
|
|
|
const selectPayment = (payment) => {
|
|
|
|
|
selectedPayment.value = payment;
|
|
|
|
|
};
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
// 检查环境
|
|
|
|
|
const checkEnvironment = () => {
|
|
|
|
|
// 检查环境
|
|
|
|
|
const checkEnvironment = () => {
|
|
|
|
|
// #ifdef MP-WEIXIN
|
|
|
|
|
// 微信小程序环境，隐藏支付宝选项
|
|
|
|
|
showAlipay.value = false;
|
|
|
|
|
@ -217,10 +227,10 @@ const checkEnvironment = () => {
|
|
|
|
|
const isWechat = ua.indexOf('micromessenger') !== -1;
|
|
|
|
|
selectedPayment.value = isWechat ? 'wechat' : 'alipay';
|
|
|
|
|
// #endif
|
|
|
|
|
};
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
// 微信支付
|
|
|
|
|
const wechatPay = async (orderInfo) => {
|
|
|
|
|
// 微信支付
|
|
|
|
|
const wechatPay = async (orderInfo) => {
|
|
|
|
|
// #ifdef MP-WEIXIN
|
|
|
|
|
// 微信小程序支付
|
|
|
|
|
try {
|
|
|
|
|
@ -234,7 +244,10 @@ const wechatPay = async (orderInfo) => {
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
console.log('微信支付成功:', paymentResult);
|
|
|
|
|
return { success: true, data: paymentResult };
|
|
|
|
|
return {
|
|
|
|
|
success: true,
|
|
|
|
|
data: paymentResult
|
|
|
|
|
};
|
|
|
|
|
} catch (error) {
|
|
|
|
|
console.error('微信支付失败:', error);
|
|
|
|
|
if (error.errMsg === 'requestPayment:fail cancel') {
|
|
|
|
|
@ -257,7 +270,10 @@ const wechatPay = async (orderInfo) => {
|
|
|
|
|
paySign: orderInfo.paySign
|
|
|
|
|
}, (res) => {
|
|
|
|
|
if (res.err_msg === 'get_brand_wcpay_request:ok') {
|
|
|
|
|
resolve({ success: true, data: res });
|
|
|
|
|
resolve({
|
|
|
|
|
success: true,
|
|
|
|
|
data: res
|
|
|
|
|
});
|
|
|
|
|
} else if (res.err_msg === 'get_brand_wcpay_request:cancel') {
|
|
|
|
|
reject(new Error('用户取消支付'));
|
|
|
|
|
} else {
|
|
|
|
|
@ -269,23 +285,29 @@ const wechatPay = async (orderInfo) => {
|
|
|
|
|
// 不在微信环境，跳转到支付页面
|
|
|
|
|
const payUrl = orderInfo.mwebUrl;
|
|
|
|
|
window.location.href = payUrl;
|
|
|
|
|
return { success: true, redirect: true };
|
|
|
|
|
return {
|
|
|
|
|
success: true,
|
|
|
|
|
redirect: true
|
|
|
|
|
};
|
|
|
|
|
}
|
|
|
|
|
// #endif
|
|
|
|
|
};
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
// 支付宝支付（仅H5环境）
|
|
|
|
|
const alipayPay = async (orderInfo) => {
|
|
|
|
|
// 支付宝支付（仅H5环境）
|
|
|
|
|
const alipayPay = async (orderInfo) => {
|
|
|
|
|
// #ifdef H5
|
|
|
|
|
// H5支付宝支付
|
|
|
|
|
const payUrl = orderInfo.payUrl;
|
|
|
|
|
window.location.href = payUrl;
|
|
|
|
|
return { success: true, redirect: true };
|
|
|
|
|
return {
|
|
|
|
|
success: true,
|
|
|
|
|
redirect: true
|
|
|
|
|
};
|
|
|
|
|
// #endif
|
|
|
|
|
};
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
// 确认充值
|
|
|
|
|
const confirmRecharge = async () => {
|
|
|
|
|
// 确认充值
|
|
|
|
|
const confirmRecharge = async () => {
|
|
|
|
|
if (finalAmount.value <= 0) {
|
|
|
|
|
uni.showToast({
|
|
|
|
|
title: '请选择充值金额',
|
|
|
|
|
@ -294,13 +316,13 @@ const confirmRecharge = async () => {
|
|
|
|
|
return;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
if (finalAmount.value < 1) {
|
|
|
|
|
uni.showToast({
|
|
|
|
|
title: '充值金额不能少于1元',
|
|
|
|
|
icon: 'none'
|
|
|
|
|
});
|
|
|
|
|
return;
|
|
|
|
|
}
|
|
|
|
|
// if (finalAmount.value < 1) {
|
|
|
|
|
// uni.showToast({
|
|
|
|
|
// title: '充值金额不能少于1元',
|
|
|
|
|
// icon: 'none'
|
|
|
|
|
// });
|
|
|
|
|
// return;
|
|
|
|
|
// }
|
|
|
|
|
|
|
|
|
|
if (!selectedPayment.value) {
|
|
|
|
|
uni.showToast({
|
|
|
|
|
@ -314,46 +336,50 @@ const confirmRecharge = async () => {
|
|
|
|
|
|
|
|
|
|
try {
|
|
|
|
|
// 创建充值订单参数
|
|
|
|
|
const orderParams = {
|
|
|
|
|
type: 'recharge',
|
|
|
|
|
amount: finalAmount.value,
|
|
|
|
|
bonusAmount: bonusAmount.value,
|
|
|
|
|
paymentMethod: selectedPayment.value,
|
|
|
|
|
userId: userStore.userInfo?.id || 'mock_user_id',
|
|
|
|
|
// #ifdef MP-WEIXIN
|
|
|
|
|
platform: 'mp-weixin',
|
|
|
|
|
// #endif
|
|
|
|
|
// #ifdef H5
|
|
|
|
|
platform: 'h5',
|
|
|
|
|
// #endif
|
|
|
|
|
};
|
|
|
|
|
// const orderParams = {
|
|
|
|
|
// type: 'recharge',
|
|
|
|
|
// amount: finalAmount.value,
|
|
|
|
|
// bonusAmount: bonusAmount.value,
|
|
|
|
|
// paymentMethod: selectedPayment.value,
|
|
|
|
|
// userId: userStore.userInfo?.id || 'mock_user_id',
|
|
|
|
|
// // #ifdef MP-WEIXIN
|
|
|
|
|
// platform: 'mp-weixin',
|
|
|
|
|
// // #endif
|
|
|
|
|
// // #ifdef H5
|
|
|
|
|
// platform: 'h5',
|
|
|
|
|
// // #endif
|
|
|
|
|
// };
|
|
|
|
|
|
|
|
|
|
uni.showLoading({
|
|
|
|
|
title: '正在创建订单...'
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
// 调用后端创建充值订单API
|
|
|
|
|
// const orderResult = await RPC.post('/api/recharge/create', orderParams);
|
|
|
|
|
|
|
|
|
|
const orderNum = await RPC.post('/wallet/recharge', {
|
|
|
|
|
user_id: userStore.userInfo.id,
|
|
|
|
|
amount_cents: finalAmount.value * 100,
|
|
|
|
|
pay_channel: selectedPayment.value
|
|
|
|
|
})
|
|
|
|
|
console.log('orderNum', orderNum)
|
|
|
|
|
// 模拟创建订单返回的数据
|
|
|
|
|
const orderResult = {
|
|
|
|
|
orderId: 'RECHARGE_' + Date.now(),
|
|
|
|
|
amount: orderParams.amount,
|
|
|
|
|
// 微信支付参数
|
|
|
|
|
wechatPayInfo: {
|
|
|
|
|
appId: 'wx1234567890',
|
|
|
|
|
timeStamp: String(Date.now()),
|
|
|
|
|
nonceStr: 'random_string_' + Date.now(),
|
|
|
|
|
package: 'prepay_id=wx_prepay_id_123456',
|
|
|
|
|
signType: 'RSA',
|
|
|
|
|
paySign: 'mock_pay_sign_123456',
|
|
|
|
|
mwebUrl: 'https://wx.tenpay.com/cgi-bin/mmpayweb-bin/checkmweb?prepay_id=wx_prepay_id_123456'
|
|
|
|
|
},
|
|
|
|
|
// 支付宝支付参数
|
|
|
|
|
alipayInfo: {
|
|
|
|
|
payUrl: 'https://openapi.alipay.com/gateway.do?mock_recharge_url'
|
|
|
|
|
}
|
|
|
|
|
};
|
|
|
|
|
// const orderResult = {
|
|
|
|
|
// orderId: 'RECHARGE_' + Date.now(),
|
|
|
|
|
// amount: orderParams.amount,
|
|
|
|
|
// // 微信支付参数
|
|
|
|
|
// wechatPayInfo: {
|
|
|
|
|
// appId: 'wx1234567890',
|
|
|
|
|
// timeStamp: String(Date.now()),
|
|
|
|
|
// nonceStr: 'random_string_' + Date.now(),
|
|
|
|
|
// package: 'prepay_id=wx_prepay_id_123456',
|
|
|
|
|
// signType: 'RSA',
|
|
|
|
|
// paySign: 'mock_pay_sign_123456',
|
|
|
|
|
// mwebUrl: 'https://wx.tenpay.com/cgi-bin/mmpayweb-bin/checkmweb?prepay_id=wx_prepay_id_123456'
|
|
|
|
|
// },
|
|
|
|
|
// // 支付宝支付参数
|
|
|
|
|
// alipayInfo: {
|
|
|
|
|
// payUrl: 'https://openapi.alipay.com/gateway.do?mock_recharge_url'
|
|
|
|
|
// }
|
|
|
|
|
// };
|
|
|
|
|
|
|
|
|
|
uni.hideLoading();
|
|
|
|
|
|
|
|
|
|
@ -361,10 +387,18 @@ const confirmRecharge = async () => {
|
|
|
|
|
let paymentResult;
|
|
|
|
|
|
|
|
|
|
if (selectedPayment.value === 'wechat') {
|
|
|
|
|
const res = await uni.login({
|
|
|
|
|
provider: 'weixin'
|
|
|
|
|
})
|
|
|
|
|
const orderResult = await RPC.post('/membership/order/pay_by_wechat_mini', {
|
|
|
|
|
code: res.code,
|
|
|
|
|
"order_no": orderNum.order_no
|
|
|
|
|
})
|
|
|
|
|
uni.showLoading({
|
|
|
|
|
title: '正在跳转微信支付...'
|
|
|
|
|
title: "正在跳转微信支付...",
|
|
|
|
|
});
|
|
|
|
|
paymentResult = await wechatPay(orderResult.wechatPayInfo);
|
|
|
|
|
console.log('orderResult', orderResult)
|
|
|
|
|
paymentResult = await wechatPay(orderResult);
|
|
|
|
|
} else if (selectedPayment.value === 'alipay') {
|
|
|
|
|
uni.showLoading({
|
|
|
|
|
title: '正在跳转支付宝...'
|
|
|
|
|
@ -390,12 +424,12 @@ const confirmRecharge = async () => {
|
|
|
|
|
icon: 'success'
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
// 更新余额
|
|
|
|
|
currentBalance.value += finalAmount.value + bonusAmount.value;
|
|
|
|
|
|
|
|
|
|
// 重置选择
|
|
|
|
|
selectedAmount.value = 0;
|
|
|
|
|
customAmount.value = '';
|
|
|
|
|
// setTimeout(() => {
|
|
|
|
|
// getMemberInfo()
|
|
|
|
|
// },1000)
|
|
|
|
|
|
|
|
|
|
// 延迟返回上一页
|
|
|
|
|
setTimeout(() => {
|
|
|
|
|
@ -422,10 +456,10 @@ const confirmRecharge = async () => {
|
|
|
|
|
} finally {
|
|
|
|
|
recharging.value = false;
|
|
|
|
|
}
|
|
|
|
|
};
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
// 处理支付回调
|
|
|
|
|
const handlePaymentCallback = () => {
|
|
|
|
|
// 处理支付回调
|
|
|
|
|
const handlePaymentCallback = () => {
|
|
|
|
|
// #ifdef H5
|
|
|
|
|
const urlParams = new URLSearchParams(window.location.search);
|
|
|
|
|
const orderId = urlParams.get('orderId');
|
|
|
|
|
@ -459,10 +493,10 @@ const handlePaymentCallback = () => {
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
// #endif
|
|
|
|
|
};
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
// 加载用户余额
|
|
|
|
|
const loadUserBalance = async () => {
|
|
|
|
|
// 加载用户余额
|
|
|
|
|
const loadUserBalance = async () => {
|
|
|
|
|
try {
|
|
|
|
|
// 调用获取用户余额API
|
|
|
|
|
// const result = await RPC.get('/api/user/balance');
|
|
|
|
|
@ -470,27 +504,28 @@ const loadUserBalance = async () => {
|
|
|
|
|
} catch (error) {
|
|
|
|
|
console.error('加载余额失败:', error);
|
|
|
|
|
}
|
|
|
|
|
};
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
onMounted(() => {
|
|
|
|
|
onMounted(() => {
|
|
|
|
|
checkEnvironment();
|
|
|
|
|
loadUserBalance();
|
|
|
|
|
handlePaymentCallback();
|
|
|
|
|
});
|
|
|
|
|
// loadUserBalance();
|
|
|
|
|
// handlePaymentCallback();
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
onShow(() => {
|
|
|
|
|
onShow(() => {
|
|
|
|
|
handlePaymentCallback();
|
|
|
|
|
});
|
|
|
|
|
getMemberInfo()
|
|
|
|
|
});
|
|
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
|
|
.container {
|
|
|
|
|
.container {
|
|
|
|
|
min-height: 100vh;
|
|
|
|
|
background-color: #f8f8f8;
|
|
|
|
|
padding-bottom: 120px;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.balance-section {
|
|
|
|
|
.balance-section {
|
|
|
|
|
padding: 20px 16px;
|
|
|
|
|
background: linear-gradient(135deg, #4285f4 0%, #6fa8f5 100%);
|
|
|
|
|
|
|
|
|
|
@ -520,11 +555,11 @@ onShow(() => {
|
|
|
|
|
opacity: 0.8;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.recharge-section,
|
|
|
|
|
.payment-section,
|
|
|
|
|
.notice-section {
|
|
|
|
|
.recharge-section,
|
|
|
|
|
.payment-section,
|
|
|
|
|
.notice-section {
|
|
|
|
|
margin: 16px;
|
|
|
|
|
background: white;
|
|
|
|
|
border-radius: 12px;
|
|
|
|
|
@ -536,9 +571,9 @@ onShow(() => {
|
|
|
|
|
color: #333;
|
|
|
|
|
margin-bottom: 16px;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.amount-grid {
|
|
|
|
|
.amount-grid {
|
|
|
|
|
display: grid;
|
|
|
|
|
grid-template-columns: repeat(3, 1fr);
|
|
|
|
|
gap: 12px;
|
|
|
|
|
@ -569,9 +604,9 @@ onShow(() => {
|
|
|
|
|
color: #ff4d4f;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.custom-amount {
|
|
|
|
|
.custom-amount {
|
|
|
|
|
.custom-label {
|
|
|
|
|
font-size: 14px;
|
|
|
|
|
color: #666;
|
|
|
|
|
@ -605,9 +640,9 @@ onShow(() => {
|
|
|
|
|
font-size: 12px;
|
|
|
|
|
color: #999;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.payment-list {
|
|
|
|
|
.payment-list {
|
|
|
|
|
.payment-item {
|
|
|
|
|
display: flex;
|
|
|
|
|
align-items: center;
|
|
|
|
|
@ -646,9 +681,9 @@ onShow(() => {
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.notice-list {
|
|
|
|
|
.notice-list {
|
|
|
|
|
.notice-item {
|
|
|
|
|
display: flex;
|
|
|
|
|
align-items: flex-start;
|
|
|
|
|
@ -666,9 +701,9 @@ onShow(() => {
|
|
|
|
|
line-height: 1.4;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.bottom-section {
|
|
|
|
|
.bottom-section {
|
|
|
|
|
position: fixed;
|
|
|
|
|
bottom: 0;
|
|
|
|
|
left: 0;
|
|
|
|
|
@ -695,5 +730,5 @@ onShow(() => {
|
|
|
|
|
margin-left: 4px;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
</style>
|
