94 lines
3.2 KiB
Vue
94 lines
3.2 KiB
Vue
<template>
|
|
<view class="p-30">
|
|
<view class="c-menu p-r-20">
|
|
<u--form labelPosition="left" labelWidth="100" ref="uForm">
|
|
<u-form-item borderBottom label="收款户名">
|
|
<u--input border="none" placeholder="请输入(必填)" v-model="form.bankCardAccountName"></u--input>
|
|
</u-form-item>
|
|
<u-form-item borderBottom label="银行名称">
|
|
<picker @change="bindPickerChange" :value="chooseBank" :range="bankList">
|
|
<view style="color: #303133;">{{ chooseBank === null ? '请选择银行' : bankList[chooseBank] }}</view>
|
|
</picker>
|
|
</u-form-item>
|
|
<u-form-item borderBottom label="支行所在地">
|
|
<!-- <u--input border="none" placeholder="请选择" v-model="form.bankCardArea"></u--input> -->
|
|
<view style="color: #303133;" @click="visible = true">
|
|
{{ !form.bankCardArea ? '请选择支行所在地' : form.bankCardArea }}</view>
|
|
</u-form-item>
|
|
<u-form-item borderBottom label="支行名称">
|
|
<u--input border="none" placeholder="请输入(必填)" v-model="form.bankCardSubBranchName"></u--input>
|
|
</u-form-item>
|
|
<u-form-item borderBottom label="银行卡号">
|
|
<u--input border="none" placeholder="请输入(必填)" v-model="form.bankCardNumber"></u--input>
|
|
</u-form-item>
|
|
<u-form-item borderBottom label="确认卡号">
|
|
<u--input border="none" placeholder="请输入(必填)" v-model="form.reBankCardNumber"></u--input>
|
|
</u-form-item>
|
|
</u--form>
|
|
</view>
|
|
|
|
<view style="padding: 50rpx 30upx;position: fixed;left: 0;bottom: 0;width: 100%;box-sizing: border-box;">
|
|
<u-button shape="circle" type="primary" @click="submit">提交</u-button>
|
|
</view>
|
|
|
|
<cityPicker column="3" :default-value="defaultValue" :mask-close-able="maskCloseAble" @confirm="confirm"
|
|
@cancel="cancel" :visible="visible" />
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import cityPicker from '@/uni_modules/piaoyi-cityPicker/components/piaoyi-cityPicker/piaoyi-cityPicker'
|
|
export default {
|
|
components: {
|
|
cityPicker
|
|
},
|
|
data() {
|
|
return {
|
|
form: {
|
|
bankCardAccountName: '',
|
|
bankCardArea: '',
|
|
bankCardNumber: '',
|
|
reBankCardNumber: '',
|
|
bankCardSubBranchName: '',
|
|
bankCardType: ''
|
|
},
|
|
bankList: [
|
|
'农业银行',
|
|
'建设银行',
|
|
'工商银行',
|
|
'交通银行',
|
|
'中国银行'
|
|
],
|
|
chooseBank: null,
|
|
visible: false,
|
|
maskCloseAble: true,
|
|
defaultValue: '110101',
|
|
}
|
|
},
|
|
methods: {
|
|
confirm(val) {
|
|
console.log(val);
|
|
this.form.bankCardArea = val.name
|
|
this.visible = false
|
|
},
|
|
cancel() {
|
|
this.visible = false
|
|
},
|
|
bindPickerChange(e) {
|
|
this.chooseBank = parseInt(e.detail.value)
|
|
},
|
|
submit() {
|
|
if(!this.form.bankCardAccountName) return uni.$u.toast('请输入您的收款账户')
|
|
if(!this.form.bankCardType) return uni.$u.toast('请选择银行')
|
|
if(!this.form.bankCardArea) return uni.$u.toast('请选择支行所在地区')
|
|
if(!this.form.bankCardSubBranchName) return uni.$u.toast('请输入支行名称')
|
|
if(!this.form.bankCardNumber) return uni.$u.toast('请输入银行卡号')
|
|
if(!this.form.reBankCardNumber) return uni.$u.toast('请再次输入银行卡号')
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style>
|
|
|
|
</style> |