增加手机登录界面，方便不在钉钉群里人员使用资产管理系统
This commit is contained in:
wulin
parent
7f38fec897
commit
8961f8894c
@ -13,8 +13,8 @@ module.exports = {
|
||||
assetsPublicPath: '/',
|
||||
proxyTable: {
|
||||
'/lz_management': {
|
||||
// target: 'https://tlzmanagement.ldxinyong.com',
|
||||
target: 'http://localhost:8080/',
|
||||
target: 'https://tlzmanagement.ldxinyong.com',
|
||||
// target: 'http://127.0.0.1:8088/',
|
||||
changeOrigin: true
|
||||
}
|
||||
},
|
||||
|
||||
@ -22,10 +22,11 @@ const globalRoutes = [
|
||||
{ path: '/lzluck', component: _import('common/lzluck'), name: 'lzluck', meta: { title: '霖梓抽奖' } },
|
||||
{ path: '/dingtalkluck', component: _import('common/dingtalkluck'), name: 'dingtalkluck', meta: { title: '钉钉抽奖登记' } },
|
||||
{ path: '/404', component: _import('common/404'), name: '404', meta: { title: '404未找到' } },
|
||||
{ path: '/login', component: _import('common/login'), name: 'login', meta: { title: '登录' } }
|
||||
{ path: '/login', component: _import('common/login'), name: 'login', meta: { title: '登录' } },
|
||||
{ path: '/phoneweblogin', component: _import('common/phoneweblogin'), name: 'login', meta: { title: '登录' } }
|
||||
]
|
||||
|
||||
const dingtalkRoutes=[
|
||||
const dingtalkRoutes = [
|
||||
{ path: '/devicemain', component: _import('modules/device/device-main'), name: 'devicemain', meta: { title: '资产盘点主入口' } },
|
||||
{ path: '/devicetype', component: _import('modules/device/device-type'), name: 'devicetype', meta: { title: '设备类型' } },
|
||||
{ path: '/deviceqr', component: _import('modules/device/device-qr'), name: 'deviceqr', meta: { title: '设备自带编码' } },
|
||||
|
||||
168
src/views/common/phoneweblogin.vue
Normal file
168
src/views/common/phoneweblogin.vue
Normal file
@ -0,0 +1,168 @@
|
||||
<template>
|
||||
<div class="phone-login-main">
|
||||
<h3 class="phone-login-title">用户登录</h3>
|
||||
<el-form
|
||||
:model="dataForm"
|
||||
:rules="dataRule"
|
||||
ref="dataForm"
|
||||
@keyup.enter.native="handleLogin()"
|
||||
status-icon
|
||||
>
|
||||
<el-form-item prop="userName">
|
||||
<el-input clearable v-model="dataForm.userName" placeholder="帐号"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item prop="password">
|
||||
<el-input clearable v-model="dataForm.password" type="password" placeholder="密码"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item prop="captcha">
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="14">
|
||||
<el-input v-model="dataForm.verify" placeholder="验证码">
|
||||
</el-input>
|
||||
</el-col>
|
||||
<el-col :span="10" class="login-captcha">
|
||||
<el-button v-if="!hasSendCode" type="primary" @click="handleVerify">获取验证码</el-button>
|
||||
<el-button v-else type="primary">重新发送({{time}}S)</el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button
|
||||
class="phone-login-btn-submit"
|
||||
type="primary"
|
||||
:loading="isloading"
|
||||
@click="handleLogin"
|
||||
>登录</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getUUID } from '@/utils'
|
||||
import { apiLogin, apiSsysSendSMS } from '@/api/api_sys'
|
||||
import { apiDingtalkLogin } from '@/api/api_staff'
|
||||
import * as dd from 'dingtalk-jsapi'
|
||||
var dingCode = ''
|
||||
export default {
|
||||
data () {
|
||||
return {
|
||||
isloading: false,
|
||||
dataForm: {
|
||||
userName: '',
|
||||
password: '',
|
||||
uuid: '',
|
||||
// captcha: ''
|
||||
verify: ''
|
||||
},
|
||||
dataRule: {
|
||||
userName: [{ required: true, message: '帐号不能为空', trigger: 'blur' }],
|
||||
password: [{ required: true, message: '密码不能为空', trigger: 'blur' }],
|
||||
// captcha: [{ required: true, message: '验证码不能为空', trigger: 'blur' }]
|
||||
verify: [{ required: true, message: '验证码不能为空', trigger: 'blur' }]
|
||||
},
|
||||
// captchaPath: '' // 图像验证码请求地址
|
||||
time: 0,
|
||||
timer: true,
|
||||
hasSendCode: false
|
||||
}
|
||||
},
|
||||
created () {
|
||||
// this.handleGetImgCaptcha()
|
||||
},
|
||||
mounted () {
|
||||
},
|
||||
methods: {
|
||||
// // 获取图像验证码
|
||||
// handleGetImgCaptcha () {
|
||||
// this.dataForm.uuid = getUUID()
|
||||
// this.captchaPath = `/lz_management/captcha.jpg?uuid=${this.dataForm.uuid}`
|
||||
// },
|
||||
// 登录提交表单
|
||||
handleLogin () {
|
||||
let param = Object.assign(this.dataForm, {'userName': this.dataForm.userName}, {'uuid': this.dataForm.uuid}, {'verifyCode': this.dataForm.verify})
|
||||
this.$refs.dataForm.validate((valid) => {
|
||||
if (valid) {
|
||||
this.isloading = true
|
||||
apiLogin(param).then(res => {
|
||||
this.isloading = false
|
||||
if (res && res.code === 200) {
|
||||
console.log('获取token')
|
||||
this.$cookie.set('token', res.token)
|
||||
console.log('保存token')
|
||||
this.$router.replace({ name: this.$route.query.do })
|
||||
console.log('跳转')
|
||||
} else {
|
||||
this.$message.error(res.msg)
|
||||
}
|
||||
})
|
||||
} else {
|
||||
return false
|
||||
}
|
||||
})
|
||||
},
|
||||
// 获取验证码
|
||||
handleVerify () {
|
||||
this.dataForm.uuid = getUUID()
|
||||
if (!this.dataForm.userName) {
|
||||
this.$message('请输入账号')
|
||||
return false
|
||||
}
|
||||
// if (!this.dataForm.captcha) {
|
||||
// this.$message('请输入图形验证码')
|
||||
// return false
|
||||
// }
|
||||
let parmse = {
|
||||
userName: this.dataForm.userName,
|
||||
// captcha: this.dataForm.captcha,
|
||||
password: this.dataForm.password,
|
||||
uuid: this.dataForm.uuid
|
||||
}
|
||||
apiSsysSendSMS(parmse).then(res => {
|
||||
if (res.code == 200) {
|
||||
this.time = 60
|
||||
this.hasSendCode = true
|
||||
this.timer = setInterval(() => {
|
||||
if (this.time === 0) {
|
||||
this.hasSendCode = false
|
||||
}
|
||||
this.time--
|
||||
}, 1000)
|
||||
this.$message.success(res.msg)
|
||||
} else {
|
||||
// this.getCaptcha()
|
||||
this.$message.error(res.msg)
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.phone-site-wrapper.phone-site-page--login {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
background-color: rgba(38, 50, 56, 0.6);
|
||||
overflow: hidden;
|
||||
.phone-login-main {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
padding: 150px 60px 180px;
|
||||
width: 470px;
|
||||
min-height: 100%;
|
||||
background-color: #fff;
|
||||
}
|
||||
.phone-login-title {
|
||||
font-size: 16px;
|
||||
}
|
||||
.phone-login-btn-submit {
|
||||
width: 100px;
|
||||
margin-top: 38px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Loading…
x
Reference in New Issue
Block a user