<template>
	<view class="zd_content bg">
		<view class="p1">{{$t('login.text1')}}</view>
		<view class="p2">{{$t('login.text2')}}</view>
		<view class="input-box">
			<input class="large-input" type="text" :placeholder="$t('login.username')" v-model="user">
		</view>
		<div class="input-box">
			<input class="large-input" :password="!showPassword" :placeholder="$t('login.password')" v-model="password">
			<span class="iconfont icon_eye_close" :class="[showPassword ? 'icon_eye_active' : '']" @tap="changePassword">&#xe6a0;</span>
	    </div>
		<view class="radio-box">
			<view class="radio-wrap">
				<span class="iconfont icon_unchecked" :class="{'icon_checked': saveUser}"  @tap="toSaveUser">&#xe66b;</span>
				<text class="radio-label">{{$t('login.remember')}}</text>
			</view>
			<text class="setup-text" @tap="setup">{{$t('login.settings')}}</text>
			<text class="setup-text" @tap="isUpdate">{{$t('login.upgrade')}}</text>
		</view>
		<button class="login-btn" :disabled="disabled" @tap="toLogin">{{$t('login.login')}}</button>
		<!-- <button class="login-btn" @tap="test">打印</button> -->
		<view v-if="version !== ''" class="version-name">v{{version}}</view>
		<Up-grade v-if="grade === true" @closeUpdate="closeUpdate" :androidUrl="androidUrl"></up-grade>
	</view>
</template>

<script>
	// import {getCLodop, getPrinterList} from "@/utils/CLodopfuncs.js"
	import { RSAencrypt } from '@/utils/jsencrypt.js'
	import {handLogin, pdaUpdate} from '@/utils/getData2.js'
	import UpGrade from './upgrade.vue'
	export default {
		components: {
			UpGrade
		},
		data() {
			return {
				user: this.$store.getters.loginName ? this.$store.getters.loginName : '',
				password: '',
				showPassword: false,
				saveUser: this.$store.getters.loginName ? true : false,
				disabled: false,
				version: '',
				versionCode: '',
				grade: false,
				androidUrl: ''
			}
		},
		created () {
			//#ifdef APP-PLUS
				// 获取本地应用资源版本号
				plus.runtime.getProperty(plus.runtime.appid, (info) => {
					// console.log(JSON.stringify(info));
					this.version = info.version;
					this.versionCode = info.versionCode ;
				}) 
			//#endif
		},
		methods: {
			isUpdate () {
				this._pdaUpdate()
			},
			// test() {
			// 	let LODOP = getCLodop();
			// 	// 更换为打印服务器ip 不需要加前缀
			// 	LODOP.PRINT_INIT(null, "192.168.81.198");
			// 	// 打印机序号 规则为打印服务器打印机列表倒数从0开始 -1为默认打印机 
			// 	LODOP.SET_PRINTER_INDEX(-1);
			// 	// 设置打印纸大小
			// 	LODOP.SET_PRINT_PAGESIZE(1, 800, 600, "");
			// 	// 根据需求插入打印代码
			// 	LODOP.PRINT();  // 打印
			// 	// LODOP.PREVIEW()
			// },
			toSaveUser() {
				this.saveUser = !this.saveUser
			},
			changePassword() {
			    this.showPassword = !this.showPassword
			},
			setup () {
				uni.redirectTo({
					url: '/pages/login/setup'
				})
			},
			async toLogin() {
				uni.redirectTo({
					url: '/pages/home/home'
				})
				this.disabled = true
				if (this.user === '') {
					// uni.showToast({
					// 	title: '用户名不能为空',
					// 	icon: 'none'
					// })
					this.disabled = false
					return
				}
				if (this.password === '') {
					// uni.showToast({
					// 	title: '密码不能为空',
					// 	icon: 'none'
					// })
					this.disabled = false
					return
				}
				try {
					let res = await handLogin(this.user, RSAencrypt(this.password))
					if (this.saveUser) {
						this.$store.dispatch('saveLoginName', this.user)
					} else {
						this.$store.dispatch('delLoginName', '')
					}
					this.$store.dispatch('saveUserInfo', JSON.stringify(res.user.user))
					this.$store.dispatch('saveToken', res.token)
					uni.redirectTo({
						url: '/pages/home/home'
					})
					this.disabled = false
				} catch (e) {
					this.disabled = false
				}
			},
			async _pdaUpdate () {
				let res = await pdaUpdate()
				// if (res.versionName === this.version) {
				// 	uni.showToast({
				// 		title: '当前为最新版本',
				// 		icon: 'none'
				// 	})
				// } else {
				// 	this.grade = true
				// 	this.androidUrl = res.url
				// }
				this.grade = true
				this.androidUrl = res.url
			},
			closeUpdate () {
				this.grade = false
			}
		}
	}
</script>

<style lang="stylus" scoped>
@import '../../common/style/mixin.styl';
.p1
  _font(40rpx,75rpx,#444,666)
  padding-top: 90rpx
.p2
  _font(52rpx,1,#444,600)
  padding: 10rpx 0 55rpx 0
.input-box
  _fj()
  margin-top 68rpx
  height 75rpx
  border-bottom 1rpx solid #e2e2e2
.large-input
	_wh(calc(100% - 40rpx), 74rpx)
	_font(32rpx,74rpx,#999)
	padding-left 10rpx
.radio-box
	_fj()
	margin: 25rpx 0 70rpx 0
	height: 34rpx
.radio-wrap
	_fj(flex-start)
	height: 34rpx
	flex: 2
.radio-label
	_font(28rpx, 28rpx,#333)
	padding-left: 10rpx
.setup-text
	_font(28rpx, 28rpx,$red,,right)
	padding-left 25rpx
.bg
	background-color: #fff;
	_bis('../../static/image/login_bg.png', 100%,,bottom)
.login-btn
  width 100%
  border-radius 46rpx
  _font(36rpx,92rpx,#fff,,center)
  background-color $red
.zd_content
	position: relative
	top 0
	height: 100%
	padding-left 40rpx
	padding-right 40rpx
	background linear-gradient(to bottom, #f8e6db 0%, #f6f6f6 30%, #f6f6f6 100%)
	overflow: hidden
.version-name
	width 100%
	position: absolute
	bottom: 30rpx
	_font(30rpx, 60rpx, #999,,center)
</style>
