From 634d5b5b043cba4bec74261541327f3f274f54db Mon Sep 17 00:00:00 2001
From: cxt104926 <1049266034@qq.com>
Date: Thu, 22 Apr 2021 15:30:40 +0800
Subject: [PATCH] =?UTF-8?q?=E5=AE=8C=E5=96=84=E7=94=A8=E6=88=B7=E6=94=B9?=
 =?UTF-8?q?=E5=AF=86=E7=A0=81?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/login.vue             | 115 ++++++++-------
 src/views/manager/index.vue     |  42 +++---
 src/views/register/register.vue | 248 ++++++++++++++++----------------
 3 files changed, 202 insertions(+), 203 deletions(-)

diff --git a/src/views/login.vue b/src/views/login.vue
index 23d68ea..a5a1c4d 100644
--- a/src/views/login.vue
+++ b/src/views/login.vue
@@ -12,13 +12,13 @@
         <el-input clearable v-model="addAndEditFormData.account" placeholder="请输入账号" style="width: 80%"></el-input>
       </el-form-item>
       <el-form-item prop="password" label="密  码：">
-        <el-input clearable v-model="addAndEditFormData.password" placeholder="请输入密码" show-password
-                  style="width: 80%"></el-input>
+        <el-input clearable v-model="addAndEditFormData.password" placeholder="请输入密码" show-password style="width: 80%">
+        </el-input>
       </el-form-item>
       <el-form-item prop="verification" label="验证码:">
-        <el-input clearable v-model="addAndEditFormData.verification" placeholder="请输入验证码"
-                  style="width: 40%"></el-input>
-        <img id="img" @click="getVerification" :src="imgSrc" alt="验证码" title="点击更换验证码"/>
+        <el-input clearable v-model="addAndEditFormData.verification" placeholder="请输入验证码" style="width: 40%">
+        </el-input>
+        <img id="img" @click="getVerification" :src="imgSrc" alt="验证码" title="点击更换验证码" />
       </el-form-item>
       <el-checkbox class="rememberMe" v-model="rememberMe">记住我</el-checkbox>
       <el-form-item>
@@ -34,59 +34,64 @@
 </template>
 
 <script>
-export default {
-  name: "login",
-  data() {
-    return {
-      addAndEditFormData: {
-        account: "",
-        password: "",
-        verification: ""
-      },
-      rememberMe: true,
-      imgSrc: "/getVerify?temp=" + new Date(),
-      message: "",
-      addAndEditRules: {
-        account: {
-          required: true, message: "账号不能为空", trigger: "blur"
-        },
-        password: {
-          required: true, message: "密码不能为空", trigger: "blur"
+  export default {
+    name: "login",
+    data() {
+      return {
+        addAndEditFormData: {
+          account: "",
+          password: "",
+          verification: ""
         },
-        verification: {
-          required: true, message: "验证码不能为空", trigger: "blur"
+        rememberMe: true,
+        imgSrc: "/getVerify?temp=" + new Date(),
+        message: "",
+        addAndEditRules: {
+          account: {
+            required: true,
+            message: "账号不能为空",
+            trigger: "blur"
+          },
+          password: {
+            required: true,
+            message: "密码不能为空",
+            trigger: "blur"
+          },
+          verification: {
+            required: true,
+            message: "验证码不能为空",
+            trigger: "blur"
+          }
         }
-      }
-    };
-  },
-  created() {
-  },
-  methods: {
-    getVerification() {
-      this.imgSrc = "/getVerify?temp=" + +new Date();
+      };
     },
-    handleConfirmEvent() {
-      this.$refs.loginFrom.validate(valid => {
-        if (valid) {
-          let params = {
-            account: this.addAndEditFormData.account,
-            password: this.addAndEditFormData.password,
-            verification: this.addAndEditFormData.verification
-          };
-          this.api.postApi("/login", params).then(e => {
-            if (e.data.code === 200) {
-              localStorage.setItem("Authorization", e.data.data.authorization);
-              this.$store.commit("userInfo", e.data.data);
-              this.$router.push({
-                path: "/manager"
-              });
-            }
-          });
-        }
-      });
+    created() {},
+    methods: {
+      getVerification() {
+        this.imgSrc = "/getVerify?temp=" + +new Date();
+      },
+      handleConfirmEvent() {
+        this.$refs.loginFrom.validate(valid => {
+          if (valid) {
+            let params = {
+              account: this.addAndEditFormData.account,
+              password: this.addAndEditFormData.password,
+              verification: this.addAndEditFormData.verification
+            };
+            this.api.postApi("/login", params).then(e => {
+              if (e.data.code === 200) {
+                localStorage.setItem("Authorization", e.data.data.authorization);
+                this.$store.commit("userInfo", e.data.data);
+                this.$router.push({
+                  path: "/manager"
+                });
+              }
+            });
+          }
+        });
+      }
     }
-  }
-};
+  };
 </script>
 
 <style scoped>
@@ -118,7 +123,7 @@ body {
 
 /*匀速移动*/
 @keyframes animate {
-  0%, 100% {
+  0%,100% {
     transform: translateY(-50px);
   }
   50% {
diff --git a/src/views/manager/index.vue b/src/views/manager/index.vue
index 12b679e..dd34632 100644
--- a/src/views/manager/index.vue
+++ b/src/views/manager/index.vue
@@ -184,26 +184,27 @@
         editAvatarDialog: false,
         previews: {},
         option: {
-          img: '', // 裁剪图片的地址
-          info: true, // 裁剪框的大小信息
-          outputSize: 1, // 剪切后的图片质量（0.1-1）
-          full: true, // 输出原图比例截图 props名full
-          outputType: 'png', // 裁剪生成额图片的格式
-          canMove: true, // 能否拖动图片
-          original: false, // 上传图片是否显示原始宽高
-          canMoveBox: true, // 能否拖动截图框
-          autoCrop: true, // 是否默认生成截图框
+          img: '',                  // 裁剪图片的地址
+          info: true,               // 裁剪框的大小信息
+          outputSize: 1,            // 剪切后的图片质量（0.1-1）
+          full: true,               // 输出原图比例截图 props名full
+          outputType: 'png',        // 裁剪生成额图片的格式
+          canMove: true,            // 能否拖动图片
+          original: false,          // 上传图片是否显示原始宽高
+          canMoveBox: true,         // 能否拖动截图框
+          autoCrop: true,           // 是否默认生成截图框
           autoCropWidth: 100,
           autoCropHeight: 100,
-          fixedBox: true // 截图框固定大小
+          fixedBox: true            // 截图框固定大小
         },
       }
     },
     created() {
+      // 初始化，加载用户信息和菜单
       this.init();
     },
     methods: {
-      // 初始化，加载用户信息和菜单
+
       init() {
         let userInfo = this.$store.state.userInfo;
         if (userInfo === null || userInfo.length === 0) {
@@ -213,10 +214,10 @@
         this.userInfo = userInfo;
         // 获取菜单
         let routes = this.$store.state.routes;
-        // 第一次
+        // 第一次进入时候是null，后面可能是空或者undefined
         if (routes === null || routes.length === 0) {
           let item = localStorage.getItem("routers");
-          if (item === undefined || item === null) {
+          if (item === null || item === undefined) {
             this.api.getApi('/menu/get/treeMenu').then(res => {
               if (res.data !== undefined) {
                 this.menu = res.data;
@@ -260,14 +261,8 @@
 
       // 提交修改的密码
       submitPwd() {
-        let param = {
-          id: this.userInfo.id,
-          oldPwd: this.pwdFormData.oldPassword,
-          newPwd: this.pwdFormData.password
-        }
-        this.api.getApi("/updatePwd", param).then(e => {
-          console.log(e);
-        })
+        let url = "/updatePwd?id=" + this.userInfo.id + "&oldPwd=" + this.pwdFormData.oldPassword + "&newPwd=" + this.pwdFormData.password;
+        this.api.getApi(url);
       },
 
       // 关闭密码弹框
@@ -352,10 +347,12 @@
           })
         }
       },
+
       // 实时预览函数
       realTime(data) {
         this.previews = data
       },
+
       // 下载图片
       down(type) {
         var aLink = document.createElement('a')
@@ -372,6 +369,7 @@
           })
         }
       },
+
       // 更换头像--上传本地图片
       uploadImg(file) {
         var _this = this;
@@ -399,7 +397,7 @@
   }
 
   .nameClass {
-    color: #133cce;
+    color: #1d2a2a;
     float: right;
     margin-top: 15px;
     margin-left: 8px;
diff --git a/src/views/register/register.vue b/src/views/register/register.vue
index 26318a5..a66df2c 100644
--- a/src/views/register/register.vue
+++ b/src/views/register/register.vue
@@ -7,11 +7,12 @@
           <el-input v-model="addAndEditFormData.account" placeholder="请输入账号" style="width: 75%"></el-input>
         </el-form-item>
         <el-form-item prop="password" label="密 码：">
-          <el-input v-model="addAndEditFormData.password" placeholder="请输入密码" show-password style="width: 75%"></el-input>
+          <el-input v-model="addAndEditFormData.password" placeholder="请输入密码" show-password style="width: 75%">
+          </el-input>
         </el-form-item>
         <el-form-item prop="confirmPassword" label="确认密码:">
-          <el-input v-model="addAndEditFormData.confirmPassword" placeholder="请输入密码" show-password
-                    style="width:75%"></el-input>
+          <el-input v-model="addAndEditFormData.confirmPassword" placeholder="请输入密码" show-password style="width:75%">
+          </el-input>
         </el-form-item>
         <el-form-item prop="name" label="用户名：">
           <el-input v-model="addAndEditFormData.name" placeholder="请输入用户名" style="width:75%"></el-input>
@@ -20,13 +21,8 @@
           <el-input v-model="addAndEditFormData.phone" placeholder="请输入电话" style="width:75%"></el-input>
         </el-form-item>
         <el-form-item prop="classId" label=" 班 级：">
-          <el-cascader
-            @change="stuClassChange"
-            :change-on-select="true"
-            :props="defaultParams"
-            :options="classNames"
-            v-model="addAndEditFormData.classId"
-            :clearable="true" style="width:75%">
+          <el-cascader @change="stuClassChange" :change-on-select="true" :props="defaultParams" :options="classNames"
+            v-model="addAndEditFormData.classId" :clearable="true" style="width:75%">
           </el-cascader>
         </el-form-item>
         <el-form-item class="registerBtu">
@@ -43,135 +39,135 @@
 </template>
 
 <script>
-export default {
-  name: "register",
-  data() {
-    let validateConfirmPassword = (rule, value, callback) => {
-      if (value === "") {
-        callback(new Error("请输入确认密码"));
-      } else if (value !== this.addAndEditFormData.password) {
-        callback(new Error("两次密码输入不一致"));
-      } else {
-        callback();
-      }
-    };
-    return {
-      defaultParams: {
-        label: 'name',
-        value: 'id',
-        children: 'child'
-      },
-      classNames: [], // 班级数据
-      addAndEditFormData: {
-        name: "",
-        phone: "",
-        account: "",
-        password: "",
-        classId: "",
-        confirmPassword: "" // 确认密码
-      },
-      message: "",
-      addAndEditRules: {
-        account: {
-          required: true,
-          message: "账号不能为空",
-          trigger: "blur"
-        },
-        password: {
-          required: true,
-          message: "密码不能为空",
-          trigger: "blur"
+  export default {
+    name: "register",
+    data() {
+      let validateConfirmPassword = (rule, value, callback) => {
+        if (value === "") {
+          callback(new Error("请输入确认密码"));
+        } else if (value !== this.addAndEditFormData.password) {
+          callback(new Error("两次密码输入不一致"));
+        } else {
+          callback();
+        }
+      };
+      return {
+        defaultParams: {
+          label: 'name',
+          value: 'id',
+          children: 'child'
         },
-        name: {
-          required: true,
-          message: "用户名不能为空",
-          trigger: "blur"
+        classNames: [], // 班级数据
+        addAndEditFormData: {
+          name: "",
+          phone: "",
+          account: "",
+          password: "",
+          classId: "",
+          confirmPassword: "" // 确认密码
         },
-        confirmPassword: {
-          required: true,
-          validator: validateConfirmPassword,
-          trigger: "blur"
+        message: "",
+        addAndEditRules: {
+          account: {
+            required: true,
+            message: "账号不能为空",
+            trigger: "blur"
+          },
+          password: {
+            required: true,
+            message: "密码不能为空",
+            trigger: "blur"
+          },
+          name: {
+            required: true,
+            message: "用户名不能为空",
+            trigger: "blur"
+          },
+          confirmPassword: {
+            required: true,
+            validator: validateConfirmPassword,
+            trigger: "blur"
+          },
+          phone: {
+            required: true,
+            message: "电话不能为空",
+            trigger: "blur"
+          }
         },
-        phone: {
-          required: true,
-          message: "电话不能为空",
-          trigger: "blur"
-        }
-      },
-    };
-  },
-  created() {
-    // 去加载班级数据
-    this.api.getApi("/stu/class/get/treeData").then(e => {
-      this.classNames = e.data;
-    });
-  },
-  methods: {
-    handleConfirmEvent() {
-      this.$refs.registerForm.validate(valid => {
-        if (valid) {
-          this.api.postApi("/register", this.addAndEditFormData).then(e => {
-            if (e.data.code === 200) {
-              this.$router.push("/");
-            }
-          });
-        }
+      };
+    },
+    created() {
+      // 去加载班级数据
+      this.api.getApi("/stu/class/get/treeData").then(e => {
+        this.classNames = e.data;
       });
     },
+    methods: {
+      handleConfirmEvent() {
+        this.$refs.registerForm.validate(valid => {
+          if (valid) {
+            this.api.postApi("/register", this.addAndEditFormData).then(e => {
+              if (e.data.code === 200) {
+                this.$router.push("/");
+              }
+            });
+          }
+        });
+      },
 
-    // 监听班级选择
-    stuClassChange(value) {
-      this.addAndEditFormData.classId = value[value.length - 1];
+      // 监听班级选择
+      stuClassChange(value) {
+        this.addAndEditFormData.classId = value[value.length - 1];
+      }
     }
-  }
-};
+  };
 </script>
 
 <style scoped>
-#register {
-  background-image: url("../../assets/img/1.jpg");
-  background-size: cover;
-  height: 100vh;
-  width: 100vw;
-}
+  #register {
+    background-image: url("../../assets/img/1.jpg");
+    background-size: cover;
+    height: 100vh;
+    width: 100vw;
+  }
 
-.registerDiv{
-  left: 50%;
-  top: 50%;
-  position: absolute;
-  width: 400px;
-  transform: translate(-50%, -50%);
-}
+  .registerDiv {
+    left: 40%;
+    top: 20%;
+    position: absolute;
+    width: 400px;
+  }
 
-.registerForm {
-  border-radius: 15px;
-  background-clip: padding-box;
-  padding: 15px 20px;
-  border: #133cce;
-  box-shadow: 0 0 25px #2cb6b6;
-  background: rgba(255, 255, 255, 0.1);
-  backdrop-filter: blur(5px);
-  border: 1px solid rgba(255, 255, 255, 0.5);
-  border-right: 1px solid rgba(255, 255, 255, 0.1);
-  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
-  z-index: 1;
-  text-align: right;
-}
+  .registerForm {
+    border-radius: 15px;
+    background-clip: padding-box;
+    padding: 15px 20px;
+    color: black;
+    border: #133cce;
+    box-shadow: 0 0 25px #2cb6b6;
+    background: rgba(255, 255, 255, 0.1);
+    backdrop-filter: blur(5px);
+    border: 1px solid rgba(255, 255, 255, 0.5);
+    border-right: 1px solid rgba(255, 255, 255, 0.1);
+    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
+    z-index: 1;
+    text-align: right;
+  }
 
-.registerBtu{
-  margin-right: 25%;
-}
+  .registerBtu {
+    margin-right: 25%;
+  }
 
-.registerTitle {
-  margin: 0 auto 15px auto;
-  text-align: center;
-  color: #3c8dbc;
-}
+  .registerTitle {
+    margin: 0 auto 15px auto;
+    text-align: center;
+    color: #3c8dbc;
+  }
 
-.navigate {
-  text-align: right;
-  color: #8b8989;
-  font-size: small;
-  margin-top: -10px;
-}
+  .navigate {
+    text-align: right;
+    color: #8b8989;
+    font-size: small;
+    margin-top: -10px;
+  }
 </style>
-- 
GitLab