<template>
|
<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-border">
|
<div class="login-main">
|
<h4 class="login-title">
|
{{ $t('login.title') }}{{website.title}}
|
<top-lang type="login"></top-lang>
|
</h4>
|
<userLogin v-if="activeName==='user'"></userLogin>
|
<thirdLogin v-else-if="activeName==='third'"></thirdLogin>
|
<!-- <div style="color: white;text-align: center;margin-top: 20px;font-size: 12px">-->
|
<!-- <span>技术支持:北京宏博远达科技有限公司</span>-->
|
<!-- </div>-->
|
</div>
|
|
</div>
|
</div>
|
<!-- <div class="login-bg-image" style="color: white;text-align: center">-->
|
<!-- <div style="font-size: 80px; font-weight: bold" >欢迎登录</div>-->
|
<!-- <h1 style="font-size: 40px">PLT-WEB平台</h1>-->
|
<!-- </div>-->
|
</div>
|
</template>
|
<script>
|
import userLogin from "./userlogin";
|
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 "@/styles/login.scss";
|
export default {
|
name: "login",
|
components: {
|
userLogin,
|
|
thirdLogin,
|
topLang,
|
topColor
|
},
|
data() {
|
return {
|
time: "",
|
activeName: "user",
|
socialForm: {
|
tenantId: "000000",
|
source: "",
|
|
state: "",
|
}
|
};
|
},
|
watch: {
|
$route() {
|
this.handleLogin();
|
}
|
},
|
created() {
|
this.handleLogin();
|
this.getTime();
|
|
},
|
mounted() {
|
},
|
computed: {
|
...mapGetters(["website", "tagWel"])
|
},
|
props: [],
|
methods: {
|
getTime() {
|
setInterval(() => {
|
this.time = dateFormat(new Date());
|
}, 1000);
|
},
|
handleLogin() {
|
const topUrl = getTopUrl();
|
const redirectUrl = "/oauth/redirect/";
|
this.socialForm.source = getQueryString("source");
|
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.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});
|
loading.close();
|
}).catch(() => {
|
loading.close();
|
});
|
} else if (!topUrl.includes(redirectUrl) && !validatenull(this.socialForm.state)) {
|
const loading = this.$loading({
|
lock: true,
|
text: '单点系统登录中,请稍后。。。',
|
spinner: "el-icon-loading"
|
});
|
this.$store.dispatch("LoginBySso", this.socialForm).then(() => {
|
|
this.$router.push({path: this.tagWel.value});
|
loading.close();
|
}).catch(() => {
|
loading.close();
|
});
|
}
|
}
|
}
|
};
|
</script>
|
|
<style lang="scss" scoped>
|
.login-container {
|
background: url('../../../public/img/login-backgrounds.png') no-repeat center;
|
background-size: 100% 100%;
|
background-color: #638DFF;
|
}
|
.login-bg-image{
|
position: fixed;
|
left: 10%;
|
top: 30%;
|
|
}
|
</style>
|