hht-ximenzi-uni/pages/login/login.vue

<template>
	<view class="zd_content bg">
		<view class="p1">欢迎来到</view>
		<view class="p2">西门子LMS手持系统！</view>
		<view class="input-box">
			<input class="large-input" type="text" placeholder="请输入用户名" v-model="user">
		</view>
		<div class="input-box">
			<input class="large-input" :password="!showPassword" placeholder="请输入密码" v-model="password" autocomplete=“off”>
			<uni-icons :type="showPassword ? 'eye-filled' : 'eye'" size="20" :color="showPassword ? '#ff6a00' : '#999'" @tap="showPassword = !showPassword"></uni-icons>
	    </div>
		<view class="zd-row radio-box">
			<view class="zd-col-2 zd-row jccenter radio-icon-wrap" :class="{'radio-icon-wrap_checked': saveUser}" @tap="toSaveUser">
				<uni-icons type="checkmarkempty" size="14" :color="saveUser ? '#ff6a00' : '#fff'"></uni-icons>
			</view>
			<view class="zd-col-13 radio-label">记住用户名</view>
			<view class="zd-col-4 setup-text" @tap="setup">设置</view>
			<view class="zd-col-5 setup-text" @tap="isUpdate">升级版本</view>
		</view>
		<button class="login-btn" :disabled="disabled" @tap="toLogin">确认登录</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 { 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
			this.$globalData.stopTimer()
		},
		methods: {
			isUpdate () {
				this._pdaUpdate()
			},
			toSaveUser() {
				this.saveUser = !this.saveUser
			},
			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: 190rpx
.p2
  _font(44rpx,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% - 100rpx), 74rpx)
	_font(32rpx,74rpx,#999)
	padding-left 10rpx
.radio-box
	margin 25rpx 0 70rpx 0
.radio-icon-wrap
	_wh(34rpx, 34rpx)
	border 1rpx solid #999
	border-radius 4rpx
	text-align center
	line-height 40rpx
.radio-icon-wrap_checked
	border-color $red
.radio-label
	_font(28rpx, 28rpx,#333)
.setup-text
	_font(28rpx, 28rpx,$red,,right)
.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-color: #fff
	overflow: hidden
.version-name
	width 100%
	position: absolute
	bottom: 30rpx
	_font(30rpx, 60rpx, #999,,center)
</style>