Merge remote-tracking branch 'origin/master'
| | |
| | | <template> |
| | | <div :class="{ loginContainer: true, 'narrowScreen': narrowScreen }" @keyup.enter="handleLogin"> |
| | | <div class="login-container"> |
| | | <div class="logo" v-if="isShowAiSkyLogo"> |
| | | <img src="@/assets/images/login/aisky-logo.png" alt="" /> |
| | | </div> |
| | | <userLogin v-if="activeName === 'user'"></userLogin> |
| | | </div> |
| | | </div> |
| | |
| | | left: 0; |
| | | top: 0; |
| | | position: absolute; |
| | | height: 1080px; |
| | | width: 1920px; |
| | | height: 100%; |
| | | width: 100%; |
| | | } |
| | | .login-container { |
| | | background-image: url('@/assets/images/login/bg-new.png'); |
| | | background-size: 100% 100%; |
| | | background-repeat: no-repeat; |
| | | pointer-events: none; |
| | |
| | | <template> |
| | | <div class="login-right-new" :class="loginPageClass"> |
| | | <div class="login-title">{{ loginTitle }}</div> |
| | | <div class="user-login">用户登录</div> |
| | | <el-form |
| | | class="login-form" |
| | |
| | | :destroy-on-close="false" |
| | | class="tip-dialogs" |
| | | > |
| | | <div class="dialog-headers">提示</div> |
| | | <div class="dialog-close" @click="tipDialogVisible = false"> |
| | | <img src="@/assets/images/clusterScheduling/close.png" alt="" /> |
| | | </div> |
| | |
| | | }, |
| | | } |
| | | </script> |
| | | <style> |
| | | input:-webkit-autofill, |
| | | input:-webkit-autofill:hover, |
| | | input:-webkit-autofill:focus { |
| | | -webkit-text-fill-color: white !important; |
| | | box-shadow: 0 0 0 1000px transparent inset !important; |
| | | transition: background-color 5000s ease-in-out 0s; |
| | | } |
| | | </style> |
| | | <style lang="scss" scoped> |
| | | <style scoped> |
| | | .login-right-new { |
| | | .login-form { |
| | | :deep(.el-form-item__label) { |
| | | width: 100px; |
| | | height: 26px; |
| | | font-family: Source Han Sans CN, Source Han Sans CN; |
| | | font-weight: 400; |
| | | font-size: 16px; |
| | | color: rgba(255, 255, 255, 0.7); |
| | | line-height: 26px; |
| | | } |
| | | :deep(.el-input) { |
| | | width: 100%; |
| | | border-bottom: 1px solid rgba(255, 255, 255, 0.7); |
| | | .el-input__wrapper { |
| | | // background: rgba(17, 64, 136, 0.1); |
| | | box-shadow: 0 0 0 1px rgba(17, 64, 136, 0); |
| | | background: transparent; |
| | | height: 42px; |
| | | } |
| | | padding: 16px; |
| | | } |
| | | |
| | | .el-input__inner { |
| | | color: #fff; |
| | | &::placeholder { |
| | | color: rgba(255, 255, 255, 0.6); |
| | | } |
| | | } |
| | | } |
| | | :deep(.el-button) { |
| | | width: 418px; |
| | | height: 60px; |
| | | background: linear-gradient(96deg, #4293c5 0%, #063c9f 100%); |
| | | border-radius: 4px 4px 4px 4px; |
| | | font-family: Source Han Sans CN, Source Han Sans CN; |
| | | font-weight: 400; |
| | | font-size: 24px; |
| | | color: #ffffff; |
| | | .user-login { |
| | | font-size: 18px; |
| | | font-weight: 600; |
| | | margin-bottom: 16px; |
| | | } |
| | | |
| | | // &:hover { |
| | | // background: linear-gradient(270deg, #0070ff 0%, rgba(0, 112, 255, 0.5) 100%); |
| | | // } |
| | | } |
| | | } |
| | | .login-form { |
| | | width: 100%; |
| | | } |
| | | |
| | | .username { |
| | | margin-bottom: 30px; |
| | | } |
| | | .password { |
| | | img { |
| | | position: absolute; |
| | | right: 0; |
| | | width: 30px; |
| | | height: 30px; |
| | | cursor: pointer; |
| | | } |
| | | } |
| | | :deep(.el-dialog) { |
| | | width: 406px; |
| | | height: 206px; |
| | | background: url('@/assets/images/login/tip.png') no-repeat; |
| | | background-size: 100% 100%; |
| | | transform: translate(-30%, 80%); |
| | | } |
| | | :deep(.el-dialog__header) { |
| | | display: none; |
| | | } |
| | | .dialog-headers { |
| | | position: absolute; |
| | | left: 30px; |
| | | top: 18px; |
| | | width: 37px; |
| | | height: 26px; |
| | | font-family: YouSheBiaoTiHei, YouSheBiaoTiHei; |
| | | font-weight: 400; |
| | | font-size: 20px; |
| | | color: #ffffff; |
| | | line-height: 26px; |
| | | text-align: center; |
| | | } |
| | | .dialog-close { |
| | | position: absolute; |
| | | right: 24px; |
| | | top: 20px; |
| | | cursor: pointer; |
| | | img { |
| | | width: 20px; |
| | | height: 16x; |
| | | } |
| | | } |
| | | .dialog-contents { |
| | | position: absolute; |
| | | top: 80px; |
| | | .tip-contents { |
| | | width: 406px; |
| | | height: 26px; |
| | | font-family: Source Han Sans CN, Source Han Sans CN; |
| | | font-weight: 500; |
| | | font-size: 16px; |
| | | color: #ffffff; |
| | | line-height: 26px; |
| | | text-align: center; |
| | | margin-bottom: 20px; |
| | | } |
| | | .dialog-btns { |
| | | margin-left: 150px; |
| | | width: 94px; |
| | | height: 38px; |
| | | background: #1b3e6c; |
| | | border-radius: 8px 8px 8px 8px; |
| | | border: 1px solid #ffffff; |
| | | color: #fff; |
| | | line-height: 38px; |
| | | text-align: center; |
| | | cursor: pointer; |
| | | } |
| | | } |
| | | .username, |
| | | .password, |
| | | .get-forget-password, |
| | | .login-submit { |
| | | margin-bottom: 12px; |
| | | } |
| | | |
| | | .get-forget-password { |
| | | display: flex; |
| | | justify-content: space-between; |
| | | align-items: center; |
| | | } |
| | | |
| | | .forget-password-text { |
| | | font-size: 14px; |
| | | color: #1677ff; |
| | | } |
| | | |
| | | :deep(.el-button) { |
| | | width: 100%; |
| | | } |
| | | |
| | | .password img { |
| | | width: 20px; |
| | | height: 20px; |
| | | margin-left: 8px; |
| | | vertical-align: middle; |
| | | cursor: pointer; |
| | | } |
| | | |
| | | .dialog-close { |
| | | text-align: right; |
| | | cursor: pointer; |
| | | margin-bottom: 8px; |
| | | } |
| | | |
| | | .dialog-contents { |
| | | text-align: center; |
| | | } |
| | | |
| | | .dialog-btns { |
| | | display: inline-block; |
| | | padding: 6px 12px; |
| | | border: 1px solid #dcdfe6; |
| | | border-radius: 4px; |
| | | cursor: pointer; |
| | | } |
| | | </style> |
| | |
| | | |
| | | |
| | | function setUrlInfo(route) { |
| | | if (!route.query?.params) return |
| | | const userInfo = JSON.parse(decodeURIComponent(route.query?.params || '')) |
| | | store.commit('setUniPlatform', route.query.uniPlatform) |
| | | store.commit('SET_USER_INFO', userInfo) |
| | |
| | | .login-right-new { |
| | | position: absolute; |
| | | top: 222px; |
| | | right: 48px; |
| | | width: 604px; |
| | | position: relative; |
| | | width: 100%; |
| | | padding: 16px; |
| | | box-sizing: border-box; |
| | | } |
| | | |
| | | // height: 508px; |
| | | .login-title { |
| | | width: 705px; |
| | | height: 68px; |
| | | font-family: YouSheBiaoTiHei, YouSheBiaoTiHei; |
| | | font-weight: 400; |
| | | font-size: 54px; |
| | | color: #ffffff; |
| | | line-height: 98px; |
| | | letter-spacing: 2px; |
| | | text-align: left; |
| | | } |
| | | .login-right-new .login-title { |
| | | font-size: 20px; |
| | | font-weight: 600; |
| | | margin-bottom: 12px; |
| | | } |
| | | |
| | | .user-login { |
| | | width: 96px; |
| | | height: 26px; |
| | | font-family: Source Han Sans CN, Source Han Sans CN; |
| | | font-weight: bold; |
| | | font-size: 24px; |
| | | color: #e3edff; |
| | | line-height: 26px; |
| | | text-align: center; |
| | | margin-bottom: 40px; |
| | | } |
| | | .login-right-new .user-login { |
| | | font-size: 16px; |
| | | font-weight: 600; |
| | | margin-bottom: 12px; |
| | | } |
| | | |
| | | .username { |
| | | width: 394px; |
| | | height: 72px; |
| | | } |
| | | .login-right-new .username, |
| | | .login-right-new .password { |
| | | width: 100%; |
| | | height: auto; |
| | | } |
| | | |
| | | .password { |
| | | width: 394px; |
| | | height: 72px; |
| | | } |
| | | .login-right-new .get-forget-password { |
| | | margin-top: 8px; |
| | | display: flex; |
| | | justify-content: space-between; |
| | | align-items: center; |
| | | } |
| | | |
| | | .get-forget-password { |
| | | width: 400px; |
| | | height: 26px; |
| | | position: absolute; |
| | | margin-top: 24px; |
| | | display: flex; |
| | | justify-content: space-between; |
| | | } |
| | | .login-right-new .forget-password-text { |
| | | cursor: pointer; |
| | | font-size: 14px; |
| | | color: #1677ff; |
| | | } |
| | | |
| | | .forget-password-text { |
| | | cursor: pointer; |
| | | font-family: Source Han Sans CN, Source Han Sans CN; |
| | | font-weight: 400; |
| | | font-size: 16px; |
| | | color: #ffffff; |
| | | line-height: 26px; |
| | | text-align: center; |
| | | } |
| | | |
| | | .forgot-password { |
| | | position: absolute; |
| | | width: 64px; |
| | | height: 24px; |
| | | top: 289px; |
| | | right: 58px; |
| | | font-family: Source Han Sans CN, Source Han Sans CN; |
| | | font-weight: 500; |
| | | font-size: 16px; |
| | | color: #d1e0f9; |
| | | line-height: 19px; |
| | | } |
| | | |
| | | .login-click { |
| | | position: absolute; |
| | | bottom: 106px; |
| | | left: 44px; |
| | | width: 391px; |
| | | height: 61px; |
| | | background: url("../assets/images/login/login-btn.png") no-repeat center / 100% 100%; |
| | | font-family: Source Han Sans CN, Source Han Sans CN; |
| | | font-weight: 500; |
| | | font-size: 24px; |
| | | line-height: 50px; |
| | | text-align: center; |
| | | color: #fff; |
| | | } |
| | | .login-right-new .login-click { |
| | | width: 100%; |
| | | height: auto; |
| | | margin-top: 16px; |
| | | text-align: center; |
| | | } |
| | | |
| | | .jw-user-login-page { |
| | | display: flex; |
| | | flex-direction: column; |
| | | align-items: center; |
| | | width: 756px; |
| | | |
| | | .login-title { |
| | | width: 756px; |
| | | } |
| | | align-items: stretch; |
| | | width: 100%; |
| | | } |
| | | |
| | | .login-weaper { |
| | |
| | | .login-left, |
| | | .login-border { |
| | | position: relative; |
| | | min-height: 500px; |
| | | min-height: auto; |
| | | align-items: center; |
| | | display: flex; |
| | | } |
| | | |
| | | .login-left { |
| | | // padding-top: 100px; |
| | | justify-content: center; |
| | | flex-direction: column; |
| | | color: #fff; |
| | | float: left; |
| | | width: 50%; |
| | | position: relative; |
| | | width: 100%; |
| | | box-sizing: border-box; |
| | | } |
| | | |
| | | .login-left .img { |
| | | width: 200px; |
| | | width: 120px; |
| | | } |
| | | |
| | | .login-time { |
| | | position: absolute; |
| | | left: 25px; |
| | | top: 25px; |
| | | margin: 12px 0; |
| | | width: 100%; |
| | | color: #fff; |
| | | font-weight: 200; |
| | | opacity: 0.9; |
| | | font-size: 18px; |
| | | overflow: hidden; |
| | | font-weight: bold; |
| | | font-size: 14px; |
| | | } |
| | | |
| | | .login-left .title { |
| | | margin-top: 60px; |
| | | margin-top: 12px; |
| | | text-align: center; |
| | | color: #fff; |
| | | font-weight: 300; |
| | | letter-spacing: 2px; |
| | | font-size: 28px; |
| | | font-weight: bold; |
| | | font-size: 16px; |
| | | } |
| | | |
| | | .login-border { |
| | | border-left: none; |
| | | border-top-right-radius: 5px; |
| | | border-bottom-right-radius: 5px; |
| | | color: #fff; |
| | | width: 50%; |
| | | float: left; |
| | | width: 100%; |
| | | box-sizing: border-box; |
| | | } |
| | | |
| | | .login-main { |
| | | margin: 0 auto; |
| | | padding: 30px 50px; |
| | | width: 70%; |
| | | //box-shadow: -4px 5px 10px rgba(255, 255, 255, 0.4); |
| | | padding: 16px; |
| | | width: 100%; |
| | | box-sizing: border-box; |
| | | } |
| | | |
| | | .login-main > h3 { |
| | | margin-bottom: 20px; |
| | | margin-bottom: 12px; |
| | | } |
| | | |
| | | .login-title { |
| | | color: #000; |
| | | margin-bottom: 50px; |
| | | font-weight: bold; |
| | | font-size: 28px; |
| | | margin-bottom: 16px; |
| | | font-weight: 600; |
| | | font-size: 18px; |
| | | text-align: center; |
| | | letter-spacing: 4px; |
| | | } |
| | | |
| | | .login-menu { |
| | | margin-top: 40px; |
| | | margin-top: 16px; |
| | | width: 100%; |
| | | text-align: center; |
| | | } |
| | | |
| | | a { |
| | | color: #999; |
| | | font-size: 12px; |
| | | margin: 0px 8px; |
| | | } |
| | | .login-menu a { |
| | | font-size: 12px; |
| | | margin: 0 8px; |
| | | } |
| | | |
| | | .login-submit { |
| | | margin-top: 94px; |
| | | height: 60px; |
| | | margin-top: 16px; |
| | | height: auto; |
| | | } |
| | | |
| | | .register-submit { |
| | | width: 100%; |
| | | height: 45px; |
| | | font-size: 18px; |
| | | letter-spacing: 2px; |
| | | font-weight: 300; |
| | | height: auto; |
| | | font-size: 16px; |
| | | cursor: pointer; |
| | | margin-top: 30px; |
| | | margin-top: 12px; |
| | | margin-left: 0 !important; |
| | | transition: 0.25s; |
| | | } |
| | | |
| | | // .login-form { |
| | | // margin: 10px 0; |
| | | // i { |
| | | // color: #333; |
| | | // } |
| | | // .el-input { |
| | | // input { |
| | | // text-indent: 5px; |
| | | // } |
| | | // .el-input__wrapper { |
| | | // padding: 5px 10px; |
| | | // border-radius: 0; |
| | | // } |
| | | // .el-input__suffix, |
| | | // .el-input__prefix { |
| | | // display: flex; |
| | | // align-items: center; |
| | | // text-align: center; |
| | | // } |
| | | // .el-input__prefix { |
| | | // margin-left: 8px; |
| | | // } |
| | | // } |
| | | // } |
| | | .login-code { |
| | | width: 100%; |
| | | height: 100%; |
| | | |
| | | .el-input-group__append { |
| | | background-color: #fff; |
| | | } |
| | | } |
| | | |
| | | .login-code-box { |
| | |
| | | min-width: 100px; |
| | | padding: 0 5px; |
| | | height: 30px; |
| | | color: #333; |
| | | font-size: 20px; |
| | | font-weight: bold; |
| | | letter-spacing: 3px; |
| | | line-height: 38px; |
| | | text-indent: 5px; |
| | | font-size: 16px; |
| | | line-height: 30px; |
| | | text-align: center; |
| | | box-sizing: border-box; |
| | | } |