From ac3ad638949e4d560ddf69320a5f9bb28ca5aaca Mon Sep 17 00:00:00 2001 From: ahaos <8406649+lhailgl@user.noreply.gitee.com> Date: 星期三, 19 七月 2023 22:48:30 +0800 Subject: [PATCH] !29 修改列表打开对话框和接口请求顺序 Merge pull request !29 from ahaos/tspr --- src/views/demo/tree/index.vue | 58 +++++++++++++++++++++++++--------------------------------- 1 files changed, 25 insertions(+), 33 deletions(-) diff --git a/src/views/demo/tree/index.vue b/src/views/demo/tree/index.vue index b00ae69..162ddf6 100644 --- a/src/views/demo/tree/index.vue +++ b/src/views/demo/tree/index.vue @@ -91,8 +91,6 @@ <script setup name="Tree" lang="ts"> import { listTree, getTree, delTree, addTree, updateTree } from "@/api/demo/tree"; import { TreeVO, TreeQuery, TreeForm } from '@/api/demo/tree/types'; -import { ComponentInternalInstance } from 'vue'; -import { ElForm, ElTable } from 'element-plus'; type TreeOption = { @@ -111,9 +109,9 @@ const isExpandAll = ref(true); const loading = ref(false); -const queryFormRef = ref(ElForm); -const treeFormRef = ref(ElForm); -const treeTableRef = ref(ElTable) +const queryFormRef = ref<ElFormInstance>(); +const treeFormRef = ref<ElFormInstance>(); +const treeTableRef = ref<ElTableInstance>() const dialog = reactive<DialogOption>({ visible: false, @@ -187,7 +185,7 @@ // 琛ㄥ崟閲嶇疆 const reset = () => { form.value = {...initFormData} - treeFormRef.value.resetFields(); + treeFormRef.value?.resetFields(); } /** 鎼滅储鎸夐挳鎿嶄綔 */ @@ -197,23 +195,21 @@ /** 閲嶇疆鎸夐挳鎿嶄綔 */ const resetQuery = () => { - queryFormRef.value.resetFields(); + queryFormRef.value?.resetFields(); handleQuery(); } /** 鏂板鎸夐挳鎿嶄綔 */ const handleAdd = (row?: TreeVO) => { + reset(); + getTreeselect(); + if (row && row.id) { + form.value.parentId = row.id; + } else { + form.value.parentId = 0; + } dialog.visible = true; dialog.title = "娣诲姞娴嬭瘯鏍�"; - nextTick(() => { - reset(); - getTreeselect(); - if (row != null && row.id) { - form.value.parentId = row.id; - } else { - form.value.parentId = 0; - } - }); } /** 灞曞紑/鎶樺彔鎿嶄綔 */ @@ -225,41 +221,37 @@ /** 灞曞紑/鎶樺彔鎿嶄綔 */ const toggleExpandAll = (data: TreeVO[], status: boolean) => { data.forEach((item) => { - treeTableRef.value.toggleRowExpansion(item, status) + treeTableRef.value?.toggleRowExpansion(item, status) if (item.children && item.children.length > 0) toggleExpandAll(item.children, status) }) } /** 淇敼鎸夐挳鎿嶄綔 */ -const handleUpdate = (row: TreeVO) => { - loading.value = true; +const handleUpdate = async (row: TreeVO) => { + reset(); + await getTreeselect(); + if (row) { + form.value.parentId = row.id; + } + const res = await getTree(row.id); + Object.assign(form.value, res.data); dialog.visible = true; dialog.title = "淇敼娴嬭瘯鏍�"; - nextTick(async () => { - reset(); - await getTreeselect(); - if (row != null) { - form.value.parentId = row.id; - } - const res = await getTree(row.id); - loading.value = false; - Object.assign(form.value, res.data); - }); } /** 鎻愪氦鎸夐挳 */ const submitForm = () => { - treeFormRef.value.validate((valid: boolean) => { + treeFormRef.value?.validate(async (valid: boolean) => { if (valid) { buttonLoading.value = true; if (form.value.id) { - updateTree(form.value).finally(() => buttonLoading.value = false); + await updateTree(form.value).finally(() => buttonLoading.value = false); } else { - addTree(form.value).finally(() => buttonLoading.value = false); + await addTree(form.value).finally(() => buttonLoading.value = false); } proxy?.$modal.msgSuccess("鎿嶄綔鎴愬姛"); dialog.visible = false; - getList(); + await getList(); } }); } -- Gitblit v1.9.3