angelo
/
web-store-retail-h5
forked from angelo/web-retail-h5
3
0
Fork 0
Code Pull Requests Activity

feat(bindBank): 绑定银行卡逻辑找回

This commit is contained in:
woody 2025-09-03 17:26:50 +08:00
parent d3527c69dc
commit 4b116e4ad8
6 changed files with 346 additions and 260 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
config/balance.js
View File

@ -18,12 +18,6 @@ export const getDefaultBank = params =>
params, params,
}) })
//校验是否绑定银行卡
export const checkIsbindBank = params =>
http.get('/member/api/bank/is-bind', {
params,
})
//提现页面展示 //提现页面展示
export const getWidthdrawShow = params => export const getWidthdrawShow = params =>
http.get('/member/api/withdraw/show/add', { http.get('/member/api/withdraw/show/add', {
@ -90,12 +84,6 @@ export const getVerification = params =>
export const verifyBankCard = params => export const verifyBankCard = params =>
http.post('/member/api/bank/verify-bank-card', params) http.post('/member/api/bank/verify-bank-card', params)
//是否配置白名单 白名单不进行银行卡四要素校验
export const checkIfWhite = params =>
http.get('/member/api/bank/is-white-list', {
params,
})
//银行卡选择下拉选 //银行卡选择下拉选
export const getBankCardChoiceList = params => export const getBankCardChoiceList = params =>
http.get('/system/api/bank/list', { http.get('/system/api/bank/list', {

2
config/request.js
View File

@ -19,7 +19,7 @@ module.exports = vm => {
//#ifdef DEV_SERVER //#ifdef DEV_SERVER
console.log('DEV_SERVER') console.log('DEV_SERVER')
config.baseURL = 'http://192.168.0.86:8080' config.baseURL = 'https://t-bl.beida777.com/prod-api'
//#endif //#endif
//#ifdef QA_SERVER //#ifdef QA_SERVER

9
pages/mine/balance/index.vue
View File

@ -232,13 +232,14 @@ export default {
url: item.path, url: item.path,
}) })
} else if (res.code == 200 && res.flag == 'N') { } else if (res.code == 200 && res.flag == 'N') {
this.smShow = true
uni.showToast({ uni.showToast({
title: '请先进行实名认证', title: '请先进行实名认证',
}) })
uni.navigateTo({ setTimeout(() => {
url: '/pages/selfService/realName/realName', uni.navigateTo({
}) url: '/pages/selfService/realName/realName',
})
}, 300)
} }
}) })
} }

49
pages/mine/balance/withdrawal.vue
View File

@ -134,7 +134,16 @@
<u-button class="subbtn" @click="submit">{{ '提现' }}</u-button> <u-button class="subbtn" @click="submit">{{ '提现' }}</u-button>
</view> </view>
<u-toast ref="uToast"></u-toast> <u-toast ref="uToast"></u-toast>
<u-modal
:show="unBindDefaultModal"
showCancelButton
@cancel="unBindDefaultModal = false"
cancelText="取消"
confirmText="确定"
@confirm="unBindDefaultConfirm"
>
请先绑定默认银行卡
</u-modal>
<!-- 提现引导弹窗 --> <!-- 提现引导弹窗 -->
<!-- <WithdrawalGuide <!-- <WithdrawalGuide
:show="showWithdrawalGuide" :show="showWithdrawalGuide"
@ -193,8 +202,9 @@ export default {
bankData: {}, bankData: {},
widthDrwaData: {}, widthDrwaData: {},
ifeye: false, ifeye: false,
canbind: false, canbind: true,
showWithdrawalGuide: false, showWithdrawalGuide: false,
unBindDefaultModal: false,
} }
}, },
watch: { watch: {
@ -205,7 +215,7 @@ export default {
url: '/pages/mine/balance/withdrawlDetail', url: '/pages/mine/balance/withdrawlDetail',
}) })
}, },
onLoad() { onShow() {
this.getList() this.getList()
}, },
methods: { methods: {
@ -233,16 +243,26 @@ export default {
} }
}) })
bal.getDefaultBank().then(res => { bal.getDefaultBank().then(res => {
this.bankData = res.data if (res.data && Object.keys(res.data).length > 0) {
this.dataForm.pkBank = res.data.pkId this.bankData = res.data
this.dataForm.pkBank = res.data.pkId
} else {
this.unBindDefaultModal = true
}
}) })
//校验是否绑定银行卡 //校验是否绑定银行卡
bal.checkIsbindBank().then(res => { // bal.checkIsbindBank().then(res => {
if (res.flag == 'Y') { // if (res.flag == 'Y') {
this.canbind = false // this.canbind = false
} else if (res.flag == 'N') { // } else if (res.flag == 'N') {
this.canbind = true // this.canbind = true
} // }
// })
},
unBindDefaultConfirm() {
this.unBindDefaultModal = false
uni.navigateTo({
url: '/pages/mine/bindBank/index',
}) })
}, },
submit() { submit() {
@ -252,10 +272,13 @@ export default {
bal.addWithdraw(this.dataForm).then(res => { bal.addWithdraw(this.dataForm).then(res => {
if (res.code == 200) { if (res.code == 200) {
this.$refs.uToast.show({ this.$refs.uToast.show({
message: res.msg, message: res.msg || '提现成功',
type: 'success', type: 'success',
}) })
uni.navigateBack() setTimeout(() => {
uni.navigateBack()
}, 500)
// 显示提现引导弹窗 // 显示提现引导弹窗
// setTimeout(() => { // setTimeout(() => {
// this.showWithdrawalGuide = true // this.showWithdrawalGuide = true

86
pages/mine/bindBank/bindBank.vue
View File

@ -7,21 +7,9 @@
:rules="rules" :rules="rules"
ref="uForm" ref="uForm"
> >
<u-form-item
label-width="200rpx"
:label="'银行卡号'"
borderBottom
prop="cardNumber"
ref="item1"
>
<u--input
v-model="dataForm.cardNumber"
disabledColor="#F5F5F5;"
border="none"
></u--input>
</u-form-item>
<u-form-item <u-form-item
borderBottom borderBottom
required
label-width="200rpx" label-width="200rpx"
:label="'银行名称'" :label="'银行名称'"
prop="bankName" prop="bankName"
@ -40,6 +28,7 @@
<u-form-item <u-form-item
label-width="200rpx" label-width="200rpx"
:label="'开户支行'" :label="'开户支行'"
required
prop="subBankName" prop="subBankName"
borderBottom borderBottom
ref="item1" ref="item1"
@ -52,7 +41,22 @@
</u-form-item> </u-form-item>
<u-form-item <u-form-item
label-width="200rpx" label-width="200rpx"
:label="'真实姓名'" :label="'银行卡号'"
required
borderBottom
prop="cardNumber"
ref="item1"
>
<u--input
v-model="dataForm.cardNumber"
disabledColor="#F5F5F5;"
border="none"
></u--input>
</u-form-item>
<u-form-item
label-width="200rpx"
label="开户姓名"
required
prop="accountName" prop="accountName"
borderBottom borderBottom
ref="item1" ref="item1"
@ -66,6 +70,7 @@
<u-form-item <u-form-item
label-width="200rpx" label-width="200rpx"
:label="'证件号码'" :label="'证件号码'"
required
prop="idCard" prop="idCard"
borderBottom borderBottom
ref="item1" ref="item1"
@ -81,6 +86,7 @@
label-width="200rpx" label-width="200rpx"
:label="'联系方式'" :label="'联系方式'"
prop="phone" prop="phone"
required
borderBottom borderBottom
ref="item1" ref="item1"
> >
@ -95,6 +101,7 @@
v-if="userInfo.pkCountry == 1 && cancode" v-if="userInfo.pkCountry == 1 && cancode"
label-width="200rpx" label-width="200rpx"
:label="'验证码'" :label="'验证码'"
required
prop="verificationCode" prop="verificationCode"
borderBottom borderBottom
ref="item1" ref="item1"
@ -131,6 +138,13 @@
></u-picker> ></u-picker>
</u--form> </u--form>
</view> </view>
<view class="tip-wrapper">
<view class="tip-content">
<view class="tip-text"
>银行卡号、真实姓名、证件号码、联系方式，请与银行预留信息保持一致</view
>
</view>
</view>
<view class="btnbox"> <view class="btnbox">
<u-button class="subbtn" @click="submit">{{ '确定' }}</u-button> <u-button class="subbtn" @click="submit">{{ '确定' }}</u-button>
</view> </view>
@ -221,18 +235,8 @@ export default {
onLoad() { onLoad() {
this.userInfo = uni.getStorageSync('User') this.userInfo = uni.getStorageSync('User')
this.getList() this.getList()
this.checkIfWhite()
}, },
methods: { methods: {
checkIfWhite() {
ban.checkIfWhite().then(res => {
if (res.code == 200 && res.flag == 'N') {
this.cancode = true
} else if (res.code == 200 && res.flag == 'Y') {
this.cancode = false
}
})
},
codeChange(text) { codeChange(text) {
this.tips = text this.tips = text
}, },
@ -295,9 +299,7 @@ export default {
.then(res => { .then(res => {
// 没有三方接口 临机写死 // 没有三方接口 临机写死
this.ifpass = true this.ifpass = true
this.bindBank()
return
if (this.userInfo.pkCountry == 1) { if (this.userInfo.pkCountry == 1) {
if (this.cancode) { if (this.cancode) {
ban ban
@ -374,5 +376,37 @@ export default {
border-radius: 38rpx; border-radius: 38rpx;
color: #fff; color: #fff;
} }
.tip-wrapper {
margin: 20rpx 20rpx 0 20rpx;
.tip-content {
display: flex;
align-items: flex-start;
background: linear-gradient(135deg, #fff3e0 0%, #fff8f0 100%);
border: 2rpx solid #ffb74d;
border-radius: 16rpx;
padding: 20rpx 24rpx;
box-shadow: 0 4rpx 12rpx rgba(255, 183, 77, 0.1);
.tip-icon {
color: #ff9800;
font-size: 28rpx;
font-weight: bold;
margin-right: 16rpx;
margin-top: 2rpx;
flex-shrink: 0;
}
.tip-text {
flex: 1;
font-size: 24rpx;
line-height: 36rpx;
color: #e65100;
font-weight: 500;
letter-spacing: 0.5rpx;
}
}
}
} }
</style> </style>

448
pages/mine/bindBank/index.vue
View File

@ -1,225 +1,265 @@
<template> <template>
<view class="content"> <view class="content">
<view class="tablebox" v-if="tableData.length > 0"> <view class="tablebox" v-if="tableData.length > 0">
<view class="card" v-for="(item, index) in tableData" <view
:style="{ backgroundImage: 'url(' + item.backgroundImg + ')'}" :key="index"> class="card"
<view class="cardtopflex"> v-for="(item, index) in tableData"
<view class="cardtopflex2"> :style="{ backgroundImage: 'url(' + item.backgroundImg + ')' }"
<view class="imgbox"><img :src="item.logo" alt="" /></view> :key="index"
<view class="titlebox"> >
<view class="cardtitle">{{item.bankName}}</view> <view class="cardtopflex">
<view class="cardtitle2">{{'储蓄卡'}}</view> <view class="cardtopflex2">
</view> <view class="imgbox"><img :src="item.logo" alt="" /></view>
</view> <view class="titlebox">
<view class="flexs_1" v-if="item.defaultCard==1"> <view class="cardtitle">{{ item.bankName }}</view>
<view class="qiu"></view> <view class="cardtitle2">{{ '储蓄卡' }}</view>
<view v-if="userInfo.pkCountry == 1">{{'默认'}}</view> </view>
<view v-else style="color: #000;font-weight: bold;" class="cardfooter">{{'默认'}}</view> </view>
</view> <view class="flexs_1" v-if="item.defaultCard == 1">
<view class="flexs_1" v-else> <view class="qiu"></view>
<view v-if="userInfo.pkCountry == 1">{{ '默认' }}</view>
<view
v-else
style="color: #000; font-weight: bold"
class="cardfooter"
>{{ '默认' }}</view
>
</view>
<view class="flexs_1" v-else>
<view
style="color: #fff; font-weight: bold; cursor: pointer"
@click="setDefault(item.pkId)"
class="cardfooter"
>{{ '设为默认' }}</view
>
</view>
</view>
<view class="cardNumber">{{ item.cardNumber }}</view>
<view
v-if="userInfo.pkCountry == 1"
class="cardfooter"
@click="removeBind(item)"
>
[{{ '解绑' }}]</view
>
<view
v-else
style="color: #000; font-weight: bold"
class="cardfooter"
@click="removeBind(item)"
>
[{{ '解绑' }}]</view
>
</view>
</view>
<u-modal
:showCancelButton="true"
@cancel="modalShow = false"
:content="'是否确认解绑银行卡'"
:show="modalShow"
@confirm="confirmRemove"
ref="uModal"
:asyncClose="true"
></u-modal>
<view class="footerbtn" @click="goAdd"> +{{ '添加银行卡' }} </view>
<view style="color: #fff; font-weight: bold; cursor: pointer" @click="setDefault(item.pkId)" <u-modal
class="cardfooter">{{'设为默认'}}</view> :showCancelButton="true"
</view> @cancel="modalShow2 = false"
</view> content="当前解绑为默银行卡，请设置为另一张卡为默认银行卡"
<view class="cardNumber">{{ item.cardNumber }}</view> :show="modalShow2"
<view v-if="userInfo.pkCountry == 1" class="cardfooter" @click="removeBind(item)"> @confirm="confirmRemove2"
[{{'解绑'}}]</view> ref="uModal"
<view v-else style="color: #000;font-weight: bold;" class="cardfooter" @click="removeBind(item)"> :asyncClose="true"
[{{'解绑'}}]</view> ></u-modal>
</view> <!-- <el-button class="footerbtn" @click="bindBank(true)">{{'绑定银行卡'}}</el-button> -->
</view> </view>
<u-modal :showCancelButton="true" @cancel="modalShow=false" :content="'是否确认解绑银行卡'" :show="modalShow"
@confirm="confirmRemove" ref="uModal" :asyncClose="true"></u-modal>
<view class="footerbtn" @click="goAdd">
+{{'添加银行卡'}}
</view>
<u-modal :showCancelButton="true" @cancel="modalShow2=false" content="当前解绑为默银行卡，请设置为另一张卡为默认银行卡"
:show="modalShow2" @confirm="confirmRemove2" ref="uModal" :asyncClose="true"></u-modal>
<!-- <el-button class="footerbtn" @click="bindBank(true)">{{'绑定银行卡'}}</el-button> -->
</view>
</template> </template>
<script> <script>
import * as ban from "@/config/balance.js" import * as ban from '@/config/balance.js'
export default { export default {
data() { data() {
return { return {
tableData: [], tableData: [],
modalShow: false, modalShow: false,
modalShow2: false, modalShow2: false,
pkId: "", pkId: '',
userInfo: {} userInfo: {},
} }
}, },
onLoad() { onLoad() {
this.userInfo = uni.getStorageSync('User') this.userInfo = uni.getStorageSync('User')
}, },
onShow() { onShow() {
this.getSearch() this.getSearch()
}, },
methods: { methods: {
setDefault(pkId) { setDefault(pkId) {
ban.updateDefault({ ban
pkId: pkId .updateDefault({
}).then((res) => { pkId: pkId,
if (res.code == 200) { })
uni.$u.toast(res.msg) .then(res => {
this.getSearch(); if (res.code == 200) {
} else { uni.$u.toast(res.msg)
uni.$u.toast(res.msg) this.getSearch()
} } else {
}); uni.$u.toast(res.msg)
}, }
goAdd() { })
uni.navigateTo({ },
url: '/pages/mine/bindBank/bindBank' goAdd() {
}) uni.navigateTo({
}, url: '/pages/mine/bindBank/bindBank',
removeBind(item) { })
this.pkId = item.pkId },
if (item.defaultCard == 1) { removeBind(item) {
this.modalShow2 = true this.pkId = item.pkId
} else { if (item.defaultCard == 1) {
this.modalShow = true this.modalShow2 = true
} } else {
this.modalShow = true
}, }
confirmRemove2() { },
this.modalShow2 =false confirmRemove2() {
this.modalShow = true this.modalShow2 = false
}, // this.modalShow = true
//解除绑定 },
confirmRemove() { //解除绑定
ban.removeBankBind({ confirmRemove() {
pkId: this.pkId ban
}).then((res) => { .removeBankBind({
if (res.code == 200) { pkId: this.pkId,
uni.$u.toast(res.msg) })
this.modalShow = false .then(res => {
this.getSearch(); if (res.code == 200) {
} else { uni.$u.toast(res.msg)
uni.$u.toast(res.msg) this.modalShow = false
this.modalShow = false this.getSearch()
} } else {
}); uni.$u.toast(res.msg)
}, this.modalShow = false
//点击绑定银行卡 }
bindBank(val) { })
// this.isAdd = true; },
// this.jdTl = val; //点击绑定银行卡
}, bindBank(val) {
getSearch() { // this.isAdd = true;
ban.getBankList().then((res) => { // this.jdTl = val;
this.tableData = res.data; },
}); getSearch() {
}, ban.getBankList().then(res => {
} this.tableData = res.data
} })
},
},
}
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.content { .content {
background-color: #f9f9f9; background-color: #f9f9f9;
padding: 22rpx; padding: 22rpx;
.tablebox { .tablebox {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
justify-content: space-between; justify-content: space-between;
.card { .card {
width: 100%; width: 100%;
background-color: rgba(170, 45, 42, 0.9); background-color: rgba(170, 45, 42, 0.9);
background-size: 100% 100%; background-size: 100% 100%;
border-radius: 20rpx; border-radius: 20rpx;
margin: 20rpx 0; margin: 20rpx 0;
padding: 28rpx 32rpx 40rpx 32rpx; padding: 28rpx 32rpx 40rpx 32rpx;
margin-top: 20rpx; margin-top: 20rpx;
.cardtopflex { .cardtopflex {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
.flexs_1 { .flexs_1 {
display: flex; display: flex;
align-items: center; align-items: center;
margin-right: 20rpx; margin-right: 20rpx;
color: #ffffff; color: #ffffff;
font-size: 24rpx; font-size: 24rpx;
.qiu { .qiu {
margin-right: 10rpx; margin-right: 10rpx;
width: 20rpx; width: 20rpx;
height: 20rpx; height: 20rpx;
border-radius: 50%; border-radius: 50%;
background: rgb(47, 236, 47); background: rgb(47, 236, 47);
} }
} }
.cardtopflex2 { .cardtopflex2 {
.imgbox { .imgbox {
margin-right: 20rpx; margin-right: 20rpx;
img { img {
width: 68rpx; width: 68rpx;
height: 68rpx; height: 68rpx;
} }
} }
.titlebox { .titlebox {
color: #ffffff; color: #ffffff;
text-align: left; text-align: left;
.cardtitle { .cardtitle {
font-size: 36rpx; font-size: 36rpx;
font-weight: 600; font-weight: 600;
} }
.cardtitle2 { .cardtitle2 {
font-size: 20rpx; font-size: 20rpx;
margin-top: 8rpx; margin-top: 8rpx;
font-weight: 400; font-weight: 400;
} }
} }
} }
}
} .cardNumber {
font-size: 32rpx;
font-family:
PingFang SC-Medium,
PingFang SC;
font-weight: 600;
color: #ffffff;
margin-top: 100rpx;
margin-left: 36rpx;
}
.cardNumber { .cardfooter {
font-size: 32rpx; text-align: right;
font-family: PingFang SC-Medium, PingFang SC; font-size: 24rpx;
font-weight: 600; font-family:
color: #ffffff; PingFang SC-Regular,
margin-top: 100rpx; PingFang SC;
margin-left: 36rpx; font-weight: 400;
} color: #ffffff;
margin-top: 24rpx;
cursor: pointer;
}
}
}
.cardfooter { .footerbtn {
text-align: right; display: flex;
font-size: 24rpx; align-items: center;
font-family: PingFang SC-Regular, PingFang SC; padding: 40rpx;
font-weight: 400; background: #ffffff;
color: #ffffff; font-size: 24rpx;
margin-top: 24rpx; font-weight: 600;
cursor: pointer; border-radius: 20rpx;
} margin-top: 32rpx;
} width: 100%;
} }
}
.footerbtn { </style>
display: flex;
align-items: center;
padding: 40rpx;
background: #ffffff;
font-size: 24rpx;
font-weight: 600;
border-radius: 20rpx;
margin-top: 32rpx;
width: 100%;
}
}
</style>