jp-charge/components/job/ResumeAuth.vue

<template>
	<view>
		<u-navbar title="实名认证" :is-back="false"></u-navbar>
		<view class="id-input">
			<view class="title">
				真实姓名
			</view>
			<u-input v-model="authData.name" placeholder="请输入您的真实姓名" input-align="right" />
		</view>
		<view class="id-input">
			<view class="title">
				身份证号
			</view>
			<u-input v-model="authData.idCard" placeholder="请输入18位身份证号" input-align="right" />
		</view>
		<view class="id-upload">
			<view class="title">
				请上传身份证的正反面
			</view>
			<view class="id-upload-item"  @click="uploadPic('positiveUrl')">
				<view class="id-upload-left">
					<h4>头像面</h4>
					<p>上传您的身份证头像面</p>
				</view>
				<view class="id-upload-right">
					
 					
					<u-image width="100%" height="220rpx"   :src="authData.positiveUrl?authData.positiveUrl:require('@/static/img/id2.png')"></u-image>
					
				</view>
			</view>
			<view class="id-upload-item"  @click="uploadPic('reverseUrl')">
				<view class="id-upload-left">
					<h4>国徽面</h4>
					<p>上传您的身份证国徽面</p>
				</view>
				<view class="id-upload-right">
					<u-image width="100%" height="220rpx"   :src="authData.reverseUrl?authData.reverseUrl:require('@/static/img/id1.png')"></u-image>
					
				</view>
			</view>
		</view>
		<view class="jp-btn">
			<u-button type="primary" @click="authSubmit">提交</u-button>
		</view>
	</view>
</template>


<script>
	import * as API_Common from '@/apis/common.js'
 	
 	import * as WxJsApi from '@/utils/wxJsApi.js'
	import {
			checkIdCard
		} from '@/utils'
 	export default {
		name:"Common",
		props:{
			 
		},
		data() {
			return {
				isReady2:false,
				authData:{} 
			};
			
		},methods:{
			uploadPic(key){
				if(!this.isReady2){
					return
				}
				 WxJsApi.chooseImage().then(res=>{
					 
					var formData = {
						'photoName': '1.jpg',
						'photoFile': res.localData
					}
					uni.showLoading({
					  	title:"加载中",mask:true,
					  })
					
						API_Common.uploadBase64(formData).then(response => {
							
							this.authData[key]=response.data
							console.log(this.authData);
 							uni.showToast({
										title:"上传成功",
										icon:"none"
							})
							this.$forceUpdate()
						}).catch(error => {
							uni.showToast({
										title:error,
										icon:"none"
							})	
						})
				 })
			 
			},
			authSubmit(){
				uni.showLoading({
				  	title:"加载中",mask:true,
				  })
				  var checkIdCardResult = checkIdCard(this.authData.idCard);
				  if (checkIdCardResult !== true) {
				  	 uni.showToast({
						 	icon:"none",
				  	 	title:checkIdCardResult
				  	 })
					 
				  } else if (!this.authData.name) {
						uni.showToast({
							icon:"none",
							title:"请填写姓名"
						})
				  }else if (!this.authData.positiveUrl) {
						uni.showToast({
							icon:"none",
							title:"请上传身份证人脸面"
						})
				  }else if (!this.authData.reverseUrl) {
						uni.showToast({
							icon:"none",
							title:"请上传身份证国徽面"
						})
				  }else{
					  API_Common.submitAuthentication(this.authData).then((response) => {
					  		var obj=this.carhelp.getPersonInfo()
							obj.isAuthentication="2";
							this.carhelp.setPersonInfo(obj)
							uni.hideLoading()
					  	 this.$emit("authSubmit")
					  }).catch(error => {
					  	uni.showToast({
					  				title:error,
					  				icon:"none"
					  	})
					  })
				  }
				  
				
			},
			  
			  
		},onReady(){
			 
			WxJsApi.getWxConfig(['chooseImage']).then(()=>{
						 	 this.isReady2=true;
			});
		},mounted(){
			  
			  WxJsApi.getWxConfig(['chooseImage']).then(()=>{
			 	 this.isReady2=true;
			  });
				
		},destroyed(){
			
		}
		
	}
</script>

<style>
	page{
		background-color: #f7f7f7;
	}
</style>
 
<style scoped lang="scss">
	.id-input{
		background-color: #fff;
		margin: 20rpx;
		padding: 20rpx 30rpx;
		border-radius: 20rpx;
		display: flex;
		align-items: center;
		justify-content: space-between;
		.title{
			font-size: 32rpx;
		}
	}
	.id-upload{
		margin:40rpx 20rpx;
		.title{
			font-size: 32rpx;
		}
	}
	.id-upload-item{
		margin-top: 20rpx;
		background-color: #fff;
		border-radius: 20rpx;
		display: flex;
		padding: 30rpx;
		justify-content: space-between;
		.id-upload-left{
			h4{
				margin-bottom: 10rpx;
				font-size: 32rpx;
			}
			p{
				color:#999;
			}
		}
		.id-upload-right{
			width: 340rpx;
		}
	}
	.jp-btn{
		margin: 20rpx;
	}
</style>