fix load

src/modules/17_acting/views/main.vue

@@ -2,12 +2,11 @@
 import { ref, onMounted } from "vue";
 import { useQuasar } from "quasar";
 
-import http from "@/plugins/http";
-import config from "@/app.config";
-
 import { checkPermission } from "@/utils/permissions";
 import { useCounterMixin } from "@/stores/mixin";
 import { useStructureTree } from "@/stores/structureTree";
+import http from "@/plugins/http";
+import config from "@/app.config";
 
 /** importType*/
 import type { QTableProps } from "quasar";
@@ -17,7 +16,7 @@ import type {
   ListPerson,
 } from "@/modules/17_acting/interface/response/Main";
 
-/** importStore*/
+import LoadView from "@/components/LoadView.vue";
 
 /** use*/
 const $q = useQuasar();
@@ -59,14 +58,20 @@ async function fetchOrganizationActive() {
   }
 }
 
+const isLaod = ref<boolean>(false);
+
 /**
- * function เลือกตำแหน่งที่จะให่รักษาการ
+ * function เลือกตำแหน่งที่จะให้ษาการ
  * @param data ข้อมูลตำแหน่ง
  */
 async function updateSelected(data: PosMaster) {
   posmasterId.value = data.posmasterId;
+  isLaod.value = true;
   // เรียกใช้ function  fetch รายชื่อ ,fetch รายชื่อรักษาการ
-  await Promise.all([fetchPosMaster(), fetchListAct()]);
+  await Promise.all([fetchPosMaster(), fetchListAct()]).finally(() => {
+    isLaod.value = false;
+    console.log("test");
+  });
 }
 
 /** ตำแหน่ง*/
@@ -143,9 +148,8 @@ const keyword = ref<string>("");
 /**
  * function fetch รายชื่อ
  */
-function fetchPosMaster() {
-  showLoader();
-  http
+async function fetchPosMaster() {
+  await http
     .post(config.API.orgPosAct + `/search`, {
       posmasterId: posmasterId.value,
       isAll: isAll.value,
@@ -156,9 +160,6 @@ function fetchPosMaster() {
     })
     .catch((err) => {
       messageError($q, err);
-    })
-    .finally(() => {
-      hideLoader();
     });
 }
 
@@ -198,9 +199,8 @@ const keywordAct = ref<string>("");
 /**
  *  function fetch รายชื่อรักษาการ
  */
-function fetchListAct() {
-  showLoader();
-  http
+async function fetchListAct() {
+  await http
     .get(config.API.orgPosAct + `/${posmasterId.value}`)
     .then((res) => {
       const data = res.data.result;
@@ -208,9 +208,6 @@ function fetchListAct() {
     })
     .catch((err) => {
       messageError($q, err);
-    })
-    .finally(() => {
-      hideLoader();
     });
 }
 
@@ -341,7 +338,8 @@ onMounted(() => {
         class="col-lg-9 col-md-8 col-xs-12 scroll"
         style="height: 80vh"
       >
-        <div class="column q-col-gutter-sm">
+        <LoadView v-if="isLaod" />
+        <div class="column q-col-gutter-sm" v-else>
           <div class="col">
             <q-card bordered style="height: 100%; border: 1px solid #d6dee1">
               <div class="col-12 text-weight-medium bg-grey-1 q-py-sm q-px-md">