fix: 修复挂账按订单支付还款传参问题，增加修改密功能

src/layout/components/NavBar/components/UserProfile.vue

@@ -8,18 +8,71 @@
     <template #dropdown>
       <el-dropdown-menu>
         <el-dropdown-item @click="handleOpenUserProfile">店铺配置</el-dropdown-item>
-        <el-dropdown-item divided>修改密码</el-dropdown-item>
+        <el-dropdown-item divided @click="dialogVisible = true">修改密码</el-dropdown-item>
         <el-dropdown-item divided @click="logout">退出登录</el-dropdown-item>
       </el-dropdown-menu>
     </template>
   </el-dropdown>
+  <el-dialog
+    title="修改密码"
+    modal-append-to-body
+    append-to-body
+    v-model="dialogVisible"
+    width="400px"
+  >
+    <el-form ref="refForm" :model="form" :rules="rules">
+      <el-form-item label="旧密码" prop="oldPass">
+        <el-input :type="ip1Type" v-model="form.oldPass" placeholder="请输入旧密码">
+          <template #suffix>
+            <i
+              :class="`el-input__icon ${
+                ip1Type == 'text' ? 'el-icon-view' : 'el-icon-remove-outline'
+              }`"
+              @click.stop="changeInputType('ip1Type')"
+            ></i>
+          </template>
+        </el-input>
+      </el-form-item>
+      <el-form-item label="新密码" prop="newPass">
+        <el-input :type="ip2Type" v-model="form.newPass" placeholder="请输入新密码">
+          <template #suffix>
+            <i
+              :class="`el-input__icon ${
+                ip2Type == 'text' ? 'el-icon-view' : 'el-icon-remove-outline'
+              }`"
+              @click.stop="changeInputType('ip2Type')"
+            ></i>
+          </template>
+        </el-input>
+      </el-form-item>
+      <el-form-item label="确认新密码" prop="rnewPass">
+        <el-input :type="ip3Type" v-model="form.rnewPass" placeholder="请再次输入新密码">
+          <template #suffix>
+            <i
+              :class="`el-input__icon ${
+                ip3Type == 'text' ? 'el-icon-view' : 'el-icon-remove-outline'
+              }`"
+              @click.stop="changeInputType('ip3Type')"
+            ></i>
+          </template>
+        </el-input>
+      </el-form-item>
+    </el-form>
+    <template #footer>
+      <span class="dialog-footer">
+        <el-button @click="dialogVisible = false">取 消</el-button>
+        <el-button type="primary" :loading="formLoading" @click="submitHandle">确 定</el-button>
+      </span>
+    </template>
+  </el-dialog>
 </template>
 
 <script setup lang="ts">
+import sysUser from "@/api/account/sysUser";
 defineOptions({
   name: "UserProfile",
 });
-
+import { ElNotification } from "element-plus";
 import { useTagsViewStore, useUserStore } from "@/store";
 
 const tagsViewStore = useTagsViewStore();
@@ -28,6 +81,89 @@ const userStore = useUserStore();
 const route = useRoute();
 const router = useRouter();
 
+const dialogVisible = ref(false);
+const formLoading = ref(false);
+
+const state = reactive({
+  ip1Type: "password",
+  ip2Type: "password",
+  ip3Type: "password",
+});
+const { ip1Type, ip2Type, ip3Type } = toRefs(state);
+const form = reactive({
+  oldPass: "",
+  newPass: "",
+  rnewPass: "",
+});
+// 修改密码框类型
+function changeInputType(key: "ip1Type" | "ip2Type" | "ip3Type") {
+  if (state[key] == "text") {
+    state[key] = "password";
+  } else {
+    state[key] = "text";
+  }
+}
+const validateNewPass = (rule: any, value: string, callback: (error?: Error) => void) => {
+  if (!form.newPass) {
+    callback(new Error(" "));
+  } else if (form.newPass === form.oldPass) {
+    callback(new Error("请输入与旧密码不同的新密码"));
+  } else {
+    callback();
+  }
+};
+const validateRnewPass = (rule: any, value: string, callback: (error?: Error) => void) => {
+  if (!form.rnewPass) {
+    callback(new Error(" "));
+  } else if (form.rnewPass !== form.newPass) {
+    callback(new Error("两次密码输入不一致"));
+  } else {
+    callback();
+  }
+};
+const rules = {
+  oldPass: [
+    {
+      required: true,
+      message: " ",
+      trigger: "blur",
+    },
+  ],
+  newPass: [
+    {
+      required: true,
+      validator: validateNewPass,
+      trigger: "blur",
+    },
+  ],
+  rnewPass: [
+    {
+      required: true,
+      validator: validateRnewPass,
+      trigger: "blur",
+    },
+  ],
+};
+const refForm = ref();
+// 提交修改密码
+function submitHandle() {
+  refForm.value.validate(async (vaild: boolean) => {
+    if (vaild) {
+      try {
+        formLoading.value = true;
+        const res = await sysUser.pwd({
+          originalPassword: form.oldPass,
+          checkPassword: form.newPass,
+          password: form.newPass,
+        });
+        ElNotification.success("修改成功，请重新登陆");
+      } catch (error) {
+        formLoading.value = false;
+        console.log(error);
+      }
+    }
+  });
+}
 /**
  * 打开个人中心页面
  */