From 992340e487ebd57106e55492ca48b3f71f6545d8 Mon Sep 17 00:00:00 2001 From: "Ray.Hao" <1490493387@qq.com> Date: Tue, 3 Mar 2026 22:21:52 +0800 Subject: [PATCH] =?UTF-8?q?refactor:=20=E7=BB=9F=E4=B8=80=E9=87=8D?= =?UTF-8?q?=E5=91=BD=E5=90=8D=20dialog=20=E7=8A=B6=E6=80=81=E5=8F=98?= =?UTF-8?q?=E9=87=8F=E4=B8=BA=20dialogState?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/views/codegen/index.vue | 18 +- src/views/profile/index.vue | 50 ++-- src/views/system/config/index.vue | 126 ++++---- src/views/system/dept/index.vue | 152 +++++----- src/views/system/dict/dict-item.vue | 127 ++++---- src/views/system/dict/index.vue | 152 +++++----- src/views/system/log/index.vue | 35 ++- src/views/system/menu/index.vue | 162 +++++----- src/views/system/notice/index.vue | 193 ++++++------ src/views/system/role/index.vue | 211 +++++++------ src/views/system/tenant/index.vue | 235 ++++++++------- src/views/system/tenant/plan.vue | 146 +++++---- .../system/user/components/UserDeptTree.vue | 20 +- .../user/components/UserImportDialog.vue | 76 +++-- src/views/system/user/index.vue | 276 ++++++++---------- 15 files changed, 1096 insertions(+), 883 deletions(-) diff --git a/src/views/codegen/index.vue b/src/views/codegen/index.vue index a302e15f..75143091 100644 --- a/src/views/codegen/index.vue +++ b/src/views/codegen/index.vue @@ -87,10 +87,10 @@ @@ -603,7 +603,7 @@ const genConfigFormRules = { entityName: [{ required: true, message: "请输入实体名", trigger: "blur" }], }; -const dialog = reactive({ +const dialogState = reactive({ visible: false, title: "", }); @@ -684,7 +684,7 @@ watch(active, (val) => { }); watch( - () => dialog.visible, + () => dialogState.visible, (visible) => { if (!visible) { destroySort(); @@ -841,7 +841,7 @@ function handleResetQuery() { /** 打开弹窗 */ async function handleOpenDialog(tableName: string) { - dialog.visible = true; + dialogState.visible = true; active.value = 0; currentTableName.value = tableName; loading.value = true; @@ -854,7 +854,7 @@ async function handleOpenDialog(tableName: string) { menuOptions.value = menuList; dictOptions.value = dictList; - dialog.title = `${tableName} 代码生成`; + dialogState.title = `${tableName} 代码生成`; genConfigFormData.value = config; checkAllSelected("isShowInQuery", isCheckAllQuery); @@ -867,7 +867,7 @@ async function handleOpenDialog(tableName: string) { } } catch { ElMessage.error("获取生成配置失败"); - dialog.visible = false; + dialogState.visible = false; } finally { loading.value = false; } @@ -912,7 +912,7 @@ async function handlePreview(tableName: string) { (genConfigFormData.value.pageType as any) || "classic", frontendType ); - dialog.title = `代码生成 ${tableName}`; + dialogState.title = `代码生成 ${tableName}`; const previewList = data || []; const typeOptions = Array.from( new Set( diff --git a/src/views/profile/index.vue b/src/views/profile/index.vue index 625cc00a..738ad3e6 100644 --- a/src/views/profile/index.vue +++ b/src/views/profile/index.vue @@ -162,10 +162,10 @@ - + { * @param type 弹窗类型 ACCOUNT: 账号资料 PASSWORD: 修改密码 MOBILE: 绑定手机 EMAIL: 绑定邮箱 */ const handleOpenDialog = (type: DialogType) => { - dialog.type = type; - dialog.visible = true; + dialogState.type = type; + dialogState.visible = true; switch (type) { case DialogType.ACCOUNT: - dialog.title = "账号资料"; + dialogState.title = "账号资料"; // 初始化表单数据 userProfileForm.nickname = userProfile.value.nickname; userProfileForm.avatar = userProfile.value.avatar; userProfileForm.gender = userProfile.value.gender; break; case DialogType.PASSWORD: - dialog.title = "修改密码"; + dialogState.title = "修改密码"; break; case DialogType.MOBILE: - dialog.title = userProfile.value.mobile ? "更换手机号" : "绑定手机号"; + dialogState.title = userProfile.value.mobile ? "更换手机号" : "绑定手机号"; mobileUpdateForm.mobile = ""; mobileUpdateForm.code = ""; mobileUpdateForm.password = ""; break; case DialogType.EMAIL: - dialog.title = userProfile.value.email ? "更换邮箱" : "绑定邮箱"; + dialogState.title = userProfile.value.email ? "更换邮箱" : "绑定邮箱"; emailUpdateForm.email = ""; emailUpdateForm.code = ""; emailUpdateForm.password = ""; @@ -524,36 +524,36 @@ function handleSendEmailCode() { */ const handleSubmit = async () => { try { - if (dialog.type === DialogType.ACCOUNT) { + if (dialogState.type === DialogType.ACCOUNT) { const valid = await userProfileFormRef.value?.validate(); if (!valid) return; await UserAPI.updateProfile(userProfileForm); ElMessage.success("账号资料修改成功"); - dialog.visible = false; + dialogState.visible = false; await loadUserProfile(); - } else if (dialog.type === DialogType.PASSWORD) { + } else if (dialogState.type === DialogType.PASSWORD) { const valid = await passwordChangeFormRef.value?.validate(); if (!valid) return; await UserAPI.changePassword(passwordChangeForm); - dialog.visible = false; + dialogState.visible = false; await redirectToLogin("密码已修改,请重新登录"); - } else if (dialog.type === DialogType.MOBILE) { + } else if (dialogState.type === DialogType.MOBILE) { const valid = await mobileBindingFormRef.value?.validate(); if (!valid) return; await UserAPI.bindOrChangeMobile(mobileUpdateForm); ElMessage.success(userProfile.value.mobile ? "手机号更换成功" : "手机号绑定成功"); - dialog.visible = false; + dialogState.visible = false; await loadUserProfile(); - } else if (dialog.type === DialogType.EMAIL) { + } else if (dialogState.type === DialogType.EMAIL) { const valid = await emailBindingFormRef.value?.validate(); if (!valid) return; await UserAPI.bindOrChangeEmail(emailUpdateForm); ElMessage.success(userProfile.value.email ? "邮箱更换成功" : "邮箱绑定成功"); - dialog.visible = false; + dialogState.visible = false; await loadUserProfile(); } } catch { @@ -565,14 +565,14 @@ const handleSubmit = async () => { * 取消 */ const handleCancel = () => { - dialog.visible = false; - if (dialog.type === DialogType.ACCOUNT) { + dialogState.visible = false; + if (dialogState.type === DialogType.ACCOUNT) { userProfileFormRef.value?.resetFields(); - } else if (dialog.type === DialogType.PASSWORD) { + } else if (dialogState.type === DialogType.PASSWORD) { passwordChangeFormRef.value?.resetFields(); - } else if (dialog.type === DialogType.MOBILE) { + } else if (dialogState.type === DialogType.MOBILE) { mobileBindingFormRef.value?.resetFields(); - } else if (dialog.type === DialogType.EMAIL) { + } else if (dialogState.type === DialogType.EMAIL) { emailBindingFormRef.value?.resetFields(); } }; diff --git a/src/views/system/config/index.vue b/src/views/system/config/index.vue index 86c6a699..c12be097 100644 --- a/src/views/system/config/index.vue +++ b/src/views/system/config/index.vue @@ -1,7 +1,5 @@ - @@ -143,30 +140,33 @@ defineOptions({ import ConfigAPI from "@/api/system/config"; import type { ConfigItem, ConfigForm, ConfigQueryParams } from "@/types/api"; -import { ElMessage, ElMessageBox } from "element-plus"; +import { ElMessage, ElMessageBox, type FormInstance, type FormRules } from "element-plus"; import { useDebounceFn } from "@vueuse/core"; -const queryFormRef = ref(); -const dataFormRef = ref(); - -const loading = ref(false); -const selectIds = ref([]); -const total = ref(0); +// 表单引用 +const queryFormRef = ref(); +const dataFormRef = ref(); +// 查询参数 const queryParams = reactive({ pageNum: 1, pageSize: 10, keywords: "", }); -// 系统配置表格数据 +// 列表数据 const pageData = ref([]); +const total = ref(0); +const loading = ref(false); +const selectIds = ref([]); -const dialog = reactive({ +// 弹窗状态 +const dialogState = reactive({ title: "", visible: false, }); +// 表单数据 const formData = reactive({ id: undefined, configName: "", @@ -175,14 +175,17 @@ const formData = reactive({ remark: "", }); -const rules = reactive({ +// 验证规则 +const rules: FormRules = { configName: [{ required: true, message: "请输入系统配置名称", trigger: "blur" }], configKey: [{ required: true, message: "请输入系统配置编码", trigger: "blur" }], configValue: [{ required: true, message: "请输入系统配置值", trigger: "blur" }], -}); +}; -// 获取数据 -function fetchData() { +/** + * 加载配置列表数据 + */ +function fetchData(): void { loading.value = true; ConfigAPI.getPage(queryParams) .then((data) => { @@ -194,48 +197,61 @@ function fetchData() { }); } -// 查询(重置页码后获取数据) -function handleQuery() { +/** + * 查询按钮点击事件 + */ +function handleQuery(): void { queryParams.pageNum = 1; fetchData(); } -// 重置查询 -function handleResetQuery() { - queryFormRef.value.resetFields(); +/** + * 重置查询 + */ +function handleResetQuery(): void { + queryFormRef.value?.resetFields(); queryParams.pageNum = 1; fetchData(); } -// 行复选框选中项变化 -function handleSelectionChange(selection: any) { - selectIds.value = selection.map((item: any) => item.id); +/** + * 表格选择变化事件 + */ +function handleSelectionChange(selection: ConfigItem[]): void { + selectIds.value = selection.map((item) => item.id).filter(Boolean) as string[]; } -// 打开系统配置弹窗 -function handleOpenDialog(id?: string) { - dialog.visible = true; +/** + * 打开弹窗 + * @param id 配置ID(编辑时传入) + */ +function openDialog(id?: string): void { + dialogState.visible = true; if (id) { - dialog.title = "修改系统配置"; + dialogState.title = "修改系统配置"; ConfigAPI.getFormData(id).then((data) => { Object.assign(formData, data); }); } else { - dialog.title = "新增系统配置"; + dialogState.title = "新增系统配置"; formData.id = undefined; } } -// 刷新缓存(防抖) -const handleRefreshCache = useDebounceFn(() => { +/** + * 刷新缓存 + */ +const refreshCache = useDebounceFn(() => { ConfigAPI.refreshCache().then(() => { ElMessage.success("刷新成功"); }); }, 1000); -// 系统配置表单提交 -function handleSubmit() { - dataFormRef.value.validate((valid: any) => { +/** + * 提交表单 + */ +function handleSubmit(): void { + dataFormRef.value?.validate((valid) => { if (valid) { loading.value = true; const id = formData.id; @@ -243,7 +259,7 @@ function handleSubmit() { ConfigAPI.update(id, formData) .then(() => { ElMessage.success("修改成功"); - handleCloseDialog(); + closeDialog(); handleResetQuery(); }) .finally(() => (loading.value = false)); @@ -251,7 +267,7 @@ function handleSubmit() { ConfigAPI.create(formData) .then(() => { ElMessage.success("新增成功"); - handleCloseDialog(); + closeDialog(); handleResetQuery(); }) .finally(() => (loading.value = false)); @@ -260,21 +276,21 @@ function handleSubmit() { }); } -// 重置表单 -function resetForm() { - dataFormRef.value.resetFields(); - dataFormRef.value.clearValidate(); +/** + * 关闭弹窗 + */ +function closeDialog(): void { + dialogState.visible = false; + dataFormRef.value?.resetFields(); + dataFormRef.value?.clearValidate(); formData.id = undefined; } -// 关闭系统配置弹窗 -function handleCloseDialog() { - dialog.visible = false; - resetForm(); -} - -// 删除系统配置 -function handleDelete(id: string) { +/** + * 删除配置 + * @param id 配置ID + */ +function handleDelete(id: string): void { ElMessageBox.confirm("确认删除该项配置?", "警告", { confirmButtonText: "确定", cancelButtonText: "取消", diff --git a/src/views/system/dept/index.vue b/src/views/system/dept/index.vue index 22159d0b..4f17538e 100644 --- a/src/views/system/dept/index.vue +++ b/src/views/system/dept/index.vue @@ -1,6 +1,5 @@ -