From dff9fb32c1bac52d378a6d196f670b92610c01d3 Mon Sep 17 00:00:00 2001
From: ZZJ <zzjdsg2300@163.com>
Date: 星期四, 16 十二月 2021 17:21:49 +0800
Subject: [PATCH] 自适应2

---
 src/pages/login/App.vue | 1154 ++++++++++++++++++++++++++++----------------------------
 1 files changed, 577 insertions(+), 577 deletions(-)

diff --git a/src/pages/login/App.vue b/src/pages/login/App.vue
index b752383..fdd8d7b 100644
--- a/src/pages/login/App.vue
+++ b/src/pages/login/App.vue
@@ -1,577 +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">{{ 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">&#xe7e5;</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">&#xe7e4;</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() {
-      // 瑙f瀽璺敱鍙傛暟锛屽苟缂撳瓨
-      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>
+<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">&#xe7e5;</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">&#xe7e4;</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() {
+      // 瑙f瀽璺敱鍙傛暟锛屽苟缂撳瓨
+      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