Refactor data retrieval in filterData function

src/components/Pages/Gangguan/Daftar/DGangguan_RecoveryTime.vue

@@ -346,7 +346,7 @@ import {
   DxSelection
 } from 'devextreme-vue/data-grid'
 import { useQuery } from '@vue/apollo-composable'
-import { queries } from '@/utils/api/api.graphql'
+import { queries, requestGraphQl } from '@/utils/api/api.graphql'
 import {
   exportToPDF,
   exportToXLSX,
@@ -361,6 +361,7 @@ const data = ref<any[]>([])
 const dataSelected = ref<any>({})
 const dialogDetail = ref(false)
 const dataGridRef = ref<DxDataGrid | null>(null)
+const loading = ref(false)
 const clearSelection = () => {
   const dataGrid = dataGridRef.value!.instance!
   dataGrid.clearSelection()
@@ -377,11 +378,11 @@ const showDetail = () => (dialogDetail.value = true)
 
 const closeDialog = () => (dialogDetail.value = false)
 
-const filterData = (params: any) => {
+const filterData = async (params: any) => {
   const { minTime, maxTime, posko, uid, up3 } = params
   const dateValue = params.periode.split(' s/d ')
 
-  refetch({
+  const query = {
     dateFrom: dateValue[0]
       ? dateValue[0].split('-').reverse().join('-')
       : new Date().toISOString().slice(0, 10),
@@ -393,19 +394,24 @@ const filterData = (params: any) => {
     posko: posko ? posko.id : 0,
     idUid: uid ? uid.id : 0,
     idUp3: up3 ? up3.id : 0
-  })
+  }
+  loading.value = true
+  await requestGraphQl(queries.gangguan.daftar.recoveryTime, query)
+    .then((result) => {
+      if (result.data.data != undefined) {
+        data.value = result.data.data.daftarGangguanRecoveryTime
+      } else {
+        data.value = []
+      }
 
-  onResult((queryResult) => {
-    if (queryResult.data != undefined) {
-      data.value = queryResult.data.daftarGangguanRecoveryTime
-    }
-
-    reportMeta.value = filters.value
-  })
-
-  onError((error) => {
-    console.log(error)
-  })
+      reportMeta.value = filters.value
+    })
+    .catch((err) => {
+      console.error(err)
+    })
+    .finally(() => {
+      loading.value = false
+    })
 }
 
 const onExporting = (e: any) => {
@@ -418,16 +424,6 @@ const onExporting = (e: any) => {
   }
 }
 
-const { onResult, onError, loading, refetch } = useQuery(queries.gangguan.daftar.recoveryTime, {
-  dateFrom: new Date().toISOString().slice(0, 10),
-  dateTo: new Date().toISOString().slice(0, 10),
-  minDurasiRecoveryTime: 1, //menit
-  maxDurasiRecoveryTime: 1, // menit
-  posko: 0,
-  idUid: 0,
-  idUp3: 0
-})
-
 const filters = ref()
 const reportMeta = ref({
   uid: { id: 0, name: 'Semua Unit Induk Distribusi/Wilayah' },