|
|
@ -1,18 +1,18 @@
|
|
|
|
<template>
|
|
|
|
<template>
|
|
|
|
<div class="login-background">
|
|
|
|
<div class="login-background" style="">
|
|
|
|
<div class="login-container">
|
|
|
|
<div class="login-container">
|
|
|
|
<el-row v-loading="loading" type="flex">
|
|
|
|
<el-row v-loading="loading" type="flex">
|
|
|
|
<el-col :span="12">
|
|
|
|
<el-col :span="10">
|
|
|
|
|
|
|
|
<img class="login-logo" src="../../assets/login.png" alt="">
|
|
|
|
|
|
|
|
</el-col>
|
|
|
|
|
|
|
|
<el-col :span="4" />
|
|
|
|
|
|
|
|
<el-col :span="10">
|
|
|
|
<el-form ref="loginForm" :model="loginForm" :rules="loginRules" size="default">
|
|
|
|
<el-form ref="loginForm" :model="loginForm" :rules="loginRules" size="default">
|
|
|
|
<div class="login-logo">
|
|
|
|
|
|
|
|
<!-- <svg-icon v-if="!loginLogoUrl && axiosFinished" icon-class="DataEase" custom-class="login-logo-icon" /> -->
|
|
|
|
|
|
|
|
<img v-if="loginLogoUrl && axiosFinished" :src="loginLogoUrl" alt="">
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<div v-if="uiInfo && uiInfo['ui.loginTitle'] && uiInfo['ui.loginTitle'].paramValue" class="login-welcome">
|
|
|
|
<div v-if="uiInfo && uiInfo['ui.loginTitle'] && uiInfo['ui.loginTitle'].paramValue" class="login-welcome">
|
|
|
|
{{ uiInfo['ui.loginTitle'].paramValue }}
|
|
|
|
{{ uiInfo['ui.loginTitle'].paramValue }}
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div v-else class="login-welcome">
|
|
|
|
<div v-else class="login-welcome">
|
|
|
|
{{ $t('login.welcome') + (uiInfo && uiInfo['ui.title'] && uiInfo['ui.title'].paramValue || ' Ipsos VIA BIBoard') }}
|
|
|
|
{{ (uiInfo && uiInfo['ui.title'] && uiInfo['ui.title'].paramValue || 'Ipsos VIA BIBoard') }}
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="login-form">
|
|
|
|
<div class="login-form">
|
|
|
|
<el-form-item v-if="loginTypes.length > 1">
|
|
|
|
<el-form-item v-if="loginTypes.length > 1">
|
|
|
@ -50,10 +50,6 @@
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</el-form>
|
|
|
|
</el-form>
|
|
|
|
</el-col>
|
|
|
|
</el-col>
|
|
|
|
<el-col v-loading="!axiosFinished" :span="12">
|
|
|
|
|
|
|
|
<!-- <div v-if="!loginImageUrl && axiosFinished" class="login-image" />
|
|
|
|
|
|
|
|
<div v-if="loginImageUrl && axiosFinished" class="login-image-de" :style="{background:'url(' + loginImageUrl + ') no-repeat', 'backgroundSize':'contain'}" /> -->
|
|
|
|
|
|
|
|
</el-col>
|
|
|
|
|
|
|
|
</el-row>
|
|
|
|
</el-row>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<plugin-com v-if="loginTypes.includes(2) && loginForm.loginType === 2" ref="SSOComponent" component-name="SSOComponent" />
|
|
|
|
<plugin-com v-if="loginTypes.includes(2) && loginForm.loginType === 2" ref="SSOComponent" component-name="SSOComponent" />
|
|
|
@ -200,6 +196,9 @@ export default {
|
|
|
|
|
|
|
|
|
|
|
|
.login-background {
|
|
|
|
.login-background {
|
|
|
|
background-color: var(--MainBG, $--background-color-base);
|
|
|
|
background-color: var(--MainBG, $--background-color-base);
|
|
|
|
|
|
|
|
background-image: url('~@/assets/login-bg.png');
|
|
|
|
|
|
|
|
background-repeat: no-repeat;
|
|
|
|
|
|
|
|
background-size: cover;
|
|
|
|
height: 100vh;
|
|
|
|
height: 100vh;
|
|
|
|
@include login-center;
|
|
|
|
@include login-center;
|
|
|
|
}
|
|
|
|
}
|
|
|
@ -208,28 +207,15 @@ export default {
|
|
|
|
min-width: 900px;
|
|
|
|
min-width: 900px;
|
|
|
|
width: 1280px;
|
|
|
|
width: 1280px;
|
|
|
|
height: 520px;
|
|
|
|
height: 520px;
|
|
|
|
background-color: var(--MainContentBG, #FFFFFF);
|
|
|
|
|
|
|
|
@media only screen and (max-width: 1280px) {
|
|
|
|
@media only screen and (max-width: 1280px) {
|
|
|
|
width: 900px;
|
|
|
|
width: 900px;
|
|
|
|
height: 380px;
|
|
|
|
height: 380px;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.login-logo {
|
|
|
|
.login-logo {
|
|
|
|
margin-top: 50px;
|
|
|
|
margin-top: 30px;
|
|
|
|
text-align: center;
|
|
|
|
margin-left: 30px;
|
|
|
|
@media only screen and (max-width: 1280px) {
|
|
|
|
width: 260px;
|
|
|
|
margin-top: 20px;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
img{
|
|
|
|
|
|
|
|
/*width: 240px;*/
|
|
|
|
|
|
|
|
width: auto;
|
|
|
|
|
|
|
|
max-height: 60px;
|
|
|
|
|
|
|
|
@media only screen and (max-width: 1280px) {
|
|
|
|
|
|
|
|
/*width: 200px;*/
|
|
|
|
|
|
|
|
width: auto;
|
|
|
|
|
|
|
|
max-height: 50px;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.login-title {
|
|
|
|
.login-title {
|
|
|
@ -256,15 +242,10 @@ export default {
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.login-welcome {
|
|
|
|
.login-welcome {
|
|
|
|
margin-top: 20px;
|
|
|
|
font-size: 36px;
|
|
|
|
font-size: 14px;
|
|
|
|
|
|
|
|
color: $--color-primary;
|
|
|
|
color: $--color-primary;
|
|
|
|
letter-spacing: 0;
|
|
|
|
letter-spacing: 0;
|
|
|
|
line-height: 18px;
|
|
|
|
|
|
|
|
text-align: center;
|
|
|
|
text-align: center;
|
|
|
|
@media only screen and (max-width: 1280px) {
|
|
|
|
|
|
|
|
margin-top: 20px;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.demo-tips {
|
|
|
|
.demo-tips {
|
|
|
@ -286,12 +267,6 @@ export default {
|
|
|
|
@media only screen and (max-width: 1280px) {
|
|
|
|
@media only screen and (max-width: 1280px) {
|
|
|
|
margin-top: 40px;
|
|
|
|
margin-top: 40px;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
& ::v-deep .el-input__inner {
|
|
|
|
|
|
|
|
border-radius: 20px;
|
|
|
|
|
|
|
|
border: 1px solid transparent;
|
|
|
|
|
|
|
|
background: $colorBg;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
& :focus {
|
|
|
|
& :focus {
|
|
|
|
border: 1px solid $--color-primary;
|
|
|
|
border: 1px solid $--color-primary;
|
|
|
|
}
|
|
|
|
}
|
|
|
@ -306,7 +281,6 @@ export default {
|
|
|
|
|
|
|
|
|
|
|
|
.submit {
|
|
|
|
.submit {
|
|
|
|
width: 100%;
|
|
|
|
width: 100%;
|
|
|
|
border-radius: 20px;
|
|
|
|
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|