From c65536ee6fbda877e9476e7421d851900e6a76b6 Mon Sep 17 00:00:00 2001 From: 疯狂的狮子li <15040126243@163.com> Date: 星期四, 06 四月 2023 11:19:31 +0800 Subject: [PATCH] update 优化弹窗后导航栏偏移的问题(I3YMWW) --- src/views/system/user/profile/resetPwd.vue | 83 ++++++++++++++++++++++------------------- 1 files changed, 44 insertions(+), 39 deletions(-) diff --git a/src/views/system/user/profile/resetPwd.vue b/src/views/system/user/profile/resetPwd.vue index dec2d79..174e020 100644 --- a/src/views/system/user/profile/resetPwd.vue +++ b/src/views/system/user/profile/resetPwd.vue @@ -1,57 +1,62 @@ <template> - <el-form ref="pwdRef" :model="user" :rules="rules" label-width="80px"> - <el-form-item label="鏃у瘑鐮�" prop="oldPassword"> - <el-input v-model="user.oldPassword" placeholder="璇疯緭鍏ユ棫瀵嗙爜" type="password" show-password /> - </el-form-item> - <el-form-item label="鏂板瘑鐮�" prop="newPassword"> - <el-input v-model="user.newPassword" placeholder="璇疯緭鍏ユ柊瀵嗙爜" type="password" show-password /> - </el-form-item> - <el-form-item label="纭瀵嗙爜" prop="confirmPassword"> - <el-input v-model="user.confirmPassword" placeholder="璇风‘璁ゆ柊瀵嗙爜" type="password" show-password/> - </el-form-item> - <el-form-item> + <el-form ref="pwdRef" :model="user" :rules="rules" label-width="80px"> + <el-form-item label="鏃у瘑鐮�" prop="oldPassword"> + <el-input v-model="user.oldPassword" placeholder="璇疯緭鍏ユ棫瀵嗙爜" type="password" show-password /> + </el-form-item> + <el-form-item label="鏂板瘑鐮�" prop="newPassword"> + <el-input v-model="user.newPassword" placeholder="璇疯緭鍏ユ柊瀵嗙爜" type="password" show-password /> + </el-form-item> + <el-form-item label="纭瀵嗙爜" prop="confirmPassword"> + <el-input v-model="user.confirmPassword" placeholder="璇风‘璁ゆ柊瀵嗙爜" type="password" show-password /> + </el-form-item> + <el-form-item> <el-button type="primary" @click="submit">淇濆瓨</el-button> <el-button type="danger" @click="close">鍏抽棴</el-button> - </el-form-item> - </el-form> + </el-form-item> + </el-form> </template> -<script setup> -import { updateUserPwd } from "@/api/system/user"; +<script setup lang="ts"> +import { updateUserPwd } from '@/api/system/user'; +import { ComponentInternalInstance } from 'vue'; +import { ResetPwdForm } from '@/api/system/user/types' +import { ElForm } from 'element-plus'; -const { proxy } = getCurrentInstance(); +const { proxy } = getCurrentInstance() as ComponentInternalInstance; -const user = reactive({ - oldPassword: undefined, - newPassword: undefined, - confirmPassword: undefined + +const pwdRef = ref(ElForm); + +const user = ref<ResetPwdForm>({ + oldPassword: '', + newPassword: '', + confirmPassword: '' }); -const equalToPassword = (rule, value, callback) => { - if (user.newPassword !== value) { - callback(new Error("涓ゆ杈撳叆鐨勫瘑鐮佷笉涓�鑷�")); - } else { - callback(); - } +const equalToPassword = (rule: any, value: string, callback: any) => { + if (user.value.newPassword !== value) { + callback(new Error("涓ゆ杈撳叆鐨勫瘑鐮佷笉涓�鑷�")); + } else { + callback(); + } }; const rules = ref({ - oldPassword: [{ required: true, message: "鏃у瘑鐮佷笉鑳戒负绌�", trigger: "blur" }], - newPassword: [{ required: true, message: "鏂板瘑鐮佷笉鑳戒负绌�", trigger: "blur" }, { min: 6, max: 20, message: "闀垮害鍦� 6 鍒� 20 涓瓧绗�", trigger: "blur" }], - confirmPassword: [{ required: true, message: "纭瀵嗙爜涓嶈兘涓虹┖", trigger: "blur" }, { required: true, validator: equalToPassword, trigger: "blur" }] + oldPassword: [{ required: true, message: "鏃у瘑鐮佷笉鑳戒负绌�", trigger: "blur" }], + newPassword: [{ required: true, message: "鏂板瘑鐮佷笉鑳戒负绌�", trigger: "blur" }, { min: 6, max: 20, message: "闀垮害鍦� 6 鍒� 20 涓瓧绗�", trigger: "blur" }], + confirmPassword: [{ required: true, message: "纭瀵嗙爜涓嶈兘涓虹┖", trigger: "blur" }, { required: true, validator: equalToPassword, trigger: "blur" }] }); /** 鎻愪氦鎸夐挳 */ -function submit() { - proxy.$refs.pwdRef.validate(valid => { - if (valid) { - updateUserPwd(user.oldPassword, user.newPassword).then(response => { - proxy.$modal.msgSuccess("淇敼鎴愬姛"); - }); - } - }); +const submit = () => { + pwdRef.value.validate(async (valid: boolean) => { + if (valid) { + await updateUserPwd(user.value.oldPassword, user.value.newPassword) + proxy?.$modal.msgSuccess("淇敼鎴愬姛"); + } + }); }; /** 鍏抽棴鎸夐挳 */ -function close() { - proxy.$tab.closePage(); +const close = () => { + proxy?.$tab.closePage(); }; </script> -- Gitblit v1.9.3