diff --git a/src/pages.json b/src/pages.json index 699a4ff..a4dd732 100644 --- a/src/pages.json +++ b/src/pages.json @@ -40,7 +40,7 @@ { "path": "pages/work/user/index", "style": { - "navigationBarTitleText": "用户管理" + "navigationStyle": "custom" } }, { diff --git a/src/pages/work/user/index.vue b/src/pages/work/user/index.vue index 09dcf76..05f7605 100644 --- a/src/pages/work/user/index.vue +++ b/src/pages/work/user/index.vue @@ -1,4 +1,9 @@ @@ -113,6 +126,8 @@ import DeptAPI from "@/api/system/dept"; import VutPicker from "@/components/VutPicker.vue"; const message = useMessage(); + +const loading = ref(false); const state = ref("loading"); const dataList = ref([]); @@ -135,9 +150,19 @@ const total = ref(0); const dialog = reactive({ visible: false, }); -const formData = reactive({ + +const initialFormData: UserForm = { + id: undefined, roleIds: [], -}); + username: undefined, + nickname: undefined, + deptId: undefined, + mobile: undefined, + email: undefined, + status: 1, +}; + +const formData = reactive({ ...initialFormData }); const userFormRef = ref(); const roleOptions = ref[]>([]); @@ -252,13 +277,20 @@ function loadmore() { * 打开弹窗 */ async function handleOpenDialog(id?: number) { + loading.value = true; dialog.visible = true; roleOptions.value = await RoleAPI.getOptions(); deptOptions.value = await DeptAPI.getOptions(); if (id) { - UserAPI.getFormData(id).then((data) => { - Object.assign(formData, { ...data }); - }); + UserAPI.getFormData(id) + .then((data) => { + Object.assign(formData, { ...data }); + }) + .finally(() => { + loading.value = false; + }); + } else { + loading.value = false; } } @@ -266,19 +298,20 @@ async function handleOpenDialog(id?: number) { * 提交保存 */ function handleSubmit() { + hancleCloseDialog(); userFormRef.value.validate().then(({ valid }: { valid: boolean }) => { if (valid) { const userId = formData.id; if (userId) { UserAPI.update(userId, formData).then(() => { message.show("修改成功"); - dialog.visible = false; + hancleCloseDialog(); handleQuery(); }); } else { UserAPI.add(formData).then(() => { message.show("添加成功"); - dialog.visible = false; + hancleCloseDialog(); handleQuery(); }); } @@ -286,6 +319,18 @@ function handleSubmit() { }); } +// 重置表单 +function resetForm() { + userFormRef.value.reset(); + Object.assign(formData, initialFormData); +} + +// 关闭弹窗 +function hancleCloseDialog() { + dialog.visible = false; + resetForm(); +} + /** * 删除 * @@ -305,7 +350,7 @@ function handleDelete(id: number) { }); } -// 监听下拉菜单打开事件 +// 触底事件 onReachBottom(() => { if (queryParams.pageNum * queryParams.pageSize < total.value) { loadmore(); @@ -314,7 +359,6 @@ onReachBottom(() => { } }); -// 页面加载时执行查询 onLoad(() => { handleQuery(); });