|
|
|
@ -1,9 +1,18 @@
@@ -1,9 +1,18 @@
|
|
|
|
|
<template> |
|
|
|
|
<div class="main"> |
|
|
|
|
<a-form-model class="user-layout-login" @keyup.enter.native="handleSubmit"> |
|
|
|
|
<a-tabs :activeKey="customActiveKey" :tabBarStyle="{ textAlign: 'center', borderBottom: 'unset' }" @change="handleTabClick"> |
|
|
|
|
<a-tabs |
|
|
|
|
:activeKey="customActiveKey" |
|
|
|
|
:tabBarStyle="{ textAlign: 'center', borderBottom: 'unset' }" |
|
|
|
|
@change="handleTabClick" |
|
|
|
|
> |
|
|
|
|
<a-tab-pane key="tab1" tab="账号密码登录"> |
|
|
|
|
<login-account ref="alogin" @validateFail="validateFail" @success="requestSuccess" @fail="requestFailed"></login-account> |
|
|
|
|
<login-account |
|
|
|
|
ref="alogin" |
|
|
|
|
@validateFail="validateFail" |
|
|
|
|
@success="requestSuccess" |
|
|
|
|
@fail="requestFailed" |
|
|
|
|
></login-account> |
|
|
|
|
</a-tab-pane> |
|
|
|
|
|
|
|
|
|
<!-- <a-tab-pane key="tab2" tab="手机号登录"> |
|
|
|
@ -12,7 +21,7 @@
@@ -12,7 +21,7 @@
|
|
|
|
|
</a-tabs> |
|
|
|
|
|
|
|
|
|
<a-form-model-item> |
|
|
|
|
<a-checkbox @change="handleRememberMeChange" default-checked>自动登录</a-checkbox> |
|
|
|
|
<!-- <a-checkbox @change="handleRememberMeChange" default-checked>自动登录</a-checkbox> --> |
|
|
|
|
<!-- <router-link :to="{ name: 'alteration'}" class="forge-password" style="float: right;"> |
|
|
|
|
忘记密码 |
|
|
|
|
</router-link> |
|
|
|
@ -22,13 +31,25 @@
@@ -22,13 +31,25 @@
|
|
|
|
|
</a-form-model-item> |
|
|
|
|
|
|
|
|
|
<a-form-item style="margin-top:24px"> |
|
|
|
|
<a-button size="large" type="primary" htmlType="submit" class="login-button" :loading="loginBtn" @click.stop.prevent="handleSubmit" :disabled="loginBtn">确定 |
|
|
|
|
<a-button |
|
|
|
|
size="large" |
|
|
|
|
type="primary" |
|
|
|
|
htmlType="submit" |
|
|
|
|
class="login-button" |
|
|
|
|
:loading="loginBtn" |
|
|
|
|
@click.stop.prevent="handleSubmit" |
|
|
|
|
:disabled="loginBtn" |
|
|
|
|
>确定 |
|
|
|
|
</a-button> |
|
|
|
|
</a-form-item> |
|
|
|
|
|
|
|
|
|
</a-form-model> |
|
|
|
|
|
|
|
|
|
<two-step-captcha v-if="requiredTwoStepCaptcha" :visible="stepCaptchaVisible" @success="stepCaptchaSuccess" @cancel="stepCaptchaCancel"></two-step-captcha> |
|
|
|
|
<two-step-captcha |
|
|
|
|
v-if="requiredTwoStepCaptcha" |
|
|
|
|
:visible="stepCaptchaVisible" |
|
|
|
|
@success="stepCaptchaSuccess" |
|
|
|
|
@cancel="stepCaptchaCancel" |
|
|
|
|
></two-step-captcha> |
|
|
|
|
<login-select-tenant ref="loginSelect" @success="loginSelectOk"></login-select-tenant> |
|
|
|
|
<!-- <third-login ref="thirdLogin"></third-login> --> |
|
|
|
|
</div> |
|
|
|
@ -36,12 +57,13 @@
@@ -36,12 +57,13 @@
|
|
|
|
|
|
|
|
|
|
<script> |
|
|
|
|
import Vue from 'vue' |
|
|
|
|
import { ACCESS_TOKEN, ENCRYPTED_STRING } from '@/store/mutation-types' |
|
|
|
|
import { ACCESS_TOKEN, ENCRYPTED_STRING, ENCRYPT_KEY, ENCRYPT_IV } from '@/store/mutation-types' |
|
|
|
|
// import ThirdLogin from './third/ThirdLogin' |
|
|
|
|
import LoginSelectTenant from './LoginSelectTenant' |
|
|
|
|
import TwoStepCaptcha from '@/components/tools/TwoStepCaptcha' |
|
|
|
|
import { getEncryptedString } from '@/utils/encryption/aesEncrypt' |
|
|
|
|
import { timeFix } from '@/utils/util' |
|
|
|
|
import { getAction } from '@/api/manage' |
|
|
|
|
|
|
|
|
|
import LoginAccount from './LoginAccount' |
|
|
|
|
import LoginPhone from './LoginPhone' |
|
|
|
@ -62,17 +84,25 @@ export default {
@@ -62,17 +84,25 @@ export default {
|
|
|
|
|
requiredTwoStepCaptcha: false, |
|
|
|
|
stepCaptchaVisible: false, |
|
|
|
|
encryptedString: { |
|
|
|
|
key:"", |
|
|
|
|
iv:"", |
|
|
|
|
}, |
|
|
|
|
key: '', |
|
|
|
|
iv: '' |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
created() { |
|
|
|
|
Vue.ls.remove(ACCESS_TOKEN) |
|
|
|
|
this.getRouterData(); |
|
|
|
|
this.getRouterData() |
|
|
|
|
this.rememberMe = true |
|
|
|
|
this.initEncryptKv() |
|
|
|
|
}, |
|
|
|
|
methods: { |
|
|
|
|
initEncryptKv() { |
|
|
|
|
let that = this |
|
|
|
|
getAction('/sys/getEncryptedString', {}).then(res => { |
|
|
|
|
that.$store.commit(ENCRYPT_KEY, res.result.key) |
|
|
|
|
that.$store.commit(ENCRYPT_IV, res.result.iv) |
|
|
|
|
}) |
|
|
|
|
}, |
|
|
|
|
handleTabClick(key) { |
|
|
|
|
this.customActiveKey = key |
|
|
|
|
}, |
|
|
|
@ -91,7 +121,7 @@ export default {
@@ -91,7 +121,7 @@ export default {
|
|
|
|
|
|
|
|
|
|
//登录 |
|
|
|
|
handleSubmit() { |
|
|
|
|
this.loginBtn = true; |
|
|
|
|
this.loginBtn = true |
|
|
|
|
if (this.customActiveKey === 'tab1') { |
|
|
|
|
// 使用账户密码登录 |
|
|
|
|
this.$refs.alogin.handleLogin(this.rememberMe) |
|
|
|
@ -102,7 +132,7 @@ export default {
@@ -102,7 +132,7 @@ export default {
|
|
|
|
|
}, |
|
|
|
|
// 校验失败 |
|
|
|
|
validateFail() { |
|
|
|
|
this.loginBtn = false; |
|
|
|
|
this.loginBtn = false |
|
|
|
|
}, |
|
|
|
|
// 登录后台成功 |
|
|
|
|
requestSuccess(loginResult) { |
|
|
|
@ -110,30 +140,30 @@ export default {
@@ -110,30 +140,30 @@ export default {
|
|
|
|
|
}, |
|
|
|
|
//登录后台失败 |
|
|
|
|
requestFailed(err) { |
|
|
|
|
let description = ((err.response || {}).data || {}).message || err.message || "请求出现错误,请稍后再试" |
|
|
|
|
let description = ((err.response || {}).data || {}).message || err.message || '请求出现错误,请稍后再试' |
|
|
|
|
this.$notification['error']({ |
|
|
|
|
message: '登录失败', |
|
|
|
|
description: description, |
|
|
|
|
duration: 4, |
|
|
|
|
}); |
|
|
|
|
duration: 4 |
|
|
|
|
}) |
|
|
|
|
//账户密码登录错误后更新验证码 |
|
|
|
|
if (this.customActiveKey === 'tab1' && description.indexOf('密码错误') > 0) { |
|
|
|
|
this.$refs.alogin.handleChangeCheckCode() |
|
|
|
|
} |
|
|
|
|
this.loginBtn = false; |
|
|
|
|
this.loginBtn = false |
|
|
|
|
}, |
|
|
|
|
loginSelectOk() { |
|
|
|
|
this.loginSuccess() |
|
|
|
|
}, |
|
|
|
|
//登录成功 |
|
|
|
|
loginSuccess() { |
|
|
|
|
this.$router.push({ path: "/dashboard/analysis" }).catch(()=>{ |
|
|
|
|
this.$router.push({ path: '/dashboard/analysis' }).catch(() => { |
|
|
|
|
console.log('登录跳转首页出错,这个错误从哪里来的') |
|
|
|
|
}) |
|
|
|
|
this.$notification.success({ |
|
|
|
|
message: '欢迎', |
|
|
|
|
description: `${timeFix()},欢迎回来`, |
|
|
|
|
}); |
|
|
|
|
description: `${timeFix()},欢迎回来` |
|
|
|
|
}) |
|
|
|
|
}, |
|
|
|
|
|
|
|
|
|
stepCaptchaSuccess() { |
|
|
|
@ -147,18 +177,16 @@ export default {
@@ -147,18 +177,16 @@ export default {
|
|
|
|
|
}, |
|
|
|
|
//获取密码加密规则 |
|
|
|
|
getEncrypte() { |
|
|
|
|
var encryptedString = Vue.ls.get(ENCRYPTED_STRING); |
|
|
|
|
var encryptedString = Vue.ls.get(ENCRYPTED_STRING) |
|
|
|
|
if (encryptedString == null) { |
|
|
|
|
getEncryptedString().then((data) => { |
|
|
|
|
getEncryptedString().then(data => { |
|
|
|
|
this.encryptedString = data |
|
|
|
|
}); |
|
|
|
|
}) |
|
|
|
|
} else { |
|
|
|
|
this.encryptedString = encryptedString; |
|
|
|
|
this.encryptedString = encryptedString |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
} |
|
|
|
|
</script> |
|
|
|
|
<style lang="less" scoped> |
|
|
|
@ -190,11 +218,11 @@ export default {
@@ -190,11 +218,11 @@ export default {
|
|
|
|
|
|
|
|
|
|
.item-icon { |
|
|
|
|
font-size: 24px; |
|
|
|
|
color: rgba(0,0,0,.2); |
|
|
|
|
color: rgba(0, 0, 0, 0.2); |
|
|
|
|
margin-left: 16px; |
|
|
|
|
vertical-align: middle; |
|
|
|
|
cursor: pointer; |
|
|
|
|
transition: color .3s; |
|
|
|
|
transition: color 0.3s; |
|
|
|
|
|
|
|
|
|
&:hover { |
|
|
|
|
color: #1890ff; |
|
|
|
|