漏文件

src/views/mine/changePassword.vue

@@ -0,0 +1,123 @@
+<template>
+    <div class="page">
+        <div class="card m-top5 m-top5-left m-top5-right flex " style="box-shadow: none;">
+            <van-cell-group>
+                <van-field :required="false" clearable label="账号" icon="question-o" placeholder="请输入用户名"
+                           v-model="userName" style="opacity: 1; pointer-events: none;" />
+                <van-field ref="oldPasswordField" type="password" label="原始密码" placeholder="原密码"
+                           v-model="dataForm.oldPassword" :error-message="errorMessages.oldPasswordError"
+                           @blur="validateOldPassword" />
+                <van-field ref="newPasswordField" type="password" label="新密码" placeholder="输入新密码"
+                           v-model="dataForm.newPassword" :error-message="errorMessages.newPasswordError"
+                           @blur="validateNewPassword" />
+                <van-field ref="confirmPasswordField" type="password" label="确认密码" placeholder="确认新密码"
+                           v-model="dataForm.confirmPassword" :error-message="errorMessages.confirmPasswordError"
+                           @blur="validateConfirmPassword" />
+            </van-cell-group>
+        </div>
+        <van-button type="info" round block style="margin-top: 35px;" @click="changePassword()">确定修改</van-button>
+    </div>
+</template>
+
+<script>
+import { changePassword } from '@/api/user'
+import { encryptedData } from "@/utils";
+export default {
+    data() {
+        return {
+            userName: '',
+            dataForm: {
+                oldPassword: '',
+                newPassword: '',
+                confirmPassword: ''
+            },
+            errorMessages: {
+                oldPasswordError: '',
+                newPasswordError: '',
+                confirmPasswordError: ''
+            },
+            regex: {
+                passwordRegex: /^(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{8,}$/
+            },
+            touched: {
+                oldPassword: false,
+                newPassword: false,
+                confirmPassword: false
+            },
+        };
+    },
+    created() {
+        this.userName = this.$store.state.userInfo.userInfo.userName,
+        this.gtePubKey()
+    },
+    methods: {
+        validateOldPassword() {
+            if (!this.dataForm.oldPassword) {
+                this.errorMessages.oldPasswordError = '原始密码不能为空';
+            } else {
+                this.errorMessages.oldPasswordError = '';
+            }
+        },
+        validateNewPassword() {
+            if (!this.dataForm.newPassword) {
+                this.errorMessages.newPasswordError = '新密码不能为空';
+            } else if (!this.regex.passwordRegex.test(this.dataForm.newPassword)) {
+                this.errorMessages.newPasswordError = '新密码要求至少包含一个大写字母、一个小写字母和一个数字，且长度不少于8位';
+            } else {
+                this.errorMessages.newPasswordError = '';
+            }
+            if (this.dataForm.confirmPassword) {
+                this.validateConfirmPassword();
+            }
+        },
+        validateConfirmPassword() {
+            if (!this.dataForm.confirmPassword) {
+                this.errorMessages.confirmPasswordError = '确认密码不能为空';
+            } else if (this.dataForm.newPassword !== this.dataForm.confirmPassword) {
+                this.errorMessages.confirmPasswordError = '确认密码与新密码不一致';
+            } else {
+                this.errorMessages.confirmPasswordError = '';
+            }
+        },
+        gtePubKey() {
+            this.$http
+                .post("/auth/govweb/getKey")
+                .then((res) => {
+                    this.pubKey = res.data; // 获取到公钥;
+                })
+                .catch((err) => {
+                    console.log(err);
+                });
+        },
+        changePassword() {
+            this.validateOldPassword();
+            this.validateNewPassword();
+            this.validateConfirmPassword();
+
+            if (this.errorMessages.oldPasswordError || this.errorMessages.newPasswordError || this.errorMessages.confirmPasswordError) {
+                return;
+            }
+            try {
+                let parms = {
+                    oldPassword: encryptedData(this.pubKey, this.dataForm.oldPassword),
+                    newPassword: encryptedData(this.pubKey, this.dataForm.newPassword),
+                    confirmPassword: encryptedData(this.pubKey, this.dataForm.confirmPassword),
+                }
+                let { code, data, msg }  = changePassword(parms);
+                console.log(code, data, msg);
+                if (code === 0) {
+                    localStorage.setItem("token", data.token);
+                    this.$router.replace({ name: 'mine' });
+                } else {
+                    throw new Error(msg);
+                }
+            } catch (error) {
+                console.log(error.message);
+            }
+        }
+    }
+};
+</script>
+
+<style scoped>
+</style>