144 lines
4.1 KiB
Vue
144 lines
4.1 KiB
Vue
<template>
|
|
<div class="content">
|
|
<div class="navBar">
|
|
<van-nav-bar
|
|
title="银行卡信息认证"
|
|
left-arrow
|
|
left-arrow-color="#FFFFFF"
|
|
:border="false"
|
|
:fixed="true"
|
|
:safe-area-inset-top="true"
|
|
@click-left="h5GoBack"
|
|
/>
|
|
</div>
|
|
<tip-bar :title="'温馨提示：服务完成后，平台代收的运费需要提现到您的银行卡账户中，请确保您上传的银行卡信息真实可用。'"></tip-bar>
|
|
<photo-item title="银行卡正面照片" :left-url="form.bankCardFront || bank" :show="show" @leftImg="bankHandler"></photo-item>
|
|
<div class="carInfo">
|
|
<div class="left_wrap title">
|
|
<span class="mar_left">姓名</span>
|
|
<div>
|
|
<span class="star">*</span>
|
|
<span>账户号</span>
|
|
</div>
|
|
<div>
|
|
<span class="star">*</span>
|
|
<span>开户行</span>
|
|
</div>
|
|
</div>
|
|
<div class="right_wrap">
|
|
<input type="text" disabled placeholder="请输入持卡人姓名" v-model="form.name">
|
|
<input type="text" placeholder="请输入银行卡号" v-model="form.cardNumber">
|
|
<input type="text" placeholder="请输入开户行" v-model="form.bankName">
|
|
</div>
|
|
</div>
|
|
<fixed-button @myClick="clickHandler" v-if="showFun()"></fixed-button>
|
|
<!-- <protocol-dialog></protocol-dialog>-->
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
// import protocolDialog from "./component/protocolDialog";
|
|
import fixedButton from "./component/fixedButton";
|
|
import photoItem from "./component/photoItem";
|
|
import tipBar from "./component/tipBar";
|
|
import { ocrRecognize, driverInfoVerify, driverInfoVerifyDetail } from '@/api/authentication.js'
|
|
import { leftCopy } from '@/utils/common.js'
|
|
import { myMixins } from '@/utils/myMixins.js'
|
|
export default {
|
|
name: "bankInfo",
|
|
components: {
|
|
tipBar,
|
|
photoItem,
|
|
fixedButton,
|
|
// protocolDialog
|
|
},
|
|
mixins: [myMixins],
|
|
data() {
|
|
return {
|
|
bank: require('@/assets/authentication/bank_icon1.png'),
|
|
show: undefined,
|
|
form: {
|
|
bankCardFront: '',
|
|
bankName: '',
|
|
cardNumber: '',
|
|
name: '',
|
|
},
|
|
type:localStorage.getItem('type')
|
|
}
|
|
},
|
|
async mounted() {
|
|
// if(options?.show) {
|
|
this.show = true
|
|
// }
|
|
if( this.show ) {
|
|
await this.getDetail()
|
|
}
|
|
},
|
|
async onShow() {
|
|
|
|
},
|
|
methods: {
|
|
async clickHandler() {
|
|
if(!this.form.bankCardFront) {
|
|
this.$toast('银行卡照片未上传');
|
|
return
|
|
}
|
|
if( this.form.name && this.form.cardNumber && this.form.bankName ) {
|
|
let res = await driverInfoVerify( {
|
|
verifyType: 4,
|
|
...this.form,
|
|
type: this.type || 'full',
|
|
})
|
|
this.$toast('操作成功')
|
|
await this.getRegisterInfo({
|
|
verifyType: 4
|
|
})
|
|
setTimeout(() => {
|
|
this.h5GoBack()
|
|
}, 100)
|
|
console.log('注册', res)
|
|
} else {
|
|
this.$toast('银行卡信息识别错误')
|
|
}
|
|
},
|
|
async bankHandler(data) {
|
|
this.form.bankName = ''
|
|
this.form.cardNumber = ''
|
|
this.form.name = ''
|
|
this.form.bankCardFront = data
|
|
let res = await this.orcHandler(this.form.bankCardFront, 5)
|
|
leftCopy(this.form, {...res?.data?.data})
|
|
},
|
|
async getDetail() { // 认证详情
|
|
let res = await driverInfoVerifyDetail( {
|
|
verifyType: 4
|
|
})
|
|
leftCopy(this.form, {...res?.data?.bankCardInfoData})
|
|
console.log('bank', res)
|
|
},
|
|
async orcHandler(url, type) { // ocr 识别
|
|
let res = await ocrRecognize( {
|
|
ocrType: type,
|
|
imageUrl: url
|
|
});
|
|
return res;
|
|
},
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
@import "@/styles/common.scss";
|
|
@import "@/styles/infoShow.scss";
|
|
page {
|
|
background: #F4F5F7;
|
|
}
|
|
.content{
|
|
height: 100%;
|
|
overflow-y: auto;
|
|
}
|
|
.navBar{
|
|
margin-bottom: 46px;
|
|
}
|
|
</style>
|