赵培友
3 years ago
parent
305cab1f48
commit
300283b7dc
8 changed files with 208 additions and 259 deletions
Binary file not shown.
@ -0,0 +1,6 @@ |
||||
@font-face { |
||||
font-family: "Impact"; |
||||
src: url('./IMPACT.TTF'); |
||||
font-weight: normal; |
||||
font-style: normal; |
||||
} |
||||
@ -1,155 +1,137 @@ |
||||
<template> |
||||
<div class="login-container" |
||||
ref="login" |
||||
@keyup.enter.native="handleLogin"> |
||||
<div class="login-container" ref="login" @keyup.enter.native="handleLogin"> |
||||
<top-color v-show="false"></top-color> |
||||
<div class="login-weaper animated bounceInDown"> |
||||
<div class="login-left"> |
||||
<div class="login-time"> |
||||
{{time}} |
||||
</div> |
||||
<p class="title">{{ $t('login.info') }}</p> |
||||
<div style="font-size: 15px"> |
||||
<span>----------------------------------------------</span> |
||||
<br> |
||||
<span>管理租户编号：000000</span> |
||||
<br> |
||||
<span>超级管理员账号: admin / admin</span> |
||||
<br> |
||||
<span>人事账号: hr / hr</span> |
||||
<br> |
||||
<span>经理账号: manager / manager</span> |
||||
<br> |
||||
<span>老板账号: boss / boss</span> |
||||
<br> |
||||
<span>----------------------------------------------</span> |
||||
<br> |
||||
<span>普通租户编号：详见租户管理模块</span> |
||||
<br> |
||||
<span>租户管理员账号: admin / admin</span> |
||||
<br> |
||||
<span>----------------------------------------------</span> |
||||
</div> |
||||
<!--<img class="img" src="/img/logo.png" alt="">--> |
||||
</div> |
||||
<!-- 左侧 --> |
||||
<div class="login-border"> |
||||
<div class="login-main"> |
||||
<h4 class="login-title"> |
||||
{{ $t('login.title') }}{{website.title}} |
||||
<top-lang></top-lang> |
||||
</h4> |
||||
<userLogin v-if="activeName==='user'"></userLogin> |
||||
<codeLogin v-else-if="activeName==='code'"></codeLogin> |
||||
<thirdLogin v-else-if="activeName==='third'"></thirdLogin> |
||||
<div class="login-menu"> |
||||
<a href="#" @click.stop="activeName='user'">{{ $t('login.userLogin') }}</a> |
||||
<!--<a href="#" @click.stop="activeName='code'">{{ $t('login.phoneLogin') }}</a>--> |
||||
<a href="#" @click.stop="activeName='third'">{{ $t('login.thirdLogin') }}</a> |
||||
<a :href="website.ssoUrl + website.redirectUri">{{ $t('login.ssoLogin') }}</a> |
||||
<div class="login-logo"></div> |
||||
<div class="login-title">运维管理系统，欢迎您！</div> |
||||
<div class="login-subTitle"> |
||||
WELCOME TO THE OPERATION AND MAINTENANCE<br /> |
||||
MANAGEMENT SYSTEM |
||||
</div> |
||||
<userLogin></userLogin> |
||||
</div> |
||||
|
||||
</div> |
||||
<!-- 右侧 --> |
||||
<div class="login-right"></div> |
||||
</div> |
||||
</div> |
||||
</template> |
||||
<script> |
||||
import userLogin from "./userlogin"; |
||||
import codeLogin from "./codelogin"; |
||||
import thirdLogin from "./thirdlogin"; |
||||
import {mapGetters} from "vuex"; |
||||
import {dateFormat} from "@/util/date"; |
||||
import {validatenull} from "@/util/validate"; |
||||
import topLang from "@/page/index/top/top-lang"; |
||||
import topColor from "@/page/index/top/top-color"; |
||||
import {getQueryString, getTopUrl} from "@/util/util"; |
||||
import userLogin from "./userlogin"; |
||||
import codeLogin from "./codelogin"; |
||||
import thirdLogin from "./thirdlogin"; |
||||
import { mapGetters } from "vuex"; |
||||
import { dateFormat } from "@/util/date"; |
||||
import { validatenull } from "@/util/validate"; |
||||
import topLang from "@/page/index/top/top-lang"; |
||||
import topColor from "@/page/index/top/top-color"; |
||||
import { getQueryString, getTopUrl } from "@/util/util"; |
||||
|
||||
export default { |
||||
name: "login", |
||||
components: { |
||||
userLogin, |
||||
codeLogin, |
||||
thirdLogin, |
||||
topLang, |
||||
topColor |
||||
}, |
||||
data() { |
||||
return { |
||||
time: "", |
||||
activeName: "user", |
||||
socialForm: { |
||||
tenantId: "000000", |
||||
source: "", |
||||
code: "", |
||||
state: "", |
||||
} |
||||
}; |
||||
}, |
||||
watch: { |
||||
$route() { |
||||
this.handleLogin(); |
||||
} |
||||
}, |
||||
created() { |
||||
export default { |
||||
name: "login", |
||||
components: { |
||||
userLogin, |
||||
codeLogin, |
||||
thirdLogin, |
||||
topLang, |
||||
topColor, |
||||
}, |
||||
data() { |
||||
return { |
||||
time: "", |
||||
socialForm: { |
||||
tenantId: "000000", |
||||
source: "", |
||||
code: "", |
||||
state: "", |
||||
}, |
||||
}; |
||||
}, |
||||
watch: { |
||||
$route() { |
||||
this.handleLogin(); |
||||
this.getTime(); |
||||
}, |
||||
mounted() { |
||||
}, |
||||
computed: { |
||||
...mapGetters(["website", "tagWel"]) |
||||
}, |
||||
created() { |
||||
this.handleLogin(); |
||||
this.getTime(); |
||||
}, |
||||
mounted() {}, |
||||
computed: { |
||||
...mapGetters(["website", "tagWel"]), |
||||
}, |
||||
props: [], |
||||
methods: { |
||||
getTime() { |
||||
setInterval(() => { |
||||
this.time = dateFormat(new Date()); |
||||
}, 1000); |
||||
}, |
||||
props: [], |
||||
methods: { |
||||
getTime() { |
||||
setInterval(() => { |
||||
this.time = dateFormat(new Date()); |
||||
}, 1000); |
||||
}, |
||||
handleLogin() { |
||||
const topUrl = getTopUrl(); |
||||
const redirectUrl = "/oauth/redirect/"; |
||||
const ssoCode = "?code="; |
||||
this.socialForm.source = getQueryString("source"); |
||||
this.socialForm.code = getQueryString("code"); |
||||
this.socialForm.state = getQueryString("state"); |
||||
if (validatenull(this.socialForm.source) && topUrl.includes(redirectUrl)) { |
||||
let source = topUrl.split("?")[0]; |
||||
source = source.split(redirectUrl)[1]; |
||||
this.socialForm.source = source; |
||||
} |
||||
if (topUrl.includes(redirectUrl) && !validatenull(this.socialForm.source) && !validatenull(this.socialForm.code) && !validatenull(this.socialForm.state)) { |
||||
const loading = this.$loading({ |
||||
lock: true, |
||||
text: '第三方系统登录中,请稍后。。。', |
||||
spinner: "el-icon-loading" |
||||
}); |
||||
this.$store.dispatch("LoginBySocial", this.socialForm).then(() => { |
||||
handleLogin() { |
||||
const topUrl = getTopUrl(); |
||||
const redirectUrl = "/oauth/redirect/"; |
||||
const ssoCode = "?code="; |
||||
this.socialForm.source = getQueryString("source"); |
||||
this.socialForm.code = getQueryString("code"); |
||||
this.socialForm.state = getQueryString("state"); |
||||
if ( |
||||
validatenull(this.socialForm.source) && |
||||
topUrl.includes(redirectUrl) |
||||
) { |
||||
let source = topUrl.split("?")[0]; |
||||
source = source.split(redirectUrl)[1]; |
||||
this.socialForm.source = source; |
||||
} |
||||
if ( |
||||
topUrl.includes(redirectUrl) && |
||||
!validatenull(this.socialForm.source) && |
||||
!validatenull(this.socialForm.code) && |
||||
!validatenull(this.socialForm.state) |
||||
) { |
||||
const loading = this.$loading({ |
||||
lock: true, |
||||
text: "第三方系统登录中,请稍后。。。", |
||||
spinner: "el-icon-loading", |
||||
}); |
||||
this.$store |
||||
.dispatch("LoginBySocial", this.socialForm) |
||||
.then(() => { |
||||
window.location.href = topUrl.split(redirectUrl)[0]; |
||||
this.$router.push({path: this.tagWel.value}); |
||||
this.$router.push({ path: this.tagWel.value }); |
||||
loading.close(); |
||||
}).catch(() => { |
||||
}) |
||||
.catch(() => { |
||||
loading.close(); |
||||
}); |
||||
} else if (!topUrl.includes(redirectUrl) && !validatenull(this.socialForm.code) && !validatenull(this.socialForm.state)) { |
||||
const loading = this.$loading({ |
||||
lock: true, |
||||
text: '单点系统登录中,请稍后。。。', |
||||
spinner: "el-icon-loading" |
||||
}); |
||||
this.$store.dispatch("LoginBySso", this.socialForm).then(() => { |
||||
} else if ( |
||||
!topUrl.includes(redirectUrl) && |
||||
!validatenull(this.socialForm.code) && |
||||
!validatenull(this.socialForm.state) |
||||
) { |
||||
const loading = this.$loading({ |
||||
lock: true, |
||||
text: "单点系统登录中,请稍后。。。", |
||||
spinner: "el-icon-loading", |
||||
}); |
||||
this.$store |
||||
.dispatch("LoginBySso", this.socialForm) |
||||
.then(() => { |
||||
window.location.href = topUrl.split(ssoCode)[0]; |
||||
this.$router.push({path: this.tagWel.value}); |
||||
this.$router.push({ path: this.tagWel.value }); |
||||
loading.close(); |
||||
}).catch(() => { |
||||
}) |
||||
.catch(() => { |
||||
loading.close(); |
||||
}); |
||||
} |
||||
} |
||||
} |
||||
}; |
||||
}, |
||||
}, |
||||
}; |
||||
</script> |
||||
|
||||
<style lang="scss"> |
||||
@import "@/styles/login.scss"; |
||||
<style lang="scss" scoped> |
||||
@import "@/styles/login.scss"; |
||||
</style> |
||||
|
||||
@ -0,0 +1,16 @@ |
||||
// input输入框 |
||||
.el-input--small .el-input__inner { |
||||
width: 420px; |
||||
height: 50px; |
||||
line-height: 50px; |
||||
border-radius: 3px 3px 3px 3px; |
||||
color: #333; |
||||
position: relative; |
||||
border: 1px solid #CFCFCF |
||||
} |
||||
// input输入框label |
||||
.el-form--label-top .el-form-item__label { |
||||
font-size: 16px; |
||||
color: #273240; |
||||
padding: 0!important; |
||||
} |
||||
Loading…
Reference in new issue