<template>
	<view class="login-wrap">
		<view class="login-head">
			<view v-if="showEnvTips">{{ envTips }}</view>
		</view>
		<view class="login-body">
			<image :src="`../../static/${theme}/logo.png`" class="logo"></image>
			<form class="login-form" @submit="AndroidCheckUpdate">
				<view class="form-item">
					<u-input v-model="form.username" :custom-style="{fontSize:'34upx'}" height="110" type="text" clearable placeholder="请输入用户账号" />
				</view>
				<view class="form-item">
					<u-input v-model="form.password" :custom-style="{fontSize:'34upx'}" height="110" type="password" :password-icon="true" maxlength="50" placeholder="请输入密码"/>
				</view>
				<view class="flex-box mt20">
					<view class="remember-pass">
						<checkbox-group @change="rememberChange">
							<label>
								<u-checkbox v-model="isRemember" label-size="13px" shape="circle">记住密码</u-checkbox>
							</label>
						</checkbox-group>
					</view>
					<view class="forget-pass" @click="forgetPass">忘记密码</view>
				</view>
				<view class="form-btn-con">
					<button class="form-btn" :disabled="isDisabled" :style="{'background':isDisabled?'#e5e5e5':$config('primaryColor')}" form-type="submit">登录</button>
				</view>
			</form>
		</view>
		<!-- 隐私协议 -->
		<view class="authUserYs">
			<u-checkbox-group width="45rpx" @change="authuserChange">
				<u-checkbox v-model="isAuthuserYs" :label-disabled="false" shape="circle">
				</u-checkbox>
			</u-checkbox-group>
			<view>登录代表同意</view>
			<view @click="toYsPage">
				<text>用户协议</text>及<text>隐私保护政策</text>
			</view>
		</view>
	</view>
</template>

<script>
import { checkVersionToLoadUpdate, setStorageForAppVersion,clzConfirm } from '@/libs/tools'
import { isvalidNumLetter } from '@/libs/validate.js';
import { login } from '@/api/user.js';
import { getSysVersion } from '@/api/data.js'
export default {
	data() {
		return {
			form: {
				username: this.$store.state.vuex_user.account,
				password: this.$store.state.vuex_user.password
			},
			isRemember: true, //  是否记住密码
			isAuthuserYs: false, // 是否同意隐私政策
			envTips: '',
			showEnvTips: false,
			theme: ''
		};
	},
	computed: {
		isDisabled() {
			return this.form.username == '' || this.form.password == ''
		}
	},
	onShow() {
		this.isRemember = this.$store.state.vuex_isRemember;
		this.envTips = getApp().globalData.envTips;
		this.showEnvTips = process.env.NODE_ENV == 'development';
		this.theme = getApp().globalData.theme;
		
		//#ifdef APP-PLUS
		  this.isAuthuserYs = plus.runtime.isAgreePrivacy()
		  uni.getSystemInfo({
			  success:(res) => {
				  console.log(res)
				  // 获取最新版本信息
				  plus.runtime.getProperty(plus.runtime.appid,(wgtinfo)=>{
					wgtinfo.platform = res.platform
				  	getApp().globalData.version = wgtinfo
				  })
			  }  
		  })
		//#endif
	},
	methods: {
		// 版本更新
		AndroidCheckUpdate(){
			// let _this = this
			// let version = getApp().globalData.version
			// uni.showLoading({
			// 	title: '正在登录...'
			// });
			// getSysVersion({versionType:version.platform=='android'?'ANDROID':'IOS'}).then(ret => {
			// 	if(ret.status == 200){
			// 		this.$store.state.vuex_versionInfo = ret.data
			// 		checkVersionToLoadUpdate(ret.data,0,_this.formSubmit);
			// 	}
			// })
			this.formSubmit()
		},
		// 过滤权限code
		fiterAuthCode(data) {
			data.permCodes = data.permCodes.filter(item => item.indexOf('_mobile') > 0);
			return data;
		},
		//  表单提交
		formSubmit() {
			const _this = this;
			//  表单校验
			if (_this.form.username == '') {
				uni.showToast({ icon: 'none', title: '请输入用户账号' });
				return;
			}
			if (!isvalidNumLetter(_this.form.username)) {
				uni.showToast({ icon: 'none', title: '用户账号为数字或大小写字母组成!' });
				return;
			}
			if (_this.form.password == '') {
				uni.showToast({ icon: 'none', title: '请输入密码' });
				return;
			}
			if (_this.form.password.length < 6 || _this.form.password.length > 50) {
				uni.showToast({ icon: 'none', title: '请输入6-50位密码' });
				return;
			}
			if (!_this.isAuthuserYs) {
				uni.showToast({ icon: 'none', title: '请同意并阅读用户隐私政策' });
				return;
			}
			
			//  登录
			login(_this.form).then(res => {
				uni.hideLoading();
				if (res.status == 200) {
					// _this.$u.vuex('vuex_token', 'Bearer ' + res.data.access_token);
					// _this.$u.vuex('vuex_userData', _this.fiterAuthCode(res.data.auth_user));
					// getApp().globalData.token = 'Bearer ' + res.data.access_token;
					_this.$u.vuex('vuex_token', res.data.access_token);
					getApp().globalData.token = res.data.access_token;
					//登录成功将用户名密码存储到用户本地
					if (_this.isRemember) {
						//用户勾选“记住密码”
						_this.$u.vuex('vuex_user.account', _this.form.username);
						_this.$u.vuex('vuex_user.password', _this.form.password);
					} else {
						//用户没有勾选“记住密码”
						_this.$u.vuex('vuex_user.account', '');
						_this.$u.vuex('vuex_user.password', '');
						_this.form.username = '';
						_this.form.password = '';
					}
					uni.setStorageSync('loginTimeOut', 'NO');
					_this.toMain();
				} else {
					uni.showToast({ icon: 'none', title: res.message });
				}
			});
		},
		toMain() {
			// 跳转到首页
			uni.switchTab({
				url: '/pages/index/index'
			});
		},
		//  忘记密码
		forgetPass() {
			uni.navigateTo({
				url: '/pages/login/forget-pass?username=' + this.form.username
			});
		},
		//  判断是否记住密码
		rememberChange(e) {
			this.isRemember = e.detail.value.length > 0;
		},
		// 隐私
		authuserChange(e) {
			this.$u.vuex('vuex_isUsrAuthYs', this.isAuthuserYs);
			//#ifdef APP-PLUS
			if(!this.isAuthuserYs){
				plus.runtime.disagreePrivacy()
			}else{
				plus.runtime.agreePrivacy()
			}
			//#endif
		},
		toYsPage() {
			uni.navigateTo({
				url: '/pages/login/userAuthYs'
			});
		}
	}
};
</script>
<style scoped lang="scss">
@import './login.scss';
</style>