You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
347 lines
7.7 KiB
347 lines
7.7 KiB
<template>
|
|
<view class="verfiy_name">
|
|
<view class="vnf-tit">
|
|
<view class="vntit">请填写实名认证信息</view>
|
|
<view class="vntips">填写时，请保证输入信息的真实性</view>
|
|
</view>
|
|
<view class="form-group">
|
|
<view class="form-item">
|
|
<input type="text" v-model="rname" class="form-item--input" placeholder="请输入手机号持有人姓名"/>
|
|
</view>
|
|
|
|
<view class="form-item">
|
|
<input type="text" v-model="rid" maxlength="18" class="form-item--input" placeholder="请输入手机号持有人身份证号"/>
|
|
</view>
|
|
|
|
<!-- 图片列表 -->
|
|
<!-- <view class="image-list">
|
|
<view class="image-preview">
|
|
<text class="image-delete iconfont icon-shanchu" @click="deleteImage(index, imageIndex)"></text>
|
|
<image class="image" mode="aspectFill" ></image>
|
|
</view>
|
|
<view class="image-picker" >
|
|
<text class="choose-icon iconfont icon-camera"></text>
|
|
<text class="choose-text">上传图片</text>
|
|
</view>
|
|
</view> -->
|
|
|
|
|
|
|
|
|
|
</view>
|
|
<view class="gtbtnzone">
|
|
<button class="gtbtn" @click="chkst">下一步</button>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import * as UploadApi from '@/api/upload'
|
|
import * as Verify from '@/utils/verify'
|
|
import store from '@/store'
|
|
import * as UserApi from '@/api/user'
|
|
import { checkLogin, showError } from '@/core/app'
|
|
|
|
// 最大图片数量
|
|
const maxImageLength = 2
|
|
|
|
export default {
|
|
data() {
|
|
return {
|
|
//姓名
|
|
rname:"",
|
|
// 身份证
|
|
rid:"",
|
|
// 图片列表
|
|
imageList: [],
|
|
//用户信息
|
|
userInfo:[]
|
|
}
|
|
},
|
|
mounted() {
|
|
this.init()
|
|
},
|
|
methods: {
|
|
// 系统初始化
|
|
init(){
|
|
if(checkLogin()==true){
|
|
this.isLogin = true
|
|
this.getUserInfo()
|
|
}else{
|
|
this.isLogin= false
|
|
showError("请登录后再操作",this.gotologin())
|
|
}
|
|
},
|
|
gotologin(){
|
|
this.$navTo("pages/login/index")
|
|
},
|
|
// 获取当前用户信息
|
|
getUserInfo() {
|
|
const app = this
|
|
return new Promise((resolve, reject) => {
|
|
!app.isLogin ? resolve(null) : UserApi.info({}, { load: app.isFirstload })
|
|
.then(result => {
|
|
app.userInfo = result.data.userInfo
|
|
if(app.userInfo.real_name!="" && app.userInfo.id_no!=""){
|
|
this.$navTo("pages/home")
|
|
}
|
|
resolve(app.userInfo)
|
|
})
|
|
.catch(err => {
|
|
if (err.result && err.result.status == 401) {
|
|
app.isLogin = false
|
|
resolve(null)
|
|
} else {
|
|
reject(err)
|
|
}
|
|
})
|
|
})
|
|
},
|
|
// 提交认证信息
|
|
chkst() {
|
|
const app = this
|
|
if (!app.isLoading && app.formValidationName(app.rname) && app.formValidationId(app.rid)) {
|
|
// if(app.submitVerify()){
|
|
// // 跳转到选择设备
|
|
// //this.$navTo("pages/verfiy/choosedev");
|
|
// }
|
|
app.submitVerify();
|
|
|
|
}
|
|
},
|
|
|
|
// 提交认证信息
|
|
submitVerify(){
|
|
const app = this
|
|
let data = {real_name:app.rname,id_no:app.rid}
|
|
UserApi.verifyname({form:data}).then(res=>{
|
|
// console.log(res)
|
|
this.$navTo("pages/verfiy/choosedev");
|
|
//return true
|
|
}).catch(err=>{
|
|
// console.log(err)
|
|
return false
|
|
})
|
|
},
|
|
|
|
//todo
|
|
formValidationName(str){
|
|
if(Verify.isEmpty(str)){
|
|
this.$toast('手机号持有人姓名不能为空')
|
|
return false
|
|
}
|
|
return true
|
|
},
|
|
|
|
//check id
|
|
formValidationId(str){
|
|
if(Verify.isEmpty(str)){
|
|
this.$toast('手机号持有人身份证号')
|
|
return false
|
|
}
|
|
// 校验正则
|
|
let regIdNo = /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/;
|
|
if(!regIdNo.test(str)){
|
|
this.$toast('身份证号填写错误');
|
|
return false;
|
|
}
|
|
if(str.length<18 || str.length>18){
|
|
this.$toast("手机号持有人身份证号异常")
|
|
return false
|
|
}
|
|
return true
|
|
},
|
|
|
|
// 选择图片
|
|
chooseImage(index) {
|
|
const app = this
|
|
const oldImageList = app.imageList
|
|
// 选择图片
|
|
uni.chooseImage({
|
|
count: maxImageLength - oldImageList.length,
|
|
sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图，默认二者都有
|
|
sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机，默认二者都有
|
|
success({ tempFiles }) {
|
|
// tempFiles = [{path:'xxx', size:100}]
|
|
app.imageList = oldImageList.concat(tempFiles)
|
|
}
|
|
});
|
|
},
|
|
|
|
// 删除图片
|
|
deleteImage(index, imageIndex) {
|
|
this.imageList.splice(imageIndex, 1)
|
|
},
|
|
// 统计图片数量
|
|
getImagesLength() {
|
|
const { formData } = this
|
|
let imagesLength = 0
|
|
formData.forEach(item => {
|
|
if (item.content.trim()) {
|
|
imagesLength += item.imageList.length
|
|
}
|
|
})
|
|
return imagesLength
|
|
},
|
|
|
|
// 上传图片
|
|
uploadFile() {
|
|
const app = this
|
|
const { formData } = app
|
|
// 整理上传文件路径
|
|
const files = []
|
|
formData.forEach((item, index) => {
|
|
if (item.content.trim() && item.imageList.length) {
|
|
const images = item.imageList.map(image => image)
|
|
files.push({ formDataIndex: index, images })
|
|
}
|
|
})
|
|
// 批量上传
|
|
return new Promise((resolve, reject) => {
|
|
Promise.all(files.map((file, index) => {
|
|
return new Promise((resolve, reject) => {
|
|
UploadApi.image(file.images)
|
|
.then(fileIds => {
|
|
app.uploaded = fileIds
|
|
resolve(fileIds)
|
|
})
|
|
.catch(reject)
|
|
})
|
|
}))
|
|
.then(resolve, reject)
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.verfiy_name{
|
|
height: 100%;
|
|
overflow: hidden;
|
|
position: relative;
|
|
}
|
|
|
|
.vnf-tit{
|
|
width: 100%;
|
|
padding-left: 36rpx;
|
|
margin-top: 46rpx;
|
|
|
|
.vntit{
|
|
font-size: 46rpx;
|
|
line-height: 1.6;
|
|
}
|
|
.vntips{
|
|
padding: 10rpx;
|
|
font-size: 22rpx;
|
|
color: #999;
|
|
}
|
|
}
|
|
.form-group{
|
|
padding-left: 10rpx;
|
|
padding-right: 10rpx;
|
|
margin-top: 44rpx;
|
|
|
|
// 输入框元素
|
|
.form-item {
|
|
display: flex;
|
|
padding: 18rpx;
|
|
border-bottom: 1rpx solid #f3f1f2;
|
|
margin-bottom: 30rpx;
|
|
height: 126rpx;
|
|
|
|
&--input {
|
|
padding-left: 10rpx;
|
|
font-size: 28rpx;
|
|
letter-spacing: 1rpx;
|
|
flex: 1;
|
|
height: 100%;
|
|
background-color: #F8F8F8;
|
|
}
|
|
|
|
.image-list {
|
|
padding: 0 20rpx;
|
|
margin-top: 20rpx;
|
|
margin-bottom: -20rpx;
|
|
|
|
&:after {
|
|
clear: both;
|
|
content: " ";
|
|
display: table;
|
|
}
|
|
|
|
.image {
|
|
display: block;
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
|
|
.image-picker,
|
|
.image-preview {
|
|
width: 184rpx;
|
|
height: 184rpx;
|
|
margin-right: 30rpx;
|
|
margin-bottom: 30rpx;
|
|
float: left;
|
|
|
|
&:nth-child(3n+0) {
|
|
margin-right: 0;
|
|
}
|
|
}
|
|
|
|
.image-picker {
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: center;
|
|
align-items: center;
|
|
border: 1rpx dashed #ccc;
|
|
color: #ccc;
|
|
|
|
.choose-icon {
|
|
font-size: 48rpx;
|
|
margin-bottom: 6rpx;
|
|
}
|
|
|
|
.choose-text {
|
|
font-size: 24rpx;
|
|
}
|
|
}
|
|
|
|
.image-preview {
|
|
position: relative;
|
|
|
|
.image-delete {
|
|
position: absolute;
|
|
top: -15rpx;
|
|
right: -15rpx;
|
|
height: 42rpx;
|
|
width: 42rpx;
|
|
line-height: 42rpx;
|
|
background: rgba(0, 0, 0, 0.64);
|
|
border-radius: 50%;
|
|
color: #fff;
|
|
font-weight: bolder;
|
|
font-size: 22rpx;
|
|
z-index: 10;
|
|
text-align: center;
|
|
}
|
|
}
|
|
}
|
|
|
|
}
|
|
}
|
|
|
|
.gtbtnzone{
|
|
position: fixed;
|
|
left: 0%;
|
|
bottom: 3%;
|
|
height: 44rpx;
|
|
width: 100%;
|
|
|
|
.gtbtn{
|
|
background: #10476E;
|
|
color: #fff;
|
|
}
|
|
}
|
|
|
|
</style>
|
|
|