story#7189,回程车小程序司机端-迁移认证页面
This commit is contained in:
248
src/views/rvDriverAuthentication/personAudit.vue
Normal file
248
src/views/rvDriverAuthentication/personAudit.vue
Normal file
@ -0,0 +1,248 @@
|
||||
<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="个人头像" v-if="type != 'simple'" :show="show" :left-url="form.icon ||headerUrl" @leftImg="headerHandler"></photo-item>
|
||||
<photo-item title="身份证正反面" :show="show" :left-url="form.identityCardFront || idFront" :right-url="form.identityCardContrary || idBack"
|
||||
@leftImg="idFrontHandler" @rightImg="idBackHandler" ></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>
|
||||
<span class="star">*</span>
|
||||
<span>本人身份证号</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="right_wrap">
|
||||
<span class="phone">{{form.phone}}</span>
|
||||
<input type="text" disabled placeholder="请输入持卡人姓名" v-model="form.name">
|
||||
<input type="text" disabled placeholder="请输入持卡人性别" v-model="form.sex">
|
||||
<input type="text" placeholder="请输入持卡人身份证号" v-model="form.identityCardNumber">
|
||||
</div>
|
||||
</div>=
|
||||
<fixed-button title="实名认证" @myClick="goRealName" v-if="showFun() && !esignFlag"></fixed-button>
|
||||
<fixed-button @myClick="clickHandler" v-if="showFun() && esignFlag"></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, driverRealName } from '@/api/authentication'
|
||||
import { leftCopy } from '@/utils/common.js'
|
||||
import { myMixins } from '@/utils/myMixins.js'
|
||||
// import {version} from "@/utils/baseUrl"
|
||||
export default {
|
||||
name: "personAudit",
|
||||
components: {
|
||||
tipBar,
|
||||
photoItem,
|
||||
fixedButton,
|
||||
// protocolDialog
|
||||
},
|
||||
mixins: [myMixins],
|
||||
data() {
|
||||
return {
|
||||
form: {
|
||||
phone: localStorage.getItem('phone'),
|
||||
name: '',
|
||||
sex: '',
|
||||
identityCardNumber: '',
|
||||
icon: '',
|
||||
identityCardFront: '',
|
||||
identityCardContrary: '',
|
||||
idCardAuthority: '', // 发证机关
|
||||
idCardValidStartTime: '', // 有效期开始
|
||||
idCardValidEndTime: '', // 有效期结束
|
||||
},
|
||||
validPeriod: '', // 有效期
|
||||
headerUrl: require('@/assets/authentication/person_header.png'),
|
||||
idFront: require('@/assets/authentication/person_idcard1.png'),
|
||||
idBack: require('@/assets/authentication/person_idcard2.png'),
|
||||
user:'',
|
||||
cardId:'',
|
||||
show: undefined,
|
||||
type: localStorage.getItem('type'),
|
||||
esignFlag: false,
|
||||
}
|
||||
},
|
||||
async onLoad(options) {
|
||||
if(options?.show) {
|
||||
this.show = options.show
|
||||
if( this.show ) {
|
||||
await this.getDetail()
|
||||
}
|
||||
}
|
||||
},
|
||||
async onShow() {
|
||||
this.esignFlag = localStorage.getItem('esignFlag');
|
||||
},
|
||||
methods: {
|
||||
async getDetail() {
|
||||
let res = await driverInfoVerifyDetail( {
|
||||
verifyType: 1
|
||||
})
|
||||
leftCopy(this.form, {...res?.data?.personalInfoData})
|
||||
},
|
||||
async headerHandler(data) {
|
||||
this.form.icon = data
|
||||
},
|
||||
async idFrontHandler(data) { // 身份证正面
|
||||
this.form.identityCardFront = data
|
||||
await this.idOrcHandler(this.form.identityCardFront)
|
||||
},
|
||||
async idBackHandler(data) {
|
||||
this.form.identityCardContrary = data
|
||||
await this.idBackOrcHandler(this.form.identityCardContrary)
|
||||
},
|
||||
initForm() {
|
||||
this.form.name = ''
|
||||
this.form.sex = ''
|
||||
this.form.identityCardNumber = ''
|
||||
},
|
||||
backInit() {
|
||||
this.validPeriod = ''
|
||||
},
|
||||
async idBackOrcHandler(url) {
|
||||
let res = await ocrRecognize( {
|
||||
ocrType: 1,
|
||||
imageUrl: url
|
||||
});
|
||||
let idInfo = res?.data?.data?.back?.data
|
||||
// let validPeriod = '2014.07.09-长期'
|
||||
let validPeriod = idInfo?.validPeriod; // 有效期
|
||||
this.form.idCardAuthority = idInfo?.issueAuthority
|
||||
let dateArr = validPeriod.split('-');
|
||||
let startDate = dateArr[0];
|
||||
let endDate = dateArr[1];
|
||||
this.form.idCardValidStartTime = startDate.replace(/\./g, '/') + ' 00:00:00';
|
||||
if( endDate.indexOf('长期') != -1 ) {
|
||||
this.form.idCardValidEndTime = '2099/01/01 00:00:00'
|
||||
} else {
|
||||
this.form.idCardValidEndTime = endDate.replace(/\./g, '/') + ' 00:00:00';
|
||||
}
|
||||
// console.log('this.form.idCardValidStartTime', this.form.idCardValidStartTime);
|
||||
// console.log('this.form.idCardValidEndTime', this.form.idCardValidEndTime);
|
||||
},
|
||||
async idOrcHandler(url) {
|
||||
await this.initForm()
|
||||
let res = await ocrRecognize({
|
||||
ocrType: 1,
|
||||
imageUrl: url
|
||||
});
|
||||
let idInfo = res?.data?.data?.face?.data
|
||||
this.form.name = idInfo?.name
|
||||
this.form.sex = idInfo?.sex
|
||||
this.form.identityCardNumber = idInfo?.idNumber
|
||||
},
|
||||
async goRealName() {
|
||||
if (!this.form.identityCardContrary) {
|
||||
this.$toast('身份证反面照片未上传')
|
||||
return
|
||||
}
|
||||
if( !this.form.idCardValidStartTime ) {
|
||||
this.$toast('身份证反面识别错误')
|
||||
return
|
||||
}
|
||||
if (!this.form.identityCardFront) {
|
||||
this.$toast('身份证正面照片未上传')
|
||||
return
|
||||
}
|
||||
if(this.form.name && this.form.identityCardNumber) {
|
||||
let res = await driverRealName( {
|
||||
phone: this.form.phone,
|
||||
name: this.form.name,
|
||||
idNo: this.form.identityCardNumber,
|
||||
})
|
||||
let info = res?.data
|
||||
console.log('info', info)
|
||||
/* let env = version=='release' ? 'prod' : 'sml'
|
||||
uni.navigateToMiniProgram({
|
||||
appId: 'wx1cf2708c2de46337', // 上链公证签小程序APPID
|
||||
path: '/pages/index/index', // 上链公证签页面地址
|
||||
extraData: {
|
||||
requestObj: { // 必填，入参
|
||||
flowId: info?.flowId, // 必填，认证流程Id
|
||||
type: 'REALNAME',// 必填，业务类型：实名 REALNAME
|
||||
env: env // 非必填，对接环境：线上 prod(默认）, 模拟 sml(用于对接调试阶段）
|
||||
},
|
||||
callbackObj: { // 非必填，回传数据：签署完成后会将此数据完整回传
|
||||
}
|
||||
},
|
||||
})*/
|
||||
} else {
|
||||
this.$toast('身份证信息识别错误')
|
||||
}
|
||||
},
|
||||
async clickHandler() {
|
||||
if (!this.form.identityCardContrary) {
|
||||
this.$toast('身份证反面照片未上传')
|
||||
return
|
||||
}
|
||||
if( !this.form.idCardValidStartTime ) {
|
||||
this.$toast('身份证反面识别错误')
|
||||
return
|
||||
}
|
||||
if (!this.form.identityCardFront) {
|
||||
this.$toast('身份证正面照片未上传')
|
||||
return
|
||||
}
|
||||
if(this.form.name && this.form.identityCardNumber) {
|
||||
await driverInfoVerify( {
|
||||
verifyType: 1,
|
||||
type: this.type || 'full',
|
||||
...this.form,
|
||||
})
|
||||
this.$toast('操作成功')
|
||||
await this.getRegisterInfo({
|
||||
verifyType: 1
|
||||
})
|
||||
setTimeout(() => {
|
||||
|
||||
}, 100)
|
||||
} else {
|
||||
this.$toast('身份证信息识别错误')
|
||||
}
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
@import "@/styles/common.scss";
|
||||
@import "@/styles/infoShow.scss";
|
||||
page {
|
||||
background: #F4F5F7;
|
||||
}
|
||||
.navBar{
|
||||
margin-bottom: 46px;
|
||||
}
|
||||
.empty{
|
||||
width: 100%;
|
||||
height:151px;
|
||||
}
|
||||
.content {
|
||||
padding-bottom: 86px;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user