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