密码校验,参数控制修改密码

admin/src/layout/components/Navbar.vue

@@ -97,8 +97,14 @@
       </el-upload>
     </el-dialog>
 
-    <el-dialog title="修改密码" :visible.sync="dialogPWD">
+    <el-dialog
-      <el-form :rules="rules" :model="form">
+      title="修改密码"
+      :show-close="isPassword"
+      :close-on-press-escape="isPassword"
+      :close-on-click-modal="isPassword"
+      :visible.sync="dialogPWD"
+    >
+      <el-form ref="formName" :rules="rules" :model="form">
         <el-form-item label="旧密码" prop="oldpwd">
           <el-input v-model="form.oldpwd" autocomplete="off" />
         </el-form-item>
@@ -107,7 +113,9 @@
         </el-form-item>
       </el-form>
       <div slot="footer" class="dialog-footer">
-        <el-button @click="dialogPWD = false">取 消</el-button>
+        <el-button v-if="isPassword" @click="dialogPWD = false"
+          >取 消</el-button
+        >
         <el-button type="primary" @click="pwd">确 定</el-button>
       </div>
     </el-dialog>
@@ -201,6 +209,7 @@ import sidebar from "@/layout/components/Sidebar/index.vue";
 import avatar from "element-ui/packages/avatar";
 import { getQaCityList, getQaList } from "@/api/qa";
 import clickoutside from "element-ui/src/utils/clickoutside";
+import { Local } from "@/utils/storage";
 export default {
   directives: { clickoutside },
   components: {
@@ -228,6 +237,14 @@ export default {
   },
   // eslint-disable-next-line vue/order-in-Wangeditor
   data() {
+    var validatePassword = (rule, password, callback) => {
+      const passwordRegex = /^(?=.*[A-Za-z])(?=.*\d)[A-Za-z\d]{8,16}$/;
+      if (!passwordRegex.test(password)) {
+        callback(new Error("新密码要求包含字母和数字并且长度在8到16位"));
+      } else {
+        callback();
+      }
+    };
     return {
       workstatus: false,
       drawer: false,
@@ -238,6 +255,7 @@ export default {
       imageUrl: false,
       QaShow: true,
       os: [],
+      isPassword: true,
       getQaCityList: [],
       getQaLists: [],
       times: [],
@@ -260,13 +278,13 @@ export default {
           },
         ],
         pwd: [
-          { required: true, message: "请输入密码", trigger: "blur" },
+          { required: true, validator: validatePassword, trigger: "blur" },
-          {
+          // {
-            min: 6,
+          //   min: 6,
-            max: 20,
+          //   max: 20,
-            message: "长度在 6 到 20 个字符",
+          //   message: "长度在 6 到 20 个字符",
-            trigger: "blur",
+          //   trigger: "blur",
-          },
+          // },
         ],
       },
     };
@@ -277,6 +295,12 @@ export default {
       this.getQaCityList = res.data;
     });
   },
+  mounted() {
+    if (Local.get("userInfo").change_passwd) {
+      this.dialogPWD = true;
+      this.isPassword = false;
+    }
+  },
   methods: {
     color,
     toggleSideBar() {
@@ -308,15 +332,23 @@ export default {
       this.imageUrl = URL.createObjectURL(file.raw);
     },
     pwd() {
-      this.$axios
+      this.$refs["formName"].validate((valid) => {
-        .post("/admin/admin/pwd", this.form)
+        if (valid) {
-        .then((res) => {
+          this.$axios
-          this.dialogPWD = false;
+            .post("/admin/admin/pwd", this.form)
-          this.form = {};
+            .then((res) => {
-        })
+              this.dialogPWD = false;
-        .catch((err) => {
+              this.isPassword = true;
-          console.log(err);
+              this.form = {};
-        });
+              Local.remove("userInfo");
+            })
+            .catch((err) => {
+              console.log(err);
+            });
+        } else {
+          return false;
+        }
+      });
     },
     saveWork() {
       this.$axios

admin/src/store/modules/user.js

@@ -1,7 +1,7 @@
 import { login, logout, getInfo } from '@/api/user'
 import { getToken, setToken, removeToken } from '@/utils/auth'
 import router, { resetRouter } from '@/router'
-
+import { Local } from '@/utils/storage'
 const state = {
   token: getToken(),
   name: '',
@@ -45,6 +45,7 @@ const actions = {
         const { data } = response
         commit('SET_TOKEN', data.token)
         setToken(data.token)
+        Local.set('userInfo', data)
         resolve()
       }).catch(error => {
         reject(error)