story#7189,回程车小程序司机端-迁移认证页面
This commit is contained in:
139
src/views/rvDriverAuthentication/bankInfo.vue
Normal file
139
src/views/rvDriverAuthentication/bankInfo.vue
Normal file
@ -0,0 +1,139 @@
|
||||
<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 onLoad(options) {
|
||||
if(options?.show) {
|
||||
this.show = options.show
|
||||
}
|
||||
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;
|
||||
}
|
||||
.navBar{
|
||||
margin-bottom: 46px;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user