From 832896ccaf8ac6a8ca31394e55577f064bc5eacf Mon Sep 17 00:00:00 2001
From: ZZJ <zzjdsg2300@163.com>
Date: 星期一, 20 十二月 2021 11:05:48 +0800
Subject: [PATCH] 暂存
---
src/pages/login/App.vue | 1141 ++++++++++++++++++++++++++++----------------------------
1 files changed, 577 insertions(+), 564 deletions(-)
diff --git a/src/pages/login/App.vue b/src/pages/login/App.vue
index 8571737..fdd8d7b 100644
--- a/src/pages/login/App.vue
+++ b/src/pages/login/App.vue
@@ -1,564 +1,577 @@
-<template>
- <!-- <div class v-loading="vLoading" :style="`width: ${currentWidth}px;height:${currentHeight}px`">
- <div class="web-site">
- <a href="http://www.smartai.com" target="_blank">www.smartai.com</a>
- </div>
-
- <lang-select class="lang-select"/>
- <licence />
- <div class="right-bg" style>
- <particle-network />
- </div>
- <div class="left-bg">
- <div class="login-logo">
- <img src="/images/login-logo.png" alt width="105px" height="105px" />
- </div>
- <div class="login-com">
- <span>{{ $t('login.company') }}</span>
- </div>
- <div class="login-form">
- <el-form
- :model="user"
- status-icon
- :rules="nullRule"
- :validate-on-rule-change="false"
- ref="ruleForm"
- class="demo-ruleForm"
- >
- <el-form-item prop="loginName">
- <el-input v-model="user.loginName" style="width:280px" :placeholder="$t('placeholder.enterUsername')">
- <i slot="prefix" class="iconfont iconyonghu1"></i>
- </el-input>
- </el-form-item>
- <el-form-item prop="password">
- <el-input
- show-password
- @keyup.enter.native="systemLogin()"
- v-model="user.password"
- autocomplete="off"
- style="width:280px"
- :placeholder="$t('placeholder.enterPassword')"
- >
- <i slot="prefix" class="iconfont iconmima"></i>
- </el-input>
- </el-form-item>
- <el-form-item>
- <el-button ref="submit" type="warning" @click="systemLogin()" style="width:280px">{{ $t('button.login') }}</el-button>
- </el-form-item>
- </el-form>
- </div>
- <p class="gradient-text gradient-text-one">
- 鈥斺��
- <b>SmartAI</b> {{ $t('login.aios') }} 鈥斺��
- </p>
- <p
- class="gradient-text gradient-text-one"
- style="letter-spacing: 1.8px;font-size:15px;"
- >V1.0.0</p>
- </div>
- </div> -->
- <div class="login">
- <div class="title">
- <div class="en">Smart AI</div>
- <div class="ch">浜哄伐鏅鸿兘鎿嶄綔绯荤粺</div>
- </div>
-
- <div class="left_footer">
- <img class="logo" src="/images/loginImg/LOGO.png" alt="" />
- <div class="web">www.smartai.com</div>
- </div>
-
- <div
- class="login-form"
- :style="{ background: backgroundColor }"
- :class="{ empty: !user.loginName && !user.password }"
- >
- <img class="logo" src="/images/loginImg/OS.png" alt="" />
-
- <el-form
- :model="user"
- status-icon
- :rules="nullRule"
- :validate-on-rule-change="false"
- ref="ruleForm"
- class="demo-ruleForm"
- >
- <el-form-item prop="loginName">
- <el-input
- v-model="user.loginName"
- :placeholder="$t('placeholder.enterUsername')"
- >
- <i slot="prefix" class="iconfont icon"></i>
- </el-input>
- </el-form-item>
- <el-form-item prop="password">
- <el-input
- show-password
- @keyup.enter.native="systemLogin()"
- v-model="user.password"
- autocomplete="off"
- :placeholder="$t('placeholder.enterPassword')"
- >
- <i slot="prefix" class="iconfont icon"></i>
- </el-input>
- </el-form-item>
- <el-form-item>
- <el-button ref="submit" type="warning" @click="systemLogin()">{{
- $t("button.login")
- }}</el-button>
- </el-form-item>
- </el-form>
- </div>
- </div>
-</template>
-
-<script>
-import { tologin, getLoginUserData, getServerName } from "./api.ts";
-import ParticleNetwork from "./ParticleNetwork";
-import Licence from "@/components/licence";
-import LangSelect from "@/components/langSelect";
-import { getMenuListData } from "@/api/utils";
-
-export default {
- name: "login-pgae",
- metaInfo: {
- title: "鐧诲綍椤�",
- },
- components: {
- // ParticleNetwork,
- // Licence,
- // LangSelect
- },
- computed: {
- rules() {
- return {
- loginName: [
- {
- required: true,
- message: this.$t("placeholder.enterUsername"),
- trigger: "change",
- },
- ],
- password: [
- {
- required: true,
- message: this.$t("placeholder.enterPassword"),
- trigger: "change",
- },
- ],
- };
- },
- },
- data: () => ({
- serverTitle: "",
- user: {
- loginName: "",
- password: "",
- rememberMe: false,
- },
- nullRule: {},
-
- loading: "",
- vLoading: false,
- currentHeight: 1057,
- currentWidth: 1920,
- backgroundColor: "",
- backgroundList: [
- "#2A2344",
- "#342344",
- "#000000",
- "#233044",
- "#0B252E",
- "#150051",
- "#110040",
- ],
- }),
- created() {
- this.getServerName();
- this.getScreenHeight();
- this.backgroundColor =
- this.backgroundList[
- Math.floor(Math.random() * this.backgroundList.length)
- ];
- },
- mounted() {
- // 鑷姩鐧诲綍鎺ュ彛
- this.loginRobot();
- },
- watch: {},
- beforeDestroy() {
- window.onresize = null;
- },
- methods: {
- loginRobot() {
- // 瑙ｆ瀽璺敱鍙傛暟锛屽苟缂撳瓨
- let user = this.getQueryVariable("username");
- let passwd = this.getQueryVariable("password");
- if (user.length && passwd.length) {
- sessionStorage.setItem(
- "autoLogin",
- JSON.stringify({ username: user, passwd: passwd })
- );
-
- this.user.loginName = user;
- this.user.password = passwd;
- this.systemLogin();
- return;
- }
-
- // 鐧婚檰瓒呮椂鍚庣殑閲嶆柊鐧婚檰
- let sessionInfo = sessionStorage.getItem("autoLogin");
- if (sessionInfo) {
- let authority = JSON.parse(sessionInfo);
- this.user.loginName = authority.username;
- this.user.password = authority.passwd;
- this.systemLogin();
- }
- },
- systemLogin() {
- this.nullRule = this.rules;
- this.$nextTick(() => {
- this.$refs["ruleForm"].validate((valid) => {
- if (valid) {
- this.loading = this.$loading({
- lock: true,
- text: "Loading",
- spinner: "el-icon-loading",
- background: "rgba(0, 0, 0, 0.7)",
- });
- this.testLogin();
- } else {
- this.nullRule = {};
- }
- });
- this.nullRule = {};
- });
- },
- async testLogin() {
- // location.assign("/view/desktop/")
- tologin({ username: this.user.loginName, password: this.user.password })
- .then((json) => {
- const loginedInfo = {
- access_token: json.token_type + " " + json.access_token,
- refresh_token: json.refresh_token,
- };
- sessionStorage.setItem("expires_in", json.expires_in);
- sessionStorage.setItem("loginedInfo", JSON.stringify(loginedInfo));
- this.loading.close();
- this.getLoginUserData();
- })
- .catch((err) => {
- this.loading.close();
- this.$notify({
- title: "鎻愮ず",
- type: "error",
- message: err.msg,
- });
- this.$refs.pwd.focus();
- });
- },
- async getLoginUserData() {
- let res = await getLoginUserData();
- if (res.success) {
- sessionStorage.setItem("userInfo", JSON.stringify(res.data));
- this.$notify.success("鐧诲綍鎴愬姛锛�");
- // 鑾峰彇鏉冮檺
- await this.getMenuList();
- location.assign("/view/desktop/");
- return res.data;
- } else {
- this.$notify.error("鐧诲綍澶辫触锛�");
- }
- },
-
- getScreenHeight() {
- this.currentHeight = document.documentElement.clientHeight;
- this.currentWidth = document.documentElement.clientWidth;
- window.onresize = () => {
- this.currentHeight = document.documentElement.clientHeight;
- this.currentWidth = document.documentElement.clientWidth;
- this.$forceUpdate();
- };
- },
- async getServerName() {
- let res = await getServerName();
- if (res && res.success) {
- this.serverTitle = res.data.serverName;
- window.document.title = res.data.serverName
- ? res.data.serverName
- : "SmartAI";
- sessionStorage.setItem("title", res.data.serverName);
- }
- },
- async getMenuList() {
- let results = await getMenuListData({});
- if (results && results.success) {
- /* 瀛樺偍鏉冮檺 */
- let buttonAuthoritys = results.data;
- if (results && results.length && this.$route.query.is_login) {
- this.$router.replace(results[0].url);
- }
- sessionStorage.setItem(
- "buttonAuthoritys",
- "," + buttonAuthoritys + ","
- );
- sessionStorage.setItem("menuInfo", JSON.stringify(results));
- } else {
- this.$toast({
- type: "error",
- message: "鑿滃崟鑾峰彇澶辫触",
- });
- }
- },
- getQueryVariable(variable) {
- var query = window.location.search.substring(1);
- var vars = query.split("&");
- for (var i = 0; i < vars.length; i++) {
- var pair = vars[i].split("=");
- if (pair[0] == variable) {
- return pair[1];
- }
- }
- return false;
- },
- },
-};
-</script>
-<style lang="scss">
-.login {
- height: 100%;
- position: relative;
- background-image: url("/images/loginImg/background.png");
-
- .title {
- position: absolute;
- top: 345px;
- left: 301px;
- color: #fff;
- text-align: center;
-
- .en {
- font-size: 120px;
- }
-
- .ch {
- font-size: 48px;
- letter-spacing: 9px;
- }
- }
-
- .left_footer {
- position: absolute;
- display: flex;
- justify-content: start;
- align-items: center;
- left: 358px;
- bottom: 40px;
-
- .logo {
- width: 136px;
- margin-right: 30px;
- }
-
- .web {
- font-size: 24px;
- font-weight: 700;
- color: rgba(255, 255, 255, 0.7);
- }
- }
-
- .login-form {
- position: absolute;
- width: 780px;
- height: 1000px;
- right: 40px;
- top: 40px;
- padding: 0 90px;
- box-sizing: border-box;
-
- background: #2a2344;
- opacity: 0.95;
- box-shadow: -4px 0px 10px rgba(0, 0, 0, 0.25);
- border-radius: 56px;
-
- .logo {
- margin-top: 100px;
- margin-bottom: 16px;
- }
-
- .el-form-item {
- background: rgba(0, 0, 0, 0);
- }
-
- .el-form-item:nth-child(2) {
- margin-top: 60px;
- margin-bottom: 80px;
- }
-
- .el-button {
- width: 600px;
- height: 60px;
- background: #4e94ff;
- border-radius: 30px;
- border: none;
- }
-
- .el-input {
- width: 100%;
- background: rgba(0, 0, 0, 0);
- }
-
- input {
- width: 100%;
- height: 56px;
- background: rgba(255, 255, 255, 0.1) !important;
- border: 1px solid #4e94ff;
- box-sizing: border-box;
- border-radius: 28px;
- color: #fff;
- caret-color: #fff; //鍏夋爣棰滆壊
- padding-left: 100px;
- padding-right: 50px;
- font-weight: 700;
- }
-
- input:-webkit-autofill,
- textarea:-webkit-autofill,
- select:-webkit-autofill {
- -webkit-text-fill-color: #ededed !important;
- -webkit-box-shadow: 0 0 0px 1000px transparent inset !important;
- background-color: transparent;
- background-image: none;
- transition: background-color 50000s ease-in-out 0s; //鑳屾櫙鑹查�忔槑 鐢熸晥鏃堕暱 杩囨浮鏁堟灉 鍚敤鏃跺欢杩熺殑鏃堕棿
- }
-
- .el-form-item__error {
- top: 110%;
- left: 80px;
- }
-
- .icon {
- font-size: 32px;
- color: rgb(80, 151, 255);
- }
-
- .el-input__prefix {
- padding: 0 20px;
- height: 40px;
- left: 5px;
- top: 8px;
- border-right: 1px solid #4e94ff;
- }
-
- .el-input__suffix {
- right: 20px;
- }
-
- .el-icon-circle-close {
- display: none;
- }
- }
-
- .login-form.empty {
- input {
- border-color: #999;
- color: #bbb;
- }
-
- .el-button {
- background-color: #999;
- color: #fff;
- }
-
- .icon {
- color: #fff;
- }
-
- .el-input__prefix {
- border-color: #d4d6d9;
- }
- }
-}
-
-// .right-bg {
-// position: fixed;
-// top: 0;
-// left: 0;
-// background-image: url("/images/login-net.png");
-
-// width: 100%;
-// height: 100%;
-// min-width: 1000px;
-// z-index: -10;
-// zoom: 1;
-// background-color: #fff;
-// background-repeat: no-repeat;
-// background-size: cover;
-// -webkit-background-size: cover;
-// -o-background-size: cover;
-// background-position: center 0;
-// }
-// .web-site {
-// position: absolute;
-// top: 55px;
-// left: 41px;
-// font-family: PingFangSC-Medium;
-// font-size: 20px;
-// color: #6170e1;
-// letter-spacing: 6.15px;
-// }
-// .lang-select {
-// float: right;
-// color: white !important;
-// font-size: 14px;
-// margin: 13px;
-// cursor: pointer;
-// }
-// .left-bg {
-// position: absolute;
-// top: 29%;
-// right: 18%;
-// width: 390px;
-// height: 426px;
-// background: rgba(146, 208, 255, 0.23);
-// border-radius: 4px;
-// text-align: center;
-// .login-logo {
-// margin-top: -53px;
-// }
-
-// .login-com {
-// font-family: PingFangSC-Medium;
-// font-size: 22px;
-// color: #ffffff;
-// letter-spacing: 0.44px;
-// margin: 15px;
-// }
-// .login-form {
-// margin: 40px 10px;
-// }
-// .gradient-text {
-// line-height: 36px;
-// font-size: 17px;
-// font-family: -webkit-pictograph;
-// font-weight: bolder;
-// position: relative;
-// b {
-// font-size: 20px;
-// }
-// }
-// .gradient-text-one {
-// background-image: linear-gradient(to right, #51feff 5%, #ff8725 100%);
-// -webkit-background-clip: text;
-// -webkit-text-fill-color: transparent;
-// }
-
-// .el-input__prefix {
-// left: 8px;
-// }
-
-// .el-form-item__error {
-// left: 54px;
-// }
-// }
-</style>
+<template>
+ <!-- <div class v-loading="vLoading" :style="`width: ${currentWidth}px;height:${currentHeight}px`">
+ <div class="web-site">
+ <a href="http://www.smartai.com" target="_blank">www.smartai.com</a>
+ </div>
+
+ <lang-select class="lang-select"/>
+ <licence />
+ <div class="right-bg" style>
+ <particle-network />
+ </div>
+ <div class="left-bg">
+ <div class="login-logo">
+ <img src="/images/login-logo.png" alt width="105px" height="105px" />
+ </div>
+ <div class="login-com">
+ <span>{{ $t('login.company') }}</span>
+ </div>
+ <div class="login-form">
+ <el-form
+ :model="user"
+ status-icon
+ :rules="nullRule"
+ :validate-on-rule-change="false"
+ ref="ruleForm"
+ class="demo-ruleForm"
+ >
+ <el-form-item prop="loginName">
+ <el-input v-model="user.loginName" style="width:280px" :placeholder="$t('placeholder.enterUsername')">
+ <i slot="prefix" class="iconfont iconyonghu1"></i>
+ </el-input>
+ </el-form-item>
+ <el-form-item prop="password">
+ <el-input
+ show-password
+ @keyup.enter.native="systemLogin()"
+ v-model="user.password"
+ autocomplete="off"
+ style="width:280px"
+ :placeholder="$t('placeholder.enterPassword')"
+ >
+ <i slot="prefix" class="iconfont iconmima"></i>
+ </el-input>
+ </el-form-item>
+ <el-form-item>
+ <el-button ref="submit" type="warning" @click="systemLogin()" style="width:280px">{{ $t('button.login') }}</el-button>
+ </el-form-item>
+ </el-form>
+ </div>
+ <p class="gradient-text gradient-text-one">
+ 鈥斺��
+ <b>SmartAI</b> {{ $t('login.aios') }} 鈥斺��
+ </p>
+ <p
+ class="gradient-text gradient-text-one"
+ style="letter-spacing: 1.8px;font-size:15px;"
+ >V1.0.0</p>
+ </div>
+ </div> -->
+ <div class="login">
+ <div class="title">
+ <div class="en">{{ data.title_firstLine }}</div>
+ <div class="ch">{{ data.title_secondLine }}</div>
+ </div>
+
+ <div class="left_footer">
+ <img class="logo" src="/apps/loginData/LOGO.png" alt="" />
+ <div class="web">{{ data.website }}</div>
+ </div>
+
+ <div
+ class="login-form"
+ :style="{ background: backgroundColor }"
+ :class="{ empty: !user.loginName || !user.password }"
+ >
+ <img class="logo" src="/apps/loginData/leftImg.png" alt="" />
+
+ <el-form
+ :model="user"
+ status-icon
+ :rules="nullRule"
+ :validate-on-rule-change="false"
+ ref="ruleForm"
+ class="demo-ruleForm"
+ >
+ <el-form-item prop="loginName">
+ <el-input
+ v-model="user.loginName"
+ :placeholder="$t('placeholder.enterUsername')"
+ >
+ <i slot="prefix" class="iconfont icon"></i>
+ </el-input>
+ </el-form-item>
+ <el-form-item prop="password">
+ <el-input
+ show-password
+ @keyup.enter.native="systemLogin()"
+ v-model="user.password"
+ autocomplete="off"
+ :placeholder="$t('placeholder.enterPassword')"
+ >
+ <i slot="prefix" class="iconfont icon"></i>
+ </el-input>
+ </el-form-item>
+ <el-form-item>
+ <el-button ref="submit" type="warning" @click="systemLogin()">{{
+ $t("button.login")
+ }}</el-button>
+ </el-form-item>
+ </el-form>
+ </div>
+ </div>
+</template>
+
+<script>
+import { tologin, getLoginUserData, getServerName } from "./api.ts";
+import ParticleNetwork from "./ParticleNetwork";
+import Licence from "@/components/licence";
+import LangSelect from "@/components/langSelect";
+import { getMenuListData } from "@/api/utils";
+import loginData from "../../../public/apps/loginData/login.json";
+
+export default {
+ name: "login-pgae",
+ metaInfo: {
+ title: "鐧诲綍椤�",
+ },
+ components: {
+ // ParticleNetwork,
+ // Licence,
+ // LangSelect
+ },
+ computed: {
+ rules() {
+ return {
+ loginName: [
+ {
+ required: true,
+ message: this.$t("placeholder.enterUsername"),
+ trigger: "change",
+ },
+ ],
+ password: [
+ {
+ required: true,
+ message: this.$t("placeholder.enterPassword"),
+ trigger: "change",
+ },
+ ],
+ };
+ },
+ },
+ data: () => ({
+ data: {},
+ serverTitle: "",
+ user: {
+ loginName: "",
+ password: "",
+ rememberMe: false,
+ },
+ nullRule: {},
+
+ loading: "",
+ vLoading: false,
+ currentHeight: 1057,
+ currentWidth: 1920,
+ backgroundColor: "",
+ backgroundList: [
+ "#2A2344",
+ "#342344",
+ "#000000",
+ "#233044",
+ "#0B252E",
+ "#150051",
+ "#110040",
+ ],
+ }),
+ created() {
+ this.getServerName();
+ this.getScreenHeight();
+ this.data = loginData;
+ this.backgroundColor =
+ this.backgroundList[
+ Math.floor(Math.random() * this.backgroundList.length)
+ ];
+ },
+ mounted() {
+ // 鑷姩鐧诲綍鎺ュ彛
+ this.loginRobot();
+ },
+ watch: {},
+ beforeDestroy() {
+ window.onresize = null;
+ },
+ methods: {
+ loginRobot() {
+ // 瑙ｆ瀽璺敱鍙傛暟锛屽苟缂撳瓨
+ let user = this.getQueryVariable("username");
+ let passwd = this.getQueryVariable("password");
+ if (user.length && passwd.length) {
+ sessionStorage.setItem(
+ "autoLogin",
+ JSON.stringify({ username: user, passwd: passwd })
+ );
+
+ this.user.loginName = user;
+ this.user.password = passwd;
+ this.systemLogin();
+ return;
+ }
+
+ // 鐧婚檰瓒呮椂鍚庣殑閲嶆柊鐧婚檰
+ let sessionInfo = sessionStorage.getItem("autoLogin");
+ if (sessionInfo) {
+ let authority = JSON.parse(sessionInfo);
+ this.user.loginName = authority.username;
+ this.user.password = authority.passwd;
+ this.systemLogin();
+ }
+ },
+ systemLogin() {
+ this.nullRule = this.rules;
+ this.$nextTick(() => {
+ this.$refs["ruleForm"].validate((valid) => {
+ if (valid) {
+ this.loading = this.$loading({
+ lock: true,
+ text: "Loading",
+ spinner: "el-icon-loading",
+ background: "rgba(0, 0, 0, 0.7)",
+ });
+ this.testLogin();
+ } else {
+ this.nullRule = {};
+ }
+ });
+ this.nullRule = {};
+ });
+ },
+ async testLogin() {
+ // location.assign("/view/desktop/")
+ tologin({ username: this.user.loginName, password: this.user.password })
+ .then((json) => {
+ const loginedInfo = {
+ access_token: json.token_type + " " + json.access_token,
+ refresh_token: json.refresh_token,
+ };
+ sessionStorage.setItem("expires_in", json.expires_in);
+ sessionStorage.setItem("loginedInfo", JSON.stringify(loginedInfo));
+ this.loading.close();
+ this.getLoginUserData();
+ })
+ .catch((err) => {
+ this.loading.close();
+ this.$notify({
+ title: "鎻愮ず",
+ type: "error",
+ message: err.msg,
+ });
+ this.$refs.pwd.focus();
+ });
+ },
+ async getLoginUserData() {
+ let res = await getLoginUserData();
+ if (res.success) {
+ sessionStorage.setItem("userInfo", JSON.stringify(res.data));
+ this.$notify.success("鐧诲綍鎴愬姛锛�");
+ // 鑾峰彇鏉冮檺
+ await this.getMenuList();
+ location.assign("/view/desktop/");
+ return res.data;
+ } else {
+ this.$notify.error("鐧诲綍澶辫触锛�");
+ }
+ },
+
+ getScreenHeight() {
+ this.currentHeight = document.documentElement.clientHeight;
+ this.currentWidth = document.documentElement.clientWidth;
+ window.onresize = () => {
+ this.currentHeight = document.documentElement.clientHeight;
+ this.currentWidth = document.documentElement.clientWidth;
+ this.$forceUpdate();
+ };
+ },
+ async getServerName() {
+ let res = await getServerName();
+ if (res && res.success) {
+ this.serverTitle = res.data.serverName;
+ window.document.title = res.data.serverName
+ ? res.data.serverName
+ : "SmartAI";
+ sessionStorage.setItem("title", res.data.serverName);
+ }
+ },
+ async getMenuList() {
+ let results = await getMenuListData({});
+ if (results && results.success) {
+ /* 瀛樺偍鏉冮檺 */
+ let buttonAuthoritys = results.data;
+ if (results && results.length && this.$route.query.is_login) {
+ this.$router.replace(results[0].url);
+ }
+ sessionStorage.setItem(
+ "buttonAuthoritys",
+ "," + buttonAuthoritys + ","
+ );
+ sessionStorage.setItem("menuInfo", JSON.stringify(results));
+ } else {
+ this.$toast({
+ type: "error",
+ message: "鑿滃崟鑾峰彇澶辫触",
+ });
+ }
+ },
+ getQueryVariable(variable) {
+ var query = window.location.search.substring(1);
+ var vars = query.split("&");
+ for (var i = 0; i < vars.length; i++) {
+ var pair = vars[i].split("=");
+ if (pair[0] == variable) {
+ return pair[1];
+ }
+ }
+ return false;
+ },
+ },
+};
+</script>
+<style lang="scss">
+html,
+body,
+.login {
+ height: 100%;
+ min-width: 1200px;
+ min-height: 680px;
+ position: relative;
+ background-image: url("/apps/loginData/background.png");
+
+ .title {
+ position: absolute;
+ top: 40%;
+ left: 15.6%;
+ color: #fff;
+ text-align: center;
+
+ .en {
+ font-size: 120px;
+ }
+
+ .ch {
+ font-size: 48px;
+ letter-spacing: 9px;
+ }
+ }
+
+ .left_footer {
+ position: absolute;
+ display: flex;
+ justify-content: start;
+ align-items: center;
+ left: 18.6%;
+ bottom: 40px;
+
+ .logo {
+ width: 136px;
+ margin-right: 30px;
+ }
+
+ .web {
+ font-size: 24px;
+ font-weight: 700;
+ color: rgba(255, 255, 255, 0.7);
+ }
+ }
+
+ .login-form {
+ position: absolute;
+ width: 40%;
+ height: 92.5%;
+ right: 3.75%;
+ top: 3.75%;
+ padding: 0 90px;
+ box-sizing: border-box;
+
+ background: #2a2344;
+ opacity: 0.95;
+ box-shadow: -4px 0px 10px rgba(0, 0, 0, 0.25);
+ border-radius: 56px;
+ overflow: hidden;
+
+ .logo {
+ width: 100%;
+ margin-top: 13%;
+ margin-bottom: 20px;
+ }
+
+ .el-form {
+ width: 100%;
+ }
+
+ .el-form-item {
+ background: rgba(0, 0, 0, 0);
+ }
+
+ .el-form-item:nth-child(2) {
+ margin-top: 10%;
+ margin-bottom: 13%;
+ }
+
+ .el-button {
+ width: 100%;
+ height: 60px;
+ background: #4e94ff;
+ border-radius: 30px;
+ border: none;
+ }
+
+ .el-input {
+ width: 100%;
+ background: rgba(0, 0, 0, 0);
+ }
+
+ input {
+ width: 100%;
+ height: 56px;
+ background: rgba(255, 255, 255, 0.1) !important;
+ border: 1px solid #4e94ff;
+ box-sizing: border-box;
+ border-radius: 28px;
+ color: #fff;
+ caret-color: #fff; //鍏夋爣棰滆壊
+ padding-left: 100px;
+ padding-right: 50px;
+ font-weight: 700;
+ }
+
+ input:-webkit-autofill,
+ textarea:-webkit-autofill,
+ select:-webkit-autofill {
+ -webkit-text-fill-color: #ededed !important;
+ -webkit-box-shadow: 0 0 0px 1000px transparent inset !important;
+ background-color: transparent;
+ background-image: none;
+ transition: background-color 50000s ease-in-out 0s; //鑳屾櫙鑹查�忔槑 鐢熸晥鏃堕暱 杩囨浮鏁堟灉 鍚敤鏃跺欢杩熺殑鏃堕棿
+ }
+
+ .el-form-item__error {
+ top: 110%;
+ left: 80px;
+ }
+
+ .icon {
+ font-size: 32px;
+ color: rgb(80, 151, 255);
+ }
+
+ .el-input__prefix {
+ padding: 0 20px;
+ height: 40px;
+ left: 5px;
+ top: 8px;
+ border-right: 1px solid #4e94ff;
+ }
+
+ .el-input__suffix {
+ right: 20px;
+ }
+
+ .el-icon-circle-close {
+ display: none;
+ }
+ }
+
+ .login-form.empty {
+ input {
+ border-color: #999;
+ color: #bbb;
+ }
+
+ .el-button {
+ background-color: #999;
+ color: #fff;
+ }
+
+ .icon {
+ color: #fff;
+ }
+
+ .el-input__prefix {
+ border-color: #d4d6d9;
+ }
+ }
+}
+
+// .right-bg {
+// position: fixed;
+// top: 0;
+// left: 0;
+// background-image: url("/images/login-net.png");
+
+// width: 100%;
+// height: 100%;
+// min-width: 1000px;
+// z-index: -10;
+// zoom: 1;
+// background-color: #fff;
+// background-repeat: no-repeat;
+// background-size: cover;
+// -webkit-background-size: cover;
+// -o-background-size: cover;
+// background-position: center 0;
+// }
+// .web-site {
+// position: absolute;
+// top: 55px;
+// left: 41px;
+// font-family: PingFangSC-Medium;
+// font-size: 20px;
+// color: #6170e1;
+// letter-spacing: 6.15px;
+// }
+// .lang-select {
+// float: right;
+// color: white !important;
+// font-size: 14px;
+// margin: 13px;
+// cursor: pointer;
+// }
+// .left-bg {
+// position: absolute;
+// top: 29%;
+// right: 18%;
+// width: 390px;
+// height: 426px;
+// background: rgba(146, 208, 255, 0.23);
+// border-radius: 4px;
+// text-align: center;
+// .login-logo {
+// margin-top: -53px;
+// }
+
+// .login-com {
+// font-family: PingFangSC-Medium;
+// font-size: 22px;
+// color: #ffffff;
+// letter-spacing: 0.44px;
+// margin: 15px;
+// }
+// .login-form {
+// margin: 40px 10px;
+// }
+// .gradient-text {
+// line-height: 36px;
+// font-size: 17px;
+// font-family: -webkit-pictograph;
+// font-weight: bolder;
+// position: relative;
+// b {
+// font-size: 20px;
+// }
+// }
+// .gradient-text-one {
+// background-image: linear-gradient(to right, #51feff 5%, #ff8725 100%);
+// -webkit-background-clip: text;
+// -webkit-text-fill-color: transparent;
+// }
+
+// .el-input__prefix {
+// left: 8px;
+// }
+
+// .el-form-item__error {
+// left: 54px;
+// }
+// }
+</style>
--
Gitblit v1.8.0