124 lines
4.1 KiB
Vue
124 lines
4.1 KiB
Vue
<template>
|
|
<view>
|
|
<!-- 顶部操作条 -->
|
|
<cu-custom :bgColor="'bg-main-color'" :isBack="true">
|
|
<block slot="backText">返回</block>
|
|
<block slot="content">帐号绑定/修改</block>
|
|
</cu-custom>
|
|
<view class="margin-lr-sm margin-tb-lg shadow-warp">
|
|
<view class="bg-gray flex justify-start align-center text-xl padding-lr padding-top-xs">
|
|
<view class="padding-lr padding-tb-sm" :class="curAccountType === '0' ? 'curTab' : ''" data-type="0" @click="changAccountType">支付宝</view>
|
|
<view class="padding-lr padding-tb-sm" :class="curAccountType === '1' ? 'curTab' : ''" data-type="1" @click="changAccountType">银行卡</view>
|
|
</view>
|
|
<!-- 支付宝 -->
|
|
<view v-if="curAccountType == '0'" class="bg-white padding text-lg">
|
|
<view>
|
|
<view class="margin-bottom-sm">开户人姓名</view>
|
|
<input type="digit" placeholder="请输入开户人姓名" placeholder-style="color:#989898" v-model="formData.name">
|
|
</view>
|
|
<view class="margin-top">
|
|
<view class="margin-bottom-sm">支付宝账户</view>
|
|
<input type="digit" placeholder="请输入支付宝账户" placeholder-style="color:#989898" v-model="formData.account">
|
|
</view>
|
|
</view>
|
|
<!-- 银行卡 -->
|
|
<view v-else-if="curAccountType === '1'" class="bg-white padding text-lg">
|
|
<view>
|
|
<view class="margin-bottom-sm">开户人姓名</view>
|
|
<input type="text" placeholder="请输入开户人姓名" placeholder-style="color:#989898" v-model="formData.name">
|
|
</view>
|
|
<view class="margin-top">
|
|
<view class="margin-bottom-sm">身份证号</view>
|
|
<input type="text" placeholder="请输入身份证号" placeholder-style="color:#989898" v-model="formData.certId">
|
|
</view>
|
|
<view class="margin-top">
|
|
<view class="margin-bottom-sm">手机号</view>
|
|
<input type="text" placeholder="请输入手机号" placeholder-style="color:#989898" v-model="formData.phone">
|
|
</view>
|
|
<view class="margin-top">
|
|
<view class="margin-bottom-sm">银行卡号</view>
|
|
<input type="text" placeholder="请输入银行卡号" placeholder-style="color:#989898" v-model="formData.bankNum">
|
|
</view>
|
|
<!-- <view class="margin-top">
|
|
<view class="margin-bottom-sm">银行卡号开户城市</view>
|
|
<view class="flex">
|
|
<my-uni-combox class="flex-sub margin-right-xs" :candidates="provinceList"
|
|
:showField="'areaName'" placeholder="选择省份" v-model="formData.provinceObj"
|
|
@input="chooseRegion($event)"></my-uni-combox>
|
|
<my-uni-combox class="flex-sub margin-right-xs" :candidates="cityList"
|
|
:showField="'areaName'" placeholder="选择城市" v-model="formData.cityObj"></my-uni-combox>
|
|
</view>
|
|
</view> -->
|
|
</view>
|
|
</view>
|
|
<!-- 操作按钮 -->
|
|
<view class="margin-lr">
|
|
<button class="cu-btn lg bg-main-color long-btn shadow-blur" @click="submit">提交</button>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
// import myUniCombox from '@/components/uni-combox/my-uni-combox.vue';
|
|
|
|
export default {
|
|
// components: {
|
|
// myUniCombox
|
|
// },
|
|
data() {
|
|
return {
|
|
curAccountType: '0',
|
|
provinceList: [],
|
|
cityList: [],
|
|
formData: {
|
|
provinceObj: {},
|
|
cityObj: {}
|
|
},
|
|
curUserInfo: {}
|
|
}
|
|
},
|
|
onLoad() {
|
|
this.loadData();
|
|
},
|
|
methods: {
|
|
async loadData() {
|
|
// let res = await this.$request.areaListByStep();
|
|
// this.provinceList = res.data;
|
|
this.curUserInfo = this.$request.getCurUserInfo();
|
|
},
|
|
async chooseRegion(e) {
|
|
let res = await this.$request.areaListByStep({
|
|
parentCode: e.areaCode
|
|
});
|
|
this.cityList = res.data;
|
|
this.formData.cityObj = {}
|
|
},
|
|
changAccountType(e) {
|
|
this.curAccountType = e.currentTarget.dataset.type;
|
|
},
|
|
async submit() {
|
|
if (this.curAccountType === '1') {
|
|
let params = {
|
|
...this.formData,
|
|
customerId: this.curUserInfo.customerId
|
|
}
|
|
let res = await this.$request.bindBankCard(params);
|
|
if (res.code === 0) {
|
|
uni.navigateBack({
|
|
delta: -1
|
|
})
|
|
}
|
|
}
|
|
}
|
|
},
|
|
}
|
|
</script>
|
|
|
|
<style scoped>
|
|
.curTab {
|
|
background-color: #ffffff;
|
|
color: #0081ff;
|
|
border-radius: 15rpx 15rpx 0 0;
|
|
}
|
|
</style>
|