赵培友
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> |
<template> |
||||||
<div class="login-container" |
<div class="login-container" ref="login" @keyup.enter.native="handleLogin"> |
||||||
ref="login" |
|
||||||
@keyup.enter.native="handleLogin"> |
|
||||||
<top-color v-show="false"></top-color> |
<top-color v-show="false"></top-color> |
||||||
<div class="login-weaper animated bounceInDown"> |
<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-border"> |
||||||
<div class="login-main"> |
<div class="login-main"> |
||||||
<h4 class="login-title"> |
<div class="login-logo"></div> |
||||||
{{ $t('login.title') }}{{website.title}} |
<div class="login-title">运维管理系统，欢迎您！</div> |
||||||
<top-lang></top-lang> |
<div class="login-subTitle"> |
||||||
</h4> |
WELCOME TO THE OPERATION AND MAINTENANCE<br /> |
||||||
<userLogin v-if="activeName==='user'"></userLogin> |
MANAGEMENT SYSTEM |
||||||
<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> |
</div> |
||||||
|
<userLogin></userLogin> |
||||||
</div> |
</div> |
||||||
|
|
||||||
</div> |
</div> |
||||||
|
<!-- 右侧 --> |
||||||
|
<div class="login-right"></div> |
||||||
</div> |
</div> |
||||||
</div> |
</div> |
||||||
</template> |
</template> |
||||||
<script> |
<script> |
||||||
import userLogin from "./userlogin"; |
import userLogin from "./userlogin"; |
||||||
import codeLogin from "./codelogin"; |
import codeLogin from "./codelogin"; |
||||||
import thirdLogin from "./thirdlogin"; |
import thirdLogin from "./thirdlogin"; |
||||||
import {mapGetters} from "vuex"; |
import { mapGetters } from "vuex"; |
||||||
import {dateFormat} from "@/util/date"; |
import { dateFormat } from "@/util/date"; |
||||||
import {validatenull} from "@/util/validate"; |
import { validatenull } from "@/util/validate"; |
||||||
import topLang from "@/page/index/top/top-lang"; |
import topLang from "@/page/index/top/top-lang"; |
||||||
import topColor from "@/page/index/top/top-color"; |
import topColor from "@/page/index/top/top-color"; |
||||||
import {getQueryString, getTopUrl} from "@/util/util"; |
import { getQueryString, getTopUrl } from "@/util/util"; |
||||||
|
|
||||||
export default { |
export default { |
||||||
name: "login", |
name: "login", |
||||||
components: { |
components: { |
||||||
userLogin, |
userLogin, |
||||||
codeLogin, |
codeLogin, |
||||||
thirdLogin, |
thirdLogin, |
||||||
topLang, |
topLang, |
||||||
topColor |
topColor, |
||||||
}, |
}, |
||||||
data() { |
data() { |
||||||
return { |
return { |
||||||
time: "", |
time: "", |
||||||
activeName: "user", |
socialForm: { |
||||||
socialForm: { |
tenantId: "000000", |
||||||
tenantId: "000000", |
source: "", |
||||||
source: "", |
code: "", |
||||||
code: "", |
state: "", |
||||||
state: "", |
}, |
||||||
} |
}; |
||||||
}; |
}, |
||||||
}, |
watch: { |
||||||
watch: { |
$route() { |
||||||
$route() { |
|
||||||
this.handleLogin(); |
|
||||||
} |
|
||||||
}, |
|
||||||
created() { |
|
||||||
this.handleLogin(); |
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: [], |
handleLogin() { |
||||||
methods: { |
const topUrl = getTopUrl(); |
||||||
getTime() { |
const redirectUrl = "/oauth/redirect/"; |
||||||
setInterval(() => { |
const ssoCode = "?code="; |
||||||
this.time = dateFormat(new Date()); |
this.socialForm.source = getQueryString("source"); |
||||||
}, 1000); |
this.socialForm.code = getQueryString("code"); |
||||||
}, |
this.socialForm.state = getQueryString("state"); |
||||||
handleLogin() { |
if ( |
||||||
const topUrl = getTopUrl(); |
validatenull(this.socialForm.source) && |
||||||
const redirectUrl = "/oauth/redirect/"; |
topUrl.includes(redirectUrl) |
||||||
const ssoCode = "?code="; |
) { |
||||||
this.socialForm.source = getQueryString("source"); |
let source = topUrl.split("?")[0]; |
||||||
this.socialForm.code = getQueryString("code"); |
source = source.split(redirectUrl)[1]; |
||||||
this.socialForm.state = getQueryString("state"); |
this.socialForm.source = source; |
||||||
if (validatenull(this.socialForm.source) && topUrl.includes(redirectUrl)) { |
} |
||||||
let source = topUrl.split("?")[0]; |
if ( |
||||||
source = source.split(redirectUrl)[1]; |
topUrl.includes(redirectUrl) && |
||||||
this.socialForm.source = source; |
!validatenull(this.socialForm.source) && |
||||||
} |
!validatenull(this.socialForm.code) && |
||||||
if (topUrl.includes(redirectUrl) && !validatenull(this.socialForm.source) && !validatenull(this.socialForm.code) && !validatenull(this.socialForm.state)) { |
!validatenull(this.socialForm.state) |
||||||
const loading = this.$loading({ |
) { |
||||||
lock: true, |
const loading = this.$loading({ |
||||||
text: '第三方系统登录中,请稍后。。。', |
lock: true, |
||||||
spinner: "el-icon-loading" |
text: "第三方系统登录中,请稍后。。。", |
||||||
}); |
spinner: "el-icon-loading", |
||||||
this.$store.dispatch("LoginBySocial", this.socialForm).then(() => { |
}); |
||||||
|
this.$store |
||||||
|
.dispatch("LoginBySocial", this.socialForm) |
||||||
|
.then(() => { |
||||||
window.location.href = topUrl.split(redirectUrl)[0]; |
window.location.href = topUrl.split(redirectUrl)[0]; |
||||||
this.$router.push({path: this.tagWel.value}); |
this.$router.push({ path: this.tagWel.value }); |
||||||
loading.close(); |
loading.close(); |
||||||
}).catch(() => { |
}) |
||||||
|
.catch(() => { |
||||||
loading.close(); |
loading.close(); |
||||||
}); |
}); |
||||||
} else if (!topUrl.includes(redirectUrl) && !validatenull(this.socialForm.code) && !validatenull(this.socialForm.state)) { |
} else if ( |
||||||
const loading = this.$loading({ |
!topUrl.includes(redirectUrl) && |
||||||
lock: true, |
!validatenull(this.socialForm.code) && |
||||||
text: '单点系统登录中,请稍后。。。', |
!validatenull(this.socialForm.state) |
||||||
spinner: "el-icon-loading" |
) { |
||||||
}); |
const loading = this.$loading({ |
||||||
this.$store.dispatch("LoginBySso", this.socialForm).then(() => { |
lock: true, |
||||||
|
text: "单点系统登录中,请稍后。。。", |
||||||
|
spinner: "el-icon-loading", |
||||||
|
}); |
||||||
|
this.$store |
||||||
|
.dispatch("LoginBySso", this.socialForm) |
||||||
|
.then(() => { |
||||||
window.location.href = topUrl.split(ssoCode)[0]; |
window.location.href = topUrl.split(ssoCode)[0]; |
||||||
this.$router.push({path: this.tagWel.value}); |
this.$router.push({ path: this.tagWel.value }); |
||||||
loading.close(); |
loading.close(); |
||||||
}).catch(() => { |
}) |
||||||
|
.catch(() => { |
||||||
loading.close(); |
loading.close(); |
||||||
}); |
}); |
||||||
} |
|
||||||
} |
} |
||||||
} |
}, |
||||||
}; |
}, |
||||||
|
}; |
||||||
</script> |
</script> |
||||||
|
|
||||||
<style lang="scss"> |
<style lang="scss" scoped> |
||||||
@import "@/styles/login.scss"; |
@import "@/styles/login.scss"; |
||||||
</style> |
</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