Refactor GraphQL queries in Gangguan components

src/components/Pages/Gangguan/Rekap/RGangguan_JenisGangguanSE.vue

@@ -256,50 +256,14 @@ import { exportDataGrid as exportToPdf } from 'devextreme/pdf_exporter'
 import { exportDataGrid as exportToExcel } from 'devextreme/excel_exporter'
 import { saveAs } from 'file-saver'
 import { Workbook } from 'exceljs'
-import gql from 'graphql-tag'
 
 import { useQuery } from '@vue/apollo-composable'
+import { queries } from '@/utils/graphql'
 const position = { of: '#data' }
 const showIndicator = ref(true)
 const shading = ref(true)
 const showPane = ref(true)
 const data = ref<any[]>([])
-const GET_REKAP_JENIS_GANGGUAN_SE004 = gql`
-  query rekapitulasiJenisGangguanSE004(
-    $dateFrom: Date!
-    $dateTo: Date!
-    $posko: Int!
-    $idUid: Int!
-    $idUp3: Int!
-  ) {
-    rekapitulasiJenisGangguanSE004(
-      dateFrom: $dateFrom
-      dateTo: $dateTo
-      posko: $posko
-      idUid: $idUid
-      idUp3: $idUp3
-    ) {
-      sub_kelompok
-      total
-      selesai
-      persen_selesai
-      in_process
-      persen_in_process
-      total_durasi_response
-      avg_waktu_response_time
-      max_durasi_response
-      min_durasi_response
-      diatas_sla_durasi_response
-      dibawah_sla_durasi_response
-      total_durasi_recovery
-      avg_waktu_recovery_time
-      max_durasi_recovery
-      min_durasi_recovery
-      diatas_sla_durasi_recovery
-      dibawah_sla_durasi_recovery
-    }
-  }
-`
 
 const onExporting = (e: any) => {
   if (e.format === 'pdf') {
@@ -330,7 +294,7 @@ const onExporting = (e: any) => {
   }
 }
 
-const { onResult, onError, loading, refetch } = useQuery(GET_REKAP_JENIS_GANGGUAN_SE004, {
+const { onResult, onError, loading, refetch } = useQuery(queries.gangguan.rekap.jenisGangguanSE004, {
   dateFrom: new Date().toISOString().slice(0, 10),
   dateTo: new Date().toISOString().slice(0, 10),
   posko: 0,