代码还原

src/views/login/index.vue

@@ -1,10 +1,10 @@
 <template>
   <div class="login login-container">
-      <div class="logo">
+    <div class="logo">
-        <img src="/src/assets/images/login/logo2.png" alt="" width="250" />
+      <img src="/src/assets/images/login/logo.png" alt="" width="500" />
-      </div>
+    </div>
     <div class="form">
-      <div class="title">欢迎登录！</div>
+      <div class="title">安全生产综合监管</div>
       <el-form
         ref="formRef"
         :model="form"
@@ -12,22 +12,31 @@
         @submit.prevent="fnLogin"
       >
         <el-form-item prop="username">
-          <label>账号</label>
           <el-input
             v-model="form.username"
             placeholder="请输入用户名"
             tabindex="1"
           >
+            <template #prepend>
+              <icon-people theme="filled" size="16" fill="#909399" />
+            </template>
           </el-input>
         </el-form-item>
         <el-form-item prop="password">
-          <label>密码</label>
           <el-input
             v-model="form.password"
             type="password"
             placeholder="请输入密码"
             tabindex="2"
           >
+            <template #prepend>
+              <icon-lock
+                theme="filled"
+                size="16"
+                fill="#909399"
+                :stroke-width="3"
+              />
+            </template>
           </el-input>
         </el-form-item>
         <el-form-item>
@@ -37,9 +46,20 @@
           <el-button native-type="submit">登录</el-button>
         </el-form-item>
       </el-form>
+      <div class="tips">
+        <div style="color: red; text-align: left">
+          本平台为互联网非涉密平台，严禁处理、传输国家秘密和工作秘密
+        </div>
+      </div>
+      <el-tooltip effect="dark" placement="bottom">
+        <template #content>
+          <img :src="appPath.value" alt="" width="180" height="180" />
+        </template>
+        <div class="tooltip" style="margin-top: 10px">监管端APP下载</div>
+      </el-tooltip>
     </div>
     <div class="footer">
-      河北秦安安全科技股份有限公司 版权所有 Copy right 2013-2020-v7
+      ICP备案号： 冀ICP备15003849号 技术支持：河北秦安安全科技股份有限公司
     </div>
   </div>
 </template>
@@ -49,15 +69,12 @@ import { ref } from "vue";
 import { useRouter } from "vue-router";
 import Verification from "@/components/verification/index";
 import { useUserStore } from "@/pinia/user";
-import { getAppPath, getUserInfo, Login } from "@/request/api";
+import { getUserInfo, Login } from "@/request/api";
 import { debounce } from "throttle-debounce";
 import useForm from "@/hooks/useForm.js";
 import dayjs from "dayjs";
 import { encrypt } from "@/assets/js/aes_secret.js";
 import { ElMessage } from "element-plus";
-import { useQRCode } from "@vueuse/integrations/useQRCode";
-import { getFileUrl } from "@/assets/js/utils.js";
-
 
 const userStore = useUserStore();
 const router = useRouter();
@@ -74,16 +91,6 @@ const rules = {
   password: [{ required: true, message: "请输入密码", trigger: "blur" }],
   code: [{ required: true, message: "请输入验证码", trigger: "blur" }],
 };
-const fnGetAppDownloadPath = async () => {
-  const { versionmanager } = await getAppPath();
-  appPath.value = useQRCode(() => getFileUrl() + versionmanager.fileUrl, {
-    width: 100,
-    height: 100,
-    margin: 1,
-    correctLevel: "H",
-  });
-};
-fnGetAppDownloadPath();
 const fnLogin = debounce(
   1000,
   () => {
@@ -122,13 +129,10 @@ const fnSubmitLogin = async () => {
   width: 100%;
   background-color: #2d3a4b;
   overflow: hidden;
-  background-image: url(../../assets/images/login/bg2.png);
+  background-image: url(../../assets/images/login/bg.png);
   background-repeat: no-repeat;
-  background-size: 70% 100%;
+  background-size: 100% 100%;
-  float: left;
-  position: relative;
 }
-
 .login {
   width: 100%;
   max-width: 1920px;
@@ -138,21 +142,24 @@ const fnSubmitLogin = async () => {
   background-color: #fff;
 
   .logo {
-    top: 20px;
+    margin-top: 20px;
-    left: 20px;
+    margin-left: 20px;
-    position: absolute;
+    width: 100%;
+    pointer-events: none;
   }
 
   .form {
-    float: right;
+    border-radius: 5px;
-    padding-left: 100px;
+    box-shadow: 0 0 20px rgb(109 109 109 / 40%);
-    padding-right: 100px;
+    position: absolute;
-    padding-top: 150px;
+    right: 230px;
-    width: 30%;
+    top: 50%;
-    height: 100%;
+    transform: translateY(-50%);
-    //padding: 40px 50px;
+    width: 400px;
-    background-color: #d6def2;
+    height: 490px;
-    //z-index: 1;
+    padding: 40px 50px;
+    background-color: #fff;
+    z-index: 1;
 
     &:after {
       content: "";
@@ -212,13 +219,12 @@ const fnSubmitLogin = async () => {
     width: 100%;
     height: 80px;
     font-size: 14px;
-    color: white;
+    color: rgba(0, 0, 0, 0.5);
-    //color: rgba(0, 0, 0, 0.5);
     text-align: center;
     position: absolute;
     bottom: 0;
     left: 50%;
-    transform: translateX(-70%);
+    transform: translateX(-50%);
     z-index: 1;
     line-height: 80px;
   }