<template>
|
<div :class="{ loginContainer: true, 'narrowScreen': narrowScreen }" @keyup.enter="handleLogin">
|
<div class="login-container">
|
<userLogin v-if="activeName === 'user'"></userLogin>
|
</div>
|
</div>
|
</template>
|
<script>
|
import userLogin from './userlogin.vue'
|
import { mapGetters } from 'vuex'
|
import { validatenull } from '@/utils/validate'
|
import { getQueryString, getTopUrl } from '@/utils/util'
|
import website from '@/config/website'
|
|
import getBaseConfig from '@/buildConfig/config'
|
|
const { loginTitle, isShowAiSkyLogo } = getBaseConfig()
|
|
export default {
|
name: 'login',
|
components: {
|
userLogin,
|
},
|
data() {
|
return {
|
narrowScreen: false,
|
login: {
|
info: loginTitle,
|
},
|
website: website,
|
time: '',
|
activeName: 'user',
|
socialForm: {
|
tenantId: '000000',
|
source: '',
|
code: '',
|
state: '',
|
},
|
}
|
},
|
watch: {
|
$route() {
|
this.handleLogin()
|
},
|
},
|
created() {
|
this.handleLogin()
|
this.getTime()
|
},
|
mounted() {
|
this.narrowScreenFun()
|
window.addEventListener('resize', this.narrowScreenFun)
|
this.$store.commit('setSingleDockRefreshSn',null)
|
},
|
computed: {
|
...mapGetters(['tagWel']),
|
},
|
props: [],
|
methods: {
|
narrowScreenFun() {
|
// 监听窗口变化,计算是不是 窄屏幕
|
this.narrowScreen = window.innerWidth / window.innerHeight < 16 / 9
|
},
|
getTime() {
|
setInterval(() => {
|
this.time = this.$dayjs().format('YYYY年MM月DD日 HH:mm:ss')
|
}, 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: '第三方系统登录中,请稍后',
|
background: 'rgba(0, 0, 0, 0.7)',
|
})
|
this.$store
|
.dispatch('LoginBySocial', this.socialForm)
|
.then(() => {
|
window.location.href = topUrl.split(redirectUrl)[0]
|
//加载工作流路由集
|
this.loadFlowRoutes()
|
this.$router.push(this.tagWel)
|
loading.close()
|
})
|
.catch(() => {
|
loading.close()
|
})
|
} else if (
|
!topUrl.includes(redirectUrl) &&
|
!validatenull(this.socialForm.code) &&
|
!validatenull(this.socialForm.state)
|
) {
|
const loading = this.$loading({
|
lock: true,
|
text: '单点系统登录中,请稍后',
|
background: 'rgba(0, 0, 0, 0.7)',
|
})
|
this.$store
|
.dispatch('LoginBySso', this.socialForm)
|
.then(() => {
|
window.location.href = topUrl.split(ssoCode)[0]
|
//加载工作流路由集
|
this.loadFlowRoutes()
|
this.$router.push(this.tagWel)
|
loading.close()
|
})
|
.catch(() => {
|
loading.close()
|
})
|
}
|
},
|
loadFlowRoutes() {
|
this.$store.dispatch('FlowRoutes').then(() => {})
|
},
|
},
|
}
|
</script>
|
|
<style lang="scss" scoped>
|
.loginContainer {
|
position: relative;
|
background: #020f25;
|
width: 100%;
|
height: 100%;
|
overflow-x: auto;
|
scrollbar-width: none; /* Firefox 隐藏滚动条 */
|
&::-webkit-scrollbar {
|
display: none; /* Chrome、Safari 隐藏滚动条 */
|
}
|
|
&.narrowScreen {
|
> div {
|
left: 50%;
|
top: 50%;
|
transform: translate(-50%, -50%);
|
}
|
}
|
> div {
|
left: 0;
|
top: 0;
|
position: absolute;
|
height: 100%;
|
width: 100%;
|
}
|
.login-container {
|
background-size: 100% 100%;
|
background-repeat: no-repeat;
|
pointer-events: none;
|
|
> * {
|
pointer-events: auto;
|
}
|
.logo {
|
position: absolute;
|
left: 52px;
|
top: 44px;
|
img {
|
width: 156px;
|
height: 44px;
|
}
|
}
|
}
|
}
|
</style>
|