From 978f37eb5172fd1f687a68e3fcc8c9c1f48f060b Mon Sep 17 00:00:00 2001
From: Dede Fuji Abdul <defuj.official@gmail.com>
Date: Wed, 20 Mar 2024 10:22:15 +0700
Subject: [PATCH] Update page sizes in pagination components

---
 src/components/Pages/Cico/LaporanCICO.vue     | 22 +++++-----
 .../Pages/Gangguan/Daftar/DGangguan_BM.vue    |  4 +-
 .../Pages/Gangguan/Daftar/DGangguan_DKPL.vue  |  4 +-
 .../Gangguan/Daftar/DGangguan_DMAPKT.vue      |  4 +-
 .../Pages/Gangguan/Daftar/DGangguan_MLD1K.vue |  4 +-
 .../Daftar/DGangguan_RecoveryTime.vue         |  4 +-
 .../Daftar/DGangguan_ResponseTime.vue         |  4 +-
 .../Pages/Gangguan/Daftar/DGangguan_STIDP.vue |  4 +-
 .../Pages/Gangguan/Rekap/RGangguan_ALL.vue    | 40 +++++++++++--------
 .../Gangguan/Rekap/RGangguan_AlihPosko.vue    |  4 +-
 .../Rekap/RGangguan_BerdasarMedia.vue         |  4 +-
 .../Pages/Gangguan/Rekap/RGangguan_DMAPKT.vue |  4 +-
 .../Rekap/RGangguan_JenisGangguanSE.vue       | 12 +++---
 .../Pages/Gangguan/Rekap/RGangguan_KTI.vue    |  4 +-
 .../Gangguan/Rekap/RGangguan_PerPosko.vue     |  4 +-
 .../Gangguan/Rekap/RGangguan_PerTanggal.vue   |  4 +-
 .../Rekap/RGangguan_RatingPerPosko.vue        |  4 +-
 .../Rekap/RGangguan_RatingPerRegu.vue         |  4 +-
 .../Keluhan/Daftar/DKeluhan_BerdasarMedia.vue |  4 +-
 .../Pages/Keluhan/Daftar/DKeluhan_DKUL.vue    |  4 +-
 .../Pages/Keluhan/Daftar/DKeluhan_PLD1K.vue   |  4 +-
 .../Keluhan/Daftar/DKeluhan_RecoveryTime.vue  |  4 +-
 .../Keluhan/Daftar/DKeluhan_ResponseTime.vue  |  4 +-
 .../Pages/Keluhan/Daftar/DKeluhan_STIDP.vue   |  4 +-
 .../Keluhan/Daftar/DKeluhan_SelesaiCC.vue     |  4 +-
 .../Pages/Keluhan/Rekap/RKeluhan_ALL.vue      | 22 +++++-----
 .../Keluhan/Rekap/RKeluhan_BerdasarMedia.vue  | 20 +++++-----
 .../Rekap/RKeluhan_PerFungsiBidang.vue        | 22 +++++-----
 .../Rekap/RKeluhan_PerJenisKeluhan.vue        | 22 +++++-----
 .../Rekap/RKeluhan_PerKelompokKeluhan.vue     | 22 +++++-----
 .../Keluhan/Rekap/RKeluhan_PerTanggal.vue     | 24 +++++------
 .../Pages/Keluhan/Rekap/RKeluhan_PerUnit.vue  | 22 +++++-----
 .../Pages/Material/Daftar/Material_DGMYG.vue  |  4 +-
 .../Pages/Material/Rekap/Material_RPM.vue     |  4 +-
 .../Rekap/MonalisaGR_GangguanBelumSelesai.vue |  4 +-
 .../Bulanan/MonalisaLB_AgingComplaint.vue     | 18 ++++-----
 .../MonalisaLB_PenurunanJumlahKomplain.vue    | 24 +++++------
 .../Pages/PencarianData/PencarianData.vue     |  4 +-
 src/utils/api/api.graphql.ts                  |  3 --
 39 files changed, 190 insertions(+), 187 deletions(-)

diff --git a/src/components/Pages/Cico/LaporanCICO.vue b/src/components/Pages/Cico/LaporanCICO.vue
index 2c6ebbc..e150440 100755
--- a/src/components/Pages/Cico/LaporanCICO.vue
+++ b/src/components/Pages/Cico/LaporanCICO.vue
@@ -111,13 +111,13 @@
       />
 
       <template #formatText="{ data }">
-        <p class="text-left cursor-pointer" @click="showDialogDataSelected()">
+        <p class="text-left cursor-pointer" @click="showDetail()">
           {{ data.text }}
         </p>
       </template>
 
       <template #formatNumber="{ data }">
-        <p class="text-right cursor-pointer" @click="showDialogDataSelected()">
+        <p class="text-right cursor-pointer" @click="showDetail()">
           {{
             isNumber(data.text)
               ? data.column.caption == '%'
@@ -181,9 +181,9 @@
   </div>
 
   <DetailDialog
-    :open="dialogDataSelected"
+    :open="dialogDetail"
     title="Daftar Detail Jumlah WO Gangguan Individu"
-    @on-close="closeDialogDataSelected"
+    @on-close="closedialogDetail"
     :full-width="true"
   >
     <div class="w-full mb-4 lg:w-[70%] lg:float-left">
@@ -204,10 +204,10 @@
           column-resizing-mode="widget"
         >
           <DxSelection mode="single" />
-          <DxPaging :page-size="5" :enabled="true" />
+          <DxPaging :page-size="20" :enabled="true" />
           <DxPager
             :visible="true"
-            :allowed-page-sizes="[5, 10, 20]"
+            :allowed-page-sizes="[20, 50, 100]"
             display-mode="full"
             :show-page-size-selector="true"
             :show-info="true"
@@ -829,11 +829,11 @@ const dataSelected = ref<any>()
 const dataSubSelected = ref<any>()
 const data = ref<any[]>([])
 const dataSub = ref<any[]>([])
-const dialogDataSelected = ref(false)
+const dialogDetail = ref(false)
 const loadingData = ref(false)
 const loadingSubData = ref(false)
 
-const closeDialogDataSelected = () => (dialogDataSelected.value = false)
+const closedialogDetail = () => (dialogDetail.value = false)
 
 const getDetail = () => {
   loadingSubData.value = true
@@ -871,11 +871,11 @@ const getDetail = () => {
     loadingSubData.value = value
   })
 }
-const showDialogDataSelected = () => {
+const showDetail = () => {
   if (dataSelected.value != null) {
     dataSub.value = []
     dataSubSelected.value = null
-    dialogDataSelected.value = true
+    dialogDetail.value = true
     getDetail()
   }
 }
@@ -911,7 +911,7 @@ const onExporting = (e: any) => {
 
 const onDataSelectionChanged = ({ selectedRowsData }: any) => {
   dataSelected.value = selectedRowsData[0]
-  showDialogDataSelected()
+  showDetail()
 }
 
 const onDataSubSelectionChanged = ({ selectedRowsData }: any) => {
diff --git a/src/components/Pages/Gangguan/Daftar/DGangguan_BM.vue b/src/components/Pages/Gangguan/Daftar/DGangguan_BM.vue
index 553ee14..f0f8607 100755
--- a/src/components/Pages/Gangguan/Daftar/DGangguan_BM.vue
+++ b/src/components/Pages/Gangguan/Daftar/DGangguan_BM.vue
@@ -20,10 +20,10 @@
       column-resizing-mode="widget"
     >
       <DxSelection mode="single" />
-      <DxPaging :page-size="5" :enabled="true" />
+      <DxPaging :page-size="20" :enabled="true" />
       <DxPager
         :visible="true"
-        :allowed-page-sizes="[5, 10, 20]"
+        :allowed-page-sizes="[20, 50, 100]"
         display-mode="full"
         :show-page-size-selector="true"
         :show-info="true"
diff --git a/src/components/Pages/Gangguan/Daftar/DGangguan_DKPL.vue b/src/components/Pages/Gangguan/Daftar/DGangguan_DKPL.vue
index a62f095..f201c37 100755
--- a/src/components/Pages/Gangguan/Daftar/DGangguan_DKPL.vue
+++ b/src/components/Pages/Gangguan/Daftar/DGangguan_DKPL.vue
@@ -21,10 +21,10 @@
       :allow-column-resizing="true"
       column-resizing-mode="widget"
     >
-      <DxPaging :page-size="5" :enabled="true" />
+      <DxPaging :page-size="20" :enabled="true" />
       <DxPager
         :visible="true"
-        :allowed-page-sizes="[5, 10, 20]"
+        :allowed-page-sizes="[20, 50, 100]"
         display-mode="full"
         :show-page-size-selector="true"
         :show-info="true"
diff --git a/src/components/Pages/Gangguan/Daftar/DGangguan_DMAPKT.vue b/src/components/Pages/Gangguan/Daftar/DGangguan_DMAPKT.vue
index 4293075..ed7932e 100755
--- a/src/components/Pages/Gangguan/Daftar/DGangguan_DMAPKT.vue
+++ b/src/components/Pages/Gangguan/Daftar/DGangguan_DMAPKT.vue
@@ -20,10 +20,10 @@
       column-resizing-mode="widget"
     >
       <DxSelection mode="single" />
-      <DxPaging :page-size="5" :enabled="true" />
+      <DxPaging :page-size="20" :enabled="true" />
       <DxPager
         :visible="true"
-        :allowed-page-sizes="[5, 10, 20]"
+        :allowed-page-sizes="[20, 50, 100]"
         display-mode="full"
         :show-page-size-selector="true"
         :show-info="true"
diff --git a/src/components/Pages/Gangguan/Daftar/DGangguan_MLD1K.vue b/src/components/Pages/Gangguan/Daftar/DGangguan_MLD1K.vue
index ef27623..021fbbc 100755
--- a/src/components/Pages/Gangguan/Daftar/DGangguan_MLD1K.vue
+++ b/src/components/Pages/Gangguan/Daftar/DGangguan_MLD1K.vue
@@ -20,10 +20,10 @@
       column-resizing-mode="widget"
     >
       <DxSelection mode="single" />
-      <DxPaging :page-size="5" :enabled="true" />
+      <DxPaging :page-size="20" :enabled="true" />
       <DxPager
         :visible="true"
-        :allowed-page-sizes="[5, 10, 20]"
+        :allowed-page-sizes="[20, 50, 100]"
         display-mode="full"
         :show-page-size-selector="true"
         :show-info="true"
diff --git a/src/components/Pages/Gangguan/Daftar/DGangguan_RecoveryTime.vue b/src/components/Pages/Gangguan/Daftar/DGangguan_RecoveryTime.vue
index 0ffd1b2..09bb77f 100755
--- a/src/components/Pages/Gangguan/Daftar/DGangguan_RecoveryTime.vue
+++ b/src/components/Pages/Gangguan/Daftar/DGangguan_RecoveryTime.vue
@@ -36,10 +36,10 @@
       column-resizing-mode="widget"
     >
       <DxSelection mode="single" />
-      <DxPaging :page-size="5" :enabled="true" />
+      <DxPaging :page-size="20" :enabled="true" />
       <DxPager
         :visible="true"
-        :allowed-page-sizes="[5, 10, 20]"
+        :allowed-page-sizes="[20, 50, 100]"
         display-mode="full"
         :show-page-size-selector="true"
         :show-info="true"
diff --git a/src/components/Pages/Gangguan/Daftar/DGangguan_ResponseTime.vue b/src/components/Pages/Gangguan/Daftar/DGangguan_ResponseTime.vue
index b38035f..7338532 100755
--- a/src/components/Pages/Gangguan/Daftar/DGangguan_ResponseTime.vue
+++ b/src/components/Pages/Gangguan/Daftar/DGangguan_ResponseTime.vue
@@ -20,10 +20,10 @@
       column-resizing-mode="widget"
     >
       <DxSelection mode="single" />
-      <DxPaging :page-size="5" :enabled="true" />
+      <DxPaging :page-size="20" :enabled="true" />
       <DxPager
         :visible="true"
-        :allowed-page-sizes="[5, 10, 20]"
+        :allowed-page-sizes="[20, 50, 100]"
         display-mode="full"
         :show-page-size-selector="true"
         :show-info="true"
diff --git a/src/components/Pages/Gangguan/Daftar/DGangguan_STIDP.vue b/src/components/Pages/Gangguan/Daftar/DGangguan_STIDP.vue
index 8463394..38615e0 100755
--- a/src/components/Pages/Gangguan/Daftar/DGangguan_STIDP.vue
+++ b/src/components/Pages/Gangguan/Daftar/DGangguan_STIDP.vue
@@ -20,10 +20,10 @@
       column-resizing-mode="widget"
     >
       <DxSelection mode="single" />
-      <DxPaging :page-size="5" :enabled="true" />
+      <DxPaging :page-size="20" :enabled="true" />
       <DxPager
         :visible="true"
-        :allowed-page-sizes="[5, 10, 20]"
+        :allowed-page-sizes="[20, 50, 100]"
         display-mode="full"
         :show-page-size-selector="true"
         :show-info="true"
diff --git a/src/components/Pages/Gangguan/Rekap/RGangguan_ALL.vue b/src/components/Pages/Gangguan/Rekap/RGangguan_ALL.vue
index 03af6b1..020a130 100755
--- a/src/components/Pages/Gangguan/Rekap/RGangguan_ALL.vue
+++ b/src/components/Pages/Gangguan/Rekap/RGangguan_ALL.vue
@@ -320,13 +320,13 @@
       </DxColumn>
 
       <template #formatText="{ data }">
-        <p class="text-left cursor-pointer" @click="showDialogDataSelected()">
+        <p class="text-left cursor-pointer" @click="showDetail()">
           {{ data.text }}
         </p>
       </template>
 
       <template #formatNumber="{ data }">
-        <p class="text-right cursor-pointer" @click="showDialogDataSelected()">
+        <p class="text-right cursor-pointer" @click="showDetail()">
           {{
             isNumber(data.text)
               ? data.column.caption == '%'
@@ -338,7 +338,7 @@
       </template>
 
       <template #formatTime="{ data }">
-        <p @click="showDialogDataSelected()">
+        <p @click="showDetail()">
           {{ parseInt(data.text) ? formatWaktu(data.text) : '-' }}
         </p>
       </template>
@@ -510,9 +510,9 @@
   </div>
 
   <DetailDialog
-    :open="dialogDataSelected"
+    :open="dialogDetail"
     title="Detail Gangguan All"
-    @on-close="closeDialogDataSelected"
+    @on-close="closedialogDetail"
     :full-width="true"
   >
     <div class="w-full mb-4 lg:w-[70%] lg:float-left">
@@ -533,10 +533,10 @@
           column-resizing-mode="widget"
         >
           <DxSelection mode="single" />
-          <DxPaging :page-size="5" :enabled="true" />
+          <DxPaging :page-size="20" :enabled="true" />
           <DxPager
             :visible="true"
-            :allowed-page-sizes="[5, 10, 20]"
+            :allowed-page-sizes="[20, 50, 100]"
             display-mode="full"
             :show-page-size-selector="true"
             :show-info="true"
@@ -1037,12 +1037,13 @@ const data = ref<any[]>([])
 const dataSub = ref<any[]>([])
 const dataSelected = ref<any>(null)
 const dataSubSelected = ref<any>(null)
-const dialogDataSelected = ref(false)
-const closeDialogDataSelected = () => (dialogDataSelected.value = false)
+const dialogDetail = ref(false)
+const closedialogDetail = () => (dialogDetail.value = false)
 const loadingData = ref(false)
 const loadingSubData = ref(false)
 
 const filterData = (params: any) => {
+  loadingData.value = true
   const { posko, uid, up3 } = params
   const dateValue = params.periode.split(' s/d ')
 
@@ -1115,13 +1116,15 @@ const getDetail = () => {
     loadingSubData.value = value
   })
 }
-
-const showDialogDataSelected = () => {
+const currentDataSelected = ref<any>(null)
+const showDetail = () => {
   if (dataSelected.value != null) {
-    dataSub.value = []
-    dataSubSelected.value = null
-    dialogDataSelected.value = true
-    getDetail()
+    if (currentDataSelected.value == dataSelected.value) {
+      dataSub.value = []
+      dataSubSelected.value = null
+      dialogDetail.value = true
+      getDetail()
+    }
   }
 }
 
@@ -1155,8 +1158,11 @@ const onExporting = (e: any) => {
 }
 
 const onDataSelectionChanged = ({ selectedRowsData }: any) => {
-  dataSelected.value = selectedRowsData[0]
-  showDialogDataSelected()
+  if (dataSelected.value != selectedRowsData[0]) {
+    dataSelected.value = selectedRowsData[0]
+    currentDataSelected.value = selectedRowsData[0]
+    showDetail()
+  }
 }
 
 const onDataSubSelectionChanged = ({ selectedRowsData }: any) => {
diff --git a/src/components/Pages/Gangguan/Rekap/RGangguan_AlihPosko.vue b/src/components/Pages/Gangguan/Rekap/RGangguan_AlihPosko.vue
index dc721ae..4052e95 100755
--- a/src/components/Pages/Gangguan/Rekap/RGangguan_AlihPosko.vue
+++ b/src/components/Pages/Gangguan/Rekap/RGangguan_AlihPosko.vue
@@ -164,10 +164,10 @@
           column-resizing-mode="widget"
         >
           <DxSelection mode="single" />
-          <DxPaging :page-size="5" :enabled="true" />
+          <DxPaging :page-size="20" :enabled="true" />
           <DxPager
             :visible="true"
-            :allowed-page-sizes="[5, 10, 20]"
+            :allowed-page-sizes="[20, 50, 100]"
             display-mode="full"
             :show-page-size-selector="true"
             :show-info="true"
diff --git a/src/components/Pages/Gangguan/Rekap/RGangguan_BerdasarMedia.vue b/src/components/Pages/Gangguan/Rekap/RGangguan_BerdasarMedia.vue
index f8bd305..eface3a 100755
--- a/src/components/Pages/Gangguan/Rekap/RGangguan_BerdasarMedia.vue
+++ b/src/components/Pages/Gangguan/Rekap/RGangguan_BerdasarMedia.vue
@@ -157,10 +157,10 @@
           column-resizing-mode="widget"
         >
           <DxSelection mode="single" />
-          <DxPaging :page-size="5" :enabled="true" />
+          <DxPaging :page-size="20" :enabled="true" />
           <DxPager
             :visible="true"
-            :allowed-page-sizes="[5, 10, 20]"
+            :allowed-page-sizes="[20, 50, 100]"
             display-mode="full"
             :show-page-size-selector="true"
             :show-info="true"
diff --git a/src/components/Pages/Gangguan/Rekap/RGangguan_DMAPKT.vue b/src/components/Pages/Gangguan/Rekap/RGangguan_DMAPKT.vue
index ca86c05..ddb089d 100755
--- a/src/components/Pages/Gangguan/Rekap/RGangguan_DMAPKT.vue
+++ b/src/components/Pages/Gangguan/Rekap/RGangguan_DMAPKT.vue
@@ -437,10 +437,10 @@
           column-resizing-mode="widget"
         >
           <DxSelection mode="single" />
-          <DxPaging :page-size="5" :enabled="true" />
+          <DxPaging :page-size="20" :enabled="true" />
           <DxPager
             :visible="true"
-            :allowed-page-sizes="[5, 10, 20]"
+            :allowed-page-sizes="[20, 50, 100]"
             display-mode="full"
             :show-page-size-selector="true"
             :show-info="true"
diff --git a/src/components/Pages/Gangguan/Rekap/RGangguan_JenisGangguanSE.vue b/src/components/Pages/Gangguan/Rekap/RGangguan_JenisGangguanSE.vue
index 6dab3c2..cd74093 100755
--- a/src/components/Pages/Gangguan/Rekap/RGangguan_JenisGangguanSE.vue
+++ b/src/components/Pages/Gangguan/Rekap/RGangguan_JenisGangguanSE.vue
@@ -449,10 +449,10 @@
           column-resizing-mode="widget"
         >
           <DxSelection mode="single" />
-          <DxPaging :page-size="5" :enabled="true" />
+          <DxPaging :page-size="20" :enabled="true" />
           <DxPager
             :visible="true"
-            :allowed-page-sizes="[5, 10, 20]"
+            :allowed-page-sizes="[20, 50, 100]"
             display-mode="full"
             :show-page-size-selector="true"
             :show-info="true"
@@ -889,10 +889,10 @@ const getDetail = () => {
     dateTo: dateValue[1]
       ? dateValue[1].split('-').reverse().join('-')
       : new Date().toISOString().slice(0, 10),
-    posko: ref.id_posko,
-    idUid: ref.id_uid,
-    idUp3: ref.id_up3,
-    idEquipment: ref?.id_equipment ? ref.id_equipment : 0
+    posko: filters.value?.id_posko ? filters.value.id_posko : 0,
+    idUid: filters.value?.id_uid ? filters.value.id_uid : 0,
+    idUp3: filters.value?.id_up3 ? filters.value.id_up3 : 0,
+    idEquipment: ref?.kode ? ref.kode : 0
   }
 
   const { onResult, onError, loading, refetch } = useQuery(
diff --git a/src/components/Pages/Gangguan/Rekap/RGangguan_KTI.vue b/src/components/Pages/Gangguan/Rekap/RGangguan_KTI.vue
index cb150c7..9890ec0 100755
--- a/src/components/Pages/Gangguan/Rekap/RGangguan_KTI.vue
+++ b/src/components/Pages/Gangguan/Rekap/RGangguan_KTI.vue
@@ -326,10 +326,10 @@
           column-resizing-mode="widget"
         >
           <DxSelection mode="single" />
-          <DxPaging :page-size="5" :enabled="true" />
+          <DxPaging :page-size="20" :enabled="true" />
           <DxPager
             :visible="true"
-            :allowed-page-sizes="[5, 10, 20]"
+            :allowed-page-sizes="[20, 50, 100]"
             display-mode="full"
             :show-page-size-selector="true"
             :show-info="true"
diff --git a/src/components/Pages/Gangguan/Rekap/RGangguan_PerPosko.vue b/src/components/Pages/Gangguan/Rekap/RGangguan_PerPosko.vue
index 16da770..97d551a 100755
--- a/src/components/Pages/Gangguan/Rekap/RGangguan_PerPosko.vue
+++ b/src/components/Pages/Gangguan/Rekap/RGangguan_PerPosko.vue
@@ -534,10 +534,10 @@
           column-resizing-mode="widget"
         >
           <DxSelection mode="single" />
-          <DxPaging :page-size="5" :enabled="true" />
+          <DxPaging :page-size="20" :enabled="true" />
           <DxPager
             :visible="true"
-            :allowed-page-sizes="[5, 10, 20]"
+            :allowed-page-sizes="[20, 50, 100]"
             display-mode="full"
             :show-page-size-selector="true"
             :show-info="true"
diff --git a/src/components/Pages/Gangguan/Rekap/RGangguan_PerTanggal.vue b/src/components/Pages/Gangguan/Rekap/RGangguan_PerTanggal.vue
index acf6227..db48b8a 100755
--- a/src/components/Pages/Gangguan/Rekap/RGangguan_PerTanggal.vue
+++ b/src/components/Pages/Gangguan/Rekap/RGangguan_PerTanggal.vue
@@ -292,10 +292,10 @@
           column-resizing-mode="widget"
         >
           <DxSelection mode="single" />
-          <DxPaging :page-size="5" :enabled="true" />
+          <DxPaging :page-size="20" :enabled="true" />
           <DxPager
             :visible="true"
-            :allowed-page-sizes="[5, 10, 20]"
+            :allowed-page-sizes="[20, 50, 100]"
             display-mode="full"
             :show-page-size-selector="true"
             :show-info="true"
diff --git a/src/components/Pages/Gangguan/Rekap/RGangguan_RatingPerPosko.vue b/src/components/Pages/Gangguan/Rekap/RGangguan_RatingPerPosko.vue
index a0820d4..2f3ae5b 100755
--- a/src/components/Pages/Gangguan/Rekap/RGangguan_RatingPerPosko.vue
+++ b/src/components/Pages/Gangguan/Rekap/RGangguan_RatingPerPosko.vue
@@ -255,10 +255,10 @@
           column-resizing-mode="widget"
         >
           <DxSelection mode="single" />
-          <DxPaging :page-size="5" :enabled="true" />
+          <DxPaging :page-size="20" :enabled="true" />
           <DxPager
             :visible="true"
-            :allowed-page-sizes="[5, 10, 20]"
+            :allowed-page-sizes="[20, 50, 100]"
             display-mode="full"
             :show-page-size-selector="true"
             :show-info="true"
diff --git a/src/components/Pages/Gangguan/Rekap/RGangguan_RatingPerRegu.vue b/src/components/Pages/Gangguan/Rekap/RGangguan_RatingPerRegu.vue
index 1dfe9d3..9c8f11c 100755
--- a/src/components/Pages/Gangguan/Rekap/RGangguan_RatingPerRegu.vue
+++ b/src/components/Pages/Gangguan/Rekap/RGangguan_RatingPerRegu.vue
@@ -246,10 +246,10 @@
           column-resizing-mode="widget"
         >
           <DxSelection mode="single" />
-          <DxPaging :page-size="5" :enabled="true" />
+          <DxPaging :page-size="20" :enabled="true" />
           <DxPager
             :visible="true"
-            :allowed-page-sizes="[5, 10, 20]"
+            :allowed-page-sizes="[20, 50, 100]"
             display-mode="full"
             :show-page-size-selector="true"
             :show-info="true"
diff --git a/src/components/Pages/Keluhan/Daftar/DKeluhan_BerdasarMedia.vue b/src/components/Pages/Keluhan/Daftar/DKeluhan_BerdasarMedia.vue
index bec32a6..545e992 100755
--- a/src/components/Pages/Keluhan/Daftar/DKeluhan_BerdasarMedia.vue
+++ b/src/components/Pages/Keluhan/Daftar/DKeluhan_BerdasarMedia.vue
@@ -21,10 +21,10 @@
       :word-wrap-enabled="false"
     >
       <DxSelection mode="single" />
-      <DxPaging :page-size="5" :enabled="true" />
+      <DxPaging :page-size="20" :enabled="true" />
       <DxPager
         :visible="true"
-        :allowed-page-sizes="[5, 10, 20]"
+        :allowed-page-sizes="[20, 50, 100]"
         display-mode="full"
         :show-page-size-selector="true"
         :show-info="true"
diff --git a/src/components/Pages/Keluhan/Daftar/DKeluhan_DKUL.vue b/src/components/Pages/Keluhan/Daftar/DKeluhan_DKUL.vue
index 3ef44c5..8998182 100755
--- a/src/components/Pages/Keluhan/Daftar/DKeluhan_DKUL.vue
+++ b/src/components/Pages/Keluhan/Daftar/DKeluhan_DKUL.vue
@@ -21,10 +21,10 @@
       :word-wrap-enabled="true"
     >
       <DxSelection mode="single" />
-      <DxPaging :page-size="5" :enabled="true" />
+      <DxPaging :page-size="20" :enabled="true" />
       <DxPager
         :visible="true"
-        :allowed-page-sizes="[5, 10, 20]"
+        :allowed-page-sizes="[20, 50, 100]"
         display-mode="full"
         :show-page-size-selector="true"
         :show-info="true"
diff --git a/src/components/Pages/Keluhan/Daftar/DKeluhan_PLD1K.vue b/src/components/Pages/Keluhan/Daftar/DKeluhan_PLD1K.vue
index 782a978..d110e33 100755
--- a/src/components/Pages/Keluhan/Daftar/DKeluhan_PLD1K.vue
+++ b/src/components/Pages/Keluhan/Daftar/DKeluhan_PLD1K.vue
@@ -21,10 +21,10 @@
       :word-wrap-enabled="false"
     >
       <DxSelection mode="single" />
-      <DxPaging :page-size="5" :enabled="true" />
+      <DxPaging :page-size="20" :enabled="true" />
       <DxPager
         :visible="true"
-        :allowed-page-sizes="[5, 10, 20]"
+        :allowed-page-sizes="[20, 50, 100]"
         display-mode="full"
         :show-page-size-selector="true"
         :show-info="true"
diff --git a/src/components/Pages/Keluhan/Daftar/DKeluhan_RecoveryTime.vue b/src/components/Pages/Keluhan/Daftar/DKeluhan_RecoveryTime.vue
index 28b7830..1b01b6c 100755
--- a/src/components/Pages/Keluhan/Daftar/DKeluhan_RecoveryTime.vue
+++ b/src/components/Pages/Keluhan/Daftar/DKeluhan_RecoveryTime.vue
@@ -37,10 +37,10 @@
       :word-wrap-enabled="false"
     >
       <DxSelection mode="single" />
-      <DxPaging :page-size="5" :enabled="true" />
+      <DxPaging :page-size="20" :enabled="true" />
       <DxPager
         :visible="true"
-        :allowed-page-sizes="[5, 10, 20]"
+        :allowed-page-sizes="[20, 50, 100]"
         display-mode="full"
         :show-page-size-selector="true"
         :show-info="true"
diff --git a/src/components/Pages/Keluhan/Daftar/DKeluhan_ResponseTime.vue b/src/components/Pages/Keluhan/Daftar/DKeluhan_ResponseTime.vue
index 5f856ba..6b38773 100755
--- a/src/components/Pages/Keluhan/Daftar/DKeluhan_ResponseTime.vue
+++ b/src/components/Pages/Keluhan/Daftar/DKeluhan_ResponseTime.vue
@@ -37,10 +37,10 @@
       :word-wrap-enabled="false"
     >
       <DxSelection mode="single" />
-      <DxPaging :page-size="5" :enabled="true" />
+      <DxPaging :page-size="20" :enabled="true" />
       <DxPager
         :visible="true"
-        :allowed-page-sizes="[5, 10, 20]"
+        :allowed-page-sizes="[20, 50, 100]"
         display-mode="full"
         :show-page-size-selector="true"
         :show-info="true"
diff --git a/src/components/Pages/Keluhan/Daftar/DKeluhan_STIDP.vue b/src/components/Pages/Keluhan/Daftar/DKeluhan_STIDP.vue
index dcb1fe3..9b79ad9 100755
--- a/src/components/Pages/Keluhan/Daftar/DKeluhan_STIDP.vue
+++ b/src/components/Pages/Keluhan/Daftar/DKeluhan_STIDP.vue
@@ -21,10 +21,10 @@
       :word-wrap-enabled="false"
     >
       <DxSelection mode="single" />
-      <DxPaging :page-size="5" :enabled="true" />
+      <DxPaging :page-size="20" :enabled="true" />
       <DxPager
         :visible="true"
-        :allowed-page-sizes="[5, 10, 20]"
+        :allowed-page-sizes="[20, 50, 100]"
         display-mode="full"
         :show-page-size-selector="true"
         :show-info="true"
diff --git a/src/components/Pages/Keluhan/Daftar/DKeluhan_SelesaiCC.vue b/src/components/Pages/Keluhan/Daftar/DKeluhan_SelesaiCC.vue
index 5ec3c3a..ecea426 100755
--- a/src/components/Pages/Keluhan/Daftar/DKeluhan_SelesaiCC.vue
+++ b/src/components/Pages/Keluhan/Daftar/DKeluhan_SelesaiCC.vue
@@ -21,10 +21,10 @@
       :word-wrap-enabled="true"
     >
       <DxSelection mode="single" />
-      <DxPaging :page-size="5" :enabled="true" />
+      <DxPaging :page-size="20" :enabled="true" />
       <DxPager
         :visible="true"
-        :allowed-page-sizes="[5, 10, 20]"
+        :allowed-page-sizes="[20, 50, 100]"
         display-mode="full"
         :show-page-size-selector="true"
         :show-info="true"
diff --git a/src/components/Pages/Keluhan/Rekap/RKeluhan_ALL.vue b/src/components/Pages/Keluhan/Rekap/RKeluhan_ALL.vue
index c7f785b..ea6e26c 100755
--- a/src/components/Pages/Keluhan/Rekap/RKeluhan_ALL.vue
+++ b/src/components/Pages/Keluhan/Rekap/RKeluhan_ALL.vue
@@ -395,13 +395,13 @@
       </DxSummary>
 
       <template #formatTime="{ data }">
-        <p class="cursor-pointer !text-right" @click="showDialogDataSelected()">
+        <p class="cursor-pointer !text-right" @click="showDetail()">
           {{ parseInt(data.text) ? formatWaktu(data.text) : '-' }}
         </p>
       </template>
 
       <template #formatNumber="{ data }">
-        <p class="text-right cursor-pointer" @click="showDialogDataSelected()">
+        <p class="text-right cursor-pointer" @click="showDetail()">
           {{
             isNumber(data.text)
               ? data.column.caption == '%'
@@ -413,7 +413,7 @@
       </template>
 
       <template #formatText="{ data }">
-        <p class="cursor-pointer !text-left" @click="showDialogDataSelected()">
+        <p class="cursor-pointer !text-left" @click="showDetail()">
           {{ data.text }}
         </p>
       </template>
@@ -421,9 +421,9 @@
   </div>
 
   <DetailDialog
-    :open="dialogDataSelected"
+    :open="dialogDetail"
     title="Detail Rekapitulasi Keluhan All"
-    @on-close="closeDialogDataSelected"
+    @on-close="closedialogDetail"
     :full-width="true"
   >
     <div class="w-full mb-4 lg:w-[70%] lg:float-left">
@@ -444,10 +444,10 @@
           column-resizing-mode="widget"
         >
           <DxSelection mode="single" />
-          <DxPaging :page-size="5" :enabled="true" />
+          <DxPaging :page-size="20" :enabled="true" />
           <DxPager
             :visible="true"
-            :allowed-page-sizes="[5, 10, 20]"
+            :allowed-page-sizes="[20, 50, 100]"
             display-mode="full"
             :show-page-size-selector="true"
             :show-info="true"
@@ -800,8 +800,8 @@ const data = ref<any[]>([])
 const dataSub = ref<any[]>([])
 const dataSelected = ref<any>()
 const dataSubSelected = ref<any>()
-const dialogDataSelected = ref(false)
-const closeDialogDataSelected = () => (dialogDataSelected.value = false)
+const dialogDetail = ref(false)
+const closedialogDetail = () => (dialogDetail.value = false)
 const loadingData = ref(false)
 const loadingSubData = ref(false)
 
@@ -851,8 +851,8 @@ const getDetail = () => {
   dataSub.value = dummyData.keluhan.rekap.rekapitulasiKeluhanAll
 }
 
-const showDialogDataSelected = () => {
-  dialogDataSelected.value = true
+const showDetail = () => {
+  dialogDetail.value = true
   getDetail()
 }
 
diff --git a/src/components/Pages/Keluhan/Rekap/RKeluhan_BerdasarMedia.vue b/src/components/Pages/Keluhan/Rekap/RKeluhan_BerdasarMedia.vue
index a817bfe..891f2dd 100755
--- a/src/components/Pages/Keluhan/Rekap/RKeluhan_BerdasarMedia.vue
+++ b/src/components/Pages/Keluhan/Rekap/RKeluhan_BerdasarMedia.vue
@@ -100,7 +100,7 @@
       </DxSummary>
 
       <template #formatNumber="{ data }">
-        <p class="!text-right cursor-pointer" @click="showDialogDataSelected()">
+        <p class="!text-right cursor-pointer" @click="showDetail()">
           {{
             isNumber(data.text)
               ? data.column.caption == '%'
@@ -112,7 +112,7 @@
       </template>
 
       <template #formatText="{ data }">
-        <p class="text-left cursor-pointer" @click="showDialogDataSelected()">
+        <p class="text-left cursor-pointer" @click="showDetail()">
           {{ data.text }}
         </p>
       </template>
@@ -120,9 +120,9 @@
   </div>
 
   <DetailDialog
-    :open="dialogDataSelected"
+    :open="dialogDetail"
     title="Rekapitulasi Keluhan Berdasarkan Media"
-    @on-close="closeDialogDataSelected"
+    @on-close="closedialogDetail"
     :full-width="true"
   >
     <div class="w-full mb-4 lg:w-[70%] lg:float-left">
@@ -143,10 +143,10 @@
           column-resizing-mode="widget"
         >
           <DxSelection mode="single" />
-          <DxPaging :page-size="5" :enabled="true" />
+          <DxPaging :page-size="20" :enabled="true" />
           <DxPager
             :visible="true"
-            :allowed-page-sizes="[5, 10, 20]"
+            :allowed-page-sizes="[20, 50, 100]"
             display-mode="full"
             :show-page-size-selector="true"
             :show-info="true"
@@ -500,8 +500,8 @@ const data = ref<any[]>([])
 const dataSub = ref<any[]>([])
 const dataSelected = ref<any>()
 const dataSubSelected = ref<any>()
-const dialogDataSelected = ref(false)
-const closeDialogDataSelected = () => (dialogDataSelected.value = false)
+const dialogDetail = ref(false)
+const closedialogDetail = () => (dialogDetail.value = false)
 const loadingData = ref(false)
 const loadingSubData = ref(false)
 
@@ -554,8 +554,8 @@ const filterData = (params: any) => {
 
 const getDetail = () => {}
 
-const showDialogDataSelected = () => {
-  dialogDataSelected.value = true
+const showDetail = () => {
+  dialogDetail.value = true
   console.log(dataSelected.value)
   getDetail()
 }
diff --git a/src/components/Pages/Keluhan/Rekap/RKeluhan_PerFungsiBidang.vue b/src/components/Pages/Keluhan/Rekap/RKeluhan_PerFungsiBidang.vue
index a7f94f7..1f7686f 100755
--- a/src/components/Pages/Keluhan/Rekap/RKeluhan_PerFungsiBidang.vue
+++ b/src/components/Pages/Keluhan/Rekap/RKeluhan_PerFungsiBidang.vue
@@ -363,12 +363,12 @@
       </DxSummary>
 
       <template #formatTime="{ data }">
-        <p class="cursor-pointer !text-right" @click="showDialogDataSelected()">
+        <p class="cursor-pointer !text-right" @click="showDetail()">
           {{ parseInt(data.text) ? formatWaktu(data.text) : '-' }}
         </p>
       </template>
       <template #formatNumber="{ data }">
-        <p class="text-right cursor-pointer" @click="showDialogDataSelected()">
+        <p class="text-right cursor-pointer" @click="showDetail()">
           {{
             isNumber(data.text)
               ? data.column.caption == '%'
@@ -380,7 +380,7 @@
       </template>
 
       <template #formatText="{ data }">
-        <p class="cursor-pointer !text-left" @click="showDialogDataSelected()">
+        <p class="cursor-pointer !text-left" @click="showDetail()">
           {{ data.text }}
         </p>
       </template>
@@ -388,9 +388,9 @@
   </div>
 
   <DetailDialog
-    :open="dialogDataSelected"
+    :open="dialogDetail"
     title="Rekapitulasi Keluhan Per Fungsi Bidang"
-    @on-close="closeDialogDataSelected"
+    @on-close="closedialogDetail"
     :full-width="true"
   >
     <div class="w-full mb-4 lg:w-[70%] lg:float-left">
@@ -411,10 +411,10 @@
           column-resizing-mode="widget"
         >
           <DxSelection mode="single" />
-          <DxPaging :page-size="5" :enabled="true" />
+          <DxPaging :page-size="20" :enabled="true" />
           <DxPager
             :visible="true"
-            :allowed-page-sizes="[5, 10, 20]"
+            :allowed-page-sizes="[20, 50, 100]"
             display-mode="full"
             :show-page-size-selector="true"
             :show-info="true"
@@ -775,8 +775,8 @@ const data = ref<any[]>([])
 const dataSub = ref<any[]>([])
 const dataSelected = ref<any>()
 const dataSubSelected = ref<any>()
-const dialogDataSelected = ref(false)
-const closeDialogDataSelected = () => (dialogDataSelected.value = false)
+const dialogDetail = ref(false)
+const closedialogDetail = () => (dialogDetail.value = false)
 const loadingData = ref(false)
 const loadingSubData = ref(false)
 
@@ -828,8 +828,8 @@ const getDetail = () => {
   dataSub.value = dummyData.keluhan.rekap.rekapitulasiKeluhanPenyelesaianPerFungsiBidang
 }
 
-const showDialogDataSelected = () => {
-  dialogDataSelected.value = true
+const showDetail = () => {
+  dialogDetail.value = true
   getDetail()
 }
 
diff --git a/src/components/Pages/Keluhan/Rekap/RKeluhan_PerJenisKeluhan.vue b/src/components/Pages/Keluhan/Rekap/RKeluhan_PerJenisKeluhan.vue
index 6d179b5..65c093b 100755
--- a/src/components/Pages/Keluhan/Rekap/RKeluhan_PerJenisKeluhan.vue
+++ b/src/components/Pages/Keluhan/Rekap/RKeluhan_PerJenisKeluhan.vue
@@ -517,13 +517,13 @@
       </DxSummary>
 
       <template #formatTime="{ data }">
-        <p class="cursor-pointer !text-right" @click="showDialogDataSelected()">
+        <p class="cursor-pointer !text-right" @click="showDetail()">
           {{ parseInt(data.text) ? formatWaktu(data.text) : '-' }}
         </p>
       </template>
 
       <template #formatNumber="{ data }">
-        <p class="text-right cursor-pointer" @click="showDialogDataSelected()">
+        <p class="text-right cursor-pointer" @click="showDetail()">
           {{
             isNumber(data.text)
               ? data.column.caption == '%'
@@ -535,7 +535,7 @@
       </template>
 
       <template #formatText="{ data }">
-        <p class="text-left cursor-pointer" @click="showDialogDataSelected()">
+        <p class="text-left cursor-pointer" @click="showDetail()">
           {{ data.text }}
         </p>
       </template>
@@ -543,9 +543,9 @@
   </div>
 
   <DetailDialog
-    :open="dialogDataSelected"
+    :open="dialogDetail"
     title="Rekapitulasi Keluhan Per Jenis Keluhan"
-    @on-close="closeDialogDataSelected"
+    @on-close="closedialogDetail"
     :full-width="true"
   >
     <div class="w-full mb-4 lg:w-[70%] lg:float-left">
@@ -566,10 +566,10 @@
           column-resizing-mode="widget"
         >
           <DxSelection mode="single" />
-          <DxPaging :page-size="5" :enabled="true" />
+          <DxPaging :page-size="20" :enabled="true" />
           <DxPager
             :visible="true"
-            :allowed-page-sizes="[5, 10, 20]"
+            :allowed-page-sizes="[20, 50, 100]"
             display-mode="full"
             :show-page-size-selector="true"
             :show-info="true"
@@ -923,8 +923,8 @@ const data = ref<any[]>([])
 const dataSub = ref<any[]>([])
 const dataSelected = ref<any>()
 const dataSubSelected = ref<any>()
-const dialogDataSelected = ref(false)
-const closeDialogDataSelected = () => (dialogDataSelected.value = false)
+const dialogDetail = ref(false)
+const closedialogDetail = () => (dialogDetail.value = false)
 const loadingData = ref(false)
 const loadingSubData = ref(false)
 
@@ -977,8 +977,8 @@ const getDetail = () => {
   // dataSub.value = dummyData.keluhan.rekap.rekapitulasiKeluhanPerJenisKeluhan
 }
 
-const showDialogDataSelected = () => {
-  dialogDataSelected.value = true
+const showDetail = () => {
+  dialogDetail.value = true
   getDetail()
 }
 
diff --git a/src/components/Pages/Keluhan/Rekap/RKeluhan_PerKelompokKeluhan.vue b/src/components/Pages/Keluhan/Rekap/RKeluhan_PerKelompokKeluhan.vue
index 649edba..74e9283 100755
--- a/src/components/Pages/Keluhan/Rekap/RKeluhan_PerKelompokKeluhan.vue
+++ b/src/components/Pages/Keluhan/Rekap/RKeluhan_PerKelompokKeluhan.vue
@@ -374,13 +374,13 @@
       </DxSummary>
 
       <template #formatTime="{ data }">
-        <p class="!text-right cursor-pointer" @click="showDialogDataSelected()">
+        <p class="!text-right cursor-pointer" @click="showDetail()">
           {{ parseInt(data.text) ? formatWaktu(data.text) : '-' }}
         </p>
       </template>
 
       <template #formatNumber="{ data }">
-        <p class="text-right cursor-pointer" @click="showDialogDataSelected()">
+        <p class="text-right cursor-pointer" @click="showDetail()">
           {{
             isNumber(data.text)
               ? data.column.caption == '%'
@@ -392,7 +392,7 @@
       </template>
 
       <template #formatText="{ data }">
-        <p class="!text-left cursor-pointer" @click="showDialogDataSelected()">
+        <p class="!text-left cursor-pointer" @click="showDetail()">
           {{ data.text }}
         </p>
       </template>
@@ -400,9 +400,9 @@
   </div>
 
   <DetailDialog
-    :open="dialogDataSelected"
+    :open="dialogDetail"
     title="Detail Rekapitulasi  Keluhan Per Kelompok Keluhan"
-    @on-close="closeDialogDataSelected"
+    @on-close="closedialogDetail"
     :full-width="true"
   >
     <div class="w-full mb-4 lg:w-[70%] lg:float-left">
@@ -423,10 +423,10 @@
           column-resizing-mode="widget"
         >
           <DxSelection mode="single" />
-          <DxPaging :page-size="5" :enabled="true" />
+          <DxPaging :page-size="20" :enabled="true" />
           <DxPager
             :visible="true"
-            :allowed-page-sizes="[5, 10, 20]"
+            :allowed-page-sizes="[20, 50, 100]"
             display-mode="full"
             :show-page-size-selector="true"
             :show-info="true"
@@ -781,8 +781,8 @@ const data = ref<any[]>([])
 const dataSub = ref<any[]>([])
 const dataSelected = ref<any>()
 const dataSubSelected = ref<any>()
-const dialogDataSelected = ref(false)
-const closeDialogDataSelected = () => (dialogDataSelected.value = false)
+const dialogDetail = ref(false)
+const closedialogDetail = () => (dialogDetail.value = false)
 const loadingData = ref(false)
 const loadingSubData = ref(false)
 
@@ -835,8 +835,8 @@ const getDetail = () => {
   dataSub.value = dummyData.keluhan.rekap.rekapitulasiKeluhanPerKelompokKeluhan
 }
 
-const showDialogDataSelected = () => {
-  dialogDataSelected.value = true
+const showDetail = () => {
+  dialogDetail.value = true
   getDetail()
 }
 
diff --git a/src/components/Pages/Keluhan/Rekap/RKeluhan_PerTanggal.vue b/src/components/Pages/Keluhan/Rekap/RKeluhan_PerTanggal.vue
index db84940..d7f77e9 100755
--- a/src/components/Pages/Keluhan/Rekap/RKeluhan_PerTanggal.vue
+++ b/src/components/Pages/Keluhan/Rekap/RKeluhan_PerTanggal.vue
@@ -373,17 +373,17 @@
       </DxSummary>
 
       <template #formatTime="{ data }">
-        <p class="!text-right cursor-pointer" @click="showDialogDataSelected()">
+        <p class="!text-right cursor-pointer" @click="showDetail()">
           {{ parseInt(data.text) ? formatWaktu(data.text) : '-' }}
         </p>
       </template>
 
       <template #percent="{ data }">
-        <p class="cursor-pointer" @click="showDialogDataSelected()">{{ data.text }}%</p>
+        <p class="cursor-pointer" @click="showDetail()">{{ data.text }}%</p>
       </template>
 
       <template #formatNumber="{ data }">
-        <p class="text-right cursor-pointer" @click="showDialogDataSelected()">
+        <p class="text-right cursor-pointer" @click="showDetail()">
           {{
             isNumber(data.text)
               ? data.column.caption == '%'
@@ -395,7 +395,7 @@
       </template>
 
       <template #formatText="{ data }">
-        <p class="text-left cursor-pointer" @click="showDialogDataSelected()">
+        <p class="text-left cursor-pointer" @click="showDetail()">
           {{ data.text }}
         </p>
       </template>
@@ -403,9 +403,9 @@
   </div>
 
   <DetailDialog
-    :open="dialogDataSelected"
+    :open="dialogDetail"
     title="Rekapitulasi Keluhan Per Tanggal"
-    @on-close="closeDialogDataSelected"
+    @on-close="closedialogDetail"
     :full-width="true"
   >
     <div class="w-full mb-4 lg:w-[70%] lg:float-left">
@@ -426,10 +426,10 @@
           column-resizing-mode="widget"
         >
           <DxSelection mode="single" />
-          <DxPaging :page-size="5" :enabled="true" />
+          <DxPaging :page-size="20" :enabled="true" />
           <DxPager
             :visible="true"
-            :allowed-page-sizes="[5, 10, 20]"
+            :allowed-page-sizes="[20, 50, 100]"
             display-mode="full"
             :show-page-size-selector="true"
             :show-info="true"
@@ -784,8 +784,8 @@ const data = ref<any[]>([])
 const dataSub = ref<any[]>([])
 const dataSelected = ref<any>()
 const dataSubSelected = ref<any>()
-const dialogDataSelected = ref(false)
-const closeDialogDataSelected = () => (dialogDataSelected.value = false)
+const dialogDetail = ref(false)
+const closedialogDetail = () => (dialogDetail.value = false)
 const loadingData = ref(false)
 const loadingSubData = ref(false)
 
@@ -835,8 +835,8 @@ const getDetail = () => {
   dataSub.value = dummyData.keluhan.rekap.rekapitulasiKeluhanPerTanggal
 }
 
-const showDialogDataSelected = () => {
-  dialogDataSelected.value = true
+const showDetail = () => {
+  dialogDetail.value = true
   getDetail()
 }
 
diff --git a/src/components/Pages/Keluhan/Rekap/RKeluhan_PerUnit.vue b/src/components/Pages/Keluhan/Rekap/RKeluhan_PerUnit.vue
index 8b5558e..6d72ec1 100755
--- a/src/components/Pages/Keluhan/Rekap/RKeluhan_PerUnit.vue
+++ b/src/components/Pages/Keluhan/Rekap/RKeluhan_PerUnit.vue
@@ -516,13 +516,13 @@
       </DxSummary>
 
       <template #formatTime="{ data }">
-        <p class="cursor-pointer !text-right" @click="showDialogDataSelected()">
+        <p class="cursor-pointer !text-right" @click="showDetail()">
           {{ parseInt(data.text) ? formatWaktu(data.text) : '-' }}
         </p>
       </template>
 
       <template #formatNumber="{ data }">
-        <p class="!text-right cursor-pointer" @click="showDialogDataSelected()">
+        <p class="!text-right cursor-pointer" @click="showDetail()">
           {{
             isNumber(data.text)
               ? data.column.caption == '%'
@@ -534,7 +534,7 @@
       </template>
 
       <template #formatText="{ data }">
-        <p class="text-left cursor-pointer" @click="showDialogDataSelected()">
+        <p class="text-left cursor-pointer" @click="showDetail()">
           {{ data.text }}
         </p>
       </template>
@@ -542,9 +542,9 @@
   </div>
 
   <DetailDialog
-    :open="dialogDataSelected"
+    :open="dialogDetail"
     title="Rekapitulasi Keluhan Per Unit"
-    @on-close="closeDialogDataSelected"
+    @on-close="closedialogDetail"
     :full-width="true"
   >
     <div class="w-full mb-4 lg:w-[70%] lg:float-left">
@@ -565,10 +565,10 @@
           column-resizing-mode="widget"
         >
           <DxSelection mode="single" />
-          <DxPaging :page-size="5" :enabled="true" />
+          <DxPaging :page-size="20" :enabled="true" />
           <DxPager
             :visible="true"
-            :allowed-page-sizes="[5, 10, 20]"
+            :allowed-page-sizes="[20, 50, 100]"
             display-mode="full"
             :show-page-size-selector="true"
             :show-info="true"
@@ -921,8 +921,8 @@ const data = ref<any[]>([])
 const dataSub = ref<any[]>([])
 const dataSelected = ref<any>()
 const dataSubSelected = ref<any>()
-const dialogDataSelected = ref(false)
-const closeDialogDataSelected = () => (dialogDataSelected.value = false)
+const dialogDetail = ref(false)
+const closedialogDetail = () => (dialogDetail.value = false)
 const loadingData = ref(false)
 const loadingSubData = ref(false)
 
@@ -972,8 +972,8 @@ const getDetail = () => {
   // dataSub.value = dummyData.keluhan.rekap.rekapitulasiKeluhanPerUnit
 }
 
-const showDialogDataSelected = () => {
-  dialogDataSelected.value = true
+const showDetail = () => {
+  dialogDetail.value = true
   console.log(dataSelected.value)
   getDetail()
 }
diff --git a/src/components/Pages/Material/Daftar/Material_DGMYG.vue b/src/components/Pages/Material/Daftar/Material_DGMYG.vue
index 3f9d4fe..f805c3f 100755
--- a/src/components/Pages/Material/Daftar/Material_DGMYG.vue
+++ b/src/components/Pages/Material/Daftar/Material_DGMYG.vue
@@ -18,10 +18,10 @@
       column-resizing-mode="widget"
     >
       <DxSelection mode="single" />
-      <DxPaging :page-size="5" :enabled="true" />
+      <DxPaging :page-size="20" :enabled="true" />
       <DxPager
         :visible="true"
-        :allowed-page-sizes="[5, 10, 20]"
+        :allowed-page-sizes="[20, 50, 100]"
         display-mode="full"
         :show-page-size-selector="true"
         :show-info="true"
diff --git a/src/components/Pages/Material/Rekap/Material_RPM.vue b/src/components/Pages/Material/Rekap/Material_RPM.vue
index 3c740da..9559694 100755
--- a/src/components/Pages/Material/Rekap/Material_RPM.vue
+++ b/src/components/Pages/Material/Rekap/Material_RPM.vue
@@ -18,10 +18,10 @@
       column-resizing-mode="widget"
     >
       <DxSelection mode="single" />
-      <DxPaging :page-size="5" :enabled="true" />
+      <DxPaging :page-size="20" :enabled="true" />
       <DxPager
         :visible="true"
-        :allowed-page-sizes="[5, 10, 20]"
+        :allowed-page-sizes="[20, 50, 100]"
         display-mode="full"
         :show-page-size-selector="true"
         :show-info="true"
diff --git a/src/components/Pages/Monalisa/Gangguan/Rekap/MonalisaGR_GangguanBelumSelesai.vue b/src/components/Pages/Monalisa/Gangguan/Rekap/MonalisaGR_GangguanBelumSelesai.vue
index 8fb0985..2272075 100755
--- a/src/components/Pages/Monalisa/Gangguan/Rekap/MonalisaGR_GangguanBelumSelesai.vue
+++ b/src/components/Pages/Monalisa/Gangguan/Rekap/MonalisaGR_GangguanBelumSelesai.vue
@@ -153,10 +153,10 @@
           column-resizing-mode="widget"
         >
           <DxSelection mode="single" />
-          <DxPaging :page-size="5" :enabled="true" />
+          <DxPaging :page-size="20" :enabled="true" />
           <DxPager
             :visible="true"
-            :allowed-page-sizes="[5, 10, 20]"
+            :allowed-page-sizes="[20, 50, 100]"
             display-mode="full"
             :show-page-size-selector="true"
             :show-info="true"
diff --git a/src/components/Pages/Monalisa/Laporan/Bulanan/MonalisaLB_AgingComplaint.vue b/src/components/Pages/Monalisa/Laporan/Bulanan/MonalisaLB_AgingComplaint.vue
index 9121241..b43971f 100755
--- a/src/components/Pages/Monalisa/Laporan/Bulanan/MonalisaLB_AgingComplaint.vue
+++ b/src/components/Pages/Monalisa/Laporan/Bulanan/MonalisaLB_AgingComplaint.vue
@@ -349,9 +349,9 @@
   </div>
 
   <DetailDialog
-    :open="dialogDataSelected"
+    :open="dialogDetail"
     title="Detail (Monalisa) Aging Complaint"
-    @on-close="closeDialogDataSelected"
+    @on-close="closedialogDetail"
     :full-width="true"
   >
     <div class="w-full mb-4 lg:w-[70%] lg:float-left">
@@ -372,10 +372,10 @@
           column-resizing-mode="widget"
         >
           <DxSelection mode="single" />
-          <DxPaging :page-size="5" :enabled="true" />
+          <DxPaging :page-size="20" :enabled="true" />
           <DxPager
             :visible="true"
-            :allowed-page-sizes="[5, 10, 20]"
+            :allowed-page-sizes="[20, 50, 100]"
             display-mode="full"
             :show-page-size-selector="true"
             :show-info="true"
@@ -699,8 +699,8 @@ const data = ref<any[]>([])
 const dataSub = ref<any[]>([])
 const dataSelected = ref<any>(null)
 const dataSubSelected = ref<any>(null)
-const dialogDataSelected = ref(false)
-const closeDialogDataSelected = () => (dialogDataSelected.value = false)
+const dialogDetail = ref(false)
+const closedialogDetail = () => (dialogDetail.value = false)
 const loadingData = ref(false)
 const loadingSubData = ref(false)
 
@@ -762,11 +762,11 @@ const getDetail = () => {
   // })
 }
 
-const showDialogDataSelected = () => {
+const showDetail = () => {
   if (dataSelected.value != null) {
     dataSub.value = []
     dataSubSelected.value = null
-    dialogDataSelected.value = true
+    dialogDetail.value = true
 
     getDetail()
   }
@@ -776,7 +776,7 @@ const onDataSelectionChanged = ({ selectedRowsData }: any) => {
   const data = selectedRowsData[0]
   dataSelected.value = data
 
-  showDialogDataSelected()
+  showDetail()
 }
 
 const onDataSubSelectionChanged = ({ selectedRowsData }: any) => {
diff --git a/src/components/Pages/Monalisa/Laporan/Bulanan/MonalisaLB_PenurunanJumlahKomplain.vue b/src/components/Pages/Monalisa/Laporan/Bulanan/MonalisaLB_PenurunanJumlahKomplain.vue
index 835d9c3..b301c74 100755
--- a/src/components/Pages/Monalisa/Laporan/Bulanan/MonalisaLB_PenurunanJumlahKomplain.vue
+++ b/src/components/Pages/Monalisa/Laporan/Bulanan/MonalisaLB_PenurunanJumlahKomplain.vue
@@ -651,7 +651,7 @@
       </DxSummary>
 
       <template #formatNumber="{ data }">
-        <p class="text-right cursor-pointer" @click="showDialogDataSelected()">
+        <p class="text-right cursor-pointer" @click="showDetail()">
           {{
             isNumber(data.text)
               ? data.column.caption == '%'
@@ -663,13 +663,13 @@
       </template>
 
       <template #formatPercentage="{ data }">
-        <p class="text-right cursor-pointer" @click="showDialogDataSelected()">
+        <p class="text-right cursor-pointer" @click="showDetail()">
           {{ parseFloat(data.text) ? formatPercentage(data.text) : '0%' }}
         </p>
       </template>
 
       <template #formatText="{ data }">
-        <p class="text-left cursor-pointer" @click="showDialogDataSelected()">
+        <p class="text-left cursor-pointer" @click="showDetail()">
           {{ data.text }}
         </p>
       </template>
@@ -677,9 +677,9 @@
   </div>
 
   <DetailDialog
-    :open="dialogDataSelected"
+    :open="dialogDetail"
     title="Detail (Monalisa) Penurunan Jumlah Komplain"
-    @on-close="closeDialogDataSelected"
+    @on-close="closedialogDetail"
     :full-width="true"
   >
     <div class="w-full mb-4 lg:w-[70%] lg:float-left">
@@ -700,10 +700,10 @@
           column-resizing-mode="widget"
         >
           <DxSelection mode="single" />
-          <DxPaging :page-size="5" :enabled="true" />
+          <DxPaging :page-size="20" :enabled="true" />
           <DxPager
             :visible="true"
-            :allowed-page-sizes="[5, 10, 20]"
+            :allowed-page-sizes="[20, 50, 100]"
             display-mode="full"
             :show-page-size-selector="true"
             :show-info="true"
@@ -1027,8 +1027,8 @@ const data = ref<any[]>([])
 const dataSub = ref<any[]>([])
 const dataSelected = ref<any>(null)
 const dataSubSelected = ref<any>(null)
-const dialogDataSelected = ref(false)
-const closeDialogDataSelected = () => (dialogDataSelected.value = false)
+const dialogDetail = ref(false)
+const closedialogDetail = () => (dialogDetail.value = false)
 const loadingData = ref(false)
 const loadingSubData = ref(false)
 
@@ -1090,11 +1090,11 @@ const getDetail = () => {
   // })
 }
 
-const showDialogDataSelected = () => {
+const showDetail = () => {
   if (dataSelected.value != null) {
     dataSub.value = []
     dataSubSelected.value = null
-    dialogDataSelected.value = true
+    dialogDetail.value = true
 
     getDetail()
   }
@@ -1104,7 +1104,7 @@ const onDataSelectionChanged = ({ selectedRowsData }: any) => {
   const data = selectedRowsData[0]
   dataSelected.value = data
 
-  showDialogDataSelected()
+  showDetail()
 }
 
 const onDataSubSelectionChanged = ({ selectedRowsData }: any) => {
diff --git a/src/components/Pages/PencarianData/PencarianData.vue b/src/components/Pages/PencarianData/PencarianData.vue
index 16ea407..4211126 100755
--- a/src/components/Pages/PencarianData/PencarianData.vue
+++ b/src/components/Pages/PencarianData/PencarianData.vue
@@ -19,10 +19,10 @@
       column-resizing-mode="widget"
     >
       <DxSelection mode="single" />
-      <DxPaging :page-size="5" :enabled="true" />
+      <DxPaging :page-size="20" :enabled="true" />
       <DxPager
         :visible="true"
-        :allowed-page-sizes="[5, 10, 20]"
+        :allowed-page-sizes="[20, 50, 100]"
         display-mode="full"
         :show-page-size-selector="true"
         :show-info="true"
diff --git a/src/utils/api/api.graphql.ts b/src/utils/api/api.graphql.ts
index a665cdf..4869d68 100755
--- a/src/utils/api/api.graphql.ts
+++ b/src/utils/api/api.graphql.ts
@@ -909,9 +909,6 @@ export const queries = {
             idUid: $idUid
             idUp3: $idUp3
           ) {
-            id_posko
-            id_uid
-            id_up3
             id
             id_fasilitas
             sub_kelompok