great_mobileui/center/factorauth.vue

<template>
	<view class="pages">
		<u-navbar
			title="实名认证"
			:placeholder="true"
			:autoBack="true"
			@leftClick="leftClick"
			 :safeAreaInsetTop="true"
		>
		</u-navbar>
		<view class="page-wrap">
			<view class="login-box">
				<u--form labelPosition="left" labelWidth="200rpx" :model="form" :rules="rules" ref="uForm" >
					<u-form-item label="真实姓名" prop="name" borderBottom ref="name" >
						<u--input
							v-model="form.name"
							placeholder="真实姓名"
							border="none"
							:customStyle="inputCustomStyle"
						></u--input>
					</u-form-item>
					<u-form-item label="身份证号码" prop="idcard" ref="idcard" >
						<u--input
							v-model="form.idcard"
							border="none"
							placeholder="身份证号码"
							:customStyle="inputCustomStyle"
						></u--input>
					</u-form-item>
				</u--form>
				<u-button 
					@click="submit"
					text="提交认证" 
					type="error" 
					shape="circle" 
					:customStyle="{'margin-top':'60rpx',height:'98rpx','box-sizing':'border-box'}">
				</u-button>
			</view>
		</view>
		<u-toast ref="uToast"></u-toast>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				backUrl:'',
				form:{
					name:'',
					idcard:''
				},
				rules: {
					name: {
						type: 'string',
						required: true,
						message: '请填写真实姓名',
						trigger: ['blur', 'change']
					},
					idcard:[
						{
							type: 'string',
							required: true,
							message: '请填身份证号码',
							trigger: ['blur', 'change']
						},
						// {
						// 	validator: (rule, value, callback) => {
						// 		// 上面有说，返回true表示校验通过，返回false表示不通过
						// 		// uni.$u.test.mobile()就是返回true或者false的
						// 		return uni.$u.test.idCard(value);
						// 	},
						// 	message: '身份证号码不正确',
						// 	// 触发器可以同时用blur和change
						// 	trigger: ['change','blur'],
						// }
					]
				},
				inputCustomStyle:{}
			}
		},
		onShow() {
		},
		onReady() {
			//onReady 为uni-app支持的生命周期之一
			this.$refs.uForm.setRules(this.rules)
		},
		onLoad(page) {
			console.log('page',page);
			this.backUrl =  decodeURIComponent(page.backUrl)||'/center/center';
			console.log('this.backUrl',this.backUrl);
		},
		methods: {
			leftClick(){
				let pages = getCurrentPages();
				if(pages.length==1){
					uni.$u.route('/pages/index/index')
				}else{
					uni.navigateBack()
				};
			},
			submit(){
				// console.log('form',this.form);
				// if(!this.form.idcard.startsWith("52")){
				// 	uni.$u.toast('仅允许以52开头的身份证')
				// 	return
				// }
				this.$refs.uForm.validate().then(res => {
					// uni.$u.toast('校验通过')
					this.$u.api.factorAuth(this.form).then(res=>{
						this.getMemberInfo()
						// console.log('res',res.data);
					}).catch(err=>{
						// this.$refs.uToast.show({
						// 	type: 'error',
						// 	icon: false,
						// 	title: '认证失败',
						// 	message: err.msg,
						// })
						console.log('login',err);
					})
				}).catch(errors => {
					uni.$u.toast('请正确填写表单')
				})
			},
			getMemberInfo(){
				let that = this;
				this.$u.api.memberInfo({id:this.vuex_user_info.userid}).then(res=>{
					this.$u.vuex('vuex_member_info', res.data);
					uni.showToast({
						title:'认证成功',
						icon:'success'
					})
					setTimeout(()=>{
						// console.log('this.backUrl',this.backUrl);
						// uni.reLaunch({url: this.backUrl});
						that.leftClick();
					},1000)
					// console.log('memberInfo',this.memberInfo);
					}).catch(err=>{
					// console.log('memberInfo',err.data);
				})
			},
		}
	}
</script>

<style lang="scss" scoped>

</style>