แก้ไขการ fetch ข้อมูล

src/components/FormTime.vue

@@ -25,7 +25,7 @@ const props = defineProps({
     type: Function,
     required: true,
   },
-  fetcthDataTable: {
+  fetchData: {
     type: Function,
     require: true,
   },
@@ -59,7 +59,6 @@ const checkstatusBox = ref<boolean>(false)
 
 /** function checkValidate*/
 function onCkickSave() {
-  props.closePopup?.()
   const hasError = []
   for (const key in objectRef) {
     if (Object.prototype.hasOwnProperty.call(objectRef, key)) {
@@ -107,6 +106,7 @@ async function createListTime(data: FormTimeStemp) {
     })
     .finally(() => {
       props.closePopup?.()
+      props.fetchData?.()
     })
 }
 

src/components/PopUp.vue

@@ -21,6 +21,10 @@ const props = defineProps({
     type: Object,
     default: null,
   },
+  fetchData: {
+    type: Function,
+    default: () => console.log('not function'),
+  },
 })
 
 const data = ref<any>()
@@ -39,7 +43,11 @@ watch(
   <q-dialog v-model="props.modal">
     <q-card class="column" style="width: 300px; min-height: 600px">
       <HeaderPopup :title="props.title" :clickClose="clickClosePopup" />
-      <FormTime :dataById="data" :closePopup="clickClosePopup" />
+      <FormTime
+        :dataById="data"
+        :closePopup="clickClosePopup"
+        :fetchData="props.fetchData"
+      />
     </q-card>
   </q-dialog>
 </template>

src/components/TableHistory.vue

@@ -431,6 +431,7 @@ const checkRequestEdit = (checkInStatus: string, checkOutStatus: string) => {
   </q-table>
 
   <Popup
+    :fetchData="props.fetchData"
     :modal="modalPopup"
     :clickClose="closePopup"
     :title="titlePopup"

src/components/ToolBar.vue

@@ -27,7 +27,6 @@ function onClickopen() {
 }
 function onClickClose() {
   modalPopup.value = false
-  props.fetchData?.()
 }
 </script>
 <template>
@@ -80,7 +79,12 @@ function onClickClose() {
     </div>
   </div>
 
-  <Popup :modal="modalPopup" :title="titleName" :clickClose="onClickClose" />
+  <Popup
+    :modal="modalPopup"
+    :title="titleName"
+    :clickClose="onClickClose"
+    :fetchData="props.fetchData"
+  />
 </template>
 
 <style scoped></style>

src/views/HistoryView.vue

@@ -109,6 +109,7 @@ onMounted(() => {
         <div class="col-12 q-pa-md text-grey-9">
           <ToolBar :fetchData="fetchlistHistory" @update:year="updateYear" />
           <Table
+            :fetchData="fetchlistHistory"
             :page-size="pageSize"
             :total="total"
             :page="page"