update 修改页面代码 去除ele的引入以及vue的类型声明
This commit is contained in:
LiuHao
@ -55,11 +55,10 @@
|
||||
</template>
|
||||
|
||||
<script setup name="AuthRole" lang="ts">
|
||||
import { RoleVO } from '@/api/system/role/types';
|
||||
import { getAuthRole, updateAuthRole } from '@/api/system/user';
|
||||
import { UserForm } from '@/api/system/user/types';
|
||||
import { ElTable } from "element-plus";
|
||||
import { ComponentInternalInstance } from 'vue';
|
||||
import { RoleVO } from "@/api/system/role/types";
|
||||
import { getAuthRole, updateAuthRole } from "@/api/system/user";
|
||||
import { UserForm } from "@/api/system/user/types";
|
||||
|
||||
const route = useRoute();
|
||||
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
|
||||
|
||||
@ -70,58 +69,59 @@ const pageSize = ref(10);
|
||||
const roleIds = ref<Array<string | number>>([]);
|
||||
const roles = ref<RoleVO[]>([]);
|
||||
const form = ref<Partial<UserForm>>({
|
||||
nickName: undefined,
|
||||
userName: '',
|
||||
userId: undefined
|
||||
nickName: undefined,
|
||||
userName: "",
|
||||
userId: undefined
|
||||
});
|
||||
|
||||
const tableRef = ref(ElTable)
|
||||
const tableRef = ref<ElTableInstance>();
|
||||
|
||||
/** 单击选中行数据 */
|
||||
const clickRow = (row: RoleVO) => {
|
||||
tableRef.value.toggleRowSelection(row);
|
||||
// ele的方法有问题，selected应该为可选参数
|
||||
tableRef.value?.toggleRowSelection(row);
|
||||
};
|
||||
/** 多选框选中数据 */
|
||||
const handleSelectionChange = (selection: RoleVO[]) => {
|
||||
roleIds.value = selection.map(item => item.roleId);
|
||||
roleIds.value = selection.map(item => item.roleId);
|
||||
};
|
||||
/** 保存选中的数据编号 */
|
||||
const getRowKey = (row: RoleVO): string => {
|
||||
return String(row.roleId);
|
||||
return String(row.roleId);
|
||||
};
|
||||
/** 关闭按钮 */
|
||||
const close = () => {
|
||||
const obj = { path: "/system/user" };
|
||||
proxy?.$tab.closeOpenPage(obj);
|
||||
const obj = { path: "/system/user" };
|
||||
proxy?.$tab.closeOpenPage(obj);
|
||||
};
|
||||
/** 提交按钮 */
|
||||
const submitForm = async () => {
|
||||
const userId = form.value.userId;
|
||||
const rIds = roleIds.value.join(",");
|
||||
await updateAuthRole({ userId: userId as string, roleIds: rIds })
|
||||
proxy?.$modal.msgSuccess("授权成功");
|
||||
close();
|
||||
const userId = form.value.userId;
|
||||
const rIds = roleIds.value.join(",");
|
||||
await updateAuthRole({ userId: userId as string, roleIds: rIds });
|
||||
proxy?.$modal.msgSuccess("授权成功");
|
||||
close();
|
||||
};
|
||||
|
||||
const getList = async() => {
|
||||
const userId = route.params && route.params.userId;
|
||||
if (userId) {
|
||||
loading.value = true;
|
||||
const res = await getAuthRole(userId as string);
|
||||
Object.assign(form.value, res.data.user)
|
||||
Object.assign(roles.value, res.data.roles)
|
||||
total.value = roles.value.length;
|
||||
await nextTick(() => {
|
||||
roles.value.forEach(row => {
|
||||
if (row?.flag) {
|
||||
tableRef.value.toggleRowSelection(row);
|
||||
}
|
||||
});
|
||||
});
|
||||
loading.value = false;
|
||||
}
|
||||
}
|
||||
const getList = async () => {
|
||||
const userId = route.params && route.params.userId;
|
||||
if (userId) {
|
||||
loading.value = true;
|
||||
const res = await getAuthRole(userId as string);
|
||||
Object.assign(form.value, res.data.user);
|
||||
Object.assign(roles.value, res.data.roles);
|
||||
total.value = roles.value.length;
|
||||
await nextTick(() => {
|
||||
roles.value.forEach(row => {
|
||||
if (row?.flag) {
|
||||
tableRef.value?.toggleRowSelection(row, true);
|
||||
}
|
||||
});
|
||||
});
|
||||
loading.value = false;
|
||||
}
|
||||
};
|
||||
onMounted(() => {
|
||||
getList();
|
||||
})
|
||||
getList();
|
||||
});
|
||||
</script>
|
||||
|
||||
@ -297,30 +297,19 @@
|
||||
</template>
|
||||
|
||||
<script setup name="User" lang="ts">
|
||||
import {
|
||||
changeUserStatus,
|
||||
listUser,
|
||||
resetUserPwd,
|
||||
delUser,
|
||||
getUser,
|
||||
updateUser,
|
||||
addUser,
|
||||
deptTreeSelect
|
||||
} from "@/api/system/user"
|
||||
import api from "@/api/system/user"
|
||||
import { UserForm, UserQuery, UserVO } from '@/api/system/user/types';
|
||||
import { ComponentInternalInstance } from "vue";
|
||||
import { getToken } from "@/utils/auth";
|
||||
import { treeselect } from "@/api/system/dept";
|
||||
import { DeptVO } from "@/api/system/dept/types";
|
||||
import { RoleVO } from "@/api/system/role/types";
|
||||
import { PostVO } from "@/api/system/post/types";
|
||||
import { DateModelType, ElTree, ElUpload, UploadFile, ElForm } from 'element-plus';
|
||||
import { to } from "await-to-js";
|
||||
|
||||
const router = useRouter();
|
||||
const { proxy } = getCurrentInstance() as ComponentInternalInstance
|
||||
const { sys_normal_disable, sys_user_sex } = toRefs<any>(proxy?.useDict('sys_normal_disable', 'sys_user_sex'));
|
||||
|
||||
|
||||
const userList = ref<UserVO[]>();
|
||||
const loading = ref(true);
|
||||
const showSearch = ref(true)
|
||||
@ -361,10 +350,10 @@ const columns = ref<FieldOption[]>([
|
||||
])
|
||||
|
||||
|
||||
const deptTreeRef = ref(ElTree);
|
||||
const queryFormRef = ref(ElForm);
|
||||
const userFormRef = ref(ElForm);
|
||||
const uploadRef = ref(ElUpload);
|
||||
const deptTreeRef = ref<ElTreeInstance>();
|
||||
const queryFormRef = ref<ElFormInstance>();
|
||||
const userFormRef = ref<ElFormInstance>();
|
||||
const uploadRef = ref<ElUploadInstance>();
|
||||
|
||||
const dialog = reactive<DialogOption>({
|
||||
visible: false,
|
||||
@ -413,7 +402,7 @@ const filterNode = (value: string, data: any) => {
|
||||
}
|
||||
/** 根据名称筛选部门树 */
|
||||
watchEffect(
|
||||
() => {deptTreeRef.value.filter(deptName.value);},
|
||||
() => {deptTreeRef.value?.filter(deptName.value);},
|
||||
{
|
||||
flush: 'post' // watchEffect会在DOM挂载或者更新之前就会触发，此属性控制在DOM元素更新后运行
|
||||
}
|
||||
@ -421,14 +410,14 @@ watchEffect(
|
||||
|
||||
/** 查询部门下拉树结构 */
|
||||
const getTreeSelect = async () => {
|
||||
const res = await deptTreeSelect();
|
||||
const res = await api.deptTreeSelect();
|
||||
deptOptions.value = res.data;
|
||||
};
|
||||
|
||||
/** 查询用户列表 */
|
||||
const getList = async () => {
|
||||
loading.value = true;
|
||||
const res = await listUser(proxy?.addDateRange(queryParams.value, dateRange.value));
|
||||
const res = await api.listUser(proxy?.addDateRange(queryParams.value, dateRange.value));
|
||||
loading.value = false;
|
||||
userList.value = res.rows;
|
||||
total.value = res.total;
|
||||
@ -449,10 +438,10 @@ const handleQuery = () => {
|
||||
/** 重置按钮操作 */
|
||||
const resetQuery = () => {
|
||||
dateRange.value = ['','']
|
||||
queryFormRef.value.resetFields();
|
||||
queryFormRef.value?.resetFields();
|
||||
queryParams.value.pageNum = 1;
|
||||
queryParams.value.deptId = undefined;
|
||||
deptTreeRef.value.setCurrentKey(null);
|
||||
deptTreeRef.value?.setCurrentKey(undefined);
|
||||
handleQuery();
|
||||
}
|
||||
|
||||
@ -461,7 +450,7 @@ const handleDelete = async (row?: UserVO) => {
|
||||
const userIds = row?.userId || ids.value;
|
||||
const [err] = await to(proxy?.$modal.confirm('是否确认删除用户编号为"' + userIds + '"的数据项？') as any);
|
||||
if (!err) {
|
||||
await delUser(userIds);
|
||||
await api.delUser(userIds);
|
||||
await getList();
|
||||
proxy?.$modal.msgSuccess("删除成功");
|
||||
}
|
||||
@ -472,7 +461,7 @@ const handleStatusChange = async (row: UserVO) => {
|
||||
let text = row.status === "0" ? "启用" : "停用"
|
||||
try {
|
||||
await proxy?.$modal.confirm('确认要"' + text + '""' + row.userName + '"用户吗?');
|
||||
await changeUserStatus(row.userId, row.status);
|
||||
await api.changeUserStatus(row.userId, row.status);
|
||||
proxy?.$modal.msgSuccess(text + "成功");
|
||||
} catch (err) {
|
||||
row.status = row.status === "0" ? "1" : "0";
|
||||
@ -494,7 +483,7 @@ const handleResetPwd = async (row: UserVO) => {
|
||||
inputErrorMessage: "用户密码长度必须介于 5 和 20 之间",
|
||||
}))
|
||||
if (!err) {
|
||||
await resetUserPwd(row.userId, res.value);
|
||||
await api.resetUserPwd(row.userId, res.value);
|
||||
proxy?.$modal.msgSuccess("修改成功，新密码是：" + res.value);
|
||||
}
|
||||
}
|
||||
@ -531,14 +520,14 @@ const handleFileUploadProgress = () => {
|
||||
const handleFileSuccess = (response: any, file: UploadFile) => {
|
||||
upload.open = false;
|
||||
upload.isUploading = false;
|
||||
uploadRef.value.handleRemove(file);
|
||||
uploadRef.value?.handleRemove(file);
|
||||
ElMessageBox.alert("<div style='overflow: auto;overflow-x: hidden;max-height: 70vh;padding: 10px 20px 0;'>" + response.msg + "</div>", "导入结果", { dangerouslyUseHTMLString: true });
|
||||
getList();
|
||||
}
|
||||
|
||||
/** 提交上传文件 */
|
||||
function submitFileForm() {
|
||||
uploadRef.value.submit();
|
||||
uploadRef.value?.submit();
|
||||
}
|
||||
|
||||
/** 初始化部门数据 */
|
||||
@ -554,7 +543,7 @@ const initTreeData = async () => {
|
||||
/** 重置操作表单 */
|
||||
const reset = () => {
|
||||
form.value = { ...initFormData };
|
||||
userFormRef.value.resetFields();
|
||||
userFormRef.value?.resetFields();
|
||||
}
|
||||
/** 取消按钮 */
|
||||
const cancel = () => {
|
||||
@ -569,7 +558,7 @@ const handleAdd = () => {
|
||||
nextTick(async () => {
|
||||
reset();
|
||||
await initTreeData();
|
||||
const { data } = await getUser();
|
||||
const { data } = await api.getUser();
|
||||
postOptions.value = data.posts;
|
||||
roleOptions.value = data.roles;
|
||||
form.value.password = initPassword.value;
|
||||
@ -583,7 +572,7 @@ const handleUpdate = (row?: UserForm) => {
|
||||
reset();
|
||||
await initTreeData();
|
||||
const userId = row?.userId || ids.value[0]
|
||||
const { data } = await getUser(userId)
|
||||
const { data } = await api.getUser(userId)
|
||||
Object.assign(form.value, data.user);
|
||||
postOptions.value = data.posts;
|
||||
roleOptions.value = data.roles;
|
||||
@ -596,9 +585,9 @@ const handleUpdate = (row?: UserForm) => {
|
||||
|
||||
/** 提交按钮 */
|
||||
const submitForm = () => {
|
||||
userFormRef.value.validate(async (valid: boolean) => {
|
||||
userFormRef.value?.validate(async (valid: boolean) => {
|
||||
if (valid) {
|
||||
form.value.userId ? await updateUser(form.value) : await addUser(form.value);
|
||||
form.value.userId ? await api.updateUser(form.value) : await api.addUser(form.value);
|
||||
proxy?.$modal.msgSuccess("操作成功");
|
||||
dialog.visible = false;
|
||||
await getList();
|
||||
@ -619,8 +608,8 @@ const closeDialog = () => {
|
||||
* 重置表单
|
||||
*/
|
||||
const resetForm = () => {
|
||||
userFormRef.value.resetFields();
|
||||
userFormRef.value.clearValidate();
|
||||
userFormRef.value?.resetFields();
|
||||
userFormRef.value?.clearValidate();
|
||||
|
||||
form.value.id = undefined;
|
||||
form.value.status = '1';
|
||||
|
||||
@ -69,7 +69,7 @@ import resetPwd from "./resetPwd.vue";
|
||||
import { getUserProfile } from "@/api/system/user";
|
||||
|
||||
const activeTab = ref("userinfo");
|
||||
const state = ref<{ user: any; roleGroup: string; postGroup: string}>({
|
||||
const state = ref<Record<string, any>>({
|
||||
user: {},
|
||||
roleGroup: '',
|
||||
postGroup: ''
|
||||
|
||||
@ -17,46 +17,50 @@
|
||||
</template>
|
||||
|
||||
<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';
|
||||
import { updateUserPwd } from "@/api/system/user";
|
||||
import type { ResetPwdForm } from "@/api/system/user/types";
|
||||
|
||||
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
|
||||
|
||||
|
||||
const pwdRef = ref(ElForm);
|
||||
|
||||
const pwdRef = ref<ElFormInstance>();
|
||||
const user = ref<ResetPwdForm>({
|
||||
oldPassword: '',
|
||||
newPassword: '',
|
||||
confirmPassword: ''
|
||||
oldPassword: "",
|
||||
newPassword: "",
|
||||
confirmPassword: ""
|
||||
});
|
||||
|
||||
const equalToPassword = (rule: any, value: string, callback: any) => {
|
||||
if (user.value.newPassword !== value) {
|
||||
callback(new Error("两次输入的密码不一致"));
|
||||
} else {
|
||||
callback();
|
||||
}
|
||||
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"
|
||||
}]
|
||||
});
|
||||
|
||||
/** 提交按钮 */
|
||||
const submit = () => {
|
||||
pwdRef.value.validate(async (valid: boolean) => {
|
||||
if (valid) {
|
||||
await updateUserPwd(user.value.oldPassword, user.value.newPassword)
|
||||
proxy?.$modal.msgSuccess("修改成功");
|
||||
}
|
||||
});
|
||||
pwdRef.value?.validate(async (valid: boolean) => {
|
||||
if (valid) {
|
||||
await updateUserPwd(user.value.oldPassword, user.value.newPassword);
|
||||
proxy?.$modal.msgSuccess("修改成功");
|
||||
}
|
||||
});
|
||||
};
|
||||
/** 关闭按钮 */
|
||||
const close = () => {
|
||||
proxy?.$tab.closePage();
|
||||
proxy?.$tab.closePage();
|
||||
};
|
||||
</script>
|
||||
|
||||
@ -29,7 +29,9 @@
|
||||
<el-upload action="#" :http-request="requestUpload" :show-file-list="false" :before-upload="beforeUpload">
|
||||
<el-button>
|
||||
选择
|
||||
<el-icon class="el-icon--right"><Upload /></el-icon>
|
||||
<el-icon class="el-icon--right">
|
||||
<Upload />
|
||||
</el-icon>
|
||||
</el-button>
|
||||
</el-upload>
|
||||
</el-col>
|
||||
@ -58,18 +60,17 @@ import "vue-cropper/dist/index.css";
|
||||
import { VueCropper } from "vue-cropper";
|
||||
import { uploadAvatar } from "@/api/system/user";
|
||||
import useUserStore from "@/store/modules/user";
|
||||
import { ComponentInternalInstance } from "vue";
|
||||
|
||||
interface Options {
|
||||
img: string | ArrayBuffer | null // 裁剪图片的地址
|
||||
autoCrop: boolean // 是否默认生成截图框
|
||||
autoCropWidth: number // 默认生成截图框宽度
|
||||
autoCropHeight: number // 默认生成截图框高度
|
||||
fixedBox: boolean // 固定截图框大小 不允许改变
|
||||
fileName: string
|
||||
previews: any // 预览数据
|
||||
outputType: string
|
||||
visible: boolean
|
||||
img: string | ArrayBuffer | null; // 裁剪图片的地址
|
||||
autoCrop: boolean; // 是否默认生成截图框
|
||||
autoCropWidth: number; // 默认生成截图框宽度
|
||||
autoCropHeight: number; // 默认生成截图框高度
|
||||
fixedBox: boolean; // 固定截图框大小 不允许改变
|
||||
fileName: string;
|
||||
previews: any; // 预览数据
|
||||
outputType: string;
|
||||
visible: boolean;
|
||||
}
|
||||
|
||||
|
||||
@ -83,75 +84,76 @@ const title = ref("修改头像");
|
||||
const cropper = ref<any>({});
|
||||
//图片裁剪数据
|
||||
const options = reactive<Options>({
|
||||
img: userStore.avatar,
|
||||
autoCrop: true,
|
||||
autoCropWidth: 200,
|
||||
autoCropHeight: 200,
|
||||
fixedBox: true,
|
||||
outputType: "png",
|
||||
fileName: '',
|
||||
previews: {},
|
||||
visible: false
|
||||
img: userStore.avatar,
|
||||
autoCrop: true,
|
||||
autoCropWidth: 200,
|
||||
autoCropHeight: 200,
|
||||
fixedBox: true,
|
||||
outputType: "png",
|
||||
fileName: "",
|
||||
previews: {},
|
||||
visible: false
|
||||
});
|
||||
|
||||
/** 编辑头像 */
|
||||
const editCropper = () => {
|
||||
open.value = true;
|
||||
}
|
||||
open.value = true;
|
||||
};
|
||||
/** 打开弹出层结束时的回调 */
|
||||
const modalOpened = () => {
|
||||
visible.value = true;
|
||||
}
|
||||
visible.value = true;
|
||||
};
|
||||
/** 覆盖默认上传行为 */
|
||||
const requestUpload = (): any => {}
|
||||
const requestUpload = (): any => {
|
||||
};
|
||||
/** 向左旋转 */
|
||||
const rotateLeft = () => {
|
||||
cropper.value.rotateLeft();
|
||||
}
|
||||
cropper.value.rotateLeft();
|
||||
};
|
||||
/** 向右旋转 */
|
||||
const rotateRight = () => {
|
||||
cropper.value.rotateRight();
|
||||
}
|
||||
cropper.value.rotateRight();
|
||||
};
|
||||
/** 图片缩放 */
|
||||
const changeScale = (num: number) => {
|
||||
num = num || 1;
|
||||
cropper.value.changeScale(num);
|
||||
}
|
||||
num = num || 1;
|
||||
cropper.value.changeScale(num);
|
||||
};
|
||||
/** 上传预处理 */
|
||||
const beforeUpload = (file: any) => {
|
||||
if (file.type.indexOf("image/") == -1) {
|
||||
proxy?.$modal.msgError("文件格式错误，请上传图片类型,如：JPG，PNG后缀的文件。");
|
||||
} else {
|
||||
const reader = new FileReader();
|
||||
reader.readAsDataURL(file);
|
||||
reader.onload = () => {
|
||||
options.img = reader.result;
|
||||
options.fileName = file.name;
|
||||
};
|
||||
}
|
||||
}
|
||||
if (file.type.indexOf("image/") == -1) {
|
||||
proxy?.$modal.msgError("文件格式错误，请上传图片类型,如：JPG，PNG后缀的文件。");
|
||||
} else {
|
||||
const reader = new FileReader();
|
||||
reader.readAsDataURL(file);
|
||||
reader.onload = () => {
|
||||
options.img = reader.result;
|
||||
options.fileName = file.name;
|
||||
};
|
||||
}
|
||||
};
|
||||
/** 上传图片 */
|
||||
const uploadImg = async () => {
|
||||
cropper.value.getCropBlob(async (data: any) => {
|
||||
let formData = new FormData();
|
||||
formData.append("avatarfile", data, options.fileName);
|
||||
const res = await uploadAvatar(formData);
|
||||
open.value = false;
|
||||
options.img = res.data.imgUrl;
|
||||
userStore.avatar = options.img as string;
|
||||
proxy?.$modal.msgSuccess("修改成功");
|
||||
visible.value = false;
|
||||
});
|
||||
}
|
||||
cropper.value.getCropBlob(async (data: any) => {
|
||||
let formData = new FormData();
|
||||
formData.append("avatarfile", data, options.fileName);
|
||||
const res = await uploadAvatar(formData);
|
||||
open.value = false;
|
||||
options.img = res.data.imgUrl;
|
||||
userStore.avatar = options.img as string
|
||||
proxy?.$modal.msgSuccess("修改成功");
|
||||
visible.value = false;
|
||||
});
|
||||
};
|
||||
/** 实时预览 */
|
||||
const realTime = (data: any) => {
|
||||
options.previews = data;
|
||||
}
|
||||
options.previews = data;
|
||||
};
|
||||
/** 关闭窗口 */
|
||||
const closeDialog = () => {
|
||||
options.img = userStore.avatar;
|
||||
options.visible = false;
|
||||
}
|
||||
options.img = userStore.avatar;
|
||||
options.visible = false;
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
|
||||
@ -24,40 +24,42 @@
|
||||
|
||||
<script setup lang="ts">
|
||||
import { updateUserProfile } from "@/api/system/user";
|
||||
import { FormRules } from "element-plus";
|
||||
import { ComponentInternalInstance } from "vue";
|
||||
import { PropType } from "vue";
|
||||
import { ElForm } from "element-plus";
|
||||
|
||||
const props = defineProps({
|
||||
user: {
|
||||
type: Object as PropType<any>,
|
||||
}
|
||||
user: {
|
||||
type: Object as PropType<any>,
|
||||
required: true
|
||||
}
|
||||
});
|
||||
const userForm = computed(() => props.user);
|
||||
|
||||
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
|
||||
|
||||
const userRef = ref(ElForm);
|
||||
|
||||
const rules = ref<FormRules>({
|
||||
nickName: [{ required: true, message: "用户昵称不能为空", trigger: "blur" }],
|
||||
email: [{ required: true, message: "邮箱地址不能为空", trigger: "blur" }, { type: "email", message: "请输入正确的邮箱地址", trigger: ["blur", "change"] }],
|
||||
phonenumber: [{ required: true, message: "手机号码不能为空", trigger: "blur" }, { pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/, message: "请输入正确的手机号码", trigger: "blur" }],
|
||||
const userRef = ref<ElFormInstance>();
|
||||
const rules = ref<ElFormRules>({
|
||||
nickName: [{ required: true, message: "用户昵称不能为空", trigger: "blur" }],
|
||||
email: [{ required: true, message: "邮箱地址不能为空", trigger: "blur" }, {
|
||||
type: "email",
|
||||
message: "请输入正确的邮箱地址",
|
||||
trigger: ["blur", "change"]
|
||||
}],
|
||||
phonenumber: [{
|
||||
required: true,
|
||||
message: "手机号码不能为空",
|
||||
trigger: "blur"
|
||||
}, { pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/, message: "请输入正确的手机号码", trigger: "blur" }]
|
||||
});
|
||||
|
||||
|
||||
/** 提交按钮 */
|
||||
const submit = () => {
|
||||
userRef.value.validate(async (valid: boolean) => {
|
||||
if (valid) {
|
||||
await updateUserProfile(props.user)
|
||||
proxy?.$modal.msgSuccess("修改成功");
|
||||
}
|
||||
});
|
||||
userRef.value?.validate(async (valid: boolean) => {
|
||||
if (valid) {
|
||||
await updateUserProfile(props.user);
|
||||
proxy?.$modal.msgSuccess("修改成功");
|
||||
}
|
||||
});
|
||||
};
|
||||
/** 关闭按钮 */
|
||||
const close = () => {
|
||||
proxy?.$tab.closePage();
|
||||
proxy?.$tab.closePage();
|
||||
};
|
||||
</script>
|
||||
|
||||
Reference in New Issue
Block a user