登录、home、工单管理
This commit is contained in:
@@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="login_wrap" :class="heightLimit">
|
||||
<div class="login_wrap">
|
||||
<div class="login_tab">
|
||||
<div class="login_tab_line drift" :style="{'left': drift+'%'}"></div>
|
||||
<div class="login_tab_item" @click="_tabChange(0)">登录</div>
|
||||
@@ -10,54 +10,68 @@
|
||||
<div v-show="!scanShow" class="login_card fl">
|
||||
<div class="card_wrap">
|
||||
<div class="inputOuter">
|
||||
<label>用户名</label>
|
||||
<div class="label">用户名</div>
|
||||
<input type="text" v-model="loginname" class="inputStyle">
|
||||
<i v-show="closeIcon1" class="iconfont close_icon" @click="clearData(1)"></i>
|
||||
<div v-show="closeIcon1" class="iconfont close_icon" @click="clearData(1)"></div>
|
||||
</div>
|
||||
<div class="inputOuter">
|
||||
<label>密码</label>
|
||||
<div class="label">密码</div>
|
||||
<input type="password" v-model="password" class="inputStyle">
|
||||
<i v-show="closeIcon2" class="iconfont close_icon" @click="clearData(2)"></i>
|
||||
<div v-show="closeIcon2" class="iconfont close_icon" @click="clearData(2)"></div>
|
||||
</div>
|
||||
<div class="inputOuter"></div>
|
||||
</div>
|
||||
<div class="submit">
|
||||
<button class="btn" @click="_login" :disabled="disabled">手工登录</button>
|
||||
<button class="fr btn" @click="_scan">扫码登录</button>
|
||||
<div class="btn-wrap">
|
||||
<button class="btn" @click="_login" :disabled="disabled">手工登录</button>
|
||||
</div>
|
||||
<div class="btn-wrap">
|
||||
<button class="btn" @click="_scan">扫码登录</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-show="scanShow" class="login_card fl">
|
||||
<div class="card_wrap">
|
||||
<div class="inputOuter">
|
||||
<label>用户名</label>
|
||||
<div class="label">用户名</div>
|
||||
<input type="password" ref="lname" v-model="qrcode" class="inputStyle" @keyup.enter="scanInput" :disabled="disabled">
|
||||
</div>
|
||||
<div class="inputOuter"></div>
|
||||
<div class="inputOuter"></div>
|
||||
</div>
|
||||
<div class="submit">
|
||||
<button class="fl btn" @click="_login2">手工登录</button>
|
||||
<button class="fr btn" @click="_scan">重新扫码</button>
|
||||
<div class="btn-wrap">
|
||||
<button class="btn" @click="_login2">手工登录</button>
|
||||
</div>
|
||||
<div class="btn-wrap">
|
||||
<button class="btn" @click="_scan">重新扫码</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="login_card fl" ref="config">
|
||||
<div class="card_wrap">
|
||||
<div class="inputOuter">
|
||||
<label>域名地址</label>
|
||||
<input type="text" class="inputStyle" v-model="baseUrl">
|
||||
<i v-show="closeIcon3" class="iconfont close_icon" @click="clearData(3)"></i>
|
||||
<div class="label label1">域名地址</div>
|
||||
<input type="text" class="inputStyle inputStyle1" v-model="baseUrl">
|
||||
<div v-show="closeIcon3" class="iconfont close_icon" @click="clearData(3)"></div>
|
||||
</div>
|
||||
<div class="inputOuter">
|
||||
<label>图片域名地址</label>
|
||||
<input type="text" class="inputStyle" v-model="imgBaseUrl">
|
||||
<i v-show="closeIcon4" class="iconfont close_icon" @click="clearData(4)"></i>
|
||||
<div class="label label1">图片域名地址</div>
|
||||
<input type="text" class="inputStyle inputStyle1" v-model="imgBaseUrl">
|
||||
<div v-show="closeIcon4" class="iconfont close_icon" @click="clearData(4)"></div>
|
||||
</div>
|
||||
<!-- <div class="inputOuter">
|
||||
<label>锁屏时间(分钟)</label>
|
||||
<input type="text" class="inputStyle" v-model="lockTime">
|
||||
</div> -->
|
||||
<div class="inputOuter">
|
||||
<label>锁屏时间(分钟)</label>
|
||||
<select name="equipment" v-model="lockTime">
|
||||
<option :value="e.id" v-for="e in lockTimeArr" :key="e.id">{{e.name}}</option>
|
||||
</select>
|
||||
<div class="label label1">锁屏时间(分钟)</div>
|
||||
<div class="select select1">
|
||||
<el-select v-model="value" placeholder="请选择">
|
||||
<el-option
|
||||
v-for="item in options"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="submit">
|
||||
@@ -70,22 +84,23 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {handLogin} from './../config/getData2.js'
|
||||
import {encrypt} from './../main.js'
|
||||
export default {
|
||||
name: 'Login',
|
||||
data () {
|
||||
return {
|
||||
loginname: '',
|
||||
password: '',
|
||||
lockTimeArr: [{id: 0, name: '0(不锁屏)'}, {id: 1, name: '1'}, {id: 3, name: '3'}, {id: 5, name: '5'}, {id: 10, name: '10'}, {id: 15, name: '15'}, {id: 30, name: '30'}, {id: 60, name: '60'}],
|
||||
lockTime: Number(this.$store.getters.lockTime),
|
||||
baseUrl: this.$store.getters.baseUrl,
|
||||
imgBaseUrl: this.$store.getters.imgBaseUrl,
|
||||
drift: 0,
|
||||
heightLimit: 'heightLimit2',
|
||||
disabled: false,
|
||||
scanShow: false,
|
||||
qrcode: '',
|
||||
logintype: ''
|
||||
logintype: '',
|
||||
options: [{value: 0, label: '0(不锁屏)'}, {value: 1, label: '1'}, {value: 3, label: '3'}, {value: 5, label: '5'}, {value: 10, label: '10'}, {value: 15, label: '15'}, {value: 30, label: '30'}, {value: 60, label: '60'}],
|
||||
value: Number(this.$store.getters.lockTime)
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
@@ -105,7 +120,6 @@ export default {
|
||||
methods: {
|
||||
_tabChange (num) {
|
||||
this.drift = num
|
||||
this.heightLimit = num === 0 ? 'heightLimit2' : 'heightLimit3'
|
||||
this.scanShow = false
|
||||
},
|
||||
clearData (e) {
|
||||
@@ -128,39 +142,21 @@ export default {
|
||||
let obj = {
|
||||
baseUrl: this.baseUrl,
|
||||
imgBaseUrl: this.imgBaseUrl,
|
||||
lockTime: this.lockTime
|
||||
lockTime: this.value
|
||||
}
|
||||
this.$store.dispatch('setConfig', obj)
|
||||
this._tabChange(0)
|
||||
},
|
||||
loginApi () {
|
||||
let data = {
|
||||
'_SRVNAME': 'server.app.screenAPI',
|
||||
'_SRVMETHOD': 'verifyAccount',
|
||||
'_DATA': JSON.stringify({
|
||||
form: {
|
||||
logintype: this.logintype,
|
||||
loginname: this.loginname,
|
||||
password: this.password,
|
||||
qrcode: this.qrcode
|
||||
}
|
||||
})
|
||||
async loginApi () {
|
||||
try {
|
||||
let res = await handLogin(this.loginname, encrypt(this.password))
|
||||
this.$store.dispatch('setUserInfo', JSON.stringify(res.user.user))
|
||||
this.$store.dispatch('saveToken', res.token)
|
||||
this.$router.push('/home')
|
||||
this.disabled = false
|
||||
} catch (e) {
|
||||
this.disabled = false
|
||||
}
|
||||
this
|
||||
.$post(data)
|
||||
.then(res => {
|
||||
if (res.code === '1') {
|
||||
this.$store.dispatch('setUserInfo', res.result)
|
||||
this.$router.push('/home')
|
||||
} else {
|
||||
this.Dialog(res.desc)
|
||||
}
|
||||
this.disabled = false
|
||||
})
|
||||
.catch(error => {
|
||||
this.disabled = false
|
||||
console.log(error)
|
||||
})
|
||||
},
|
||||
_login () {
|
||||
this.disabled = true
|
||||
@@ -179,7 +175,6 @@ export default {
|
||||
},
|
||||
_scan () {
|
||||
this.scanShow = true
|
||||
this.heightLimit = 'heightLimit1'
|
||||
this.qrcode = ''
|
||||
this.$nextTick(() => {
|
||||
this.$refs.lname.focus()
|
||||
@@ -191,7 +186,6 @@ export default {
|
||||
},
|
||||
_login2 () {
|
||||
this.scanShow = false
|
||||
this.heightLimit = 'heightLimit2'
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -199,21 +193,17 @@ export default {
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
.login_wrap
|
||||
position fixed
|
||||
position absolute
|
||||
left 50%
|
||||
top 50%
|
||||
min-width 369px
|
||||
width 50%
|
||||
// min-width 369px
|
||||
width 60%
|
||||
height 3.3rem
|
||||
transform translate3d(-50%, -50%, 0)
|
||||
background-color rgba(255, 255, 255, 0.8)
|
||||
border-radius 5px
|
||||
overflow hidden
|
||||
.heightLimit1
|
||||
height 2.4rem
|
||||
.heightLimit2
|
||||
height 3.3rem
|
||||
.heightLimit3
|
||||
height 4.2rem
|
||||
z-index 1
|
||||
overflow-x hidden
|
||||
.login_tab
|
||||
position relative
|
||||
height .5rem
|
||||
@@ -238,43 +228,80 @@ export default {
|
||||
.login_cnt
|
||||
position relative
|
||||
width 200%
|
||||
overflow hidden
|
||||
overflow-x hidden
|
||||
.login_card
|
||||
width 50%
|
||||
padding .3rem .5rem
|
||||
height auto
|
||||
padding .3rem .3rem
|
||||
.card_wrap
|
||||
overflow hidden
|
||||
width 100%
|
||||
// overflow hidden
|
||||
.inputOuter
|
||||
position relative
|
||||
width 100%
|
||||
height .4rem
|
||||
margin-bottom .2rem
|
||||
label
|
||||
display block
|
||||
clear both
|
||||
.label
|
||||
float left
|
||||
width .7rem
|
||||
font-size .16rem
|
||||
line-height .3rem
|
||||
line-height .4rem
|
||||
color #333
|
||||
.inputStyle, select
|
||||
text-align justify
|
||||
text-align-last justify
|
||||
label::after
|
||||
display inline-block
|
||||
content ''
|
||||
width 100%
|
||||
height 0
|
||||
visibility hidden
|
||||
.inputStyle, .select
|
||||
float right
|
||||
width calc(100% - .9rem)
|
||||
font-size .16rem
|
||||
line-height .4rem
|
||||
height .4rem
|
||||
color #999
|
||||
color #606266
|
||||
text-indent .1rem
|
||||
border 1px solid rgba(0, 0, 0, .2)
|
||||
box-sizing border-box
|
||||
select
|
||||
appearance auto
|
||||
outline none
|
||||
.label1
|
||||
width 1.1rem
|
||||
.inputStyle1
|
||||
width calc(100% - 1.2rem)
|
||||
.select1
|
||||
width calc(100% - 1.2rem)
|
||||
background-color #fff
|
||||
text-indent 0
|
||||
.submit
|
||||
width 100%
|
||||
text-align center
|
||||
height .4rem
|
||||
clear both
|
||||
.btn-wrap
|
||||
float left
|
||||
width 50%
|
||||
height .4rem
|
||||
.btn
|
||||
display block
|
||||
background-color #2778f3
|
||||
font-size .16rem
|
||||
line-height .4rem
|
||||
color #fff
|
||||
width .9rem
|
||||
margin 0 .3rem
|
||||
padding 0 .1rem
|
||||
margin 0 auto
|
||||
border-radius 5px
|
||||
.drift
|
||||
transition left .3s linear
|
||||
.el-select
|
||||
width 100%
|
||||
.el-input__inner
|
||||
height .4rem
|
||||
line-height .4rem
|
||||
border none
|
||||
padding 0 .1rem
|
||||
font-size .16rem
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user