โครงสร้างทะเบียนประวัติ

src/modules/04_registryPerson/views/list.vue

@@ -333,9 +333,11 @@ function clearSelect(t: string) {
   fetchDataPerson();
 }
 
+const isLoad = ref<boolean>(false);
 async function fetchTree() {
   const data = await fetchStructureTree(route.meta.Key as string);
   if (data) {
+    isLoad.value = true;
     node.value = data;
     store.formFilter.node = nodeData.node;
     store.formFilter.nodeId = nodeData.nodeId;
@@ -365,6 +367,11 @@ function updateSelectedTreeMain(data: any) {
   }
 }
 
+/** callback function เมื่อมีการเปิด popup*/
+watch(selectNode, () => {
+  isLoad.value && hideLoader();
+});
+
 onMounted(async () => {
   selectType();
   fetchTree();
@@ -453,7 +460,7 @@ onMounted(async () => {
               label-color="white"
               dropdown-icon="mdi-chevron-down"
               class="q-px-sm"
-              @click="() => (selectNode = true)"
+              @click="() => ((selectNode = true), showLoader())"
             >
               <template v-slot:label>
                 {{