139 lines
3.7 KiB
Vue
139 lines
3.7 KiB
Vue
<template>
|
||
<section>
|
||
<section class="content">
|
||
<p class="p1">欢迎来到</p>
|
||
<p class="p2">中德自控立体仓库手持系统！</p>
|
||
<div class="input-box">
|
||
<input type="text" class="allwidth" placeholder="请输入用户名" v-model="loginname">
|
||
</div>
|
||
<div class="fxrow input-box">
|
||
<input class="fxcol" :type="type" placeholder="请输入密码" v-model="password">
|
||
<i class="icon-eye" :class="type === 'password' ? 'icon-eye-close' : 'icon-eye-open'" @click="changeType"></i>
|
||
</div>
|
||
<div class="fxrow check-box">
|
||
<i class="icon-name-check" :class="{'icon-name-checked': memberName}" @click="Remember"></i>
|
||
<span class="fxcol">记住用户名</span>
|
||
</div>
|
||
<button class="login-btn" :disabled="disabled" @click="_Login">确认登录</button>
|
||
</section>
|
||
</section>
|
||
</template>
|
||
|
||
<script>
|
||
import {rfLogin} from '@config/getData2'
|
||
// import {rfLogin} from '@config/mork2'
|
||
export default {
|
||
name: 'Login',
|
||
data () {
|
||
return {
|
||
loginname: '',
|
||
password: '',
|
||
type: 'password',
|
||
memberName: false,
|
||
disabled: false
|
||
}
|
||
},
|
||
created () {
|
||
if (this.$store.getters.userInfo !== '') {
|
||
this.loginname = JSON.parse(this.$store.getters.userInfo).loginname
|
||
this.memberName = this.loginname !== ''
|
||
}
|
||
},
|
||
mounted () {
|
||
document.getElementsByTagName('body')[0].className = 'login-bg'
|
||
},
|
||
methods: {
|
||
changeType () {
|
||
this.type = this.type === 'password' ? 'text' : 'password'
|
||
},
|
||
Remember () {
|
||
this.memberName = !this.memberName
|
||
},
|
||
async rfLogin () {
|
||
try {
|
||
let res = await rfLogin(this.loginname, this.password)
|
||
if (res.ErrNO === '1') {
|
||
let obj = {}
|
||
if (this.memberName) {
|
||
obj = Object.assign({}, {UserName: res.UserName, UserPID: res.UserPID, loginname: this.loginname})
|
||
} else {
|
||
obj = Object.assign({}, {UserName: res.UserName, UserPID: res.UserPID, loginname: ''})
|
||
}
|
||
this.$store.dispatch('setUserInfo', JSON.stringify(obj))
|
||
this.$router.push('/home')
|
||
} else {
|
||
this.Dialog(res.ErrMsg)
|
||
}
|
||
this.disabled = false
|
||
} catch (err) {
|
||
this.disabled = false
|
||
}
|
||
},
|
||
_Login () {
|
||
this.disabled = true
|
||
if (this.loginname === '') {
|
||
this.toast('用户名不能为空')
|
||
this.disabled = false
|
||
return
|
||
}
|
||
if (this.password === '') {
|
||
this.toast('密码不能为空')
|
||
this.disabled = false
|
||
return
|
||
}
|
||
this.logintype = '01'
|
||
this.rfLogin()
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="stylus" scoped>
|
||
@import '~@style/mixin'
|
||
.p1
|
||
_font(.6rem,1,#444)
|
||
padding-top: 0.9rem
|
||
.p2
|
||
_font(.5rem,1,#444)
|
||
padding: 0.4rem 0 0.25rem
|
||
.input-box
|
||
margin-top .68rem
|
||
border-bottom 1px solid #e2e2e2
|
||
input
|
||
_font(.32rem,.74rem,#999)
|
||
padding-left .1rem
|
||
.icon-eye
|
||
flex 0 0 .35rem
|
||
height .74rem
|
||
.icon-eye-close
|
||
_bis('../../images/eyeclose.png',.35rem)
|
||
.icon-eye-open
|
||
_bis('../../images/eyeopen.png',.35rem)
|
||
.check-box
|
||
margin .25rem 0 .7rem
|
||
height .34rem
|
||
_font(.26rem,.34rem,#999)
|
||
.icon-name-check
|
||
flex 0 0 .26rem
|
||
height .26rem
|
||
margin-right 6px
|
||
border 1px solid #e2e2e2
|
||
border-radius 50%
|
||
.icon-name-checked
|
||
border none
|
||
_bis('../../images/select.png',.26rem)
|
||
.login-btn
|
||
width 100%
|
||
border-radius .46rem
|
||
_font(.36rem,.92rem,#fff,,center)
|
||
background-color $red
|
||
.login-ewm
|
||
margin 1.2rem auto .2rem
|
||
_wh(.82rem,.82rem)
|
||
border 1px solid #e74f1a
|
||
border-radius 50%
|
||
_bis('../../images/ewm.png',58%)
|
||
.login-ewm-p
|
||
_font(.26rem,1,$red,,center)
|
||
</style>
|