1
This commit is contained in:
@@ -1,210 +1,210 @@
|
||||
<template>
|
||||
<view class="authentication_warp">
|
||||
<Header :leftTitle="$t('authentication.title')" left-path-type="switchTab" left-path="/pages/mine/mine"></Header>
|
||||
<view class="data_common_warp">
|
||||
<view class="data_msg">请填写用户本人得相关信息</view>
|
||||
<view
|
||||
class="'add_form_item add_form_item_but'"
|
||||
v-for="item in formList"
|
||||
:key="item.id"
|
||||
>
|
||||
<view class="add_form_title">{{item.title}}</view>
|
||||
<up-input
|
||||
:placeholder="item.placeholder"
|
||||
border="surround"
|
||||
v-model="form[item.formName]"
|
||||
:customStyle="inputCss"
|
||||
:type="item.type"
|
||||
></up-input>
|
||||
</view>
|
||||
<view
|
||||
class="add_form_item"
|
||||
>
|
||||
<view class="add_form_title">证件类型</view>
|
||||
<view class="cert_" @click="certShowCheck(true)">
|
||||
<view class="cert_title">{{form.certName || '请选择'}}</view>
|
||||
<up-image src="/static/common/right.png" width="16" height="16" bgColor="#f1f6ff00"></up-image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 证件照 -->
|
||||
<CommonCard @valueFunc="getValue"/>
|
||||
<view class="add_but" @click="addAuthentication">
|
||||
提交
|
||||
</view>
|
||||
<up-picker
|
||||
:show="certShow"
|
||||
:columns="[CERT_OPTION]"
|
||||
keyName="value"
|
||||
itemHeight="34"
|
||||
@confirm="certConfirm"
|
||||
@cancel="certShow=false"
|
||||
@close="certShow=false"
|
||||
></up-picker>
|
||||
<up-toast ref="uToastRef"></up-toast>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import CommonCard from '@/components/common_card.vue';
|
||||
import Header from '@/components/header.vue';
|
||||
import { realNameAuthentication } from '@/api/auth.js';
|
||||
import { CERT_OPTION } from '@/utils/enumUtils.js';
|
||||
|
||||
export default {
|
||||
computed: {
|
||||
CERT_OPTION() {
|
||||
return CERT_OPTION;
|
||||
},
|
||||
},
|
||||
components:{CommonCard,Header},
|
||||
data() {
|
||||
return {
|
||||
inputCss:{
|
||||
"height":'80rpx',
|
||||
"border-radius": "30rpx",
|
||||
"border": "0rpx",
|
||||
},
|
||||
form:{
|
||||
name:null,
|
||||
certType:null,// 证状证件类型：1-居民身份证，2-护照
|
||||
certName:null,
|
||||
certNo:null,// 证件号码
|
||||
certFimg:null,// 证件正面照片
|
||||
certBimg:null,// 证件背面照片
|
||||
},
|
||||
formList:[
|
||||
{
|
||||
id:1,
|
||||
title:"真实姓名",
|
||||
formName:"name",
|
||||
placeholder:"请输入您的真实姓名",
|
||||
type:"text",
|
||||
},{
|
||||
id:3,
|
||||
title:"证件号码",
|
||||
formName:"certNo",
|
||||
placeholder:"请输入证件号码",
|
||||
type:"text",
|
||||
}
|
||||
],
|
||||
uploadTemplList:[
|
||||
{
|
||||
id:1,
|
||||
title:"标准",
|
||||
isOk:true,
|
||||
url:"/static/common/ID_ok.png",
|
||||
},{
|
||||
id:2,
|
||||
title:"边框缺失",
|
||||
isOk:false,
|
||||
url:"/static/common/ID_error_1.png",
|
||||
},{
|
||||
id:3,
|
||||
title:"照片模糊",
|
||||
isOk:false,
|
||||
url:"/static/common/ID_error_2.png",
|
||||
},{
|
||||
id:4,
|
||||
title:"闪光强烈",
|
||||
isOk:false,
|
||||
url:"/static/common/ID_error_3.png",
|
||||
}
|
||||
],
|
||||
certShow:false,
|
||||
certOption:[],
|
||||
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
async addAuthentication(){
|
||||
const params={
|
||||
...this.form
|
||||
}
|
||||
if(!params.name){
|
||||
this.$refs.uToastRef.show({
|
||||
type: 'error',
|
||||
message: "请输入您的真实姓名",
|
||||
});
|
||||
return;
|
||||
}
|
||||
if(!params.certType){
|
||||
this.$refs.uToastRef.show({
|
||||
type: 'error',
|
||||
message: "请选择证件类型",
|
||||
});
|
||||
return;
|
||||
}
|
||||
if(!params.certNo){
|
||||
this.$refs.uToastRef.show({
|
||||
type: 'error',
|
||||
message: "请输入证件号码",
|
||||
});
|
||||
return;
|
||||
}
|
||||
if(params.certFimg.length === 0){
|
||||
this.$refs.uToastRef.show({
|
||||
type: 'error',
|
||||
message: "请上传证件正面照片",
|
||||
});
|
||||
return;
|
||||
}
|
||||
if(params.certBimg.length === 0){
|
||||
this.$refs.uToastRef.show({
|
||||
type: 'error',
|
||||
message: "请上传证件背面照片",
|
||||
});
|
||||
return;
|
||||
}
|
||||
console.log("params",params);
|
||||
const resp = await realNameAuthentication(params);
|
||||
if(resp && resp.bizcode === 100){
|
||||
uni.navigateTo({
|
||||
url:'/pages/mine_authentication_ok/mine_authentication_ok',
|
||||
})
|
||||
}
|
||||
},
|
||||
// 提交地址
|
||||
certConfirm(e){
|
||||
const {
|
||||
columnIndex,
|
||||
value,
|
||||
values,
|
||||
index,
|
||||
} = e;
|
||||
const data = value[0];
|
||||
this.form.certType = data.key;
|
||||
this.form.certName = data.value;
|
||||
this.certShowCheck(false);
|
||||
},
|
||||
// 选择银行的弹框
|
||||
async certShowCheck(status){
|
||||
this.certShow = status;
|
||||
},
|
||||
getValue(type,value){
|
||||
if (type === "Z") {
|
||||
this.form.certFimg = value;
|
||||
} else if (type === "F") {
|
||||
this.form.certBimg = value;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.authentication_warp{
|
||||
height: calc(100vh - 58rpx);
|
||||
background-color: $app-bj;
|
||||
padding: 30rpx;
|
||||
}
|
||||
.cert_{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
width: calc(100% - 170rpx);
|
||||
.cert_title{
|
||||
margin-left: 30rpx;
|
||||
color:#9e9e9ec7
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<template>
|
||||
<view class="authentication_warp">
|
||||
<Header :leftTitle="$t('authentication.title')" left-path-type="switchTab" left-path="/pages/mine/mine"></Header>
|
||||
<view class="data_common_warp">
|
||||
<view class="data_msg">请填写用户本人得相关信息</view>
|
||||
<view
|
||||
class="'add_form_item add_form_item_but'"
|
||||
v-for="item in formList"
|
||||
:key="item.id"
|
||||
>
|
||||
<view class="add_form_title">{{item.title}}</view>
|
||||
<up-input
|
||||
:placeholder="item.placeholder"
|
||||
border="surround"
|
||||
v-model="form[item.formName]"
|
||||
:customStyle="inputCss"
|
||||
:type="item.type"
|
||||
></up-input>
|
||||
</view>
|
||||
<view
|
||||
class="add_form_item"
|
||||
>
|
||||
<view class="add_form_title">证件类型</view>
|
||||
<view class="cert_" @click="certShowCheck(true)">
|
||||
<view class="cert_title">{{form.certName || '请选择'}}</view>
|
||||
<up-image src="/static/common/right.png" width="16" height="16" bgColor="#f1f6ff00"></up-image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 证件照 -->
|
||||
<CommonCard @valueFunc="getValue"/>
|
||||
<view class="add_but" @click="addAuthentication">
|
||||
提交
|
||||
</view>
|
||||
<up-picker
|
||||
:show="certShow"
|
||||
:columns="[CERT_OPTION]"
|
||||
keyName="value"
|
||||
itemHeight="34"
|
||||
@confirm="certConfirm"
|
||||
@cancel="certShow=false"
|
||||
@close="certShow=false"
|
||||
></up-picker>
|
||||
<up-toast ref="uToastRef"></up-toast>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import CommonCard from '@/components/common_card.vue';
|
||||
import Header from '@/components/header.vue';
|
||||
import { realNameAuthentication } from '@/api/auth.js';
|
||||
import { CERT_OPTION } from '@/utils/enumUtils.js';
|
||||
|
||||
export default {
|
||||
computed: {
|
||||
CERT_OPTION() {
|
||||
return CERT_OPTION;
|
||||
},
|
||||
},
|
||||
components:{CommonCard,Header},
|
||||
data() {
|
||||
return {
|
||||
inputCss:{
|
||||
"height":'80rpx',
|
||||
"border-radius": "30rpx",
|
||||
"border": "0rpx",
|
||||
},
|
||||
form:{
|
||||
name:null,
|
||||
certType:null,// 证状证件类型：1-居民身份证，2-护照
|
||||
certName:null,
|
||||
certNo:null,// 证件号码
|
||||
certFimg:null,// 证件正面照片
|
||||
certBimg:null,// 证件背面照片
|
||||
},
|
||||
formList:[
|
||||
{
|
||||
id:1,
|
||||
title:"真实姓名",
|
||||
formName:"name",
|
||||
placeholder:"请输入您的真实姓名",
|
||||
type:"text",
|
||||
},{
|
||||
id:3,
|
||||
title:"证件号码",
|
||||
formName:"certNo",
|
||||
placeholder:"请输入证件号码",
|
||||
type:"text",
|
||||
}
|
||||
],
|
||||
uploadTemplList:[
|
||||
{
|
||||
id:1,
|
||||
title:"标准",
|
||||
isOk:true,
|
||||
url:"/static/common/ID_ok.png",
|
||||
},{
|
||||
id:2,
|
||||
title:"边框缺失",
|
||||
isOk:false,
|
||||
url:"/static/common/ID_error_1.png",
|
||||
},{
|
||||
id:3,
|
||||
title:"照片模糊",
|
||||
isOk:false,
|
||||
url:"/static/common/ID_error_2.png",
|
||||
},{
|
||||
id:4,
|
||||
title:"闪光强烈",
|
||||
isOk:false,
|
||||
url:"/static/common/ID_error_3.png",
|
||||
}
|
||||
],
|
||||
certShow:false,
|
||||
certOption:[],
|
||||
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
async addAuthentication(){
|
||||
const params={
|
||||
...this.form
|
||||
}
|
||||
if(!params.name){
|
||||
this.$refs.uToastRef.show({
|
||||
type: 'error',
|
||||
message: "请输入您的真实姓名",
|
||||
});
|
||||
return;
|
||||
}
|
||||
if(!params.certType){
|
||||
this.$refs.uToastRef.show({
|
||||
type: 'error',
|
||||
message: "请选择证件类型",
|
||||
});
|
||||
return;
|
||||
}
|
||||
if(!params.certNo){
|
||||
this.$refs.uToastRef.show({
|
||||
type: 'error',
|
||||
message: "请输入证件号码",
|
||||
});
|
||||
return;
|
||||
}
|
||||
if(params.certFimg.length === 0){
|
||||
this.$refs.uToastRef.show({
|
||||
type: 'error',
|
||||
message: "请上传证件正面照片",
|
||||
});
|
||||
return;
|
||||
}
|
||||
if(params.certBimg.length === 0){
|
||||
this.$refs.uToastRef.show({
|
||||
type: 'error',
|
||||
message: "请上传证件背面照片",
|
||||
});
|
||||
return;
|
||||
}
|
||||
console.log("params",params);
|
||||
const resp = await realNameAuthentication(params);
|
||||
if(resp && resp.bizcode === 100){
|
||||
uni.navigateTo({
|
||||
url:'/pages/mine_authentication_ok/mine_authentication_ok',
|
||||
})
|
||||
}
|
||||
},
|
||||
// 提交地址
|
||||
certConfirm(e){
|
||||
const {
|
||||
columnIndex,
|
||||
value,
|
||||
values,
|
||||
index,
|
||||
} = e;
|
||||
const data = value[0];
|
||||
this.form.certType = data.key;
|
||||
this.form.certName = data.value;
|
||||
this.certShowCheck(false);
|
||||
},
|
||||
// 选择银行的弹框
|
||||
async certShowCheck(status){
|
||||
this.certShow = status;
|
||||
},
|
||||
getValue(type,value){
|
||||
if (type === "Z") {
|
||||
this.form.certFimg = value;
|
||||
} else if (type === "F") {
|
||||
this.form.certBimg = value;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.authentication_warp{
|
||||
height: calc(100vh - 58rpx);
|
||||
background-color: $app-bj;
|
||||
padding: 30rpx;
|
||||
}
|
||||
.cert_{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
width: calc(100% - 170rpx);
|
||||
.cert_title{
|
||||
margin-left: 30rpx;
|
||||
color:#9e9e9ec7
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user