Merge branch 'pd-ly-20201012' into product

pages/account/register/password/api.js

+import Api from '@/plugins/request'
+export default {
+    //10010修改密码
+    authChangepassword(params) {
+        return Api.post(`${UserUrl}/api/services/app/account/changepassword`, params);
+    },
+
+}
\ No newline at end of file

pages/account/register/password/index.vue

+<template>
+  <div>
+    <Row>
+      <Col span="24">
+        <Card class="updatePass">
+          <p slot="title">修改密码</p>
+          <p class="rowWaring mt">
+            <Alert type="warning">
+              <template slot="desc"> 密码过于简单,请重新设置密码！ </template>
+            </Alert>
+          </p>
+          <p class="mt">用户帐号：{{ userInfo.userName }}</p>
+          <Form
+            ref="formCustom"
+            :model="formCustom"
+            :rules="ruleCustom"
+            :label-width="95"
+          >
+            <Row>
+              <Col span="5">
+                <FormItem label="原密码：" prop="oldpass">
+                  <Input
+                    type="password"
+                    v-model="formCustom.oldpass"
+                    size="large"
+                  ></Input>
+                </FormItem>
+              </Col>
+            </Row>
+            <Row>
+              <Col span="5" class="container">
+                <FormItem label="新密码：" prop="passwd">
+                  <Input
+                    type="password"
+                    v-model="formCustom.passwd"
+                    size="large"
+                  ></Input>
+                </FormItem>
+                <div class="input_span">
+                  <label style="margin-left: 40px">强度:</label>
+                  <span id="one"></span>
+                  <span id="two"></span>
+                  <span id="three"></span>
+                </div>
+                <div id="font">
+                  <span>弱</span>
+                  <span>中</span>
+                  <span>强</span>
+                </div>
+              </Col>
+            </Row>
+            <Row>
+              <Col span="5">
+                <FormItem label="确认密码：" prop="passwdCheck">
+                  <Input
+                    size="large"
+                    type="password"
+                    v-model="formCustom.passwdCheck"
+                  ></Input>
+                </FormItem>
+              </Col>
+            </Row>
+
+            <FormItem>
+              <Button type="primary" @click="handleSubmit('formCustom')"
+                >确认</Button
+              >
+              <Button
+                @click="handleReset('formCustom')"
+                style="margin-left: 8px"
+                >取消</Button
+              >
+            </FormItem>
+          </Form>
+        </Card>
+      </Col>
+    </Row>
+  </div>
+</template>
+<script>
+import Api from "./api";
+export default {
+  data() {
+    const validatePass = (rule, value, callback) => {
+      if (value === "") {
+        callback(new Error("请输入密码！"));
+      } else {
+        if (this.formCustom.passwdCheck !== "") {
+          //对第二个密码框单独验证
+          this.$refs.formCustom.validateField("passwdCheck");
+        }
+
+        callback();
+      }
+    };
+    const validatePassCheck = (rule, value, callback) => {
+      if (value === "") {
+        callback(new Error("请输入密码！"));
+      } else if (value !== this.formCustom.passwd) {
+        callback(new Error("两次输入不一致请重新输入!"));
+      } else {
+        callback();
+      }
+    };
+    const validateold = (rule, value, callback) => {
+      if (value === "") {
+        callback(new Error("请输入原密码！"));
+      } else {
+        callback();
+      }
+    };
+    return {
+      userInfo: {
+        accountId: "",
+        id: "",
+        userName: "",
+      },
+      msgText: "",
+      formCustom: {
+        passwd: "",
+        passwdCheck: "",
+        oldpass: "",
+      },
+      ruleCustom: {
+        passwd: [{ validator: validatePass, trigger: "blur", required: true }],
+        passwdCheck: [
+          { validator: validatePassCheck, trigger: "blur", required: true },
+        ],
+        oldpass: [{ validator: validateold, trigger: "blur", required: true }],
+      },
+    };
+  },
+  watch: {
+    "formCustom.passwd"(newname, oldname) {
+      this.msgText = this.checkStrong(newname);
+      if (this.msgText > 1 || this.msgText == 1) {
+        document.getElementById("one").style.background = "red";
+      } else {
+        document.getElementById("one").style.background = "#eee";
+      }
+      if (this.msgText > 2 || this.msgText == 2) {
+        document.getElementById("two").style.background = "orange";
+      } else {
+        document.getElementById("two").style.background = "#eee";
+      }
+      if (this.msgText == 4) {
+        document.getElementById("three").style.background = "#00D1B2";
+      } else {
+        document.getElementById("three").style.background = "#eee";
+      }
+    },
+    // deep: true,
+  },
+  created() {
+    this.userId = this.$store.state.userInfo.userId;
+  },
+  mounted() {
+    this.initUserInfo();
+  },
+  methods: {
+    //获取用户基本信息
+    initUserInfo() {
+      let parma = {
+        Id: this.userId,
+      };
+      this.$http.sysUser.getuserinfo(parma).then((res) => {
+        if (res.result) {
+          this.$nextTick(function () {
+            this.userInfo = res.result;
+          });
+        } else {
+          this.$Message.error("查询失败!");
+        }
+      });
+    },
+    checkStrong(sValue) {
+      var modes = 0;
+      //正则表达式验证符合要求的
+      if (sValue.length < 1) return modes;
+      if (/\d/.test(sValue)) modes++; //数字
+      if (/[a-z]/.test(sValue)) modes++; //小写
+      if (/[A-Z]/.test(sValue)) modes++; //大写
+      if (/\W/.test(sValue)) modes++; //特殊字符
+      //逻辑处理
+      switch (modes) {
+        case 1:
+          return 1;
+          break;
+        case 2:
+          return 2;
+          break;
+        case 3:
+        case 4:
+          return sValue.length < 4 ? 3 : 4;
+          break;
+      }
+      return modes;
+    },
+    handleSubmit(name) {
+      this.$refs[name].validate((valid) => {
+        if (valid) {
+          if(this.msgText < 2 ){
+              this.$Message.warning("密码过于简单,请重新设置密码！");
+              return;
+          }
+          let params = {
+            accountId: this.userInfo.accountId,
+            userId: this.userInfo.id,
+            newPassword: this.formCustom.passwdCheck,
+            oldPassword: this.formCustom.oldpass,
+          };
+          Api.authChangepassword(params).then((res) => {
+            if (res.success) {
+              this.$router.push("/");
+              this.$Message.success("修改成功!");
+            } else {
+              this.$Message.error("修改失败!");
+            }
+          });
+        }
+      });
+    },
+    handleReset(name) {
+      this.$refs[name].resetFields();
+    },
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.updatePass .mt {
+  margin: 20px 0;
+  text-indent: 7px;
+}
+.input_span span {
+  display: inline-block;
+  width: 85px;
+  height: 10px;
+  background: #eee;
+  line-height: 20px;
+}
+
+#one {
+  border-top-left-radius: 5px;
+  border-bottom-left-radius: 5px;
+  border-right: 0px solid;
+  margin-left: 20px;
+  margin-right: 3px;
+}
+
+#two {
+  border-left: 0px solid;
+  border-right: 0px solid;
+  margin-left: -5px;
+  margin-right: 3px;
+}
+
+#three {
+  border-top-right-radius: 5px;
+  border-bottom-right-radius: 5px;
+  border-left: 0px solid;
+  margin-left: -5px;
+}
+#font {
+  margin-bottom: 20px;
+}
+#font span:nth-child(1) {
+  color: red;
+  margin-left: 80px;
+}
+#font span:nth-child(2) {
+  color: orange;
+  margin: 0 60px;
+}
+#font span:nth-child(3) {
+  color: #00d1b2;
+}
+</style>
\ No newline at end of file