<template>
	<view>
		<view class="logo">
			<view class="img">
				<image mode="widthFix"
					src="data:image/png;base64,[encoded data, 5008 characters]">
				</image>
			</view>
		</view>
		<view class="form re">
			<view class="username">
				<view class="get-code" style="color: #676767;" @click.stop="getCode()">{{getCodeText}}</view>
				<input placeholder="请输入手机号" v-model="phoneNumber" placeholder-style="color: #676767;" />
			</view>
			<view class="code">
				<input placeholder="请输入验证码" v-model="code" placeholder-style="color: #676767;" />
			</view>
			<view class="mart40 checkbox font14 width90">
				<text v-if="disabled==false" class='checkno' @click="getchecked"></text>
				<view v-else class='checkyes' @click="getchecked">
					<image style="width: 18px;height: 18px;margin-top: 2px;" src="../../static/img/gou.png" mode="">
					</image>
				</view>
				授权即表示同意
				<text style="color: #089BF5;" @click="getDocument(1)">《注册协议》</text><text style="color: #089BF5;"
					@click="getDocument(2)">《服务协议》</text>
			</view>
			<view class="btn" style="margin-top: 10px;" @tap="doReg">立即登录/注册</view>

		</view>

	</view>
</template>

<script>
	import {
		getLoginSMSCode,
		phone
	} from "../../Utils/Api.js";
	let app = getApp();
	export default {
		data() {
			return {
				phoneNumber: "",
				code: '',
				getCodeText: '获取验证码',
				getCodeBtnColor: "#ffffff",
				getCodeisWaiting: false,
				disabled: false,
			}
		},
		onLoad() {

		},
		onUnload(){
			// if(!app.globalData.userInfo&&!app.globalData.token){
			// 	uni.switchTab({
			// 		url:'/pages/tabBar/home/home'
			// 	})
				
				
			// }
		},
		methods: {
			//开启状态
			getchecked() {
				this.disabled = !this.disabled
			},
			//跳转协议
			getDocument(item) {
				uni.navigateTo({
					url: '../userLogin/agreement/agreement?id=' + item
				})
			},
			Timer() {},
			getCode() {
				uni.hideKeyboard()

				if (this.getCodeisWaiting) {
					return;
				}
				if (!(/^1(3|4|5|6|7|8|9)\d{9}$/.test(this.phoneNumber))) {
					uni.showToast({
						title: '请填写正确手机号码',
						icon: "none"
					});
					return false;
				}
				uni.showLoading({
					title: '发送中...'
				})
				let params = {
					phone: this.phoneNumber,
				}
				getLoginSMSCode(params).then(res => {
					uni.hideLoading();
					if (res.return_code == '000000') {
						this.getCodeisWaiting = true;
						this.getCodeBtnColor = "rgba(255,255,255,0.5)"
						uni.showToast({
							title: '验证码已发送',
							icon: "none"
						});
						this.setTimer();
					}
				})
			},
			setTimer() {
				let holdTime = 60;
				this.getCodeText = "重新获取(60)"
				this.Timer = setInterval(() => {
					if (holdTime <= 0) {
						this.getCodeisWaiting = false;
						this.getCodeBtnColor = "#ffffff";
						this.getCodeText = "获取验证码"
						clearInterval(this.Timer);
						return;
					}
					this.getCodeText = "重新获取(" + holdTime + ")"
					holdTime--;

				}, 1000)
			},
			doReg() {
				uni.hideKeyboard();
				if (this.disabled == false) {
					uni.showToast({
						title: '请勾选用户协议',
						icon: "none",
						duration: 2000
					})
					return;
				}
				//模板示例部分验证规则
				if (!(/^1(3|4|5|6|7|8|9)\d{9}$/.test(this.phoneNumber))) {
					uni.showToast({
						title: '请填写正确手机号码',
						icon: "none"
					});
					return false;
				}
				if (!this.code) {
					uni.showToast({
						title: '请填写验证码',
						icon: "none"
					});
					return false;
				}
				uni.showLoading({
					title: '提交中...'
				})
				let userid = '';
				if (app.globalData.accountId == '000009&key' || app.globalData.accountId == '0000010&key') {
					userid = app.globalData.staffCode;
				}
				let params = {
					popularizeUserId: userid,
					phone: this.phoneNumber,
					type: "SMS",
					platform: "H5",
					smsCode: this.code,
					openIdH5:app.globalData.openId
				}
				phone(params).then(res => {
					uni.hideLoading();
					if (res.return_code == '000000') {
						app.globalData.userInfo = res.return_data
							.object
							.highUser;
						app.globalData.token = res.return_data.uniqueCode;
						uni.setStorage({
							key: "user",
							data: res.return_data
								.object
								.highUser
						})
						uni.setStorage({
							key: "token",
							data: res.return_data.uniqueCode
						})
						uni.navigateBack({});
					} else {
						uni.showToast({
							title: res.return_msg,
							icon: "none"
						});
					}
				})

			}
		}
	}
</script>

<style lang="scss">
	@import "../../static/css/login.scss";

	.wximg {
		width: 50px;
		height: 50px;
		margin-left: 40%;
		margin-top: 90px;
		margin-bottom: 40px;
	}

	.checkbox {
		display: flex;
		align-items: center;
		// line-height: 35rpx;

		.checkyes {
			width: 40rpx;
			height: 40rpx;
			line-height: 40rpx;
			border: 1px solid #f4f4f4;
			background-color: #089BF5;
			margin-right: 10rpx;
			border-radius: 50%;
			text-align: center;
			vertical-align: sub;
		}

		.checkno {
			width: 35rpx;
			height: 35rpx;
			display: inline-block;
			border: 1px solid #666;
			margin-right: 10rpx;
			border-radius: 50%;
			vertical-align: sub;
		}
	}
</style>
