forked from integrated_whb/integrated_whb_vue
131 lines
3.8 KiB
Vue
131 lines
3.8 KiB
Vue
<template>
|
|
<el-dialog
|
|
v-model="visible"
|
|
title="修改信息"
|
|
width="600px"
|
|
:before-close="fnClose"
|
|
>
|
|
<el-form :model="form" :rules="rules" label-width="100px" ref="formRef">
|
|
<el-form-item label="用户名" prop="USERNAME">
|
|
<el-input
|
|
v-model="form.USERNAME"
|
|
disabled
|
|
placeholder="默认用户手机号码..."
|
|
/>
|
|
</el-form-item>
|
|
<el-form-item label="新密码" prop="newpwd">
|
|
<el-input v-model="form.newpwd" type="password" autocomplete="off" />
|
|
</el-form-item>
|
|
<el-form-item label="确认密码" prop="newpassword1">
|
|
<el-input
|
|
v-model="form.newpassword1"
|
|
type="password"
|
|
autocomplete="off"
|
|
/>
|
|
</el-form-item>
|
|
<el-form-item label="姓名" prop="NAME">
|
|
<el-input v-model="form.NAME" placeholder="这里输入姓名..." />
|
|
</el-form-item>
|
|
<el-form-item label="邮箱" prop="EMAIL">
|
|
<el-input v-model="form.EMAIL" placeholder="这里输入邮箱..." />
|
|
</el-form-item>
|
|
<el-form-item label="备注" prop="BZ">
|
|
<el-input
|
|
:rows="3"
|
|
v-model="form.BZ"
|
|
type="textarea"
|
|
placeholder="这里输入备注..."
|
|
/>
|
|
</el-form-item>
|
|
</el-form>
|
|
<template #footer>
|
|
<el-button type="primary" @click="fnSubmit"> 确认修改 </el-button>
|
|
<el-button @click="fnClose">关闭</el-button>
|
|
</template>
|
|
</el-dialog>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { getVerifyDuplicateEmail, setUserInfo } from "@/request/api.js";
|
|
import { useVModels } from "@vueuse/core";
|
|
import { debounce } from "throttle-debounce";
|
|
import useFormValidate from "@/assets/js/useFormValidate.js";
|
|
import { ElMessage } from "element-plus";
|
|
import { useUserStore } from "@/pinia/user.js";
|
|
import { ref } from "vue";
|
|
|
|
const userStore = useUserStore();
|
|
const props = defineProps({
|
|
visible: {
|
|
type: Boolean,
|
|
required: true,
|
|
default: false,
|
|
},
|
|
form: {
|
|
type: Object,
|
|
required: true,
|
|
default: () => ({}),
|
|
},
|
|
});
|
|
const emits = defineEmits(["update:visible", "update:form"]);
|
|
const { visible, form } = useVModels(props, emits);
|
|
const formRef = ref(null);
|
|
const validatePass = (rule, value, callback) => {
|
|
if (form.value.newpwd && !value) {
|
|
callback(new Error("请再次输入新密码"));
|
|
} else if (form.value.newpwd && value && value !== form.value.newpwd) {
|
|
callback(new Error("两次输入密码不一致!"));
|
|
} else callback();
|
|
};
|
|
const validateEmail = async (rule, value, callback) => {
|
|
if (value) {
|
|
try {
|
|
await getVerifyDuplicateEmail({
|
|
EMAIL: value,
|
|
USERNAME: form.value.USERNAME,
|
|
});
|
|
callback();
|
|
} catch {
|
|
callback(new Error("邮箱重复"));
|
|
}
|
|
} else callback();
|
|
};
|
|
const rules = {
|
|
NAME: [{ required: true, message: "姓名不能为空", trigger: "blur" }],
|
|
EMAIL: [
|
|
{ required: false, message: "请输入邮箱", trigger: "blur" },
|
|
{
|
|
pattern: /^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+(.[a-zA-Z0-9_-])+/,
|
|
message: "请输入正确的邮箱",
|
|
},
|
|
{ validator: validateEmail, trigger: "blur" },
|
|
],
|
|
newpwd: [
|
|
{ required: false, message: "请输入新密码", trigger: "blur" },
|
|
{ min: 6, max: 18, message: "密码长度为6-18位", trigger: "blur" },
|
|
],
|
|
newpassword1: [{ required: false, validator: validatePass, trigger: "blur" }],
|
|
};
|
|
const fnSubmit = debounce(
|
|
1000,
|
|
async () => {
|
|
await useFormValidate(formRef);
|
|
await setUserInfo({
|
|
USER_ID: userStore.getUserInfo.USER_ID,
|
|
OPERATIONTYPE: "1",
|
|
...form.value,
|
|
PASSWORD: form.value.newpwd,
|
|
});
|
|
fnClose();
|
|
ElMessage.success("修改成功");
|
|
},
|
|
{ atBegin: true }
|
|
);
|
|
const fnClose = () => {
|
|
formRef.value.resetFields();
|
|
visible.value = false;
|
|
};
|
|
</script>
|
|
|
|
<style scoped lang="scss"></style>
|