wangxiaowei/xiuhuwangqiu
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

修改充值弹窗

Browse Source
This commit is contained in:
wangxiaowei
2025-12-30 18:17:59 +08:00
parent a9f6c940bb
commit a9b34c58ad
1 changed files with 379 additions and 269 deletions
Download Patch File Download Diff File Expand all files Collapse all files

168
bundle/recharge/recharge.vue
View File

@ -10,9 +10,11 @@
<view class="bg-white card"> <view class="bg-white card">
<view> <view>
<view class="card-item" :class="currentType == i + 1 ? 'active' : ''" v-for="i in 5" :key="i" @click="selectCard(i + 1)"> <view class="card-item" :class="currentType == i + 1 ? 'active' : ''" v-for="i in 5" :key="i"
@click="selectCard(i + 1)">
<view class="d-f a-i-c"> <view class="d-f a-i-c">
<view class="icon-box d-c-c card-checkout"><span class="icon iconfont icon-xuanze"></span></view> <view class="icon-box d-c-c card-checkout"><span class="icon iconfont icon-xuanze"></span>
</view>
<view class="card-balance">充值{{ balance['balance' + (i + 1)] }}</view> <view class="card-balance">充值{{ balance['balance' + (i + 1)] }}</view>
</view> </view>
<view class="d-f a-i-c"> <view class="d-f a-i-c">
@ -26,11 +28,11 @@
</view> </view>
</view> </view>
</view> </view>
<view > <view>
<checkbox-group @change="checkboxChange"> <!-- <checkbox-group @change="checkboxChange">
<text class="" style="margin-right: 20rpx;" @click="see">我已阅读并同意充值协议</text> <text class="" style="margin-right: 20rpx;" @click="see">我已阅读并同意充值协议</text>
<checkbox value="true" :checked="yxChekced"/> <checkbox value="true" :checked="yxChekced"/>
</checkbox-group> </checkbox-group> -->
<!-- <text class="" style="margin-right: 20rpx;">我已阅读并同意充值协议</text> <!-- <text class="" style="margin-right: 20rpx;">我已阅读并同意充值协议</text>
<checkbox value="cb" class="checkbox" :checked="yxChekced" @change="yxChekced = !yxChekced" /> --> <checkbox value="cb" class="checkbox" :checked="yxChekced" @change="yxChekced = !yxChekced" /> -->
</view> </view>
@ -44,7 +46,7 @@
<view class="r-desc2">c.充值前请先查看本协议<text style="color: #FF5951;" @click="see">《充值协议》</text>。</view> <view class="r-desc2">c.充值前请先查看本协议<text style="color: #FF5951;" @click="see">《充值协议》</text>。</view>
</view> </view>
<view class="card-btn" @click="confirmCard">确定</view> <view class="card-btn" @click="openXieYi">确定</view>
</view> </view>
<!-- 会员卡选择弹窗 --> <!-- 会员卡选择弹窗 -->
@ -60,14 +62,39 @@
</view> </view>
</view> </view>
</Popup> --> </Popup> -->
<Popup :show="cardPopup" :width='680' :padding="0" backgroundColor="#fff" radius="16rpx">
<view class="notice-popup">
<view class="title" style="font-size: 36rpx; color: #303133; line-height: 50rpx;margin-top: 20rpx;">充值说明
</view>
<view class="desc" style="text-align: left; padding: 0 30rpx;">
<view class="r-desc2" style="margin-bottom: 10rpx;">a.账户充值仅限在线方式支付，充值金额实时到账；</view>
<view class="r-desc2" style="margin-bottom: 10rpx;">b.有问题请联系客服。</view>
<!-- <view class="r-desc2" style="margin-bottom: 10rpx;">c.充值前请先查看本协议<text style="color: #FF5951;" @click="see">《充值协议》</text>。</view> -->
<view class="r-desc2 xy" style="margin-bottom: 10rpx;display: flex; align-items: center; flex-wrap: wrap;" @click="yxChekced = !yxChekced">
<view style="margin-right: 10rpx;" :class="yxChekced ? 'active' : ''">
<view class="icon-box d-c-c card-checkout"><span class="icon iconfont icon-xuanze" style="font-size: 46rpx;"></span>
</view>
</view>
<view class="" style="font-size: 30rpx;">
我已认真阅读并查看此协议<text style="color: #FF5951;" @click="see">《充值协议》</text>
</view>
</view>
</view>
<view class="btn">
<view class="btn1" @click="cardPopup = false">取消</view>
<view class="btn2" @click="confirmCard">确定</view>
</view>
</view>
</Popup>
</view> </view>
</template> </template>
<script> <script>
import navbar from '@/components/navbar.vue'; import navbar from '@/components/navbar.vue';
import Popup from '@/components/uni-popup.vue'; import Popup from '@/components/uni-popup.vue';
export default { export default {
components: { components: {
navbar, navbar,
Popup Popup
@ -78,7 +105,7 @@
cardPopup: false, cardPopup: false,
currentType: -1, currentType: -1,
balance: {}, balance: {},
yxChekced: true yxChekced: false
} }
}, },
@ -90,7 +117,7 @@
{ {
app_id: self.getAppId(), app_id: self.getAppId(),
}, },
function(res) { function (res) {
self.balance = res.data.lists.balance; self.balance = res.data.lists.balance;
console.log("🚀 ~ res:", self.balance) console.log("🚀 ~ res:", self.balance)
} }
@ -110,30 +137,35 @@
}, },
openXieYi() {
this.cardPopup = true;
},
// 确认选择 // 确认选择
confirmCard() { confirmCard() {
if (!this.yxChekced) { let self = this;
if (!self.yxChekced) {
uni.showToast({ uni.showToast({
title: '请同意充值协议', title: '请认真阅读并查看此协议',
icon: 'none' icon: 'none'
}); });
return; return;
} }
let self = this; self.cardPopup = false;
uni.showLoading({ uni.showLoading({
title: '加载中' title: '加载中'
}); });
self._post('user.index/detail', { self._post('user.index/detail', {
source: self.getPlatform() source: self.getPlatform()
}, function(res) { }, function (res) {
uni.hideLoading(); uni.hideLoading();
console.log("🚀 ~ res:", res) console.log("🚀 ~ res:", res)
if (res.data.userInfo.mobile == '') { if (res.data.userInfo.mobile == '') {
uni.showModal({ uni.showModal({
title: '提示', title: '提示',
content: '请先绑定手机号', content: '请先绑定手机号',
success: function(sm) { success: function (sm) {
if (sm.confirm) { if (sm.confirm) {
uni.switchTab({ uni.switchTab({
url: '/pages/user/index/index' url: '/pages/user/index/index'
@ -141,7 +173,7 @@
} }
} }
}); });
}else { } else {
if (self.currentType == -1) { if (self.currentType == -1) {
uni.showToast({ uni.showToast({
title: '请选择充值金额', title: '请选择充值金额',
@ -168,7 +200,7 @@
app_id: self.getAppId(), app_id: self.getAppId(),
type: this.currentType type: this.currentType
}, },
function(res) { function (res) {
if (res.code) { if (res.code) {
const data = res.data const data = res.data
console.log("🚀 ~ pay data:", data) console.log("🚀 ~ pay data:", data)
@ -225,27 +257,64 @@
icon: 'none' icon: 'none'
}); });
setTimeout(() => { setTimeout(() => {
uni.navigateBack({delta: 1}) uni.navigateBack({ delta: 1 })
}, 500); }, 500);
} }
}, },
see() { see() {
uni.navigateTo({ uni.showLoading({
url: '/pages/webview/webview?url=https://xh.stnav.com/czxy.html' title: '加载中'
});
// 1. 协议文件地址（可替换为实际后端返回的 word 文件 url）
const url = 'https://xh.stnav.com/czxy.doc';
// 2. 下载 word 文件
uni.downloadFile({
url,
success: (res) => {
if (res.statusCode === 200) {
// 3. 预览 word 文件
uni.openDocument({
filePath: res.tempFilePath,
fileType: 'doc',
success: () => {
// 预览成功
uni.hideLoading();
},
fail: (err) => {
uni.hideLoading();
setTimeout(() => {
uni.showToast({ title: '无法预览文件', icon: 'none' });
}, 1000);
}
});
} else {
uni.hideLoading();
// setTimeout(() => {
// uni.showToast({ title: '下载失败', icon: 'none' });
// }, 1000);
}
},
fail: () => {
uni.hideLoading();
// setTimeout(() => {
// uni.showToast({ title: '下载失败', icon: 'none' });
// }, 1000);
}
}); });
} }
} }
} }
</script> </script>
<style lang="scss"> <style lang="scss">
page { page {
background-color: #fff; background-color: #fff;
} }
.recharge-box { .recharge-box {
margin: 0 30rpx; margin: 0 30rpx;
margin-top: 24rpx; margin-top: 24rpx;
@ -272,7 +341,7 @@
width: 690rpx; width: 690rpx;
height: 104rpx; height: 104rpx;
background: #FFFFFF; background: #FFFFFF;
box-shadow: 0rpx 0rpx 16rpx 2rpx rgba(0,0,0,0.04); box-shadow: 0rpx 0rpx 16rpx 2rpx rgba(0, 0, 0, 0.04);
border-radius: 16rpx; border-radius: 16rpx;
border: 2rpx solid #fff; border: 2rpx solid #fff;
margin: 0 0 20rpx; margin: 0 0 20rpx;
@ -287,8 +356,10 @@
color: #121212; color: #121212;
margin-right: 24rpx; margin-right: 24rpx;
} }
.sale { .sale {
font-size: 28rpx; font-size: 28rpx;
.discount { .discount {
color: #FF5951; color: #FF5951;
} }
@ -307,7 +378,7 @@
background: #FFF4F4; background: #FFF4F4;
.card-checkout { .card-checkout {
.iconfont{ .iconfont {
color: #365A9A; color: #365A9A;
} }
} }
@ -331,9 +402,9 @@
line-height: 90rpx; line-height: 90rpx;
text-align: center; text-align: center;
} }
} }
.notice-popup { .notice-popup {
padding: 20rpx 0; padding: 20rpx 0;
width: 100%; width: 100%;
@ -366,5 +437,44 @@
text-align: left; text-align: left;
margin-bottom: 10rpx; margin-bottom: 10rpx;
} }
}
.btn {
margin-top: 40rpx;
display: flex;
justify-content: space-around;
padding-bottom: 20rpx;
}
.btn1 {
width: 280rpx;
height: 80rpx;
text-align: center;
line-height: 80rpx;
font-size: 32rpx;
color: #121212;
background-color: #F6F7F8;
border-radius: 8rpx;
}
.btn2 {
width: 280rpx;
height: 80rpx;
text-align: center;
line-height: 80rpx;
font-size: 32rpx;
color: #fff;
background-color: #365A9A;
border-radius: 8rpx;
}
.xy {
.active {
.card-checkout {
.iconfont {
color: #365A9A;
} }
}
}
}
</style> </style>