From 30f8e9927e4d814696802072c257e6f15d90bae9 Mon Sep 17 00:00:00 2001
From: Dede Fuji Abdul <defuj.official@gmail.com>
Date: Thu, 29 Feb 2024 08:45:43 +0700
Subject: [PATCH 01/12] Update Table_28.vue and add PencarianData.vue

---
 src/components/Pages/Keluhan/Table_28.vue                 | 8 ++++----
 .../PencarianData/{Table_71.vue => PencarianData.vue}     | 0
 src/components/Pages/PencarianData/index.ts               | 2 +-
 3 files changed, 5 insertions(+), 5 deletions(-)
 rename src/components/Pages/PencarianData/{Table_71.vue => PencarianData.vue} (100%)

diff --git a/src/components/Pages/Keluhan/Table_28.vue b/src/components/Pages/Keluhan/Table_28.vue
index 1b0935e..8fbe988 100755
--- a/src/components/Pages/Keluhan/Table_28.vue
+++ b/src/components/Pages/Keluhan/Table_28.vue
@@ -16,7 +16,7 @@
       <DxExport :enabled="true" :formats="['pdf', 'xlsx', 'document']" :allow-export-selected-data="false" />
       <DxColumnFixing :enabled="true" />
 
-      <DxColumn :width="170" data-field="nama_ulp" caption="Nama Unit" css-class="custom-table-column"
+      <DxColumn alignment="center" :width="170" data-field="nama_ulp" caption="Nama Unit" css-class="custom-table-column"
         cell-template="data" header-cell-template="title-header" />
       <DxColumn alignment="center" caption="Response Time" css-class="custom-table-column">
         <DxColumn :width="150" alignment="center" data-field="total" data-type="number" caption="Total"
@@ -53,14 +53,14 @@
           css-class="custom-table-column" cell-template="data" />
       </DxColumn>
       <template #data="{ data }">
-        <p class="cursor-pointer" @click="showDialog()">
+        <p class="text-left cursor-pointer" @click="showDialog()">
           {{ data.text }}
         </p>
       </template>
 
       <template #title-header="{ data }">
-        <p class="text-center">
-          {{ data.text }}
+        <p class="w-full text-center">
+          {{ data.column.caption }}
         </p>
       </template>
     </DxDataGrid>
diff --git a/src/components/Pages/PencarianData/Table_71.vue b/src/components/Pages/PencarianData/PencarianData.vue
similarity index 100%
rename from src/components/Pages/PencarianData/Table_71.vue
rename to src/components/Pages/PencarianData/PencarianData.vue
diff --git a/src/components/Pages/PencarianData/index.ts b/src/components/Pages/PencarianData/index.ts
index 012e268..a1475cb 100755
--- a/src/components/Pages/PencarianData/index.ts
+++ b/src/components/Pages/PencarianData/index.ts
@@ -1 +1 @@
-export { default as PencarianDataTable1 } from '@/components/Pages/PencarianData/Table_71.vue'
\ No newline at end of file
+export { default as PencarianDataTable1 } from '@/components/Pages/PencarianData/PencarianData.vue'
\ No newline at end of file

From b848dcdac66137438f5efbf6b543364f68fe5038 Mon Sep 17 00:00:00 2001
From: Dede Fuji Abdul <defuj.official@gmail.com>
Date: Thu, 29 Feb 2024 08:46:57 +0700
Subject: [PATCH 02/12] Add Transaksi.vue component and update index.ts

---
 src/components/Pages/Transaksi/{Table_70.vue => Transaksi.vue} | 0
 src/components/Pages/Transaksi/index.ts                        | 2 +-
 2 files changed, 1 insertion(+), 1 deletion(-)
 rename src/components/Pages/Transaksi/{Table_70.vue => Transaksi.vue} (100%)

diff --git a/src/components/Pages/Transaksi/Table_70.vue b/src/components/Pages/Transaksi/Transaksi.vue
similarity index 100%
rename from src/components/Pages/Transaksi/Table_70.vue
rename to src/components/Pages/Transaksi/Transaksi.vue
diff --git a/src/components/Pages/Transaksi/index.ts b/src/components/Pages/Transaksi/index.ts
index 9335e94..e80f721 100755
--- a/src/components/Pages/Transaksi/index.ts
+++ b/src/components/Pages/Transaksi/index.ts
@@ -1 +1 @@
-export { default as TransaksiTable1 } from '@/components/Pages/Transaksi/Table_70.vue'
\ No newline at end of file
+export { default as TransaksiTable1 } from '@/components/Pages/Transaksi/Transaksi.vue'
\ No newline at end of file

From a68fae3cdfd26b2a265dafc7660b778916a20701 Mon Sep 17 00:00:00 2001
From: Dede Fuji Abdul <defuj.official@gmail.com>
Date: Thu, 29 Feb 2024 08:50:35 +0700
Subject: [PATCH 03/12] Update Material page components

---
 .../Material/{Table_68.vue => Daftar/Material_DGMYG.vue}      | 0
 .../Pages/Material/{Table_69.vue => Rekap/Material_RPM.vue}   | 0
 src/components/Pages/Material/index.ts                        | 4 ++--
 3 files changed, 2 insertions(+), 2 deletions(-)
 rename src/components/Pages/Material/{Table_68.vue => Daftar/Material_DGMYG.vue} (100%)
 rename src/components/Pages/Material/{Table_69.vue => Rekap/Material_RPM.vue} (100%)

diff --git a/src/components/Pages/Material/Table_68.vue b/src/components/Pages/Material/Daftar/Material_DGMYG.vue
similarity index 100%
rename from src/components/Pages/Material/Table_68.vue
rename to src/components/Pages/Material/Daftar/Material_DGMYG.vue
diff --git a/src/components/Pages/Material/Table_69.vue b/src/components/Pages/Material/Rekap/Material_RPM.vue
similarity index 100%
rename from src/components/Pages/Material/Table_69.vue
rename to src/components/Pages/Material/Rekap/Material_RPM.vue
diff --git a/src/components/Pages/Material/index.ts b/src/components/Pages/Material/index.ts
index 6eed0fc..0f8e48c 100755
--- a/src/components/Pages/Material/index.ts
+++ b/src/components/Pages/Material/index.ts
@@ -1,2 +1,2 @@
-export { default as MaterialTable1 } from '@/components/Pages/Material/Table_68.vue'
-export { default as MaterialTable2 } from '@/components/Pages/Material/Table_69.vue'
\ No newline at end of file
+export { default as MaterialTable1 } from '@/components/Pages/Material/Daftar/Material_DGMYG.vue'
+export { default as MaterialTable2 } from '@/components/Pages/Material/Rekap/Material_RPM.vue'
\ No newline at end of file

From dca6e86ca98a68a09c5d0ccf168aa6aed0371a4a Mon Sep 17 00:00:00 2001
From: Dede Fuji Abdul <defuj.official@gmail.com>
Date: Thu, 29 Feb 2024 08:54:35 +0700
Subject: [PATCH 04/12] Add CTT LaporanCttKwhPeriksa component

---
 .../Pages/Ctt/{Table_67.vue => CTT_LaporanCttKwhPeriksa.vue}    | 0
 src/components/Pages/Ctt/index.ts                               | 2 +-
 2 files changed, 1 insertion(+), 1 deletion(-)
 rename src/components/Pages/Ctt/{Table_67.vue => CTT_LaporanCttKwhPeriksa.vue} (100%)

diff --git a/src/components/Pages/Ctt/Table_67.vue b/src/components/Pages/Ctt/CTT_LaporanCttKwhPeriksa.vue
similarity index 100%
rename from src/components/Pages/Ctt/Table_67.vue
rename to src/components/Pages/Ctt/CTT_LaporanCttKwhPeriksa.vue
diff --git a/src/components/Pages/Ctt/index.ts b/src/components/Pages/Ctt/index.ts
index e93864f..d8dad69 100755
--- a/src/components/Pages/Ctt/index.ts
+++ b/src/components/Pages/Ctt/index.ts
@@ -1 +1 @@
-export { default as CttTable1 } from '@/components/Pages/Ctt/Table_67.vue'
\ No newline at end of file
+export { default as CttTable1 } from '@/components/Pages/Ctt/CTT_LaporanCttKwhPeriksa.vue'
\ No newline at end of file

From 13f8cc64143d9f36fd5c262cb331308cd1aa4f2d Mon Sep 17 00:00:00 2001
From: Dede Fuji Abdul <defuj.official@gmail.com>
Date: Thu, 29 Feb 2024 09:16:06 +0700
Subject: [PATCH 05/12] Update environment variables and file paths

---
 .env.development                                         | 4 ++--
 src/components/Pages/Anomali/{ => Gangguan}/Table_61.vue | 2 +-
 src/components/Pages/Anomali/{ => Gangguan}/Table_62.vue | 0
 src/components/Pages/Anomali/{ => Keluhan}/Table_65.vue  | 2 +-
 src/components/Pages/Anomali/{ => Keluhan}/Table_66.vue  | 0
 src/components/Pages/Anomali/index.ts                    | 8 ++++----
 6 files changed, 8 insertions(+), 8 deletions(-)
 rename src/components/Pages/Anomali/{ => Gangguan}/Table_61.vue (99%)
 rename src/components/Pages/Anomali/{ => Gangguan}/Table_62.vue (100%)
 rename src/components/Pages/Anomali/{ => Keluhan}/Table_65.vue (99%)
 rename src/components/Pages/Anomali/{ => Keluhan}/Table_66.vue (100%)

diff --git a/.env.development b/.env.development
index 37809dd..73a96a0 100755
--- a/.env.development
+++ b/.env.development
@@ -2,5 +2,5 @@ VITE_BASE_URL=http://localhost:5173
 VITE_BASE_DIRECTORY=/
 VITE_APP_VERSION=0.0.1
 VITE_APP_NAME='Executive Information System'
-VITE_APP_GRAPHQL_ENDPOINT=http://192.168.5.213:32169/graphql
-VITE_APP_REST_ENDPOINT=http://192.168.5.213:32180
\ No newline at end of file
+VITE_APP_GRAPHQL_ENDPOINT=http://192.168.191.163:32169/graphql
+VITE_APP_REST_ENDPOINT=http://192.168.191.163:32180
\ No newline at end of file
diff --git a/src/components/Pages/Anomali/Table_61.vue b/src/components/Pages/Anomali/Gangguan/Table_61.vue
similarity index 99%
rename from src/components/Pages/Anomali/Table_61.vue
rename to src/components/Pages/Anomali/Gangguan/Table_61.vue
index 7026dc0..43cc45c 100755
--- a/src/components/Pages/Anomali/Table_61.vue
+++ b/src/components/Pages/Anomali/Gangguan/Table_61.vue
@@ -112,7 +112,7 @@ 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 { AnomaliTable2 } from '.'
+import { AnomaliTable2 } from '../.'
 import { Type4 } from '@/components/Form/FiltersType'
 import Filters from '@/components/Form/Filters.vue'
 import { useQuery } from '@vue/apollo-composable'
diff --git a/src/components/Pages/Anomali/Table_62.vue b/src/components/Pages/Anomali/Gangguan/Table_62.vue
similarity index 100%
rename from src/components/Pages/Anomali/Table_62.vue
rename to src/components/Pages/Anomali/Gangguan/Table_62.vue
diff --git a/src/components/Pages/Anomali/Table_65.vue b/src/components/Pages/Anomali/Keluhan/Table_65.vue
similarity index 99%
rename from src/components/Pages/Anomali/Table_65.vue
rename to src/components/Pages/Anomali/Keluhan/Table_65.vue
index c6edbe8..4306252 100755
--- a/src/components/Pages/Anomali/Table_65.vue
+++ b/src/components/Pages/Anomali/Keluhan/Table_65.vue
@@ -90,7 +90,7 @@ 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 { AnomaliTable6 } from '.'
+import { AnomaliTable6 } from '../.'
 import { Type4 } from '@/components/Form/FiltersType'
 import { useQuery } from '@vue/apollo-composable'
 import gql from 'graphql-tag'
diff --git a/src/components/Pages/Anomali/Table_66.vue b/src/components/Pages/Anomali/Keluhan/Table_66.vue
similarity index 100%
rename from src/components/Pages/Anomali/Table_66.vue
rename to src/components/Pages/Anomali/Keluhan/Table_66.vue
diff --git a/src/components/Pages/Anomali/index.ts b/src/components/Pages/Anomali/index.ts
index eeedd38..99e79bb 100755
--- a/src/components/Pages/Anomali/index.ts
+++ b/src/components/Pages/Anomali/index.ts
@@ -1,6 +1,6 @@
-export { default as AnomaliTable1 } from '@/components/Pages/Anomali/Table_61.vue'
-export { default as AnomaliTable2 } from '@/components/Pages/Anomali/Table_62.vue'
+export { default as AnomaliTable1 } from '@/components/Pages/Anomali/Gangguan/Table_61.vue'
+export { default as AnomaliTable2 } from '@/components/Pages/Anomali/Gangguan/Table_62.vue'
 export { default as AnomaliTable3 } from '@/components/Pages/Anomali/Table_63.vue'
 export { default as AnomaliTable4 } from '@/components/Pages/Anomali/Table_64.vue'
-export { default as AnomaliTable5 } from '@/components/Pages/Anomali/Table_65.vue'
-export { default as AnomaliTable6 } from '@/components/Pages/Anomali/Table_66.vue'
\ No newline at end of file
+export { default as AnomaliTable5 } from '@/components/Pages/Anomali/Keluhan/Table_65.vue'
+export { default as AnomaliTable6 } from '@/components/Pages/Anomali/Keluhan/Table_66.vue'
\ No newline at end of file

From b3312b4c0bcb14c51470ce1e8dfec7e28bd2fa7d Mon Sep 17 00:00:00 2001
From: Dede Fuji Abdul <defuj.official@gmail.com>
Date: Thu, 29 Feb 2024 09:39:31 +0700
Subject: [PATCH 06/12] Update Anomali component and router imports

---
 .../Pages/Anomali/Gangguan/Anomali_LAPPGU.vue | 86 +++++++++++++++++
 .../{Table_62.vue => Anomali_LAPPGU_LPP.vue}  | 28 +++---
 .../{Table_61.vue => Anomali_LAPPGU_LPT.vue}  | 95 +++----------------
 src/components/Pages/Anomali/index.ts         |  5 +-
 src/router/index.ts                           |  9 +-
 5 files changed, 119 insertions(+), 104 deletions(-)
 create mode 100644 src/components/Pages/Anomali/Gangguan/Anomali_LAPPGU.vue
 rename src/components/Pages/Anomali/Gangguan/{Table_62.vue => Anomali_LAPPGU_LPP.vue} (77%)
 rename src/components/Pages/Anomali/Gangguan/{Table_61.vue => Anomali_LAPPGU_LPT.vue} (72%)

diff --git a/src/components/Pages/Anomali/Gangguan/Anomali_LAPPGU.vue b/src/components/Pages/Anomali/Gangguan/Anomali_LAPPGU.vue
new file mode 100644
index 0000000..30cefed
--- /dev/null
+++ b/src/components/Pages/Anomali/Gangguan/Anomali_LAPPGU.vue
@@ -0,0 +1,86 @@
+<template>
+    <Filters @run-search="() => filterData(filters)" class="mb-4">
+        <Type4 @update:filters="(value) => filters = value" />
+    </Filters>
+
+    <AnomaliTable1 :data="data" />
+    <AnomaliTable2 />
+</template>
+
+<script setup lang="ts">
+import { Type4 } from '@/components/Form/FiltersType'
+import Filters from '@/components/Form/Filters.vue'
+import { AnomaliTable2, AnomaliTable1 } from '../.'
+import { useQuery } from '@vue/apollo-composable'
+import gql from 'graphql-tag'
+import { ref } from 'vue'
+const data = ref<any[]>([])
+
+const GET_laporanAnomaliPenangananPengaduanGangguanPetugas = gql`
+  query laporanAnomaliPenangananPengaduanGangguanPetugas($dateFrom: Date!, $dateTo: Date!, $posko: String, $idUid: Int, $idUp3: Int) {
+    laporanAnomaliPenangananPengaduanGangguanPetugas(
+      dateFrom: $dateFrom
+      dateTo: $dateTo
+      posko: $posko
+      idUid: $idUid
+      idUp3: $idUp3
+    ) {
+        nama_posko
+        persen_penyelesaian_petugas_anomali_cc_123_marking
+        persen_penyelesaian_petugas_anomali_cc_123_non_marking
+        persen_penyelesaian_petugas_anomali_marking
+        persen_penyelesaian_petugas_anomali_non_marking
+        persen_penyelesaian_petugas_anomali_pln_mobile_marking
+        persen_penyelesaian_petugas_anomali_pln_mobile_non_marking
+        total_penyelesaian_petugas_anomali_cc_123_marking
+        total_penyelesaian_petugas_anomali_cc_123_non_marking
+        total_penyelesaian_petugas_anomali_marking
+        total_penyelesaian_petugas_anomali_non_marking
+        total_penyelesaian_petugas_anomali_pln_mobile_marking
+        total_penyelesaian_petugas_anomali_pln_mobile_non_marking
+        total_petugas
+    }
+  }
+`
+
+const filterData = (params: any) => {
+    const { posko, uid, up3 } = params
+    const dateValue = params.periode.split(' s/d ')
+    refetch({
+        dateFrom: dateValue[0] ? dateValue[0].split('-').reverse().join('-') : new Date().toISOString().slice(0, 10),
+        dateTo: dateValue[1] ? dateValue[1].split('-').reverse().join('-') : new Date().toISOString().slice(0, 10),
+        posko: posko ? posko.id : "",
+        idUid: uid ? uid.id : 0,
+        idUp3: up3 ? up3.id : 0
+    })
+    onResult((queryResult) => {
+        if (queryResult.data != undefined) {
+            queryResult.data.daftarGangguanDialihkanKePoskoLain.forEach((item: any) => {
+                data.value = [
+                    ...data.value,
+                    {
+                        ...item,
+                    }
+                ]
+            })
+        }
+        console.log(queryResult.data)
+        console.log(queryResult.loading)
+        console.log(queryResult.networkStatus)
+    })
+    onError((error) => {
+        console.log(error)
+    })
+}
+const { onResult, onError, loading, refetch } = useQuery(
+    GET_laporanAnomaliPenangananPengaduanGangguanPetugas,
+    {
+        dateFrom: new Date().toISOString().slice(0, 10),
+        dateTo: new Date().toISOString().slice(0, 10),
+        posko: '',
+        idUid: 0,
+        idUp3: 0
+    }
+)
+const filters = ref()
+</script>
\ No newline at end of file
diff --git a/src/components/Pages/Anomali/Gangguan/Table_62.vue b/src/components/Pages/Anomali/Gangguan/Anomali_LAPPGU_LPP.vue
similarity index 77%
rename from src/components/Pages/Anomali/Gangguan/Table_62.vue
rename to src/components/Pages/Anomali/Gangguan/Anomali_LAPPGU_LPP.vue
index 6d04224..d9c58f9 100755
--- a/src/components/Pages/Anomali/Gangguan/Table_62.vue
+++ b/src/components/Pages/Anomali/Gangguan/Anomali_LAPPGU_LPP.vue
@@ -4,14 +4,15 @@
             Laporan Pengaduan PLN Mobile
         </h1>
     </div>
-    <DxDataGrid class="max-h-[calc(100vh-140px)]"  :data-source="data" :show-column-lines="true" :show-row-lines="false" :show-borders="true"
-        :row-alternation-enabled="true" :hover-state-enabled="true" @selection-changed="onSelectionChanged"
-        @exporting="onExporting" :allow-column-resizing="true" column-resizing-mode="widget" :word-wrap-enabled="true">
+    <DxDataGrid class="max-h-[calc(100vh-140px)]" :data-source="data" :show-column-lines="true" :show-row-lines="false"
+        :show-borders="true" :row-alternation-enabled="true" :hover-state-enabled="true"
+        @selection-changed="onSelectionChanged" @exporting="onExporting" :allow-column-resizing="true"
+        column-resizing-mode="widget" :word-wrap-enabled="true">
         <DxSelection mode="single" />
         <DxPaging :enabled="false" />
         <DxScrolling column-rendering-mode="virtual" mode="virtual" />
-           <DxLoadPanel :position="position" :show-indicator="showIndicator" :show-pane="showPane" :shading="shading"
-        v-if="loading" v-model:visible="loading" :enabled="true" />
+        <DxLoadPanel :position="position" :show-indicator="showIndicator" :show-pane="showPane" :shading="shading"
+            v-if="loading" v-model:visible="loading" :enabled="true" />
         <DxSearchPanel :visible="true" :highlight-case-sensitive="true" />
         <DxExport :enabled="true" :formats="['pdf', 'xlsx', 'document']" :allow-export-selected-data="false" />
         <DxColumnFixing :enabled="true" />
@@ -42,13 +43,16 @@ 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 { ref } from 'vue'
-const position = { of: '#data' };
-const showIndicator = ref(true);
-const shading = ref(true);
-const showPane = ref(true);
-const loading = ref(true)
-const data = ref<any[]>([])
+import { computed, ref } from 'vue'
+const position = { of: '#data' }
+const showIndicator = ref(true)
+const shading = ref(true)
+const showPane = ref(true)
+const loading = ref(false)
+const props = defineProps({
+    data: Array as () => any[],
+})
+const data = computed(() => props.data)
 
 const onExporting = (e: any) => {
     if (e.format === 'pdf') {
diff --git a/src/components/Pages/Anomali/Gangguan/Table_61.vue b/src/components/Pages/Anomali/Gangguan/Anomali_LAPPGU_LPT.vue
similarity index 72%
rename from src/components/Pages/Anomali/Gangguan/Table_61.vue
rename to src/components/Pages/Anomali/Gangguan/Anomali_LAPPGU_LPT.vue
index 43cc45c..9ba3913 100755
--- a/src/components/Pages/Anomali/Gangguan/Table_61.vue
+++ b/src/components/Pages/Anomali/Gangguan/Anomali_LAPPGU_LPT.vue
@@ -1,7 +1,4 @@
 <template>
-    <Filters @run-search="() => filterData(filters)" class="mb-4">
-        <Type4 @update:filters="(value) => filters = value" />
-    </Filters>
     <div class="mt-4 lg:mt-6 max-w-7xl">
         <h1 class="text-xl font-medium md:text-2xl text-dark">
             Laporan Pengaduan Total
@@ -99,12 +96,10 @@
         </DxColumn>
 
     </DxDataGrid>
-
-    <AnomaliTable2 />
 </template>
 
 <script setup lang="ts">
-import { ref } from 'vue'
+import { computed, ref } from 'vue'
 import { DxDataGrid } from 'devextreme-vue'
 import { DxColumn, DxColumnFixing, DxExport, DxLoadPanel, DxPaging, DxScrolling, DxSearchPanel, DxSelection } from 'devextreme-vue/data-grid'
 import { jsPDF } from 'jspdf'
@@ -112,17 +107,15 @@ 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 { AnomaliTable2 } from '../.'
-import { Type4 } from '@/components/Form/FiltersType'
-import Filters from '@/components/Form/Filters.vue'
-import { useQuery } from '@vue/apollo-composable'
-import gql from 'graphql-tag'
-const position = { of: '#data' };
-const showIndicator = ref(true);
-const shading = ref(true);
-const showPane = ref(true);
-const data = ref<any[]>([])
-
+const position = { of: '#data' }
+const showIndicator = ref(true)
+const loading = ref(false)
+const shading = ref(true)
+const showPane = ref(true)
+const props = defineProps({
+    data: Array as () => any[],
+})
+const data = computed(() => props.data)
 const onExporting = (e: any) => {
     if (e.format === 'pdf') {
         const doc = new jsPDF()
@@ -157,70 +150,6 @@ const onSelectionChanged = ({ selectedRowsData }: any) => {
     console.log(data)
 }
 
-const GET_laporanAnomaliPenangananPengaduanGangguanPetugas = gql`
-  query laporanAnomaliPenangananPengaduanGangguanPetugas($dateFrom: Date!, $dateTo: Date!, $posko: String, $idUid: Int, $idUp3: Int) {
-    laporanAnomaliPenangananPengaduanGangguanPetugas(
-      dateFrom: $dateFrom
-      dateTo: $dateTo
-      posko: $posko
-      idUid: $idUid
-      idUp3: $idUp3
-    ) {
-        nama_posko
-        persen_penyelesaian_petugas_anomali_cc_123_marking
-        persen_penyelesaian_petugas_anomali_cc_123_non_marking
-        persen_penyelesaian_petugas_anomali_marking
-        persen_penyelesaian_petugas_anomali_non_marking
-        persen_penyelesaian_petugas_anomali_pln_mobile_marking
-        persen_penyelesaian_petugas_anomali_pln_mobile_non_marking
-        total_penyelesaian_petugas_anomali_cc_123_marking
-        total_penyelesaian_petugas_anomali_cc_123_non_marking
-        total_penyelesaian_petugas_anomali_marking
-        total_penyelesaian_petugas_anomali_non_marking
-        total_penyelesaian_petugas_anomali_pln_mobile_marking
-        total_penyelesaian_petugas_anomali_pln_mobile_non_marking
-        total_petugas
-    }
-  }
-`
-const filterData = (params: any) => {
-    const { posko, uid, up3 } = params
-    const dateValue = params.periode.split(' s/d ')
-    refetch({
-        dateFrom: dateValue[0] ? dateValue[0].split('-').reverse().join('-') : new Date().toISOString().slice(0, 10),
-        dateTo: dateValue[1] ? dateValue[1].split('-').reverse().join('-') : new Date().toISOString().slice(0, 10),
-        posko: posko ? posko.id : "",
-        idUid: uid ? uid.id : 0,
-        idUp3: up3 ? up3.id : 0
-    })
-    onResult((queryResult) => {
-        if (queryResult.data != undefined) {
-            queryResult.data.daftarGangguanDialihkanKePoskoLain.forEach((item: any) => {
-                data.value = [
-                    ...data.value,
-                    {
-                        ...item,
-                    }
-                ]
-            })
-        }
-        console.log(queryResult.data)
-        console.log(queryResult.loading)
-        console.log(queryResult.networkStatus)
-    })
-    onError((error) => {
-        console.log(error)
-    })
-}
-const { onResult, onError, loading, refetch } = useQuery(
-    GET_laporanAnomaliPenangananPengaduanGangguanPetugas,
-    {
-        dateFrom: new Date().toISOString().slice(0, 10),
-        dateTo: new Date().toISOString().slice(0, 10),
-        posko: '',
-        idUid: 0,
-        idUp3: 0
-    }
-)
-const filters = ref()
+
+
 </script>
\ No newline at end of file
diff --git a/src/components/Pages/Anomali/index.ts b/src/components/Pages/Anomali/index.ts
index 99e79bb..0d9050c 100755
--- a/src/components/Pages/Anomali/index.ts
+++ b/src/components/Pages/Anomali/index.ts
@@ -1,5 +1,6 @@
-export { default as AnomaliTable1 } from '@/components/Pages/Anomali/Gangguan/Table_61.vue'
-export { default as AnomaliTable2 } from '@/components/Pages/Anomali/Gangguan/Table_62.vue'
+export { default as Anomali_LAPPGU } from '@/components/Pages/Anomali/Gangguan/Anomali_LAPPGU.vue'
+export { default as AnomaliTable1 } from '@/components/Pages/Anomali/Gangguan/Anomali_LAPPGU_LPT.vue'
+export { default as AnomaliTable2 } from '@/components/Pages/Anomali/Gangguan/Anomali_LAPPGU_LPP.vue'
 export { default as AnomaliTable3 } from '@/components/Pages/Anomali/Table_63.vue'
 export { default as AnomaliTable4 } from '@/components/Pages/Anomali/Table_64.vue'
 export { default as AnomaliTable5 } from '@/components/Pages/Anomali/Keluhan/Table_65.vue'
diff --git a/src/router/index.ts b/src/router/index.ts
index ea54da9..c973c60 100755
--- a/src/router/index.ts
+++ b/src/router/index.ts
@@ -72,12 +72,7 @@ import {
   MonalisaTable9
 } from '@/components/Pages/Monalisa'
 import { CicoTable1 } from '@/components/Pages/Cico'
-import {
-  AnomaliTable1,
-  AnomaliTable2,
-  AnomaliTable3,
-  AnomaliTable5
-} from '@/components/Pages/Anomali'
+import { Anomali_LAPPGU, AnomaliTable3, AnomaliTable5 } from '@/components/Pages/Anomali'
 import { CttTable1 } from '@/components/Pages/Ctt'
 import { MaterialTable1, MaterialTable2 } from '@/components/Pages/Material'
 import { TransaksiTable1 } from '@/components/Pages/Transaksi'
@@ -565,7 +560,7 @@ export const routes: RouteRecordRaw[] = [
               {
                 path: '1',
                 name: 'Laporan Anomali Penangan Pengaduan Gangguan Unit',
-                component: AnomaliTable1
+                component: Anomali_LAPPGU
               },
               {
                 path: '2',

From 577741f6425e4ca77f0494e15d52bdfaab181550 Mon Sep 17 00:00:00 2001
From: Dede Fuji Abdul <defuj.official@gmail.com>
Date: Thu, 29 Feb 2024 09:41:19 +0700
Subject: [PATCH 07/12] Update Anomali_LAPPGU component and import statements

---
 src/components/Pages/Anomali/Gangguan/Anomali_LAPPGU.vue | 6 +++---
 src/components/Pages/Anomali/index.ts                    | 4 ++--
 2 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/src/components/Pages/Anomali/Gangguan/Anomali_LAPPGU.vue b/src/components/Pages/Anomali/Gangguan/Anomali_LAPPGU.vue
index 30cefed..40bbc69 100644
--- a/src/components/Pages/Anomali/Gangguan/Anomali_LAPPGU.vue
+++ b/src/components/Pages/Anomali/Gangguan/Anomali_LAPPGU.vue
@@ -3,14 +3,14 @@
         <Type4 @update:filters="(value) => filters = value" />
     </Filters>
 
-    <AnomaliTable1 :data="data" />
-    <AnomaliTable2 />
+    <Anomali_LAPPGU_LPT :data="data" />
+    <Anomali_LAPPGU_LPP />
 </template>
 
 <script setup lang="ts">
 import { Type4 } from '@/components/Form/FiltersType'
 import Filters from '@/components/Form/Filters.vue'
-import { AnomaliTable2, AnomaliTable1 } from '../.'
+import { Anomali_LAPPGU_LPP, Anomali_LAPPGU_LPT } from '../.'
 import { useQuery } from '@vue/apollo-composable'
 import gql from 'graphql-tag'
 import { ref } from 'vue'
diff --git a/src/components/Pages/Anomali/index.ts b/src/components/Pages/Anomali/index.ts
index 0d9050c..de20872 100755
--- a/src/components/Pages/Anomali/index.ts
+++ b/src/components/Pages/Anomali/index.ts
@@ -1,6 +1,6 @@
 export { default as Anomali_LAPPGU } from '@/components/Pages/Anomali/Gangguan/Anomali_LAPPGU.vue'
-export { default as AnomaliTable1 } from '@/components/Pages/Anomali/Gangguan/Anomali_LAPPGU_LPT.vue'
-export { default as AnomaliTable2 } from '@/components/Pages/Anomali/Gangguan/Anomali_LAPPGU_LPP.vue'
+export { default as Anomali_LAPPGU_LPT } from '@/components/Pages/Anomali/Gangguan/Anomali_LAPPGU_LPT.vue'
+export { default as Anomali_LAPPGU_LPP } from '@/components/Pages/Anomali/Gangguan/Anomali_LAPPGU_LPP.vue'
 export { default as AnomaliTable3 } from '@/components/Pages/Anomali/Table_63.vue'
 export { default as AnomaliTable4 } from '@/components/Pages/Anomali/Table_64.vue'
 export { default as AnomaliTable5 } from '@/components/Pages/Anomali/Keluhan/Table_65.vue'

From be809d9d5f1db781d24cf2d840abe48122d60be1 Mon Sep 17 00:00:00 2001
From: Dede Fuji Abdul <defuj.official@gmail.com>
Date: Thu, 29 Feb 2024 09:41:46 +0700
Subject: [PATCH 08/12] Update Anomali_LAPPGU_LPP component in
 Anomali_LAPPGU.vue

---
 src/components/Pages/Anomali/Gangguan/Anomali_LAPPGU.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/Pages/Anomali/Gangguan/Anomali_LAPPGU.vue b/src/components/Pages/Anomali/Gangguan/Anomali_LAPPGU.vue
index 40bbc69..d1763ef 100644
--- a/src/components/Pages/Anomali/Gangguan/Anomali_LAPPGU.vue
+++ b/src/components/Pages/Anomali/Gangguan/Anomali_LAPPGU.vue
@@ -4,7 +4,7 @@
     </Filters>
 
     <Anomali_LAPPGU_LPT :data="data" />
-    <Anomali_LAPPGU_LPP />
+    <Anomali_LAPPGU_LPP :data="data" />
 </template>
 
 <script setup lang="ts">

From a6562c8b42b805cb88d2b4542677ae5efedd72cc Mon Sep 17 00:00:00 2001
From: Dede Fuji Abdul <defuj.official@gmail.com>
Date: Thu, 29 Feb 2024 10:41:11 +0700
Subject: [PATCH 09/12] Update Anomali component imports

---
 .../Pages/Anomali/Gangguan/Anomali_LAPPGP.vue | 91 +++++++++++++++++
 .../Anomali_LAPPGP_LPP.vue}                   |  9 +-
 .../Anomali_LAPPGP_LPT.vue}                   | 97 ++-----------------
 .../Pages/Anomali/Keluhan/Anomali_LAPPKU.vue  | 79 +++++++++++++++
 .../{Table_66.vue => Anomali_LAPPKU_LPP.vue}  |  7 +-
 .../{Table_65.vue => Anomali_LAPPKU_LPT.vue}  | 88 ++---------------
 src/components/Pages/Anomali/index.ts         | 12 ++-
 src/router/index.ts                           |  6 +-
 8 files changed, 212 insertions(+), 177 deletions(-)
 create mode 100644 src/components/Pages/Anomali/Gangguan/Anomali_LAPPGP.vue
 rename src/components/Pages/Anomali/{Table_64.vue => Gangguan/Anomali_LAPPGP_LPP.vue} (97%)
 rename src/components/Pages/Anomali/{Table_63.vue => Gangguan/Anomali_LAPPGP_LPT.vue} (63%)
 create mode 100755 src/components/Pages/Anomali/Keluhan/Anomali_LAPPKU.vue
 rename src/components/Pages/Anomali/Keluhan/{Table_66.vue => Anomali_LAPPKU_LPP.vue} (96%)
 rename src/components/Pages/Anomali/Keluhan/{Table_65.vue => Anomali_LAPPKU_LPT.vue} (71%)

diff --git a/src/components/Pages/Anomali/Gangguan/Anomali_LAPPGP.vue b/src/components/Pages/Anomali/Gangguan/Anomali_LAPPGP.vue
new file mode 100644
index 0000000..c70cd0f
--- /dev/null
+++ b/src/components/Pages/Anomali/Gangguan/Anomali_LAPPGP.vue
@@ -0,0 +1,91 @@
+<template>
+    <Filters @run-search="() => filterData(filters)" class="mb-4">
+        <Type4 @update:filters="(value) => filters = value" />
+    </Filters>
+
+    <Anomali_LAPPGP_LPT :data="data" />
+    <Anomali_LAPPGP_LPP :filters-detail="filters" />
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue'
+import { Anomali_LAPPGP_LPT, Anomali_LAPPGP_LPP } from '../.'
+import { useQuery } from '@vue/apollo-composable'
+import gql from 'graphql-tag'
+import { Type4 } from '@/components/Form/FiltersType'
+import Filters from '@/components/Form/Filters.vue'
+const data = ref<any[]>([])
+
+const GET_laporanAnomaliPenangananPengaduanGangguanPetugas = gql`
+  query laporanAnomaliPenangananPengaduanGangguanPetugas($dateFrom: Date!, 
+  $dateTo: Date!, $jenisLaporan: Int, $idUid: Int, $idUp3: Int,$posko: String) {
+    laporanAnomaliPenangananPengaduanGangguanPetugas(
+      dateFrom: $dateFrom
+      dateTo: $dateTo
+      jenisLaporan :$jenisLaporan
+      idUid: $idUid
+      idUp3: $idUp3
+      posko: $posko
+
+    ) {
+        nama_posko
+        persen_penyelesaian_petugas_anomali_cc_123_marking
+        persen_penyelesaian_petugas_anomali_cc_123_non_marking
+        persen_penyelesaian_petugas_anomali_marking
+        persen_penyelesaian_petugas_anomali_non_marking
+        persen_penyelesaian_petugas_anomali_pln_mobile_marking
+        persen_penyelesaian_petugas_anomali_pln_mobile_non_marking
+        total_penyelesaian_petugas_anomali_cc_123_marking
+        total_penyelesaian_petugas_anomali_cc_123_non_marking
+        total_penyelesaian_petugas_anomali_marking
+        total_penyelesaian_petugas_anomali_non_marking
+        total_penyelesaian_petugas_anomali_pln_mobile_marking
+        total_penyelesaian_petugas_anomali_pln_mobile_non_marking
+        total_petugas
+    }
+  }
+`
+const filterData = (params: any) => {
+    const { posko, uid, up3 } = params
+    const dateValue = params.periode.split(' s/d ')
+    refetch({
+        dateFrom: dateValue[0] ? dateValue[0].split('-').reverse().join('-') : new Date().toISOString().slice(0, 10),
+        dateTo: dateValue[1] ? dateValue[1].split('-').reverse().join('-') : new Date().toISOString().slice(0, 10),
+        posko: posko ? posko.id : "",
+        idUid: uid ? uid.id : 0,
+        idUp3: up3 ? up3.id : 0
+    })
+    onResult((queryResult) => {
+        if (queryResult.data != undefined) {
+            queryResult.data.daftarGangguanDialihkanKePoskoLain.forEach((item: any) => {
+                data.value = [
+                    ...data.value,
+                    {
+                        ...item,
+                        total_penyelesaian_petugas_anomali_cc_123: item.total_penyelesaian_petugas_anomali_cc_123_marking + item.total_penyelesaian_petugas_anomali_cc_123_non_marking,
+                        total_penyelesaian_petugas_anomali_pln_mobile: item.total_penyelesaian_petugas_anomali_pln_mobile_marking + item.total_penyelesaian_petugas_anomali_pln_mobile_non_marking,
+                        total_penyelesaian_petugas_anomali: item.total_penyelesaian_petugas_anomali_marking + item.total_penyelesaian_petugas_anomali_non_marking,
+                    }
+                ]
+            })
+        }
+        console.log(queryResult.data)
+        console.log(queryResult.loading)
+        console.log(queryResult.networkStatus)
+    })
+    onError((error) => {
+        console.log(error)
+    })
+}
+const { onResult, onError, loading, refetch } = useQuery(
+    GET_laporanAnomaliPenangananPengaduanGangguanPetugas,
+    {
+        dateFrom: new Date().toISOString().slice(0, 10),
+        dateTo: new Date().toISOString().slice(0, 10),
+        posko: '',
+        idUid: 0,
+        idUp3: 0
+    }
+)
+const filters = ref()
+</script>
\ No newline at end of file
diff --git a/src/components/Pages/Anomali/Table_64.vue b/src/components/Pages/Anomali/Gangguan/Anomali_LAPPGP_LPP.vue
similarity index 97%
rename from src/components/Pages/Anomali/Table_64.vue
rename to src/components/Pages/Anomali/Gangguan/Anomali_LAPPGP_LPP.vue
index 47baed2..86dbfc2 100755
--- a/src/components/Pages/Anomali/Table_64.vue
+++ b/src/components/Pages/Anomali/Gangguan/Anomali_LAPPGP_LPP.vue
@@ -83,9 +83,11 @@ const shading = ref(true);
 const showPane = ref(true);
 const data = ref<any[]>([])
 const filtersDetail = ref({}); // Declare the 'filters' variable
-watch(() => filtersDetail.value, (newValue) => { // Access the 'value' property of the 'filters' ref
-    filterData(newValue)
-}, { immediate: true })
+
+// watch(() => filtersDetail.value, (newValue) => { // Access the 'value' property of the 'filters' ref
+//     filterData(newValue)
+// }, { immediate: true })
+
 const onExporting = (e: any) => {
     if (e.format === 'pdf') {
         const doc = new jsPDF()
@@ -119,6 +121,7 @@ const onSelectionChanged = ({ selectedRowsData }: any) => {
     const data = selectedRowsData[0]
     console.log(data)
 }
+
 const laporanAnomaliDetailPetugasPenangananPengaduanGangguan = gql`
   query laporanAnomaliDetailPetugasPenangananPengaduanGangguan($dateFrom: Date!, 
   $dateTo: Date!, $jenisLaporan: Int, $idUid: Int, $idUp3: Int,$posko: String) {
diff --git a/src/components/Pages/Anomali/Table_63.vue b/src/components/Pages/Anomali/Gangguan/Anomali_LAPPGP_LPT.vue
similarity index 63%
rename from src/components/Pages/Anomali/Table_63.vue
rename to src/components/Pages/Anomali/Gangguan/Anomali_LAPPGP_LPT.vue
index 50753a7..d2ec185 100755
--- a/src/components/Pages/Anomali/Table_63.vue
+++ b/src/components/Pages/Anomali/Gangguan/Anomali_LAPPGP_LPT.vue
@@ -1,7 +1,4 @@
 <template>
-    <Filters @run-search="() => filterData(filters)" class="mb-4">
-        <Type4 @update:filters="(value) => filters = value" />
-    </Filters>
     <div class="mt-4 lg:mt-6 max-w-7xl">
         <h1 class="text-xl font-medium md:text-2xl text-dark">
             Laporan Pengaduan Total
@@ -72,12 +69,10 @@
             </DxColumn>
         </DxColumn>
     </DxDataGrid>
-
-    <AnomaliTable4 :filters-detail="filters" />
 </template>
 
 <script setup lang="ts">
-import { ref } from 'vue'
+import { computed, ref } from 'vue'
 import { DxDataGrid } from 'devextreme-vue'
 import { DxColumn, DxColumnFixing, DxExport, DxLoadPanel, DxPaging, DxScrolling, DxSearchPanel, DxSelection } from 'devextreme-vue/data-grid'
 import { jsPDF } from 'jspdf'
@@ -85,17 +80,16 @@ 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 { AnomaliTable4 } from '.'
-import { useQuery } from '@vue/apollo-composable'
-import gql from 'graphql-tag'
-import { Type4 } from '@/components/Form/FiltersType'
-import Filters from '@/components/Form/Filters.vue'
 
-const position = { of: '#data' };
-const showIndicator = ref(true);
-const shading = ref(true);
-const showPane = ref(true);
-const data = ref<any[]>([])
+const position = { of: '#data' }
+const showIndicator = ref(true)
+const shading = ref(true)
+const showPane = ref(true)
+const loading = ref(false)
+const props = defineProps({
+    data: Array as () => any[],
+})
+const data = computed(() => props.data)
 
 const onExporting = (e: any) => {
     if (e.format === 'pdf') {
@@ -130,76 +124,5 @@ const onSelectionChanged = ({ selectedRowsData }: any) => {
     const data = selectedRowsData[0]
     console.log(data)
 }
-const GET_laporanAnomaliPenangananPengaduanGangguanPetugas = gql`
-  query laporanAnomaliPenangananPengaduanGangguanPetugas($dateFrom: Date!, 
-  $dateTo: Date!, $jenisLaporan: Int, $idUid: Int, $idUp3: Int,$posko: String) {
-    laporanAnomaliPenangananPengaduanGangguanPetugas(
-      dateFrom: $dateFrom
-      dateTo: $dateTo
-      jenisLaporan :$jenisLaporan
-      idUid: $idUid
-      idUp3: $idUp3
-      posko: $posko
 
-    ) {
-        nama_posko
-        persen_penyelesaian_petugas_anomali_cc_123_marking
-        persen_penyelesaian_petugas_anomali_cc_123_non_marking
-        persen_penyelesaian_petugas_anomali_marking
-        persen_penyelesaian_petugas_anomali_non_marking
-        persen_penyelesaian_petugas_anomali_pln_mobile_marking
-        persen_penyelesaian_petugas_anomali_pln_mobile_non_marking
-        total_penyelesaian_petugas_anomali_cc_123_marking
-        total_penyelesaian_petugas_anomali_cc_123_non_marking
-        total_penyelesaian_petugas_anomali_marking
-        total_penyelesaian_petugas_anomali_non_marking
-        total_penyelesaian_petugas_anomali_pln_mobile_marking
-        total_penyelesaian_petugas_anomali_pln_mobile_non_marking
-        total_petugas
-    }
-  }
-`
-const filterData = (params: any) => {
-    const { posko, uid, up3 } = params
-    const dateValue = params.periode.split(' s/d ')
-    refetch({
-        dateFrom: dateValue[0] ? dateValue[0].split('-').reverse().join('-') : new Date().toISOString().slice(0, 10),
-        dateTo: dateValue[1] ? dateValue[1].split('-').reverse().join('-') : new Date().toISOString().slice(0, 10),
-        posko: posko ? posko.id : "",
-        idUid: uid ? uid.id : 0,
-        idUp3: up3 ? up3.id : 0
-    })
-    onResult((queryResult) => {
-        if (queryResult.data != undefined) {
-            queryResult.data.daftarGangguanDialihkanKePoskoLain.forEach((item: any) => {
-                data.value = [
-                    ...data.value,
-                    {
-                        ...item,
-                        total_penyelesaian_petugas_anomali_cc_123: item.total_penyelesaian_petugas_anomali_cc_123_marking + item.total_penyelesaian_petugas_anomali_cc_123_non_marking,
-                        total_penyelesaian_petugas_anomali_pln_mobile: item.total_penyelesaian_petugas_anomali_pln_mobile_marking + item.total_penyelesaian_petugas_anomali_pln_mobile_non_marking,
-                        total_penyelesaian_petugas_anomali: item.total_penyelesaian_petugas_anomali_marking + item.total_penyelesaian_petugas_anomali_non_marking,
-                    }
-                ]
-            })
-        }
-        console.log(queryResult.data)
-        console.log(queryResult.loading)
-        console.log(queryResult.networkStatus)
-    })
-    onError((error) => {
-        console.log(error)
-    })
-}
-const { onResult, onError, loading, refetch } = useQuery(
-    GET_laporanAnomaliPenangananPengaduanGangguanPetugas,
-    {
-        dateFrom: new Date().toISOString().slice(0, 10),
-        dateTo: new Date().toISOString().slice(0, 10),
-        posko: '',
-        idUid: 0,
-        idUp3: 0
-    }
-)
-const filters = ref()
 </script>
\ No newline at end of file
diff --git a/src/components/Pages/Anomali/Keluhan/Anomali_LAPPKU.vue b/src/components/Pages/Anomali/Keluhan/Anomali_LAPPKU.vue
new file mode 100755
index 0000000..cd86335
--- /dev/null
+++ b/src/components/Pages/Anomali/Keluhan/Anomali_LAPPKU.vue
@@ -0,0 +1,79 @@
+<template>
+    <Filters @run-search="() => filterData(filters)" class="mb-4">
+        <Type4 @update:filters="(value) => filters = value" />
+    </Filters>
+
+    <Anomali_LAPPKU_LPT :data="data" />
+    <Anomali_LAPPKU_LPP :data="data" />
+</template>
+
+<script setup lang="ts">
+import Filters from '@/components/Form/Filters.vue'
+import { ref } from 'vue'
+import { Anomali_LAPPKU_LPT, Anomali_LAPPKU_LPP } from '../.'
+import { Type4 } from '@/components/Form/FiltersType'
+import { useQuery } from '@vue/apollo-composable'
+import gql from 'graphql-tag'
+const data = ref<any[]>([])
+
+const GET_laporanCheckInCheckOut = gql`
+  query laporanCheckInCheckOut($dateFrom: Date!, $dateTo: Date!, $posko: String, $idUid: Int, $idUp3: Int) {
+    laporanCheckInCheckOut(
+      dateFrom: $dateFrom
+      dateTo: $dateTo
+      posko: $posko
+      idUid: $idUid
+      idUp3: $idUp3
+    ) {
+    avg_durasi_wo_gangguan_individual
+    avg_durasi_wo_penugasan_khusus
+    avg_rct_wo_gangguan_individual
+    avg_rpt_wo_gangguan_individual
+    jumlah_wo_gangguan_individual
+    jumlah_wo_penugasan_khusus
+    personil_yantek
+    user_regu
+    }
+  }
+`
+const filterData = (params: any) => {
+    const { posko, uid, up3 } = params
+    const dateValue = params.periode.split(' s/d ')
+    refetch({
+        dateFrom: dateValue[0] ? dateValue[0].split('-').reverse().join('-') : new Date().toISOString().slice(0, 10),
+        dateTo: dateValue[1] ? dateValue[1].split('-').reverse().join('-') : new Date().toISOString().slice(0, 10),
+        posko: posko ? posko.id : "",
+        idUid: uid ? uid.id : 0,
+        idUp3: up3 ? up3.id : 0
+    })
+    onResult((queryResult) => {
+        if (queryResult.data != undefined) {
+            queryResult.data.daftarGangguanDialihkanKePoskoLain.forEach((item: any) => {
+                data.value = [
+                    ...data.value,
+                    {
+                        ...item,
+                    }
+                ]
+            })
+        }
+        console.log(queryResult.data)
+        console.log(queryResult.loading)
+        console.log(queryResult.networkStatus)
+    })
+    onError((error) => {
+        console.log(error)
+    })
+}
+const { onResult, onError, loading, refetch } = useQuery(
+    GET_laporanCheckInCheckOut,
+    {
+        dateFrom: new Date().toISOString().slice(0, 10),
+        dateTo: new Date().toISOString().slice(0, 10),
+        posko: '',
+        idUid: 0,
+        idUp3: 0
+    }
+)
+const filters = ref()
+</script>
\ No newline at end of file
diff --git a/src/components/Pages/Anomali/Keluhan/Table_66.vue b/src/components/Pages/Anomali/Keluhan/Anomali_LAPPKU_LPP.vue
similarity index 96%
rename from src/components/Pages/Anomali/Keluhan/Table_66.vue
rename to src/components/Pages/Anomali/Keluhan/Anomali_LAPPKU_LPP.vue
index 456b5df..cc7b1f7 100755
--- a/src/components/Pages/Anomali/Keluhan/Table_66.vue
+++ b/src/components/Pages/Anomali/Keluhan/Anomali_LAPPKU_LPP.vue
@@ -42,12 +42,15 @@ 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 { ref } from 'vue'
+import { computed, ref } from 'vue'
 const position = { of: '#data' };
 const showIndicator = ref(true);
 const shading = ref(true);
 const showPane = ref(true);
-const data = ref<any[]>([])
+const props = defineProps({
+    data: Array as () => any[],
+})
+const data = computed(() => props.data)
 const loading = ref(false)
 
 const onExporting = (e: any) => {
diff --git a/src/components/Pages/Anomali/Keluhan/Table_65.vue b/src/components/Pages/Anomali/Keluhan/Anomali_LAPPKU_LPT.vue
similarity index 71%
rename from src/components/Pages/Anomali/Keluhan/Table_65.vue
rename to src/components/Pages/Anomali/Keluhan/Anomali_LAPPKU_LPT.vue
index 4306252..3619708 100755
--- a/src/components/Pages/Anomali/Keluhan/Table_65.vue
+++ b/src/components/Pages/Anomali/Keluhan/Anomali_LAPPKU_LPT.vue
@@ -1,7 +1,4 @@
 <template>
-    <Filters @run-search="() => filterData(filters)" class="mb-4">
-        <Type4 @update:filters="(value) => filters = value" />
-    </Filters>
     <div class="mt-4 lg:mt-6 max-w-7xl">
         <h1 class="text-xl font-medium md:text-2xl text-dark">
             Laporan Pengaduan Total
@@ -75,14 +72,10 @@
         </DxColumn>
 
     </DxDataGrid>
-
-    <AnomaliTable6 />
 </template>
 
 <script setup lang="ts">
-import Filters from '@/components/Form/Filters.vue'
-
-import { ref } from 'vue'
+import { computed, ref } from 'vue'
 import { DxDataGrid } from 'devextreme-vue'
 import { DxColumn, DxColumnFixing, DxExport, DxLoadPanel, DxPaging, DxScrolling, DxSearchPanel, DxSelection } from 'devextreme-vue/data-grid'
 import { jsPDF } from 'jspdf'
@@ -90,15 +83,15 @@ 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 { AnomaliTable6 } from '../.'
-import { Type4 } from '@/components/Form/FiltersType'
-import { useQuery } from '@vue/apollo-composable'
-import gql from 'graphql-tag'
-const position = { of: '#data' };
-const showIndicator = ref(true);
-const shading = ref(true);
-const showPane = ref(true);
-const data = ref<any[]>([])
+const position = { of: '#data' }
+const showIndicator = ref(true)
+const shading = ref(true)
+const showPane = ref(true)
+const loading = ref(false)
+const props = defineProps({
+    data: Array as () => any[],
+})
+const data = computed(() => props.data)
 
 const onExporting = (e: any) => {
     if (e.format === 'pdf') {
@@ -133,65 +126,4 @@ const onSelectionChanged = ({ selectedRowsData }: any) => {
     const data = selectedRowsData[0]
     console.log(data)
 }
-
-const GET_laporanCheckInCheckOut = gql`
-  query laporanCheckInCheckOut($dateFrom: Date!, $dateTo: Date!, $posko: String, $idUid: Int, $idUp3: Int) {
-    laporanCheckInCheckOut(
-      dateFrom: $dateFrom
-      dateTo: $dateTo
-      posko: $posko
-      idUid: $idUid
-      idUp3: $idUp3
-    ) {
-    avg_durasi_wo_gangguan_individual
-    avg_durasi_wo_penugasan_khusus
-    avg_rct_wo_gangguan_individual
-    avg_rpt_wo_gangguan_individual
-    jumlah_wo_gangguan_individual
-    jumlah_wo_penugasan_khusus
-    personil_yantek
-    user_regu
-    }
-  }
-`
-const filterData = (params: any) => {
-    const { posko, uid, up3 } = params
-    const dateValue = params.periode.split(' s/d ')
-    refetch({
-        dateFrom: dateValue[0] ? dateValue[0].split('-').reverse().join('-') : new Date().toISOString().slice(0, 10),
-        dateTo: dateValue[1] ? dateValue[1].split('-').reverse().join('-') : new Date().toISOString().slice(0, 10),
-        posko: posko ? posko.id : "",
-        idUid: uid ? uid.id : 0,
-        idUp3: up3 ? up3.id : 0
-    })
-    onResult((queryResult) => {
-        if (queryResult.data != undefined) {
-            queryResult.data.daftarGangguanDialihkanKePoskoLain.forEach((item: any) => {
-                data.value = [
-                    ...data.value,
-                    {
-                        ...item,
-                    }
-                ]
-            })
-        }
-        console.log(queryResult.data)
-        console.log(queryResult.loading)
-        console.log(queryResult.networkStatus)
-    })
-    onError((error) => {
-        console.log(error)
-    })
-}
-const { onResult, onError, loading, refetch } = useQuery(
-    GET_laporanCheckInCheckOut,
-    {
-        dateFrom: new Date().toISOString().slice(0, 10),
-        dateTo: new Date().toISOString().slice(0, 10),
-        posko: '',
-        idUid: 0,
-        idUp3: 0
-    }
-)
-const filters = ref()
 </script>
\ No newline at end of file
diff --git a/src/components/Pages/Anomali/index.ts b/src/components/Pages/Anomali/index.ts
index de20872..68c18b8 100755
--- a/src/components/Pages/Anomali/index.ts
+++ b/src/components/Pages/Anomali/index.ts
@@ -1,7 +1,11 @@
 export { default as Anomali_LAPPGU } from '@/components/Pages/Anomali/Gangguan/Anomali_LAPPGU.vue'
 export { default as Anomali_LAPPGU_LPT } from '@/components/Pages/Anomali/Gangguan/Anomali_LAPPGU_LPT.vue'
 export { default as Anomali_LAPPGU_LPP } from '@/components/Pages/Anomali/Gangguan/Anomali_LAPPGU_LPP.vue'
-export { default as AnomaliTable3 } from '@/components/Pages/Anomali/Table_63.vue'
-export { default as AnomaliTable4 } from '@/components/Pages/Anomali/Table_64.vue'
-export { default as AnomaliTable5 } from '@/components/Pages/Anomali/Keluhan/Table_65.vue'
-export { default as AnomaliTable6 } from '@/components/Pages/Anomali/Keluhan/Table_66.vue'
\ No newline at end of file
+
+export { default as Anomali_LAPPGP } from '@/components/Pages/Anomali/Gangguan/Anomali_LAPPGP.vue'
+export { default as Anomali_LAPPGP_LPT } from '@/components/Pages/Anomali/Gangguan/Anomali_LAPPGP_LPT.vue'
+export { default as Anomali_LAPPGP_LPP } from '@/components/Pages/Anomali/Gangguan/Anomali_LAPPGP_LPP.vue'
+
+export { default as Anomali_LAPPKU } from '@/components/Pages/Anomali/Keluhan/Anomali_LAPPKU.vue'
+export { default as Anomali_LAPPKU_LPT } from '@/components/Pages/Anomali/Keluhan/Anomali_LAPPKU_LPT.vue'
+export { default as Anomali_LAPPKU_LPP } from '@/components/Pages/Anomali/Keluhan/Anomali_LAPPKU_LPP.vue'
\ No newline at end of file
diff --git a/src/router/index.ts b/src/router/index.ts
index c973c60..c3fa744 100755
--- a/src/router/index.ts
+++ b/src/router/index.ts
@@ -72,7 +72,7 @@ import {
   MonalisaTable9
 } from '@/components/Pages/Monalisa'
 import { CicoTable1 } from '@/components/Pages/Cico'
-import { Anomali_LAPPGU, AnomaliTable3, AnomaliTable5 } from '@/components/Pages/Anomali'
+import { Anomali_LAPPGU, Anomali_LAPPKU, Anomali_LAPPGP } from '@/components/Pages/Anomali'
 import { CttTable1 } from '@/components/Pages/Ctt'
 import { MaterialTable1, MaterialTable2 } from '@/components/Pages/Material'
 import { TransaksiTable1 } from '@/components/Pages/Transaksi'
@@ -565,7 +565,7 @@ export const routes: RouteRecordRaw[] = [
               {
                 path: '2',
                 name: 'Laporan Anomali Penangan Pengaduan Gangguan Petugas',
-                component: AnomaliTable3
+                component: Anomali_LAPPGP
               },
               {
                 path: ':pathMatch(.*)*',
@@ -580,7 +580,7 @@ export const routes: RouteRecordRaw[] = [
               {
                 path: '1',
                 name: 'Laporan Anomali Penangan Pengaduan Keluhan Unit',
-                component: AnomaliTable5
+                component: Anomali_LAPPKU
               },
               {
                 path: ':pathMatch(.*)*',

From 2c1bcd989fa537e5a69016bacde664d6d8b4e89d Mon Sep 17 00:00:00 2001
From: Dede Fuji Abdul <defuj.official@gmail.com>
Date: Thu, 29 Feb 2024 10:44:20 +0700
Subject: [PATCH 10/12] Update Cico and Ctt components

---
 .../Pages/Cico/{Table_60.vue => LaporanCICO.vue}          | 0
 src/components/Pages/Cico/index.ts                        | 2 +-
 src/components/Pages/Ctt/index.ts                         | 2 +-
 src/router/index.ts                                       | 8 ++++----
 4 files changed, 6 insertions(+), 6 deletions(-)
 rename src/components/Pages/Cico/{Table_60.vue => LaporanCICO.vue} (100%)

diff --git a/src/components/Pages/Cico/Table_60.vue b/src/components/Pages/Cico/LaporanCICO.vue
similarity index 100%
rename from src/components/Pages/Cico/Table_60.vue
rename to src/components/Pages/Cico/LaporanCICO.vue
diff --git a/src/components/Pages/Cico/index.ts b/src/components/Pages/Cico/index.ts
index afe5ed0..e09ed23 100755
--- a/src/components/Pages/Cico/index.ts
+++ b/src/components/Pages/Cico/index.ts
@@ -1 +1 @@
-export { default as CicoTable1 } from '@/components/Pages/Cico/Table_60.vue'
\ No newline at end of file
+export { default as LaporanCICO } from '@/components/Pages/Cico/LaporanCICO.vue'
\ No newline at end of file
diff --git a/src/components/Pages/Ctt/index.ts b/src/components/Pages/Ctt/index.ts
index d8dad69..9b32a10 100755
--- a/src/components/Pages/Ctt/index.ts
+++ b/src/components/Pages/Ctt/index.ts
@@ -1 +1 @@
-export { default as CttTable1 } from '@/components/Pages/Ctt/CTT_LaporanCttKwhPeriksa.vue'
\ No newline at end of file
+export { default as LaporanCttKwhPeriksa } from '@/components/Pages/Ctt/CTT_LaporanCttKwhPeriksa.vue'
\ No newline at end of file
diff --git a/src/router/index.ts b/src/router/index.ts
index c3fa744..52f1720 100755
--- a/src/router/index.ts
+++ b/src/router/index.ts
@@ -71,9 +71,9 @@ import {
   MonalisaTable8,
   MonalisaTable9
 } from '@/components/Pages/Monalisa'
-import { CicoTable1 } from '@/components/Pages/Cico'
+import { LaporanCICO } from '@/components/Pages/Cico'
 import { Anomali_LAPPGU, Anomali_LAPPKU, Anomali_LAPPGP } from '@/components/Pages/Anomali'
-import { CttTable1 } from '@/components/Pages/Ctt'
+import { LaporanCttKwhPeriksa } from '@/components/Pages/Ctt'
 import { MaterialTable1, MaterialTable2 } from '@/components/Pages/Material'
 import { TransaksiTable1 } from '@/components/Pages/Transaksi'
 import { PencarianDataTable1 } from '@/components/Pages/PencarianData'
@@ -535,7 +535,7 @@ export const routes: RouteRecordRaw[] = [
               {
                 path: '1',
                 name: 'Laporan Check In /Check Out (CICO)',
-                component: CicoTable1
+                component: LaporanCICO
               },
               {
                 path: ':pathMatch(.*)*',
@@ -601,7 +601,7 @@ export const routes: RouteRecordRaw[] = [
           {
             path: '1',
             name: 'Laporan CTT & KWH Periksa',
-            component: CttTable1
+            component: LaporanCttKwhPeriksa
           },
           {
             path: ':pathMatch(.*)*',

From 1f71d22f282ad4af8cda09e31209e229a8de7600 Mon Sep 17 00:00:00 2001
From: Dede Fuji Abdul <defuj.official@gmail.com>
Date: Thu, 29 Feb 2024 10:47:36 +0700
Subject: [PATCH 11/12] Update Material component imports

---
 src/components/Pages/Material/index.ts | 4 ++--
 src/router/index.ts                    | 6 +++---
 2 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/src/components/Pages/Material/index.ts b/src/components/Pages/Material/index.ts
index 0f8e48c..6301386 100755
--- a/src/components/Pages/Material/index.ts
+++ b/src/components/Pages/Material/index.ts
@@ -1,2 +1,2 @@
-export { default as MaterialTable1 } from '@/components/Pages/Material/Daftar/Material_DGMYG.vue'
-export { default as MaterialTable2 } from '@/components/Pages/Material/Rekap/Material_RPM.vue'
\ No newline at end of file
+export { default as MaterialDGMYG } from '@/components/Pages/Material/Daftar/Material_DGMYG.vue'
+export { default as MaterialRPM } from '@/components/Pages/Material/Rekap/Material_RPM.vue'
\ No newline at end of file
diff --git a/src/router/index.ts b/src/router/index.ts
index 52f1720..65d6ee2 100755
--- a/src/router/index.ts
+++ b/src/router/index.ts
@@ -74,7 +74,7 @@ import {
 import { LaporanCICO } from '@/components/Pages/Cico'
 import { Anomali_LAPPGU, Anomali_LAPPKU, Anomali_LAPPGP } from '@/components/Pages/Anomali'
 import { LaporanCttKwhPeriksa } from '@/components/Pages/Ctt'
-import { MaterialTable1, MaterialTable2 } from '@/components/Pages/Material'
+import { MaterialDGMYG, MaterialRPM } from '@/components/Pages/Material'
 import { TransaksiTable1 } from '@/components/Pages/Transaksi'
 import { PencarianDataTable1 } from '@/components/Pages/PencarianData'
 
@@ -620,7 +620,7 @@ export const routes: RouteRecordRaw[] = [
               {
                 path: '1',
                 name: 'Daftar Gangguan Dan Material Yang Dipakai',
-                component: MaterialTable1
+                component: MaterialDGMYG
               },
               {
                 path: ':pathMatch(.*)*',
@@ -635,7 +635,7 @@ export const routes: RouteRecordRaw[] = [
               {
                 path: '1',
                 name: 'Rekapitulasi Pemakaian Material',
-                component: MaterialTable2
+                component: MaterialRPM
               },
               {
                 path: ':pathMatch(.*)*',

From a5f1ded02c0e97e7b44843eaea021b5652b1104f Mon Sep 17 00:00:00 2001
From: Dede Fuji Abdul <defuj.official@gmail.com>
Date: Thu, 29 Feb 2024 11:24:43 +0700
Subject: [PATCH 12/12] Update DxDataGrid class to include mb-10

---
 src/assets/css/style.css                                  | 4 ----
 .../Pages/Anomali/Gangguan/Anomali_LAPPGP_LPP.vue         | 4 ++--
 .../Pages/Anomali/Gangguan/Anomali_LAPPGP_LPT.vue         | 8 ++++----
 .../Pages/Anomali/Gangguan/Anomali_LAPPGU_LPP.vue         | 4 ++--
 .../Pages/Anomali/Gangguan/Anomali_LAPPGU_LPT.vue         | 4 ++--
 .../Pages/Anomali/Keluhan/Anomali_LAPPKU_LPP.vue          | 7 ++++---
 .../Pages/Anomali/Keluhan/Anomali_LAPPKU_LPT.vue          | 8 ++++----
 7 files changed, 18 insertions(+), 21 deletions(-)

diff --git a/src/assets/css/style.css b/src/assets/css/style.css
index 43b09f7..7e4268c 100755
--- a/src/assets/css/style.css
+++ b/src/assets/css/style.css
@@ -1373,10 +1373,6 @@ body {
   margin-top: 1.5rem;
 }
 
-.mb-5 {
-  margin-bottom: 1.25rem;
-}
-
 .mb-10 {
   margin-bottom: 2.5rem;
 }
diff --git a/src/components/Pages/Anomali/Gangguan/Anomali_LAPPGP_LPP.vue b/src/components/Pages/Anomali/Gangguan/Anomali_LAPPGP_LPP.vue
index 0d95bbf..d2aab7a 100755
--- a/src/components/Pages/Anomali/Gangguan/Anomali_LAPPGP_LPP.vue
+++ b/src/components/Pages/Anomali/Gangguan/Anomali_LAPPGP_LPP.vue
@@ -4,8 +4,8 @@
       Laporan Pengaduan PLN Mobile
     </h1>
   </div>
-  <DxDataGrid class="max-h-[calc(100vh-140px)]" :data-source="data" :show-column-lines="true" :show-row-lines="false"
-    :show-borders="true" :row-alternation-enabled="true" :hover-state-enabled="true"
+  <DxDataGrid class="max-h-[calc(100vh-140px)] mb-10" :data-source="data" :show-column-lines="true"
+    :show-row-lines="false" :show-borders="true" :row-alternation-enabled="true" :hover-state-enabled="true"
     @selection-changed="onSelectionChanged" :column-width="100" @exporting="onExporting" :allow-column-resizing="true"
     column-resizing-mode="widget" :word-wrap-enabled="true">
     <DxSelection mode="single" />
diff --git a/src/components/Pages/Anomali/Gangguan/Anomali_LAPPGP_LPT.vue b/src/components/Pages/Anomali/Gangguan/Anomali_LAPPGP_LPT.vue
index ffaf059..2ed71e6 100755
--- a/src/components/Pages/Anomali/Gangguan/Anomali_LAPPGP_LPT.vue
+++ b/src/components/Pages/Anomali/Gangguan/Anomali_LAPPGP_LPT.vue
@@ -4,10 +4,10 @@
       Laporan Pengaduan Total
     </h1>
   </div>
-  <DxDataGrid class="max-h-[calc(100vh-140px)]" :show-column-lines="true" :show-row-lines="false" :show-borders="true"
-    :row-alternation-enabled="true" :hover-state-enabled="true" @selection-changed="onSelectionChanged"
-    :column-width="100" @exporting="onExporting" :allow-column-resizing="true" column-resizing-mode="widget"
-    :word-wrap-enabled="true">
+  <DxDataGrid class="max-h-[calc(100vh-140px)] mb-10" :show-column-lines="true" :show-row-lines="false"
+    :show-borders="true" :row-alternation-enabled="true" :hover-state-enabled="true"
+    @selection-changed="onSelectionChanged" :column-width="100" @exporting="onExporting" :allow-column-resizing="true"
+    column-resizing-mode="widget" :word-wrap-enabled="true">
     <DxSelection mode="single" />
     <DxPaging :enabled="false" />
     <DxScrolling column-rendering-mode="virtual" mode="virtual" />
diff --git a/src/components/Pages/Anomali/Gangguan/Anomali_LAPPGU_LPP.vue b/src/components/Pages/Anomali/Gangguan/Anomali_LAPPGU_LPP.vue
index e3ef7f6..59b1dc4 100755
--- a/src/components/Pages/Anomali/Gangguan/Anomali_LAPPGU_LPP.vue
+++ b/src/components/Pages/Anomali/Gangguan/Anomali_LAPPGU_LPP.vue
@@ -4,8 +4,8 @@
       Laporan Pengaduan PLN Mobile
     </h1>
   </div>
-  <DxDataGrid class="max-h-[calc(100vh-140px)]" :data-source="data" :show-column-lines="true" :show-row-lines="false"
-    :show-borders="true" :row-alternation-enabled="true" :hover-state-enabled="true"
+  <DxDataGrid class="max-h-[calc(100vh-140px)] mb-10" :data-source="data" :show-column-lines="true"
+    :show-row-lines="false" :show-borders="true" :row-alternation-enabled="true" :hover-state-enabled="true"
     @selection-changed="onSelectionChanged" @exporting="onExporting" :allow-column-resizing="true"
     column-resizing-mode="widget" :word-wrap-enabled="true">
     <DxSelection mode="single" />
diff --git a/src/components/Pages/Anomali/Gangguan/Anomali_LAPPGU_LPT.vue b/src/components/Pages/Anomali/Gangguan/Anomali_LAPPGU_LPT.vue
index 5ed15d6..b92f307 100755
--- a/src/components/Pages/Anomali/Gangguan/Anomali_LAPPGU_LPT.vue
+++ b/src/components/Pages/Anomali/Gangguan/Anomali_LAPPGU_LPT.vue
@@ -4,8 +4,8 @@
       Laporan Pengaduan Total
     </h1>
   </div>
-  <DxDataGrid class="max-h-[calc(100vh-140px)]" :data-source="data" :show-column-lines="true" :show-row-lines="false"
-    :show-borders="true" :row-alternation-enabled="true" :hover-state-enabled="true"
+  <DxDataGrid class="max-h-[calc(100vh-140px)] mb-10" :data-source="data" :show-column-lines="true"
+    :show-row-lines="false" :show-borders="true" :row-alternation-enabled="true" :hover-state-enabled="true"
     @selection-changed="onSelectionChanged" :column-width="100" @exporting="onExporting" :allow-column-resizing="true"
     column-resizing-mode="widget" :word-wrap-enabled="true">
     <DxSelection mode="single" />
diff --git a/src/components/Pages/Anomali/Keluhan/Anomali_LAPPKU_LPP.vue b/src/components/Pages/Anomali/Keluhan/Anomali_LAPPKU_LPP.vue
index ce091c9..1c0085b 100755
--- a/src/components/Pages/Anomali/Keluhan/Anomali_LAPPKU_LPP.vue
+++ b/src/components/Pages/Anomali/Keluhan/Anomali_LAPPKU_LPP.vue
@@ -4,9 +4,10 @@
       Laporan Pengaduan PLN Mobile
     </h1>
   </div>
-  <DxDataGrid class="max-h-[calc(100vh-140px)]" :show-column-lines="true" :show-row-lines="false" :show-borders="true"
-    :row-alternation-enabled="true" :hover-state-enabled="true" @selection-changed="onSelectionChanged"
-    @exporting="onExporting" :allow-column-resizing="true" column-resizing-mode="widget" :word-wrap-enabled="true">
+  <DxDataGrid class="max-h-[calc(100vh-140px)] mb-10" :show-column-lines="true" :show-row-lines="false"
+    :show-borders="true" :row-alternation-enabled="true" :hover-state-enabled="true"
+    @selection-changed="onSelectionChanged" @exporting="onExporting" :allow-column-resizing="true"
+    column-resizing-mode="widget" :word-wrap-enabled="true">
     <DxSelection mode="single" />
     <DxPaging :enabled="false" />
     <DxScrolling column-rendering-mode="virtual" mode="virtual" />
diff --git a/src/components/Pages/Anomali/Keluhan/Anomali_LAPPKU_LPT.vue b/src/components/Pages/Anomali/Keluhan/Anomali_LAPPKU_LPT.vue
index 5ebbb35..590e097 100755
--- a/src/components/Pages/Anomali/Keluhan/Anomali_LAPPKU_LPT.vue
+++ b/src/components/Pages/Anomali/Keluhan/Anomali_LAPPKU_LPT.vue
@@ -4,10 +4,10 @@
       Laporan Pengaduan Total
     </h1>
   </div>
-  <DxDataGrid class="max-h-[calc(100vh-140px)]" :show-column-lines="true" :show-row-lines="false" :show-borders="true"
-    :row-alternation-enabled="true" :hover-state-enabled="true" @selection-changed="onSelectionChanged"
-    :column-width="100" @exporting="onExporting" :allow-column-resizing="true" column-resizing-mode="widget"
-    :word-wrap-enabled="true">
+  <DxDataGrid class="max-h-[calc(100vh-140px)] mb-10" :show-column-lines="true" :show-row-lines="false"
+    :show-borders="true" :row-alternation-enabled="true" :hover-state-enabled="true"
+    @selection-changed="onSelectionChanged" :column-width="100" @exporting="onExporting" :allow-column-resizing="true"
+    column-resizing-mode="widget" :word-wrap-enabled="true">
     <DxSelection mode="single" />
     <DxPaging :enabled="false" />
     <DxScrolling column-rendering-mode="virtual" mode="virtual" />