From a079b51dedafb805f9269826e24208ce28b43884 Mon Sep 17 00:00:00 2001
From: 龚焕茏 <2842157468@qq.com>
Date: 星期二, 26 三月 2024 18:01:43 +0800
Subject: [PATCH] 卡片图片预览

---
 src/views/login.vue |  119 ++++++++++++++++++++++++++++++++++++++++++++++++++++-------
 1 files changed, 105 insertions(+), 14 deletions(-)

diff --git a/src/views/login.vue b/src/views/login.vue
index 95cff50..e855493 100644
--- a/src/views/login.vue
+++ b/src/views/login.vue
@@ -1,7 +1,11 @@
 <template>
   <div class="login">
+    <div class="title-container">
+      <h3 class="title">鑷础鍏畨澶╃綉杩愮淮骞冲彴</h3>
+    </div>
     <el-form ref="loginForm" :model="loginForm" :rules="loginRules" class="login-form">
-      <h3 class="title">鑻ヤ緷鍚庡彴绠$悊绯荤粺</h3>
+      <h3 class="title">鑷础鍏畨澶╃綉杩愮淮骞冲彴</h3>
+
       <el-form-item prop="username">
         <el-input
           v-model="loginForm.username"
@@ -37,7 +41,7 @@
           <img :src="codeUrl" @click="getCode" class="login-code-img"/>
         </div>
       </el-form-item>
-      <el-checkbox v-model="loginForm.rememberMe" style="margin:0px 0px 25px 0px;">璁颁綇瀵嗙爜</el-checkbox>
+      <el-checkbox v-model="loginForm.rememberMe" style=" margin:0px 0px 25px 0px;">璁颁綇瀵嗙爜</el-checkbox>
       <el-form-item style="width:100%;">
         <el-button
           :loading="loading"
@@ -54,21 +58,53 @@
         </div>
       </el-form-item>
     </el-form>
-    <!--  搴曢儴  -->
-    <div class="el-login-footer">
-      <span>Copyright 漏 2018-2023 ruoyi.vip All Rights Reserved.</span>
-    </div>
+
+    <el-dialog title="涓轰簡鎮ㄧ殑璐﹀彿瀹夊叏,棣栨鐧婚檰璇蜂慨鏀瑰瘑鐮�" :visible.sync="loginInfo.firstLogin==0">
+         <el-form>
+           <el-form-item label="鏂板瘑鐮�">
+               <el-input v-model="newPassword" autocomplete="off"></el-input>
+           </el-form-item>
+            <el-form-item label="璇风‘璁ゅ瘑鐮�">
+               <el-input v-model="confirmPassword" autocomplete="off"></el-input>
+            </el-form-item>
+         </el-form>
+         <div slot="footer" class="dialog-footer">
+            <el-button type="primary" @click="updatePwd">纭� 瀹�</el-button>
+         </div>
+    </el-dialog>
   </div>
+
+
 </template>
 
 <script>
-import { getCodeImg } from "@/api/login";
+import { getCodeImg ,getInfo} from "@/api/login";
 import Cookies from "js-cookie";
 import { encrypt, decrypt } from '@/utils/jsencrypt'
+import { updateUserPwd } from "@/api/system/user";
 
 export default {
+  //鏂板瀵硅薄銆佸彉閲�
   name: "Login",
   data() {
+    const equalToPassword = (rule, value, callback) => {
+          if (this.newPassword !== value) {
+            callback(new Error("涓ゆ杈撳叆鐨勫瘑鐮佷笉涓�鑷�"));
+          } else {
+            callback();
+          }
+        };
+    const validatePassword = (rule, value, callback) => {
+          var regex = /(?=.*[0-9])(?=.*[A-Z])(?=.*[a-z])(?=.*[\W_])/;
+              if (value.length < 8 || value.length > 10) {
+                callback(new Error('璇疯緭鍏�8-10浣嶅ぇ鍐欏瓧姣�+灏忓啓瀛楁瘝+鏁板瓧+鐗规畩瀛楃'));
+              }
+              else if (!regex.test(value)) {
+                callback(new Error("璇疯緭鍏�8-10浣嶅ぇ鍐欏瓧姣�+灏忓啓瀛楁瘝+鏁板瓧+鐗规畩瀛楃"));
+              } else {
+                callback();
+              }
+            };
     return {
       codeUrl: "",
       loginForm: {
@@ -78,6 +114,11 @@
         code: "",
         uuid: ""
       },
+      loginInfo: {
+          firstLogin: 1
+      },
+      newPassword: undefined,
+      confirmPassword: undefined,
       loginRules: {
         username: [
           { required: true, trigger: "blur", message: "璇疯緭鍏ユ偍鐨勮处鍙�" }
@@ -86,6 +127,16 @@
           { required: true, trigger: "blur", message: "璇疯緭鍏ユ偍鐨勫瘑鐮�" }
         ],
         code: [{ required: true, trigger: "change", message: "璇疯緭鍏ラ獙璇佺爜" }]
+      },
+      rules: {
+        newPassword: [
+          { required: true, message: "鏂板瘑鐮佷笉鑳戒负绌�", trigger: "blur" },
+          { required: true, validator: validatePassword, trigger: "blur" }
+        ],
+        confirmPassword: [
+          { required: true, message: "纭瀵嗙爜涓嶈兘涓虹┖", trigger: "blur" },
+          { required: true, validator: equalToPassword, trigger: "blur" }
+        ]
       },
       loading: false,
       // 楠岃瘉鐮佸紑鍏�
@@ -98,6 +149,7 @@
   watch: {
     $route: {
       handler: function(route) {
+        console.log(route);
         this.redirect = route.query && route.query.redirect;
       },
       immediate: true
@@ -131,6 +183,7 @@
       this.$refs.loginForm.validate(valid => {
         if (valid) {
           this.loading = true;
+
           if (this.loginForm.rememberMe) {
             Cookies.set("username", this.loginForm.username, { expires: 30 });
             Cookies.set("password", encrypt(this.loginForm.password), { expires: 30 });
@@ -140,22 +193,46 @@
             Cookies.remove("password");
             Cookies.remove('rememberMe');
           }
-          this.$store.dispatch("Login", this.loginForm).then(() => {
-            this.$router.push({ path: this.redirect || "/" }).catch(()=>{});
+
+          this.$store.dispatch("Login", this.loginForm).then((res) => {
+              getInfo().then(loginInfo => {
+              this.loginInfo = loginInfo.user
+              //濡傛灉杩斿洖涓�1姝e父璺宠浆
+              if(this.loginInfo.firstLogin == 1){
+                this.$router.push({ path: "/" }).catch(()=>{});
+                return;
+                this.$router.push({ path: this.redirect || "/" }).catch(()=>{});
+              } else {
+                 localStorage.setItem('firstLogin',0)
+              }
+              }).catch(()=>{})
           }).catch(() => {
             this.loading = false;
             if (this.captchaEnabled) {
               this.getCode();
             }
           });
+         }
+       });
+      },
+    // 鏂板淇敼鏂规硶
+    updatePwd(){
+      updateUserPwd("", this.newPassword, 0).then(response => {
+      	// 淇敼瀹屾垚灏唂irstLogin鏀逛负1
+        localStorage.setItem('firstLogin', 1)
+        this.$modal.msgSuccess("淇敼鎴愬姛");
+        this.$router.push({ path: this.redirect || "/" }).catch(() => {});
+      }).catch((e) => {
+        console.info(e)
+          });
         }
-      });
-    }
-  }
-};
+       }
+     };
 </script>
 
-<style rel="stylesheet/scss" lang="scss">
+<style rel="stylesheet/scss" lang="scss" scoped>
+
+$light_gray:#eee;
 .login {
   display: flex;
   justify-content: center;
@@ -165,6 +242,7 @@
   background-size: cover;
 }
 .title {
+
   margin: 0px auto 30px auto;
   text-align: center;
   color: #707070;
@@ -216,4 +294,17 @@
 .login-code-img {
   height: 38px;
 }
+.title-container {
+  position: absolute;
+  transform: translateY(-400%);
+  left: 35%;
+  .title {
+    font-size: 40px;
+    color: $light_gray;
+    margin: 0px auto 20px auto;
+    text-align: center;
+    font-weight: bold;
+    letter-spacing: 20px;
+  }
+}
 </style>

--
Gitblit v1.8.0