初始化商家端
This commit is contained in:
316
pages/md/bindBankCard/bindBankCard.vue
Normal file
316
pages/md/bindBankCard/bindBankCard.vue
Normal file
@ -0,0 +1,316 @@
|
||||
<template>
|
||||
<view class="page" :style="themeColor">
|
||||
<view class="flex align-stretch benben-position-layout flex bindBankCard_flex_0"
|
||||
:style="{height:(88+StatusBarRpx)+'rpx',paddingTop:StatusBarRpx+'rpx'}">
|
||||
<view class='flex align-center justify-between flex-sub bindBankCard_fd0_0'>
|
||||
<view class='flex align-center bindBankCard_fd0_0_c0' @tap.stop="handleJumpDiy" data-type="back"
|
||||
data-url="1">
|
||||
<text class='fu-iconfont2 bindBankCard_fd0_0_c0_c0'></text>
|
||||
</view>
|
||||
<view class='flex align-center'>
|
||||
<text class='bindBankCard_fd0_0_c1_c0'>绑定银行卡</text>
|
||||
</view>
|
||||
<view class='flex align-center bindBankCard_fd0_0_c2'>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
<view :style="{height: (88+StatusBarRpx)+'rpx'}"></view>
|
||||
<!---flex布局flex布局开始-->
|
||||
<view class="flex flex-direction flex-wrap align-stretch benben-flex-layout bindBankCard_flex_1">
|
||||
<view class='flex flex-wrap align-center bindBankCard_fd1_0'>
|
||||
<text class='bindBankCard_fd1_0_c0'>持卡人姓名</text>
|
||||
<input class='flex-sub bindBankCard_fd1_0_c1' type="text" placeholder="请输入真实姓名" confirm-type="done"
|
||||
:maxlength="-1" placeholder-style="color:rgba(191, 191, 191, 1);font-size:32rpx" v-model="name" />
|
||||
</view>
|
||||
<view class='flex flex-wrap align-center bindBankCard_fd1_1'>
|
||||
<text class='bindBankCard_fd1_1_c0'>银行名称</text>
|
||||
<input class='flex-sub bindBankCard_fd1_1_c1' type="text" placeholder="请输入银行名称" confirm-type="done"
|
||||
:maxlength="-1" placeholder-style="color:rgba(191, 191, 191, 1);font-size:32rpx"
|
||||
v-model="bankName" />
|
||||
</view>
|
||||
<view class='flex flex-wrap align-center bindBankCard_fd1_2'>
|
||||
<text class='bindBankCard_fd1_2_c0'>银行卡号</text>
|
||||
<input class='flex-sub bindBankCard_fd1_2_c1' type="number" placeholder="请输入银行卡号" confirm-type="done"
|
||||
:maxlength="19" placeholder-style="color:rgba(191, 191, 191, 1);font-size:32rpx"
|
||||
v-model="bankCardNumber" />
|
||||
</view>
|
||||
<view class='flex flex-wrap align-center bindBankCard_fd1_3'>
|
||||
<text class='bindBankCard_fd1_3_c0'>开户行</text>
|
||||
<input class='flex-sub bindBankCard_fd1_3_c1' type="text" placeholder="请输入开户行" confirm-type="done"
|
||||
:maxlength="-1" placeholder-style="color:rgba(191, 191, 191, 1);font-size:32rpx"
|
||||
v-model="openingBank" />
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!---flex布局flex布局结束-->
|
||||
<view class="flex align-start justify-center benben-position-layout flex bindBankCard_flex_2">
|
||||
<button class='bindBankCard_fd2_0' @tap.stop="submitFunc()">提交</button>
|
||||
|
||||
</view>
|
||||
<view :style="{height: '120rpx'}"></view>
|
||||
|
||||
|
||||
</view>
|
||||
</template>
|
||||
<script>
|
||||
import {
|
||||
validate
|
||||
} from '@/common/utils/validate.js'
|
||||
export default {
|
||||
components: {},
|
||||
|
||||
|
||||
data() {
|
||||
return {
|
||||
"name": "",
|
||||
"bankName": "",
|
||||
"bankCardNumber": "",
|
||||
"openingBank": "",
|
||||
account_id:""
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
themeColor() {
|
||||
return this.$store.getters.themeColor
|
||||
},
|
||||
|
||||
},
|
||||
watch: {},
|
||||
onLoad(options) {
|
||||
this.get_withdraw_account();
|
||||
},
|
||||
onUnload() {
|
||||
|
||||
},
|
||||
onReady() {
|
||||
|
||||
},
|
||||
onShow() {
|
||||
|
||||
},
|
||||
onHide() {
|
||||
|
||||
},
|
||||
onResize() {
|
||||
|
||||
},
|
||||
onPullDownRefresh() {
|
||||
|
||||
},
|
||||
onReachBottom(e) {
|
||||
|
||||
},
|
||||
onPageScroll(e) {
|
||||
|
||||
},
|
||||
methods: {
|
||||
get_withdraw_account() { //获取用户已绑定的账户信息
|
||||
this.$api.get(global.apiUrls.getWithdrawAccount, {
|
||||
account_type: 3
|
||||
}).then(res => {
|
||||
console.log(res, '请求');
|
||||
res = res.data;
|
||||
if (res.code == 1) {
|
||||
this.name = res.data.real_name;
|
||||
this.bankCardNumber = res.data.account;
|
||||
this.bankName = res.data.bank_name;
|
||||
this.openingBank = res.data.bank_address;
|
||||
|
||||
|
||||
}
|
||||
});
|
||||
},
|
||||
//提交
|
||||
submitFunc() {
|
||||
if (!validate(this.name, 'require')) {
|
||||
this.$message.info('持卡人姓名不能为空');
|
||||
return false;
|
||||
}
|
||||
if (!validate(this.bankName, 'require')) {
|
||||
this.$message.info('银行名称不能为空');
|
||||
return false;
|
||||
}
|
||||
if (!validate(this.bankCardNumber, 'require')) {
|
||||
this.$message.info('银行卡号不能为空');
|
||||
return false;
|
||||
}
|
||||
// if (!validate(this.bankCardNumber, 'card')) {
|
||||
// this.$message.info('请输入正确的银行卡号');
|
||||
// return false;
|
||||
// }
|
||||
if (!validate(this.openingBank, 'require')) {
|
||||
this.$message.info('开户行不能为空');
|
||||
return false;
|
||||
}
|
||||
this.$api.post(global.apiUrls.postBindWithdrawAccount,{
|
||||
real_name: this.name,
|
||||
bank_name: this.bankName,
|
||||
account_type: 3,
|
||||
account: this.bankCardNumber,
|
||||
bank_address:this.openingBank
|
||||
}).then(res => {
|
||||
console.log(res)
|
||||
if(res.data.code == 1){
|
||||
this.$message.info('绑定成功');
|
||||
setTimeout(()=>{
|
||||
uni.navigateBack({
|
||||
delta:1
|
||||
})
|
||||
})
|
||||
}
|
||||
}).catch(err => {
|
||||
console.log(err)
|
||||
})
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.page {
|
||||
width: 100vw;
|
||||
overflow-x: hidden;
|
||||
min-height: calc(100vh - var(--window-bottom));
|
||||
background: #F8F8F8;
|
||||
background-size: 100% auto !important;
|
||||
}
|
||||
|
||||
.bindBankCard_flex_0 {
|
||||
border-bottom: 1px solid #eee;
|
||||
background: #fff;
|
||||
width: 750rpx;
|
||||
height: 88rpx;
|
||||
overflow: hidden;
|
||||
z-index: 10;
|
||||
top: 0rpx;
|
||||
background-size: 100% auto !important;
|
||||
}
|
||||
|
||||
.bindBankCard_fd0_0_c2 {
|
||||
width: 180rpx;
|
||||
}
|
||||
|
||||
.bindBankCard_fd0_0_c1_c0 {
|
||||
font-size: 36rpx;
|
||||
font-weight: 500;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.bindBankCard_fd0_0_c0_c0 {
|
||||
font-size: 32rpx;
|
||||
font-weight: 500;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.bindBankCard_fd0_0_c0 {
|
||||
width: 180rpx;
|
||||
}
|
||||
|
||||
.bindBankCard_fd0_0 {
|
||||
padding: 0rpx 32rpx 0rpx 32rpx;
|
||||
line-height: 88rpx;
|
||||
}
|
||||
|
||||
.bindBankCard_flex_1 {
|
||||
background: #fff;
|
||||
padding: 0rpx 32rpx 0rpx 32rpx;
|
||||
background-size: 100% auto !important;
|
||||
}
|
||||
|
||||
.bindBankCard_fd1_3_c1 {
|
||||
font-size: 32rpx;
|
||||
font-weight: 400;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.bindBankCard_fd1_3_c0 {
|
||||
width: 210rpx;
|
||||
line-height: 43rpx;
|
||||
font-size: 32rpx;
|
||||
font-weight: 400;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.bindBankCard_fd1_3 {
|
||||
border-bottom: 1px solid #eee;
|
||||
height: 109rpx;
|
||||
}
|
||||
|
||||
.bindBankCard_fd1_2_c1 {
|
||||
font-size: 32rpx;
|
||||
font-weight: 400;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.bindBankCard_fd1_2_c0 {
|
||||
width: 210rpx;
|
||||
line-height: 43rpx;
|
||||
font-size: 32rpx;
|
||||
font-weight: 400;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.bindBankCard_fd1_2 {
|
||||
border-bottom: 1px solid #eee;
|
||||
height: 109rpx;
|
||||
}
|
||||
|
||||
.bindBankCard_fd1_1_c1 {
|
||||
font-size: 32rpx;
|
||||
font-weight: 400;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.bindBankCard_fd1_1_c0 {
|
||||
width: 210rpx;
|
||||
line-height: 43rpx;
|
||||
font-size: 32rpx;
|
||||
font-weight: 400;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.bindBankCard_fd1_1 {
|
||||
border-bottom: 1px solid #eee;
|
||||
height: 109rpx;
|
||||
}
|
||||
|
||||
.bindBankCard_fd1_0_c1 {
|
||||
font-size: 32rpx;
|
||||
font-weight: 400;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.bindBankCard_fd1_0_c0 {
|
||||
width: 210rpx;
|
||||
line-height: 43rpx;
|
||||
font-size: 32rpx;
|
||||
font-weight: 400;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.bindBankCard_fd1_0 {
|
||||
border-bottom: 1px solid #eee;
|
||||
height: 109rpx;
|
||||
}
|
||||
|
||||
.bindBankCard_flex_2 {
|
||||
background: #fff;
|
||||
width: 750rpx;
|
||||
height: 120rpx;
|
||||
overflow: hidden;
|
||||
z-index: 10;
|
||||
bottom: calc(0rpx + var(--window-bottom));
|
||||
background-size: 100% auto !important;
|
||||
}
|
||||
|
||||
.bindBankCard_fd2_0 {
|
||||
background: rgba(255, 147, 0, 1);
|
||||
border-radius: 40rpx 40rpx 40rpx 40rpx;
|
||||
font-size: 32rpx;
|
||||
color: #fff;
|
||||
width: 686rpx;
|
||||
height: 80rpx;
|
||||
line-height: 80rpx;
|
||||
font-weight: 700;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user