<template>
	<view class="other-login">
		<u--form id="uForm" labelPosition="left"  errorType="toast" :model="userInfo" :rules="rules" ref="uForm">
			<u-form-item label="手机号码" class="code" prop="phoneNum" borderBottom ref="item1" labelWidth="140">
				<u--input type="digit" placeholder="输入手机号码" maxlength="11" v-model="userInfo.phoneNum" border="none"></u--input>
				<view class="code-btn" slot="right" @click="sendCode">
					{{codeText}}
				</view>
			</u-form-item>
			<u-form-item label="验证码" prop="code" borderBottom ref="item1" labelWidth="140">
				<u--input type="idcard" placeholder="输入6位验证码" maxlength="6" v-model="userInfo.code"  border="none"></u--input>
			</u-form-item>
			<!-- <u-form-item label="保存此号码供以后使用" borderBottom ref="item1" labelWidth="320">
				<u-switch v-model="open" slot="right"></u-switch>
			</u-form-item> -->
		</u--form>
		
		<!-- 实名认证 -->
		<u-popup :show="show" v-show="show" closeable :closeOnClickOverlay="false" mode="center" round="24"
			@close="close">
			<view class="modal">
				<view class="title">
					实名认证
				</view>
				<u--form id="uForm" errorType="toast" labelPosition="left" :model="auth" :rules="rules" ref="uForm">
					<u-form-item label="姓名" prop="name" ref="item1" labelWidth="100">
						<u--input placeholder="请输入姓名" v-model="auth.name" border="none"></u--input>
					</u-form-item>
					<u-form-item label="身份证" prop="idCardNum" ref="item1" labelWidth="100">
						<u--input type="idcard" placeholder="请输入身份证号码" maxlength="18" v-model="auth.idCardNum"
							border="none"></u--input>
					</u-form-item>
		
				</u--form>
					<u-checkbox-group v-model="check">
						<u-checkbox size="34" shape="circle" >
						</u-checkbox>
						<view  class="protocol" @click="handleProtocol">已阅读并同意
						<view class="link">
							《用户隐私协议》
						</view> 
						</view>
						<view class="notice-protocol" v-if="notice">请勾选用户隐私协议</view>
					</u-checkbox-group>
				<button class="save-btn" type="default" @click="submit">提交</button>
			</view>
		</u-popup>
		
		<view class="save" @click="save">
			完成
		</view>
	</view>
</template>

<script>
	import {validLogin,getLoginToken,sendVerifyCode,auth,getUserDetail} from '@/api/common.js'
	export default {
		data() {
			return {
				check:false,
				notice:false,
				id:'',//其他页面传来的id
				scene:'',//其他页面携带的参数统一存放
				redirect:'',//重定位地址
				params:'',//重定向页面参数
				show: false,
				auth: {
					name: '',
					idCardNum: '',
					phone:''
				},
				rules: {
					'name': {
						type: 'string',
						required: true,
						message: '请填写姓名',
						trigger: ['blur', 'change']
					},
					'idCardNum': [
						{
							type: 'string',
							max: 18,
							required: true,
							message: '请输入身份证号',
							trigger: ['blur', 'change']
						},
						{
							validator: (rule, value, callback) => {
								let reg = /^[1-9]\d{5}(18|19|20)\d{2}((0[1-9])|(1[0-2]))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$/;
								// 上面有说，返回true表示校验通过，返回false表示不通过
								return reg.test(value);
							},
							message: '身份证号不合法',
							// 触发器可以同时用blur和change
							trigger: ['change','blur'],
						}
					] ,
				},
				userInfo: {
					code:'',
					phoneNum:'',
					platformType : 1
				},
				open:false,
				seconds:6,
				rules: {
					'phoneNum': {
						type: 'string',
						required: true,
						message: '请输入手机号',
						trigger: ['blur', 'change']
					},
					'code': {
						type: 'string',
						max: 18,
						required: true,
						message: '请输入验证码',
						trigger: ['blur', 'change']
					},
					
				},
				isSend:false,
				seconds:60,
				codeText:'获取验证码',//按钮文字
			}
		},
		methods: {
			handleProtocol() {
				uni.navigateTo({
					url:'./xieyi'
				})
			},
			close(){
				this.show = false
			},
			// 获取验证码
			sendCode(){
				if(this.isSend) return
				this.isSend = true
				sendVerifyCode({phoneNum:this.userInfo.phoneNum,appName:'user',templateId:1}).then(res=>{
				})
				this.timer = setInterval(()=>{
					if(this.seconds<=0){
						this.codeText = '获取验证码'
						this.seconds = 60
						this.isSend = false
						clearInterval(this.timer)
					}else{
						this.codeText = this.seconds +'s后获取'
					}
					this.seconds --
				},1000)
			},
			// 实名认证
			submit() {
				if(!this.check) return this.notice = true
				this.$refs.uForm.validate().then(r => {
					uni.showLoading({
						title:'验证中'
					})
					this.auth.phone = this.userInfo.phoneNum
					auth(this.auth).then(res => {
						uni.hideLoading()
						if (res.msg == '成功') {
							this.show = false
							if(this.redirect){
								uni.reLaunch({
									// url:`${this.redirect}?scene=${this.scene}&id=${this.id}`
									url:`${this.redirect}?${this.params}`
								})
							}else{
								uni.switchTab({
									url: '../../pages/index/index'
								})
							}
						}
					})
				})
			},
			save(){
				let that = this
				this.$refs.uForm.validate().then(r => {
					
					uni.showLoading({
						title: '加载中'
					});
					const inviteUserId = uni.getStorageSync('inviteCode') == 'undefined' ? null : uni.getStorageSync('inviteCode')
					getLoginToken({phoneNum:this.userInfo.phoneNum,platformType:1,inviteUserId}).then(res=>{
						uni.login({
							provider: 'weixin',
							success(r) {
								let userInfo = that.userInfo
								userInfo.loginToken = res.content
								userInfo.scene = inviteUserId
								userInfo.jsCode = r.code
								if(res.state != 'Success') return
								validLogin(userInfo).then(res=>{
									uni.hideLoading()
									if(res.state == 'Success'){
										uni.setStorageSync('isAuth', res.content
											.isAuth) //登录状态
										uni.setStorageSync('token', res.content
											.token) //登录状态
										uni.setStorageSync('refreshToken', res.content
											.refreshToken) //refreshToken
										getUserDetail().then(res => {
											uni.setStorageSync('userInfo', JSON.stringify(res.content))
											if(that.redirect){
												uni.reLaunch({
													// url:`${that.redirect}?scene=${that.scene}&id=${that.id}`
													url:`${that.redirect}?${that.params}`
												})
											}else{
												uni.reLaunch({
													url: '../../pages/index/index'
												})
											}
											// if (res.content.isAuth == 1) {
											// 	if(that.redirect && that.redirect !=  "undefined"){
											// 		uni.reLaunch({
											// 			// url:`${that.redirect}?scene=${that.scene}&id=${that.id}`
											// 			url:`${that.redirect}?${that.params}`
											// 		})
											// 	}else{
											// 		uni.switchTab({
											// 			url: '../../pages/index/index'
											// 		})
											// 	}
											// } else { //未实名认证
											// 	that.show = true
											// }
										})
										
										
									}
								})
							}
						})
					})
				})
			}
		},
		onLoad(options) {
			this.redirect = options.redirect
			this.scene = options.scene
			this.id = options.id
			for (let key in options) {
				if(key != 'redirect'){
					if(this.params){
					 this.params += `&${key}=${options[key]}`
					}else{
						 this.params += `${key}=${options[key]}`
					}
				}
			}
		}
	}
</script>

<style lang="scss" >
.other-login{
	padding: 10rpx 20rpx;
		.code-btn{
			padding: 10rpx 25rpx;
			background: rgb(164, 173, 179);
			color: #fff;
			border-radius: 4px;
		}
		.save{
			width: 400rpx;
			line-height: 110rpx;
			text-align: center;
			color: #fff;
			background: rgb(164, 173, 179);
			border-radius: 55rpx;
			font-size: 30rpx;
			margin: 150rpx auto 0;
		}
		
		.u-form-item{
			
		}
		.u-checkbox-group{
			position: relative;
			padding-bottom: 30rpx;
			margin-top: 20rpx;
			.protocol {
				display: flex;
				text-align: center;
				font-size: 28rpx;
				color: #999999;
				.link{
				color: #0C6FFE;
				}
			}
			
			.notice-protocol {
				color: red;
				margin-left: 50rpx;
				font-size: 26rpx;
				position: absolute;
				bottom: 0;
				left: 0%;
			}
		}
		
		
		.modal {
			width: 680rpx;
			box-sizing: border-box;
			padding: 30rpx;
		
			.title {
				text-align: center;
				font-size: 38rpx;
				font-weight: bold;
				margin-top: 30rpx;
				margin-bottom: 50rpx;
			}
		
			.u-form-item {
				border-radius: 46rpx;
				height: 92rpx;
				background: #F5F5F5;
				padding: 0 30rpx;
				box-sizing: border-box;
				margin-top: 32rpx;
		
				.u-form-item__body {
					padding: 0 !important;
				}
		
				.u-form-item__body__left,
				.u-form-item__body__right {
		
					input {
						line-height: 92rpx;
						height: 92rpx;
					}
				}
			}
		
			.save-btn {
				width: 432rpx;
				height: 92rpx;
				line-height: 92rpx;
				border-radius: 46rpx;
				font-size: 32rpx;
				font-weight: bold;
				background: $uni-color-primary;
				color: #fff;
				margin-top: 32rpx;
			}
		
		
		}
}
</style>