From 1ac15758022a5356af671b838fe4254b71ef29e4 Mon Sep 17 00:00:00 2001
From: Dede Fuji Abdul <defuj.official@gmail.com>
Date: Sun, 31 Mar 2024 21:16:49 +0700
Subject: [PATCH] Update table columns and grouping settings

---
 .../Anomali/Gangguan/Anomali_LAPPGP_LPP.vue   |  1 +
 .../Anomali/Gangguan/Anomali_LAPPGP_LPT.vue   | 33 +++++--
 .../Anomali/Gangguan/Anomali_LAPPGU_LPP.vue   |  2 +
 .../Anomali/Gangguan/Anomali_LAPPGU_LPT.vue   | 35 +++++--
 .../Pages/Ctt/CTT_LaporanCttKwhPeriksa.vue    |  2 +
 .../Pages/Gangguan/Rekap/RGangguan_KTI.vue    | 44 +++++----
 .../Pages/Keluhan/Daftar/DKeluhan_DKUL.vue    |  2 +-
 .../MonalisaGR_DispatchingTimeGangguan.vue    | 91 ++++++++++++++++--
 .../Gangguan/Rekap/MonalisaGR_ENSGangguan.vue | 92 ++++++++++++++++++-
 .../Rekap/MonalisaGR_GangguanBelumSelesai.vue | 50 ++++++++--
 .../MonalisaGR_JumlahDDRPTRCTGangguan.vue     | 10 +-
 .../Gangguan/Rekap/MonalisaGR_LaporUlang.vue  | 33 ++++++-
 .../Rekap/MonalisaGR_RecoveryTimeGangguan.vue | 91 ++++++++++++++++--
 .../Rekap/MonalisaGR_ResponseTimeGangguan.vue | 91 ++++++++++++++++--
 .../MonalisaKR_JumlahDDRPTRCTKeluhan.vue      | 34 +++++--
 .../Rekap/MonalisaKR_JumlahKaliKeluhan.vue    | 24 ++++-
 .../Rekap/MonalisaKR_KeluhanBelumSelesai.vue  | 64 ++++++++++++-
 .../Rekap/MonalisaKR_LaporUlangKeluhan.vue    | 34 ++++++-
 .../Rekap/MonalisaKR_RecoveryTimeKeluhan.vue  | 19 ++--
 .../Rekap/MonalisaKR_ResponseTimeKeluhan.vue  | 19 ++--
 .../Bulanan/MonalisaLB_AgingComplaint.vue     | 19 ++--
 .../Bulanan/MonalisaLB_EnergyNotSales.vue     | 19 ++--
 .../Bulanan/MonalisaLB_KADDalamPelaporan.vue  | 19 ++--
 .../MonalisaLB_PenurunanJumlahKomplain.vue    | 19 ++--
 .../Kumulatif/MonalisaLK_AgingComplaint.vue   | 19 ++--
 .../Kumulatif/MonalisaLK_EnergyNotSales.vue   | 19 ++--
 .../Kumulatif/MonalisaLK_KDADPelaporan.vue    | 19 ++--
 .../MonalisaLK_PenurunanJumlahKomplain.vue    | 19 ++--
 src/utils/api/api.graphql.ts                  | 19 +++-
 src/utils/texts.ts                            |  6 +-
 30 files changed, 792 insertions(+), 156 deletions(-)

diff --git a/src/components/Pages/Anomali/Gangguan/Anomali_LAPPGP_LPP.vue b/src/components/Pages/Anomali/Gangguan/Anomali_LAPPGP_LPP.vue
index 05fb23f..481d60e 100755
--- a/src/components/Pages/Anomali/Gangguan/Anomali_LAPPGP_LPP.vue
+++ b/src/components/Pages/Anomali/Gangguan/Anomali_LAPPGP_LPP.vue
@@ -18,6 +18,7 @@
     column-resizing-mode="widget"
     :word-wrap-enabled="true"
   >
+    <DxGrouping auto-expand-all="false" expand-mode="rowClick" />
     <DxSelection mode="single" />
     <DxPaging :enabled="false" />
     <DxScrolling column-rendering-mode="virtual" mode="virtual" />
diff --git a/src/components/Pages/Anomali/Gangguan/Anomali_LAPPGP_LPT.vue b/src/components/Pages/Anomali/Gangguan/Anomali_LAPPGP_LPT.vue
index 64e842f..7085bec 100755
--- a/src/components/Pages/Anomali/Gangguan/Anomali_LAPPGP_LPT.vue
+++ b/src/components/Pages/Anomali/Gangguan/Anomali_LAPPGP_LPT.vue
@@ -19,7 +19,7 @@
     :word-wrap-enabled="true"
     :data-source="data"
   >
-    <DxGrouping expand-mode="rowClick" />
+    <DxGrouping expand-mode="rowClick" :auto-expand-all="false" />
     <DxSelection mode="single" />
     <DxPaging :enabled="false" />
     <DxScrolling column-rendering-mode="virtual" mode="virtual" />
@@ -50,15 +50,36 @@
       cell-template="formatText"
     />
     <DxColumn
-      :width="170"
       alignment="center"
-      data-field="nama_ulp"
-      caption="Nama Unit"
+      :min-width="170"
+      data-type="text"
+      data-field=""
+      caption="Semua Unit"
       css-class="custom-table-column"
-      cell-template="formatText"
-      name="namaUnit"
       :group-index="0"
     />
+    <DxColumn
+      alignment="center"
+      :min-width="170"
+      data-type="text"
+      data-field="id_uid"
+      caption="UID"
+      css-class="custom-table-column"
+      :group-index="1"
+      name="namaUID"
+      :calculate-group-value="(rowData: any) => rowData.nama_uid"
+    />
+    <DxColumn
+      alignment="center"
+      :min-width="170"
+      data-type="text"
+      data-field="id_up3"
+      caption="UP3"
+      css-class="custom-table-column"
+      :group-index="1"
+      name="namaUID"
+      :calculate-group-value="(rowData: any) => rowData.nama_up3"
+    />
     <DxColumn alignment="center" caption="Total Petugas" css-class="custom-table-column">
       <DxColumn
         :width="170"
diff --git a/src/components/Pages/Anomali/Gangguan/Anomali_LAPPGU_LPP.vue b/src/components/Pages/Anomali/Gangguan/Anomali_LAPPGU_LPP.vue
index 6120d44..2ad931f 100755
--- a/src/components/Pages/Anomali/Gangguan/Anomali_LAPPGU_LPP.vue
+++ b/src/components/Pages/Anomali/Gangguan/Anomali_LAPPGU_LPP.vue
@@ -18,6 +18,7 @@
     column-resizing-mode="widget"
     :word-wrap-enabled="true"
   >
+    <DxGrouping auto-expand-all="false" expand-mode="rowClick" />
     <DxSelection mode="single" />
     <DxPaging :enabled="false" />
     <DxScrolling column-rendering-mode="virtual" mode="virtual" />
@@ -116,6 +117,7 @@ import {
   DxColumn,
   DxColumnFixing,
   DxExport,
+  DxGrouping,
   DxPaging,
   DxScrolling,
   DxSearchPanel,
diff --git a/src/components/Pages/Anomali/Gangguan/Anomali_LAPPGU_LPT.vue b/src/components/Pages/Anomali/Gangguan/Anomali_LAPPGU_LPT.vue
index 8adfadf..7dae95a 100755
--- a/src/components/Pages/Anomali/Gangguan/Anomali_LAPPGU_LPT.vue
+++ b/src/components/Pages/Anomali/Gangguan/Anomali_LAPPGU_LPT.vue
@@ -19,7 +19,7 @@
     column-resizing-mode="widget"
     :word-wrap-enabled="true"
   >
-    <DxGrouping expand-mode="rowClick" />
+    <DxGrouping expand-mode="rowClick" :auto-expand-all="false" />
     <DxSelection mode="single" />
     <DxPaging :enabled="false" />
     <DxScrolling column-rendering-mode="virtual" mode="virtual" />
@@ -29,7 +29,6 @@
       :show-indicator="showIndicator"
       :show-pane="showPane"
       :shading="shading"
-      v-if="loading"
       v-model:visible="loading"
       :enabled="true"
     />
@@ -49,16 +48,38 @@
       css-class="custom-table-column"
       cell-template="formatText"
     />
+
     <DxColumn
-      :width="170"
       alignment="center"
-      data-field="nama_ulp"
-      caption="Nama Unit"
-      name="namaUnit"
+      :min-width="170"
+      data-type="text"
+      data-field=""
+      caption="Semua Unit"
       css-class="custom-table-column"
-      cell-template="formatText"
       :group-index="0"
     />
+    <DxColumn
+      alignment="center"
+      :min-width="170"
+      data-type="text"
+      data-field="id_uid"
+      caption="UID"
+      css-class="custom-table-column"
+      :group-index="1"
+      name="namaUID"
+      :calculate-group-value="(rowData: any) => rowData.nama_uid"
+    />
+    <DxColumn
+      alignment="center"
+      :min-width="170"
+      data-type="text"
+      data-field="id_up3"
+      caption="UP3"
+      css-class="custom-table-column"
+      :group-index="1"
+      name="namaUID"
+      :calculate-group-value="(rowData: any) => rowData.nama_up3"
+    />
     <DxColumn alignment="center" caption="Total WO" css-class="custom-table-column">
       <DxColumn alignment="center" caption="CC 123" css-class="custom-table-column">
         <DxColumn
diff --git a/src/components/Pages/Ctt/CTT_LaporanCttKwhPeriksa.vue b/src/components/Pages/Ctt/CTT_LaporanCttKwhPeriksa.vue
index 0034d91..15a7393 100755
--- a/src/components/Pages/Ctt/CTT_LaporanCttKwhPeriksa.vue
+++ b/src/components/Pages/Ctt/CTT_LaporanCttKwhPeriksa.vue
@@ -19,6 +19,7 @@
       column-resizing-mode="widget"
       :word-wrap-enabled="true"
     >
+      <DxGrouping auto-expand-all="false" expand-mode="rowClick" />
       <DxSelection mode="single" />
       <DxPaging :enabled="false" />
       <DxScrolling column-rendering-mode="virtual" mode="virtual" />
@@ -171,6 +172,7 @@ import {
   DxColumn,
   DxColumnFixing,
   DxExport,
+  DxGrouping,
   DxLoadPanel,
   DxPaging,
   DxScrolling,
diff --git a/src/components/Pages/Gangguan/Rekap/RGangguan_KTI.vue b/src/components/Pages/Gangguan/Rekap/RGangguan_KTI.vue
index 0fdb696..bb8bcd4 100755
--- a/src/components/Pages/Gangguan/Rekap/RGangguan_KTI.vue
+++ b/src/components/Pages/Gangguan/Rekap/RGangguan_KTI.vue
@@ -1159,22 +1159,26 @@ const groupDialog = ref(false)
 const groupData = ref<any>(null)
 
 const onCellClicked = (e: any) => {
-  if (e.rowType == 'group') {
-    groupDialog.value = true
-    if (e.row.groupIndex != 0) {
-      const data = getDataRowGroup(e.data)
-      console.table(data)
-      groupData.value = data
-    }
-    showDetail()
-  } else {
-    groupDialog.value = false
-  }
+  // if (e.rowType == 'group') {
+  //   groupDialog.value = true
+  //   if (e.row.groupIndex != 0) {
+  //     const data = getDataRowGroup(e.data)
+  //     console.table(data)
+  //     groupData.value = data
+  //   }
+  //   showDetail()
+  // } else {
+  //   groupDialog.value = false
+  // }
 }
 
 const setMonth = (month: any) => {
   if (month != '') {
-    monthSelected.value = getMonthNumber(month)
+    if (getMonthNumber(month) == 0) {
+      monthSelected.value = null
+    } else {
+      monthSelected.value = getMonthNumber(month)
+    }
   } else {
     monthSelected.value = null
   }
@@ -1289,17 +1293,25 @@ const filterData = async (params: any) => {
     idUid: uid ? uid.id : 0,
     idUp3: up3 ? up3.id : 0,
     is_transaksi_individual:
-      jenisTransaksi.length == 4
+      jenisTransaksi.length == 4 || jenisTransaksi.length == 0
         ? 0
         : jenisTransaksi.includes('Koreksi Transaksi Individual')
           ? 1
           : 2,
     is_cleansing_transaksi_tm:
-      jenisTransaksi.length == 4 ? 0 : jenisTransaksi.includes('Cleansing Traksaksi TM') ? 1 : 2,
+      jenisTransaksi.length == 4 || jenisTransaksi.length == 0
+        ? 0
+        : jenisTransaksi.includes('Cleansing Traksaksi TM')
+          ? 1
+          : 2,
     is_koreksi_transaksi_tm:
-      jenisTransaksi.length == 4 ? 0 : jenisTransaksi.includes('Koreksi Transaksi TM') ? 1 : 2,
+      jenisTransaksi.length == 4 || jenisTransaksi.length == 0
+        ? 0
+        : jenisTransaksi.includes('Koreksi Transaksi TM')
+          ? 1
+          : 2,
     is_koreksi_gangguan_dan_anev:
-      jenisTransaksi.length == 4
+      jenisTransaksi.length == 4 || jenisTransaksi.length == 0
         ? 0
         : jenisTransaksi.includes('Koreksi Kode Gangguan dan Anev')
           ? 1
diff --git a/src/components/Pages/Keluhan/Daftar/DKeluhan_DKUL.vue b/src/components/Pages/Keluhan/Daftar/DKeluhan_DKUL.vue
index 80281c2..1c3fcd3 100755
--- a/src/components/Pages/Keluhan/Daftar/DKeluhan_DKUL.vue
+++ b/src/components/Pages/Keluhan/Daftar/DKeluhan_DKUL.vue
@@ -195,7 +195,7 @@
       <DxColumn
         :width="170"
         alignment="center"
-        data-field="nama_ulp"
+        data-field="nama_unit_baru"
         caption="Nama ULP"
         css-class="custom-table-column !align-top"
         cell-template="formatText"
diff --git a/src/components/Pages/Monalisa/Gangguan/Rekap/MonalisaGR_DispatchingTimeGangguan.vue b/src/components/Pages/Monalisa/Gangguan/Rekap/MonalisaGR_DispatchingTimeGangguan.vue
index 0fc23d4..9ad071d 100755
--- a/src/components/Pages/Monalisa/Gangguan/Rekap/MonalisaGR_DispatchingTimeGangguan.vue
+++ b/src/components/Pages/Monalisa/Gangguan/Rekap/MonalisaGR_DispatchingTimeGangguan.vue
@@ -25,7 +25,7 @@
       column-resizing-mode="widget"
       :word-wrap-enabled="true"
     >
-      <DxGrouping expand-mode="rowClick" />
+      <DxGrouping expand-mode="rowClick" :auto-expand-all="false" />
       <DxSelection mode="single" />
       <DxPaging :enabled="false" />
       <DxScrolling column-rendering-mode="virtual" mode="virtual" />
@@ -46,16 +46,38 @@
       />
       <DxColumnFixing :enabled="true" />
 
-      <!-- <DxColumn
+      <DxColumn
         alignment="center"
         :min-width="170"
         data-type="text"
-        data-field="nama_ulp"
-        caption="Nama Unit"
+        data-field="nama_regional"
+        caption="Regional"
         css-class="custom-table-column"
         :group-index="0"
-        name="namaUlp"
-      /> -->
+        name="namaRegional"
+      />
+      <DxColumn
+        alignment="center"
+        :min-width="170"
+        data-type="text"
+        data-field="id_uid"
+        caption="UID"
+        css-class="custom-table-column"
+        :group-index="1"
+        name="namaUID"
+        :calculate-group-value="(rowData: any) => rowData.nama_uid"
+      />
+      <DxColumn
+        alignment="center"
+        :min-width="170"
+        data-type="text"
+        data-field="id_up3"
+        caption="UP3"
+        css-class="custom-table-column"
+        :group-index="1"
+        name="namaUID"
+        :calculate-group-value="(rowData: any) => rowData.nama_up3"
+      />
       <DxColumn
         alignment="center"
         :min-width="170"
@@ -179,6 +201,62 @@
           css-class="text-white !text-right"
           :customize-text="(e: any) => formatPercentage(e.value)"
         />
+
+        <DxGroupItem
+          :show-in-group-footer="false"
+          :align-by-column="true"
+          summary-type="sum"
+          display-format="{0}"
+          show-in-column="mom_bulan_kemarin"
+          column="mom_bulan_kemarin"
+          css-class="!text-right"
+          :customize-text="(e: any) => formatNumber(e.value)"
+        />
+        <DxGroupItem
+          :show-in-group-footer="false"
+          :align-by-column="true"
+          summary-type="sum"
+          show-in-column="mom_bulan_ini"
+          column="mom_bulan_ini"
+          css-class="!text-right"
+          :customize-text="(e: any) => formatNumber(e.value)"
+        />
+        <DxGroupItem
+          :show-in-group-footer="false"
+          :align-by-column="true"
+          summary-type="sum"
+          show-in-column="persen_mom"
+          column="persen_mom"
+          css-class="!text-right"
+          :customize-text="(e: any) => formatPercentage(e.value)"
+        />
+        <DxGroupItem
+          :show-in-group-footer="false"
+          :align-by-column="true"
+          summary-type="sum"
+          show-in-column="yoy_tahun_kemarin"
+          column="yoy_tahun_kemarin"
+          css-class="!text-right"
+          :customize-text="(e: any) => formatNumber(e.value)"
+        />
+        <DxGroupItem
+          :show-in-group-footer="false"
+          :align-by-column="true"
+          summary-type="sum"
+          show-in-column="yoy_tahun_ini"
+          column="yoy_tahun_ini"
+          css-class="!text-right"
+          :customize-text="(e: any) => formatNumber(e.value)"
+        />
+        <DxGroupItem
+          :show-in-group-footer="false"
+          :align-by-column="true"
+          summary-type="sum"
+          show-in-column="persen_yoy"
+          column="persen_yoy"
+          css-class="!text-right"
+          :customize-text="(e: any) => formatPercentage(e.value)"
+        />
       </DxSummary>
 
       <template #formatNumber="{ data }">
@@ -211,6 +289,7 @@ import {
   DxColumn,
   DxColumnFixing,
   DxExport,
+  DxGroupItem,
   DxGrouping,
   DxLoadPanel,
   DxPaging,
diff --git a/src/components/Pages/Monalisa/Gangguan/Rekap/MonalisaGR_ENSGangguan.vue b/src/components/Pages/Monalisa/Gangguan/Rekap/MonalisaGR_ENSGangguan.vue
index 2e45f4a..14d9e18 100755
--- a/src/components/Pages/Monalisa/Gangguan/Rekap/MonalisaGR_ENSGangguan.vue
+++ b/src/components/Pages/Monalisa/Gangguan/Rekap/MonalisaGR_ENSGangguan.vue
@@ -25,6 +25,7 @@
       column-resizing-mode="widget"
       :word-wrap-enabled="true"
     >
+      <DxGrouping :context-menu-enabled="true" expand-mode="rowClick" :auto-expand-all="false" />
       <DxSelection mode="single" />
       <DxPaging :enabled="false" />
       <DxScrolling column-rendering-mode="virtual" mode="virtual" />
@@ -44,7 +45,38 @@
         :allow-export-selected-data="false"
       />
       <DxColumnFixing :enabled="true" />
-
+      <DxColumn
+        alignment="center"
+        :min-width="170"
+        data-type="text"
+        data-field="nama_regional"
+        caption="Regional"
+        css-class="custom-table-column"
+        :group-index="0"
+        name="namaRegional"
+      />
+      <DxColumn
+        alignment="center"
+        :min-width="170"
+        data-type="text"
+        data-field="id_uid"
+        caption="UIW"
+        css-class="custom-table-column"
+        :group-index="1"
+        name="namaUID"
+        :calculate-group-value="(rowData: any) => rowData.nama_uid"
+      />
+      <DxColumn
+        alignment="center"
+        :min-width="170"
+        data-type="text"
+        data-field="id_up3"
+        caption="UP3"
+        css-class="custom-table-column"
+        :group-index="1"
+        name="namaUID"
+        :calculate-group-value="(rowData: any) => rowData.nama_up3"
+      />
       <DxColumn
         alignment="center"
         data-field="nama_ulp"
@@ -180,6 +212,62 @@
           css-class="text-white !text-right"
           :customize-text="(e: any) => formatPercentage(e.value)"
         />
+
+        <DxGroupItem
+          :show-in-group-footer="false"
+          :align-by-column="true"
+          summary-type="sum"
+          display-format="{0}"
+          show-in-column="mom_bulan_kemarin"
+          column="mom_bulan_kemarin"
+          css-class="!text-right"
+          :customize-text="(e: any) => formatNumber(e.value)"
+        />
+        <DxGroupItem
+          :show-in-group-footer="false"
+          :align-by-column="true"
+          summary-type="sum"
+          show-in-column="mom_bulan_ini"
+          column="mom_bulan_ini"
+          css-class="!text-right"
+          :customize-text="(e: any) => formatNumber(e.value)"
+        />
+        <DxGroupItem
+          :show-in-group-footer="false"
+          :align-by-column="true"
+          summary-type="sum"
+          show-in-column="persen_mom"
+          column="persen_mom"
+          css-class="!text-right"
+          :customize-text="(e: any) => formatPercentage(e.value)"
+        />
+        <DxGroupItem
+          :show-in-group-footer="false"
+          :align-by-column="true"
+          summary-type="sum"
+          show-in-column="yoy_tahun_kemarin"
+          column="yoy_tahun_kemarin"
+          css-class="!text-right"
+          :customize-text="(e: any) => formatNumber(e.value)"
+        />
+        <DxGroupItem
+          :show-in-group-footer="false"
+          :align-by-column="true"
+          summary-type="sum"
+          show-in-column="yoy_tahun_ini"
+          column="yoy_tahun_ini"
+          css-class="!text-right"
+          :customize-text="(e: any) => formatNumber(e.value)"
+        />
+        <DxGroupItem
+          :show-in-group-footer="false"
+          :align-by-column="true"
+          summary-type="sum"
+          show-in-column="persen_yoy"
+          column="persen_yoy"
+          css-class="!text-right"
+          :customize-text="(e: any) => formatPercentage(e.value)"
+        />
       </DxSummary>
     </DxDataGrid>
   </div>
@@ -194,6 +282,8 @@ import {
   DxColumn,
   DxColumnFixing,
   DxExport,
+  DxGroupItem,
+  DxGrouping,
   DxLoadPanel,
   DxPaging,
   DxScrolling,
diff --git a/src/components/Pages/Monalisa/Gangguan/Rekap/MonalisaGR_GangguanBelumSelesai.vue b/src/components/Pages/Monalisa/Gangguan/Rekap/MonalisaGR_GangguanBelumSelesai.vue
index caa745c..37b829f 100755
--- a/src/components/Pages/Monalisa/Gangguan/Rekap/MonalisaGR_GangguanBelumSelesai.vue
+++ b/src/components/Pages/Monalisa/Gangguan/Rekap/MonalisaGR_GangguanBelumSelesai.vue
@@ -54,27 +54,35 @@
       />
       <DxColumn
         alignment="center"
+        :min-width="170"
+        data-type="text"
         data-field="nama_regional"
         caption="Regional"
         css-class="custom-table-column"
-        cell-template="formatText"
         :group-index="0"
+        name="namaRegional"
       />
       <DxColumn
         alignment="center"
-        data-field="nama_uid"
+        :min-width="170"
+        data-type="text"
+        data-field="id_uid"
         caption="UIW"
         css-class="custom-table-column"
-        cell-template="formatText"
         :group-index="1"
+        name="namaUID"
+        :calculate-group-value="(rowData: any) => rowData.nama_uid"
       />
       <DxColumn
         alignment="center"
-        data-field="nama_up3"
+        :min-width="170"
+        data-type="text"
+        data-field="id_up3"
         caption="UP3"
         css-class="custom-table-column"
-        cell-template="formatText"
-        :group-index="2"
+        :group-index="1"
+        name="namaUID"
+        :calculate-group-value="(rowData: any) => rowData.nama_up3"
       />
       <DxColumn alignment="center" caption="Tahun" css-class="custom-table-column">
         <DxColumn
@@ -151,6 +159,35 @@
           css-class="text-white !text-right"
           :customize-text="(e: any) => formatNumber(e.value)"
         />
+
+        <DxGroupItem
+          :show-in-group-footer="false"
+          :align-by-column="true"
+          summary-type="sum"
+          display-format="{0}"
+          show-in-column="jumlah_gangguan"
+          column="jumlah_gangguan"
+          css-class="!text-right"
+          :customize-text="(e: any) => formatNumber(e.value)"
+        />
+        <DxGroupItem
+          :show-in-group-footer="false"
+          :align-by-column="true"
+          summary-type="sum"
+          show-in-column="jumlah_informasi"
+          column="jumlah_informasi"
+          css-class="!text-right"
+          :customize-text="(e: any) => formatNumber(e.value)"
+        />
+        <DxGroupItem
+          :show-in-group-footer="false"
+          :align-by-column="true"
+          summary-type="sum"
+          show-in-column="total"
+          column="total"
+          css-class="!text-right"
+          :customize-text="(e: any) => formatPercentage(e.value)"
+        />
       </DxSummary>
     </DxDataGrid>
   </div>
@@ -463,6 +500,7 @@ import {
   DxColumn,
   DxColumnFixing,
   DxExport,
+  DxGroupItem,
   DxGrouping,
   DxLoadPanel,
   DxPager,
diff --git a/src/components/Pages/Monalisa/Gangguan/Rekap/MonalisaGR_JumlahDDRPTRCTGangguan.vue b/src/components/Pages/Monalisa/Gangguan/Rekap/MonalisaGR_JumlahDDRPTRCTGangguan.vue
index 7e9bde9..f2930f4 100755
--- a/src/components/Pages/Monalisa/Gangguan/Rekap/MonalisaGR_JumlahDDRPTRCTGangguan.vue
+++ b/src/components/Pages/Monalisa/Gangguan/Rekap/MonalisaGR_JumlahDDRPTRCTGangguan.vue
@@ -24,7 +24,7 @@
       column-resizing-mode="widget"
       :word-wrap-enabled="true"
     >
-      <DxGrouping expand-mode="rowClick" />
+      <DxGrouping expand-mode="rowClick" :auto-expand-all="false" />
       <DxSelection mode="single" />
       <DxPaging :enabled="false" />
       <DxScrolling column-rendering-mode="virtual" mode="virtual" />
@@ -53,6 +53,14 @@
         css-class="custom-table-column"
         cell-template="formatText"
       />
+      <DxColumn
+        alignment="center"
+        data-field=""
+        caption="NASIONAL"
+        css-class="custom-table-column"
+        cell-template="formatText"
+        :group-index="0"
+      />
       <DxColumn
         alignment="center"
         data-field="nama_regional"
diff --git a/src/components/Pages/Monalisa/Gangguan/Rekap/MonalisaGR_LaporUlang.vue b/src/components/Pages/Monalisa/Gangguan/Rekap/MonalisaGR_LaporUlang.vue
index 14f6958..6de86b8 100755
--- a/src/components/Pages/Monalisa/Gangguan/Rekap/MonalisaGR_LaporUlang.vue
+++ b/src/components/Pages/Monalisa/Gangguan/Rekap/MonalisaGR_LaporUlang.vue
@@ -25,7 +25,7 @@
       column-resizing-mode="widget"
       :word-wrap-enabled="true"
     >
-      <DxGrouping :context-menu-enabled="true" expand-mode="rowClick" />
+      <DxGrouping :context-menu-enabled="true" expand-mode="rowClick" :auto-expand-all="false" />
       <DxSelection mode="single" />
       <DxPaging :enabled="false" />
       <DxScrolling column-rendering-mode="virtual" mode="virtual" />
@@ -55,11 +55,35 @@
       />
       <DxColumn
         alignment="center"
-        data-field="nama_uid"
-        caption="UID"
+        :min-width="170"
+        data-type="text"
+        data-field="nama_regional"
+        caption="Regional"
         css-class="custom-table-column"
-        cell-template="formatText"
         :group-index="0"
+        name="namaRegional"
+      />
+      <DxColumn
+        alignment="center"
+        :min-width="170"
+        data-type="text"
+        data-field="id_uid"
+        caption="UIW"
+        css-class="custom-table-column"
+        :group-index="1"
+        name="namaUID"
+        :calculate-group-value="(rowData: any) => rowData.nama_uid"
+      />
+      <DxColumn
+        alignment="center"
+        :min-width="170"
+        data-type="text"
+        data-field="id_up3"
+        caption="UP3"
+        css-class="custom-table-column"
+        :group-index="1"
+        name="namaUID"
+        :calculate-group-value="(rowData: any) => rowData.nama_up3"
       />
       <DxColumn alignment="center" caption="Lapor Ulang Gangguan" css-class="custom-table-column">
         <DxColumn alignment="center" caption="MoM" css-class="custom-table-column">
@@ -199,6 +223,7 @@
           show-in-column="mom_bulan_kemarin"
           column="mom_bulan_kemarin"
           css-class="!text-right"
+          :customize-text="(e: any) => formatNumber(e.value)"
         />
         <DxGroupItem
           :show-in-group-footer="false"
diff --git a/src/components/Pages/Monalisa/Gangguan/Rekap/MonalisaGR_RecoveryTimeGangguan.vue b/src/components/Pages/Monalisa/Gangguan/Rekap/MonalisaGR_RecoveryTimeGangguan.vue
index 40eafb5..262eb49 100755
--- a/src/components/Pages/Monalisa/Gangguan/Rekap/MonalisaGR_RecoveryTimeGangguan.vue
+++ b/src/components/Pages/Monalisa/Gangguan/Rekap/MonalisaGR_RecoveryTimeGangguan.vue
@@ -25,7 +25,7 @@
       column-resizing-mode="widget"
       :word-wrap-enabled="true"
     >
-      <DxGrouping expand-mode="rowClick" />
+      <DxGrouping expand-mode="rowClick" :auto-expand-all="false" />
       <DxSelection mode="single" />
       <DxPaging :enabled="false" />
       <DxScrolling column-rendering-mode="virtual" mode="virtual" />
@@ -46,16 +46,38 @@
       />
       <DxColumnFixing :enabled="true" />
 
-      <!-- <DxColumn
+      <DxColumn
         alignment="center"
         :min-width="170"
         data-type="text"
-        data-field="nama_ulp"
-        caption="Nama Unit"
+        data-field="nama_regional"
+        caption="Regional"
         css-class="custom-table-column"
         :group-index="0"
-        name="namaUlp"
-      /> -->
+        name="namaRegional"
+      />
+      <DxColumn
+        alignment="center"
+        :min-width="170"
+        data-type="text"
+        data-field="id_uid"
+        caption="UIW"
+        css-class="custom-table-column"
+        :group-index="1"
+        name="namaUID"
+        :calculate-group-value="(rowData: any) => rowData.nama_uid"
+      />
+      <DxColumn
+        alignment="center"
+        :min-width="170"
+        data-type="text"
+        data-field="id_up3"
+        caption="UP3"
+        css-class="custom-table-column"
+        :group-index="1"
+        name="namaUID"
+        :calculate-group-value="(rowData: any) => rowData.nama_up3"
+      />
       <DxColumn
         alignment="center"
         :min-width="170"
@@ -179,6 +201,62 @@
           css-class="text-white !text-right"
           :customize-text="(e: any) => formatPercentage(e.value)"
         />
+
+        <DxGroupItem
+          :show-in-group-footer="false"
+          :align-by-column="true"
+          summary-type="sum"
+          display-format="{0}"
+          show-in-column="mom_bulan_kemarin"
+          column="mom_bulan_kemarin"
+          css-class="!text-right"
+          :customize-text="(e: any) => formatNumber(e.value)"
+        />
+        <DxGroupItem
+          :show-in-group-footer="false"
+          :align-by-column="true"
+          summary-type="sum"
+          show-in-column="mom_bulan_ini"
+          column="mom_bulan_ini"
+          css-class="!text-right"
+          :customize-text="(e: any) => formatNumber(e.value)"
+        />
+        <DxGroupItem
+          :show-in-group-footer="false"
+          :align-by-column="true"
+          summary-type="sum"
+          show-in-column="persen_mom"
+          column="persen_mom"
+          css-class="!text-right"
+          :customize-text="(e: any) => formatPercentage(e.value)"
+        />
+        <DxGroupItem
+          :show-in-group-footer="false"
+          :align-by-column="true"
+          summary-type="sum"
+          show-in-column="yoy_tahun_kemarin"
+          column="yoy_tahun_kemarin"
+          css-class="!text-right"
+          :customize-text="(e: any) => formatNumber(e.value)"
+        />
+        <DxGroupItem
+          :show-in-group-footer="false"
+          :align-by-column="true"
+          summary-type="sum"
+          show-in-column="yoy_tahun_ini"
+          column="yoy_tahun_ini"
+          css-class="!text-right"
+          :customize-text="(e: any) => formatNumber(e.value)"
+        />
+        <DxGroupItem
+          :show-in-group-footer="false"
+          :align-by-column="true"
+          summary-type="sum"
+          show-in-column="persen_yoy"
+          column="persen_yoy"
+          css-class="!text-right"
+          :customize-text="(e: any) => formatPercentage(e.value)"
+        />
       </DxSummary>
 
       <template #formatNumber="{ data }">
@@ -211,6 +289,7 @@ import {
   DxColumn,
   DxColumnFixing,
   DxExport,
+  DxGroupItem,
   DxGrouping,
   DxLoadPanel,
   DxPaging,
diff --git a/src/components/Pages/Monalisa/Gangguan/Rekap/MonalisaGR_ResponseTimeGangguan.vue b/src/components/Pages/Monalisa/Gangguan/Rekap/MonalisaGR_ResponseTimeGangguan.vue
index 9e91a7d..fb6f97b 100755
--- a/src/components/Pages/Monalisa/Gangguan/Rekap/MonalisaGR_ResponseTimeGangguan.vue
+++ b/src/components/Pages/Monalisa/Gangguan/Rekap/MonalisaGR_ResponseTimeGangguan.vue
@@ -25,7 +25,7 @@
       column-resizing-mode="widget"
       :word-wrap-enabled="true"
     >
-      <DxGrouping expand-mode="rowClick" />
+      <DxGrouping expand-mode="rowClick" :auto-expand-all="false" />
       <DxSelection mode="single" />
       <DxPaging :enabled="false" />
       <DxScrolling column-rendering-mode="virtual" mode="virtual" />
@@ -46,16 +46,38 @@
       />
       <DxColumnFixing :enabled="true" />
 
-      <!-- <DxColumn
+      <DxColumn
         alignment="center"
         :min-width="170"
         data-type="text"
-        data-field="nama_ulp"
-        caption="Nama Unit"
+        data-field="nama_regional"
+        caption="Regional"
         css-class="custom-table-column"
         :group-index="0"
-        name="namaUlp"
-      /> -->
+        name="namaRegional"
+      />
+      <DxColumn
+        alignment="center"
+        :min-width="170"
+        data-type="text"
+        data-field="id_uid"
+        caption="UIW"
+        css-class="custom-table-column"
+        :group-index="1"
+        name="namaUID"
+        :calculate-group-value="(rowData: any) => rowData.nama_uid"
+      />
+      <DxColumn
+        alignment="center"
+        :min-width="170"
+        data-type="text"
+        data-field="id_up3"
+        caption="UP3"
+        css-class="custom-table-column"
+        :group-index="1"
+        name="namaUID"
+        :calculate-group-value="(rowData: any) => rowData.nama_up3"
+      />
       <DxColumn
         alignment="center"
         :min-width="170"
@@ -179,6 +201,62 @@
           css-class="text-white !text-right"
           :customize-text="(e: any) => formatPercentage(e.value)"
         />
+
+        <DxGroupItem
+          :show-in-group-footer="false"
+          :align-by-column="true"
+          summary-type="sum"
+          display-format="{0}"
+          show-in-column="mom_bulan_kemarin"
+          column="mom_bulan_kemarin"
+          css-class="!text-right"
+          :customize-text="(e: any) => formatNumber(e.value)"
+        />
+        <DxGroupItem
+          :show-in-group-footer="false"
+          :align-by-column="true"
+          summary-type="sum"
+          show-in-column="mom_bulan_ini"
+          column="mom_bulan_ini"
+          css-class="!text-right"
+          :customize-text="(e: any) => formatNumber(e.value)"
+        />
+        <DxGroupItem
+          :show-in-group-footer="false"
+          :align-by-column="true"
+          summary-type="sum"
+          show-in-column="persen_mom"
+          column="persen_mom"
+          css-class="!text-right"
+          :customize-text="(e: any) => formatPercentage(e.value)"
+        />
+        <DxGroupItem
+          :show-in-group-footer="false"
+          :align-by-column="true"
+          summary-type="sum"
+          show-in-column="yoy_tahun_kemarin"
+          column="yoy_tahun_kemarin"
+          css-class="!text-right"
+          :customize-text="(e: any) => formatNumber(e.value)"
+        />
+        <DxGroupItem
+          :show-in-group-footer="false"
+          :align-by-column="true"
+          summary-type="sum"
+          show-in-column="yoy_tahun_ini"
+          column="yoy_tahun_ini"
+          css-class="!text-right"
+          :customize-text="(e: any) => formatNumber(e.value)"
+        />
+        <DxGroupItem
+          :show-in-group-footer="false"
+          :align-by-column="true"
+          summary-type="sum"
+          show-in-column="persen_yoy"
+          column="persen_yoy"
+          css-class="!text-right"
+          :customize-text="(e: any) => formatPercentage(e.value)"
+        />
       </DxSummary>
 
       <template #formatNumber="{ data }">
@@ -211,6 +289,7 @@ import {
   DxColumn,
   DxColumnFixing,
   DxExport,
+  DxGroupItem,
   DxGrouping,
   DxLoadPanel,
   DxPaging,
diff --git a/src/components/Pages/Monalisa/Keluhan/Rekap/MonalisaKR_JumlahDDRPTRCTKeluhan.vue b/src/components/Pages/Monalisa/Keluhan/Rekap/MonalisaKR_JumlahDDRPTRCTKeluhan.vue
index 9f62a0b..080b441 100755
--- a/src/components/Pages/Monalisa/Keluhan/Rekap/MonalisaKR_JumlahDDRPTRCTKeluhan.vue
+++ b/src/components/Pages/Monalisa/Keluhan/Rekap/MonalisaKR_JumlahDDRPTRCTKeluhan.vue
@@ -26,7 +26,7 @@
       column-resizing-mode="widget"
       :word-wrap-enabled="true"
     >
-      <DxGrouping expand-mode="rowClick" />
+      <DxGrouping expand-mode="rowClick" :auto-expand-all="false" />
       <DxSelection mode="single" />
       <DxPaging :enabled="false" />
       <DxScrolling column-rendering-mode="virtual" mode="virtual" />
@@ -57,27 +57,35 @@
       />
       <DxColumn
         alignment="center"
+        :min-width="170"
+        data-type="text"
         data-field="nama_regional"
         caption="Regional"
         css-class="custom-table-column"
-        cell-template="formatText"
         :group-index="0"
+        name="namaRegional"
       />
       <DxColumn
         alignment="center"
-        data-field="nama_uid"
+        :min-width="170"
+        data-type="text"
+        data-field="id_uid"
         caption="UID"
         css-class="custom-table-column"
-        cell-template="formatText"
         :group-index="1"
+        name="namaUID"
+        :calculate-group-value="(rowData: any) => rowData.nama_uid"
       />
       <DxColumn
         alignment="center"
-        data-field="nama_up3"
+        :min-width="170"
+        data-type="text"
+        data-field="id_up3"
         caption="UP3"
         css-class="custom-table-column"
-        cell-template="formatText"
-        :group-index="2"
+        :group-index="1"
+        name="namaUID"
+        :calculate-group-value="(rowData: any) => rowData.nama_up3"
       />
       <DxColumn
         alignment="center"
@@ -236,6 +244,7 @@
           :align-by-column="true"
           summary-type="sum"
           show-in-column="total_durasi_response_time_bulan_ini"
+          column="total_durasi_response_time_bulan_ini"
           css-class="!text-right"
           :customize-text="(e: any) => formatNumber(e.value)"
         />
@@ -244,6 +253,7 @@
           :align-by-column="true"
           summary-type="sum"
           show-in-column="jumlah_keluhan_rpt_bulan"
+          column="jumlah_keluhan_rpt_bulan"
           css-class="!text-right"
           :customize-text="(e: any) => formatNumber(e.value)"
         />
@@ -252,6 +262,7 @@
           :align-by-column="true"
           summary-type="sum"
           show-in-column="rpt_keluhan_bulan"
+          column="rpt_keluhan_bulan"
           css-class="!text-right"
           :customize-text="(e: any) => formatNumber(e.value)"
         />
@@ -260,6 +271,7 @@
           :align-by-column="true"
           summary-type="sum"
           show-in-column="total_rct_bulan"
+          column="total_rct_bulan"
           css-class="!text-right"
           :customize-text="(e: any) => formatNumber(e.value)"
         />
@@ -268,6 +280,7 @@
           :align-by-column="true"
           summary-type="sum"
           show-in-column="jumlah_keluhan_rct_bulan"
+          column="jumlah_keluhan_rct_bulan"
           css-class="!text-right"
           :customize-text="(e: any) => formatNumber(e.value)"
         />
@@ -276,6 +289,7 @@
           :align-by-column="true"
           summary-type="sum"
           show-in-column="rct_keluhan_bulan"
+          column="rct_keluhan_bulan"
           css-class="!text-right"
           :customize-text="(e: any) => formatNumber(e.value)"
         />
@@ -284,6 +298,7 @@
           :align-by-column="true"
           summary-type="sum"
           show-in-column="total_durasi_response_time_tahun_ini"
+          column="total_durasi_response_time_tahun_ini"
           css-class="!text-right"
           :customize-text="(e: any) => formatNumber(e.value)"
         />
@@ -292,6 +307,7 @@
           :align-by-column="true"
           summary-type="sum"
           show-in-column="jumlah_keluhan_rpt_sampai_bulan"
+          column="jumlah_keluhan_rpt_sampai_bulan"
           css-class="!text-right"
           :customize-text="(e: any) => formatNumber(e.value)"
         />
@@ -300,6 +316,7 @@
           :align-by-column="true"
           summary-type="sum"
           show-in-column="rpt_keluhan_sampai_bulan"
+          column="rpt_keluhan_sampai_bulan"
           css-class="!text-right"
           :customize-text="(e: any) => formatNumber(e.value)"
         />
@@ -308,6 +325,7 @@
           :align-by-column="true"
           summary-type="sum"
           show-in-column="total_durasi_recovery_time_tahun_ini"
+          column="total_durasi_recovery_time_tahun_ini"
           css-class="!text-right"
           :customize-text="(e: any) => formatNumber(e.value)"
         />
@@ -316,6 +334,7 @@
           :align-by-column="true"
           summary-type="sum"
           show-in-column="jumlah_keluhan_rct_sampai_bulan"
+          column="jumlah_keluhan_rct_sampai_bulan"
           css-class="!text-right"
           :customize-text="(e: any) => formatNumber(e.value)"
         />
@@ -324,6 +343,7 @@
           :align-by-column="true"
           summary-type="sum"
           show-in-column="rch_keluhan_sampai_bulan"
+          column="rch_keluhan_sampai_bulan"
           css-class="!text-right"
           :customize-text="(e: any) => formatNumber(e.value)"
         />
diff --git a/src/components/Pages/Monalisa/Keluhan/Rekap/MonalisaKR_JumlahKaliKeluhan.vue b/src/components/Pages/Monalisa/Keluhan/Rekap/MonalisaKR_JumlahKaliKeluhan.vue
index 70cb832..dd93cb7 100755
--- a/src/components/Pages/Monalisa/Keluhan/Rekap/MonalisaKR_JumlahKaliKeluhan.vue
+++ b/src/components/Pages/Monalisa/Keluhan/Rekap/MonalisaKR_JumlahKaliKeluhan.vue
@@ -25,7 +25,7 @@
       column-resizing-mode="widget"
       :word-wrap-enabled="true"
     >
-      <DxGrouping expand-mode="rowClick" />
+      <DxGrouping expand-mode="rowClick" :auto-expand-all="false" />
       <DxSelection mode="single" />
       <DxPaging :enabled="false" />
       <DxScrolling column-rendering-mode="virtual" mode="virtual" />
@@ -60,19 +60,33 @@
         alignment="center"
         :min-width="170"
         data-type="text"
-        data-field="nama_uid"
-        caption="Nama UID"
+        data-field="nama_regional"
+        caption="Regional"
         css-class="custom-table-column"
         :group-index="0"
+        name="namaRegional"
       />
       <DxColumn
         alignment="center"
         :min-width="170"
         data-type="text"
-        data-field="nama_up3"
-        caption="Nama UP3"
+        data-field="id_uid"
+        caption="UID"
         css-class="custom-table-column"
         :group-index="1"
+        name="namaUID"
+        :calculate-group-value="(rowData: any) => rowData.nama_uid"
+      />
+      <DxColumn
+        alignment="center"
+        :min-width="170"
+        data-type="text"
+        data-field="id_up3"
+        caption="UP3"
+        css-class="custom-table-column"
+        :group-index="1"
+        name="namaUID"
+        :calculate-group-value="(rowData: any) => rowData.nama_up3"
       />
       <DxColumn alignment="center" caption="Jumlah Kali Gangguan" css-class="custom-table-column">
         <DxColumn alignment="center" caption="MoM" css-class="custom-table-column">
diff --git a/src/components/Pages/Monalisa/Keluhan/Rekap/MonalisaKR_KeluhanBelumSelesai.vue b/src/components/Pages/Monalisa/Keluhan/Rekap/MonalisaKR_KeluhanBelumSelesai.vue
index 54e51bd..5deeccf 100755
--- a/src/components/Pages/Monalisa/Keluhan/Rekap/MonalisaKR_KeluhanBelumSelesai.vue
+++ b/src/components/Pages/Monalisa/Keluhan/Rekap/MonalisaKR_KeluhanBelumSelesai.vue
@@ -25,7 +25,7 @@
       column-resizing-mode="widget"
       :word-wrap-enabled="true"
     >
-      <DxGrouping expand-mode="rowClick" />
+      <DxGrouping expand-mode="rowClick" :auto-expand-all="false" />
       <DxSelection mode="single" />
       <DxPaging :enabled="false" />
       <DxScrolling column-rendering-mode="virtual" mode="virtual" />
@@ -55,11 +55,35 @@
       />
       <DxColumn
         alignment="center"
-        data-field="nama_uid"
+        :min-width="170"
+        data-type="text"
+        data-field="nama_regional"
+        caption="Regional"
+        css-class="custom-table-column"
+        :group-index="0"
+        name="namaRegional"
+      />
+      <DxColumn
+        alignment="center"
+        :min-width="170"
+        data-type="text"
+        data-field="id_uid"
         caption="UID"
         css-class="custom-table-column"
-        cell-template="formatText"
-        :group-index="0"
+        :group-index="1"
+        name="namaUID"
+        :calculate-group-value="(rowData: any) => rowData.nama_uid"
+      />
+      <DxColumn
+        alignment="center"
+        :min-width="170"
+        data-type="text"
+        data-field="id_up3"
+        caption="UP3"
+        css-class="custom-table-column"
+        :group-index="1"
+        name="namaUID"
+        :calculate-group-value="(rowData: any) => rowData.nama_up3"
       />
       <DxColumn alignment="center" caption="Tahun" css-class="custom-table-column">
         <DxColumn
@@ -119,6 +143,37 @@
           css-class="text-white !text-right"
           :customize-text="(e: any) => formatPercentage(e.value)"
         />
+
+        <DxGroupItem
+          :show-in-group-footer="false"
+          :align-by-column="true"
+          summary-type="sum"
+          display-format="{0}"
+          show-in-column="jumlah_keluhan"
+          column="jumlah_keluhan"
+          css-class="!text-right"
+          :customize-text="(e: any) => formatNumber(e.value)"
+        />
+        <DxGroupItem
+          :show-in-group-footer="false"
+          :align-by-column="true"
+          summary-type="sum"
+          display-format="{0}"
+          show-in-column="jumlah_informasi"
+          column="jumlah_informasi"
+          css-class="!text-right"
+          :customize-text="(e: any) => formatNumber(e.value)"
+        />
+        <DxGroupItem
+          :show-in-group-footer="false"
+          :align-by-column="true"
+          summary-type="sum"
+          display-format="{0}"
+          show-in-column="total"
+          column="total"
+          css-class="!text-right"
+          :customize-text="(e: any) => formatNumber(e.value)"
+        />
       </DxSummary>
 
       <template #formatNumber="{ data }">
@@ -157,6 +212,7 @@ import {
   DxColumn,
   DxColumnFixing,
   DxExport,
+  DxGroupItem,
   DxGrouping,
   DxLoadPanel,
   DxPaging,
diff --git a/src/components/Pages/Monalisa/Keluhan/Rekap/MonalisaKR_LaporUlangKeluhan.vue b/src/components/Pages/Monalisa/Keluhan/Rekap/MonalisaKR_LaporUlangKeluhan.vue
index 49e0c47..40bb560 100755
--- a/src/components/Pages/Monalisa/Keluhan/Rekap/MonalisaKR_LaporUlangKeluhan.vue
+++ b/src/components/Pages/Monalisa/Keluhan/Rekap/MonalisaKR_LaporUlangKeluhan.vue
@@ -25,7 +25,7 @@
       column-resizing-mode="widget"
       :word-wrap-enabled="true"
     >
-      <DxGrouping expand-mode="rowClick" />
+      <DxGrouping expand-mode="rowClick" :auto-expand-all="false" />
       <DxSelection mode="single" />
       <DxPaging :enabled="false" />
       <DxScrolling column-rendering-mode="virtual" mode="virtual" />
@@ -55,11 +55,35 @@
       />
       <DxColumn
         alignment="center"
-        data-field="nama_uid"
+        :min-width="170"
+        data-type="text"
+        data-field="nama_regional"
+        caption="Regional"
+        css-class="custom-table-column"
+        :group-index="0"
+        name="namaRegional"
+      />
+      <DxColumn
+        alignment="center"
+        :min-width="170"
+        data-type="text"
+        data-field="id_uid"
         caption="UID"
         css-class="custom-table-column"
-        cell-template="formatText"
-        :group-index="0"
+        :group-index="1"
+        name="namaUID"
+        :calculate-group-value="(rowData: any) => rowData.nama_uid"
+      />
+      <DxColumn
+        alignment="center"
+        :min-width="170"
+        data-type="text"
+        data-field="id_up3"
+        caption="UP3"
+        css-class="custom-table-column"
+        :group-index="1"
+        name="namaUID"
+        :calculate-group-value="(rowData: any) => rowData.nama_up3"
       />
       <DxColumn alignment="center" caption="Lapor Ulang Keluhan" css-class="custom-table-column">
         <DxColumn alignment="center" caption="MoM" css-class="custom-table-column">
@@ -181,6 +205,7 @@
           show-in-column="mom_bulan_kemarin"
           column="mom_bulan_kemarin"
           css-class="!text-right"
+          :customize-text="(e: any) => formatNumber(e.value)"
         />
         <DxGroupItem
           :show-in-group-footer="false"
@@ -259,6 +284,7 @@ import {
   DxColumn,
   DxColumnFixing,
   DxExport,
+  DxGroupItem,
   DxGrouping,
   DxLoadPanel,
   DxPaging,
diff --git a/src/components/Pages/Monalisa/Keluhan/Rekap/MonalisaKR_RecoveryTimeKeluhan.vue b/src/components/Pages/Monalisa/Keluhan/Rekap/MonalisaKR_RecoveryTimeKeluhan.vue
index d6d6f14..5c39e42 100755
--- a/src/components/Pages/Monalisa/Keluhan/Rekap/MonalisaKR_RecoveryTimeKeluhan.vue
+++ b/src/components/Pages/Monalisa/Keluhan/Rekap/MonalisaKR_RecoveryTimeKeluhan.vue
@@ -25,7 +25,7 @@
       column-resizing-mode="widget"
       :word-wrap-enabled="true"
     >
-      <DxGrouping expand-mode="rowClick" />
+      <DxGrouping expand-mode="rowClick" :auto-expand-all="false" />
       <DxSelection mode="single" />
       <DxPaging :enabled="false" />
       <DxScrolling column-rendering-mode="virtual" mode="virtual" />
@@ -51,27 +51,32 @@
         :min-width="170"
         data-type="text"
         data-field="nama_regional"
-        caption="Nama Regional"
+        caption="Regional"
         css-class="custom-table-column"
         :group-index="0"
+        name="namaRegional"
       />
       <DxColumn
         alignment="center"
         :min-width="170"
         data-type="text"
-        data-field="nama_uid"
-        caption="Nama UID"
+        data-field="id_uid"
+        caption="UID"
         css-class="custom-table-column"
         :group-index="1"
+        name="namaUID"
+        :calculate-group-value="(rowData: any) => rowData.nama_uid"
       />
       <DxColumn
         alignment="center"
         :min-width="170"
         data-type="text"
-        data-field="nama_up3"
-        caption="Nama UP3"
+        data-field="id_up3"
+        caption="UP3"
         css-class="custom-table-column"
-        :group-index="2"
+        :group-index="1"
+        name="namaUID"
+        :calculate-group-value="(rowData: any) => rowData.nama_up3"
       />
       <DxColumn
         alignment="center"
diff --git a/src/components/Pages/Monalisa/Keluhan/Rekap/MonalisaKR_ResponseTimeKeluhan.vue b/src/components/Pages/Monalisa/Keluhan/Rekap/MonalisaKR_ResponseTimeKeluhan.vue
index 68d6d80..f416151 100755
--- a/src/components/Pages/Monalisa/Keluhan/Rekap/MonalisaKR_ResponseTimeKeluhan.vue
+++ b/src/components/Pages/Monalisa/Keluhan/Rekap/MonalisaKR_ResponseTimeKeluhan.vue
@@ -25,7 +25,7 @@
       column-resizing-mode="widget"
       :word-wrap-enabled="true"
     >
-      <DxGrouping expand-mode="rowClick" />
+      <DxGrouping expand-mode="rowClick" :auto-expand-all="false" />
       <DxSelection mode="single" />
       <DxPaging :enabled="false" />
       <DxScrolling column-rendering-mode="virtual" mode="virtual" />
@@ -51,27 +51,32 @@
         :min-width="170"
         data-type="text"
         data-field="nama_regional"
-        caption="Nama Regional"
+        caption="Regional"
         css-class="custom-table-column"
         :group-index="0"
+        name="namaRegional"
       />
       <DxColumn
         alignment="center"
         :min-width="170"
         data-type="text"
-        data-field="nama_uid"
-        caption="Nama UID"
+        data-field="id_uid"
+        caption="UID"
         css-class="custom-table-column"
         :group-index="1"
+        name="namaUID"
+        :calculate-group-value="(rowData: any) => rowData.nama_uid"
       />
       <DxColumn
         alignment="center"
         :min-width="170"
         data-type="text"
-        data-field="nama_up3"
-        caption="Nama UP3"
+        data-field="id_up3"
+        caption="UP3"
         css-class="custom-table-column"
-        :group-index="2"
+        :group-index="1"
+        name="namaUID"
+        :calculate-group-value="(rowData: any) => rowData.nama_up3"
       />
       <DxColumn
         alignment="center"
diff --git a/src/components/Pages/Monalisa/Laporan/Bulanan/MonalisaLB_AgingComplaint.vue b/src/components/Pages/Monalisa/Laporan/Bulanan/MonalisaLB_AgingComplaint.vue
index b45043c..0514642 100755
--- a/src/components/Pages/Monalisa/Laporan/Bulanan/MonalisaLB_AgingComplaint.vue
+++ b/src/components/Pages/Monalisa/Laporan/Bulanan/MonalisaLB_AgingComplaint.vue
@@ -25,7 +25,7 @@
       column-resizing-mode="widget"
       :word-wrap-enabled="true"
     >
-      <DxGrouping expand-mode="rowClick" />
+      <DxGrouping expand-mode="rowClick" :auto-expand-all="false" />
       <DxSelection mode="single" />
       <DxPaging :enabled="false" />
       <DxScrolling column-rendering-mode="virtual" mode="virtual" />
@@ -56,27 +56,32 @@
           :min-width="170"
           data-type="text"
           data-field="nama_regional"
-          caption="Nama Regional"
+          caption="Regional"
           css-class="custom-table-column"
           :group-index="0"
+          name="namaRegional"
         />
         <DxColumn
           alignment="center"
           :min-width="170"
           data-type="text"
-          data-field="nama_uid"
-          caption="Nama UID"
+          data-field="id_uid"
+          caption="UID"
           css-class="custom-table-column"
           :group-index="1"
+          name="namaUID"
+          :calculate-group-value="(rowData: any) => rowData.nama_uid"
         />
         <DxColumn
           alignment="center"
           :min-width="170"
           data-type="text"
-          data-field="nama_up3"
-          caption="Nama UP3"
+          data-field="id_up3"
+          caption="UP3"
           css-class="custom-table-column"
-          :group-index="2"
+          :group-index="1"
+          name="namaUID"
+          :calculate-group-value="(rowData: any) => rowData.nama_up3"
         />
         <DxColumn
           alignment="center"
diff --git a/src/components/Pages/Monalisa/Laporan/Bulanan/MonalisaLB_EnergyNotSales.vue b/src/components/Pages/Monalisa/Laporan/Bulanan/MonalisaLB_EnergyNotSales.vue
index dfab978..fbd9042 100755
--- a/src/components/Pages/Monalisa/Laporan/Bulanan/MonalisaLB_EnergyNotSales.vue
+++ b/src/components/Pages/Monalisa/Laporan/Bulanan/MonalisaLB_EnergyNotSales.vue
@@ -25,7 +25,7 @@
       column-resizing-mode="widget"
       :word-wrap-enabled="true"
     >
-      <DxGrouping expand-mode="rowClick" />
+      <DxGrouping expand-mode="rowClick" :auto-expand-all="false" />
       <DxSelection mode="single" />
       <DxPaging :enabled="false" />
       <DxScrolling column-rendering-mode="virtual" mode="virtual" />
@@ -56,27 +56,32 @@
           :min-width="170"
           data-type="text"
           data-field="nama_regional"
-          caption="Nama Regional"
+          caption="Regional"
           css-class="custom-table-column"
           :group-index="0"
+          name="namaRegional"
         />
         <DxColumn
           alignment="center"
           :min-width="170"
           data-type="text"
-          data-field="nama_uid"
-          caption="Nama UID"
+          data-field="id_uid"
+          caption="UID"
           css-class="custom-table-column"
           :group-index="1"
+          name="namaUID"
+          :calculate-group-value="(rowData: any) => rowData.nama_uid"
         />
         <DxColumn
           alignment="center"
           :min-width="170"
           data-type="text"
-          data-field="nama_up3"
-          caption="Nama UP3"
+          data-field="id_up3"
+          caption="UP3"
           css-class="custom-table-column"
-          :group-index="2"
+          :group-index="1"
+          name="namaUID"
+          :calculate-group-value="(rowData: any) => rowData.nama_up3"
         />
         <DxColumn
           alignment="center"
diff --git a/src/components/Pages/Monalisa/Laporan/Bulanan/MonalisaLB_KADDalamPelaporan.vue b/src/components/Pages/Monalisa/Laporan/Bulanan/MonalisaLB_KADDalamPelaporan.vue
index 0de4e57..ddbeb73 100755
--- a/src/components/Pages/Monalisa/Laporan/Bulanan/MonalisaLB_KADDalamPelaporan.vue
+++ b/src/components/Pages/Monalisa/Laporan/Bulanan/MonalisaLB_KADDalamPelaporan.vue
@@ -25,7 +25,7 @@
       column-resizing-mode="widget"
       :word-wrap-enabled="true"
     >
-      <DxGrouping expand-mode="rowClick" />
+      <DxGrouping expand-mode="rowClick" :auto-expand-all="false" />
       <DxSelection mode="single" />
       <DxPaging :enabled="false" />
       <DxScrolling column-rendering-mode="virtual" mode="virtual" />
@@ -51,27 +51,32 @@
         :min-width="170"
         data-type="text"
         data-field="nama_regional"
-        caption="Nama Regional"
+        caption="Regional"
         css-class="custom-table-column"
         :group-index="0"
+        name="namaRegional"
       />
       <DxColumn
         alignment="center"
         :min-width="170"
         data-type="text"
-        data-field="nama_uid"
-        caption="Nama UID"
+        data-field="id_uid"
+        caption="UID"
         css-class="custom-table-column"
         :group-index="1"
+        name="namaUID"
+        :calculate-group-value="(rowData: any) => rowData.nama_uid"
       />
       <DxColumn
         alignment="center"
         :min-width="170"
         data-type="text"
-        data-field="nama_up3"
-        caption="Nama UP3"
+        data-field="id_up3"
+        caption="UP3"
         css-class="custom-table-column"
-        :group-index="2"
+        :group-index="1"
+        name="namaUID"
+        :calculate-group-value="(rowData: any) => rowData.nama_up3"
       />
       <DxColumn
         alignment="center"
diff --git a/src/components/Pages/Monalisa/Laporan/Bulanan/MonalisaLB_PenurunanJumlahKomplain.vue b/src/components/Pages/Monalisa/Laporan/Bulanan/MonalisaLB_PenurunanJumlahKomplain.vue
index 1c2a76a..7473af8 100755
--- a/src/components/Pages/Monalisa/Laporan/Bulanan/MonalisaLB_PenurunanJumlahKomplain.vue
+++ b/src/components/Pages/Monalisa/Laporan/Bulanan/MonalisaLB_PenurunanJumlahKomplain.vue
@@ -26,7 +26,7 @@
       column-resizing-mode="widget"
       :word-wrap-enabled="true"
     >
-      <DxGrouping expand-mode="rowClick" />
+      <DxGrouping expand-mode="rowClick" :auto-expand-all="false" />
       <DxSelection mode="single" />
       <DxPaging :enabled="false" />
       <DxScrolling column-rendering-mode="virtual" mode="virtual" />
@@ -52,27 +52,32 @@
         :min-width="170"
         data-type="text"
         data-field="nama_regional"
-        caption="Nama Regional"
+        caption="Regional"
         css-class="custom-table-column"
         :group-index="0"
+        name="namaRegional"
       />
       <DxColumn
         alignment="center"
         :min-width="170"
         data-type="text"
-        data-field="nama_uid"
-        caption="Nama UID"
+        data-field="id_uid"
+        caption="UID"
         css-class="custom-table-column"
         :group-index="1"
+        name="namaUID"
+        :calculate-group-value="(rowData: any) => rowData.nama_uid"
       />
       <DxColumn
         alignment="center"
         :min-width="170"
         data-type="text"
-        data-field="nama_up3"
-        caption="Nama UP3"
+        data-field="id_up3"
+        caption="UP3"
         css-class="custom-table-column"
-        :group-index="2"
+        :group-index="1"
+        name="namaUID"
+        :calculate-group-value="(rowData: any) => rowData.nama_up3"
       />
       <DxColumn
         alignment="center"
diff --git a/src/components/Pages/Monalisa/Laporan/Kumulatif/MonalisaLK_AgingComplaint.vue b/src/components/Pages/Monalisa/Laporan/Kumulatif/MonalisaLK_AgingComplaint.vue
index 3c8cb5b..ce0c607 100755
--- a/src/components/Pages/Monalisa/Laporan/Kumulatif/MonalisaLK_AgingComplaint.vue
+++ b/src/components/Pages/Monalisa/Laporan/Kumulatif/MonalisaLK_AgingComplaint.vue
@@ -25,7 +25,7 @@
       column-resizing-mode="widget"
       :word-wrap-enabled="true"
     >
-      <DxGrouping expand-mode="rowClick" />
+      <DxGrouping expand-mode="rowClick" :auto-expand-all="false" />
       <DxSelection mode="single" />
       <DxPaging :enabled="false" />
       <DxScrolling column-rendering-mode="virtual" mode="virtual" />
@@ -56,27 +56,32 @@
           :min-width="170"
           data-type="text"
           data-field="nama_regional"
-          caption="Nama Regional"
+          caption="Regional"
           css-class="custom-table-column"
           :group-index="0"
+          name="namaRegional"
         />
         <DxColumn
           alignment="center"
           :min-width="170"
           data-type="text"
-          data-field="nama_uid"
-          caption="Nama UID"
+          data-field="id_uid"
+          caption="UID"
           css-class="custom-table-column"
           :group-index="1"
+          name="namaUID"
+          :calculate-group-value="(rowData: any) => rowData.nama_uid"
         />
         <DxColumn
           alignment="center"
           :min-width="170"
           data-type="text"
-          data-field="nama_up3"
-          caption="Nama UP3"
+          data-field="id_up3"
+          caption="UP3"
           css-class="custom-table-column"
-          :group-index="2"
+          :group-index="1"
+          name="namaUID"
+          :calculate-group-value="(rowData: any) => rowData.nama_up3"
         />
         <DxColumn
           alignment="center"
diff --git a/src/components/Pages/Monalisa/Laporan/Kumulatif/MonalisaLK_EnergyNotSales.vue b/src/components/Pages/Monalisa/Laporan/Kumulatif/MonalisaLK_EnergyNotSales.vue
index 962ba69..c7a58ef 100755
--- a/src/components/Pages/Monalisa/Laporan/Kumulatif/MonalisaLK_EnergyNotSales.vue
+++ b/src/components/Pages/Monalisa/Laporan/Kumulatif/MonalisaLK_EnergyNotSales.vue
@@ -25,7 +25,7 @@
       column-resizing-mode="widget"
       :word-wrap-enabled="true"
     >
-      <DxGrouping expand-mode="rowClick" />
+      <DxGrouping expand-mode="rowClick" :auto-expand-all="false" />
       <DxSelection mode="single" />
       <DxPaging :enabled="false" />
       <DxScrolling column-rendering-mode="virtual" mode="virtual" />
@@ -56,27 +56,32 @@
           :min-width="170"
           data-type="text"
           data-field="nama_regional"
-          caption="Nama Regional"
+          caption="Regional"
           css-class="custom-table-column"
           :group-index="0"
+          name="namaRegional"
         />
         <DxColumn
           alignment="center"
           :min-width="170"
           data-type="text"
-          data-field="nama_uid"
-          caption="Nama UID"
+          data-field="id_uid"
+          caption="UID"
           css-class="custom-table-column"
           :group-index="1"
+          name="namaUID"
+          :calculate-group-value="(rowData: any) => rowData.nama_uid"
         />
         <DxColumn
           alignment="center"
           :min-width="170"
           data-type="text"
-          data-field="nama_up3"
-          caption="Nama UP3"
+          data-field="id_up3"
+          caption="UP3"
           css-class="custom-table-column"
-          :group-index="2"
+          :group-index="1"
+          name="namaUID"
+          :calculate-group-value="(rowData: any) => rowData.nama_up3"
         />
         <DxColumn
           alignment="center"
diff --git a/src/components/Pages/Monalisa/Laporan/Kumulatif/MonalisaLK_KDADPelaporan.vue b/src/components/Pages/Monalisa/Laporan/Kumulatif/MonalisaLK_KDADPelaporan.vue
index 5aa94e3..c331ca2 100755
--- a/src/components/Pages/Monalisa/Laporan/Kumulatif/MonalisaLK_KDADPelaporan.vue
+++ b/src/components/Pages/Monalisa/Laporan/Kumulatif/MonalisaLK_KDADPelaporan.vue
@@ -25,7 +25,7 @@
       column-resizing-mode="widget"
       :word-wrap-enabled="true"
     >
-      <DxGrouping expand-mode="rowClick" />
+      <DxGrouping expand-mode="rowClick" :auto-expand-all="false" />
       <DxSelection mode="single" />
       <DxPaging :enabled="false" />
       <DxScrolling column-rendering-mode="virtual" mode="virtual" />
@@ -51,27 +51,32 @@
         :min-width="170"
         data-type="text"
         data-field="nama_regional"
-        caption="Nama Regional"
+        caption="Regional"
         css-class="custom-table-column"
         :group-index="0"
+        name="namaRegional"
       />
       <DxColumn
         alignment="center"
         :min-width="170"
         data-type="text"
-        data-field="nama_uid"
-        caption="Nama UID"
+        data-field="id_uid"
+        caption="UID"
         css-class="custom-table-column"
         :group-index="1"
+        name="namaUID"
+        :calculate-group-value="(rowData: any) => rowData.nama_uid"
       />
       <DxColumn
         alignment="center"
         :min-width="170"
         data-type="text"
-        data-field="nama_up3"
-        caption="Nama UP3"
+        data-field="id_up3"
+        caption="UP3"
         css-class="custom-table-column"
-        :group-index="2"
+        :group-index="1"
+        name="namaUID"
+        :calculate-group-value="(rowData: any) => rowData.nama_up3"
       />
       <DxColumn
         alignment="center"
diff --git a/src/components/Pages/Monalisa/Laporan/Kumulatif/MonalisaLK_PenurunanJumlahKomplain.vue b/src/components/Pages/Monalisa/Laporan/Kumulatif/MonalisaLK_PenurunanJumlahKomplain.vue
index 396b3fd..a97660a 100755
--- a/src/components/Pages/Monalisa/Laporan/Kumulatif/MonalisaLK_PenurunanJumlahKomplain.vue
+++ b/src/components/Pages/Monalisa/Laporan/Kumulatif/MonalisaLK_PenurunanJumlahKomplain.vue
@@ -26,7 +26,7 @@
       column-resizing-mode="widget"
       :word-wrap-enabled="true"
     >
-      <DxGrouping expand-mode="rowClick" />
+      <DxGrouping expand-mode="rowClick" :auto-expand-all="false" />
       <DxSelection mode="single" />
       <DxPaging :enabled="false" />
       <DxScrolling column-rendering-mode="virtual" mode="virtual" />
@@ -52,27 +52,32 @@
         :min-width="170"
         data-type="text"
         data-field="nama_regional"
-        caption="Nama Regional"
+        caption="Regional"
         css-class="custom-table-column"
         :group-index="0"
+        name="namaRegional"
       />
       <DxColumn
         alignment="center"
         :min-width="170"
         data-type="text"
-        data-field="nama_uid"
-        caption="Nama UID"
+        data-field="id_uid"
+        caption="UID"
         css-class="custom-table-column"
         :group-index="1"
+        name="namaUID"
+        :calculate-group-value="(rowData: any) => rowData.nama_uid"
       />
       <DxColumn
         alignment="center"
         :min-width="170"
         data-type="text"
-        data-field="nama_up3"
-        caption="Nama UP3"
+        data-field="id_up3"
+        caption="UP3"
         css-class="custom-table-column"
-        :group-index="2"
+        :group-index="1"
+        name="namaUID"
+        :calculate-group-value="(rowData: any) => rowData.nama_up3"
       />
       <DxColumn
         alignment="center"
diff --git a/src/utils/api/api.graphql.ts b/src/utils/api/api.graphql.ts
index 9c2b217..ac6bb98 100755
--- a/src/utils/api/api.graphql.ts
+++ b/src/utils/api/api.graphql.ts
@@ -678,11 +678,6 @@ export const queries = {
             persen_selesai
             total_inproses
             persen_inproses
-            avg_durasi_dispatch
-            min_durasi_dispatch
-            max_durasi_dispatch
-            total_dibawah_sla_dispatch
-            total_diatas_sla_dispatch
             total_durasi_response
             avg_durasi_response
             min_durasi_response
@@ -2248,6 +2243,13 @@ export const queries = {
               bulan: $bulan
               tahun: $tahun
             ) {
+              id
+              nama_regional
+              id_uid
+              nama_uid
+              id_up3
+              nama_up3
+              id_ulp
               nama_ulp
               mom_bulan_ini
               mom_bulan_kemarin
@@ -2275,6 +2277,13 @@ export const queries = {
               bulan: $bulan
               tahun: $tahun
             ) {
+              id
+              nama_regional
+              id_uid
+              nama_uid
+              id_up3
+              nama_up3
+              id_ulp
               nama_ulp
               mom_bulan_ini
               mom_bulan_kemarin
diff --git a/src/utils/texts.ts b/src/utils/texts.ts
index a8a8df3..5141c4f 100755
--- a/src/utils/texts.ts
+++ b/src/utils/texts.ts
@@ -60,7 +60,11 @@ const getMonthNumber = (monthName: string) => {
     'November',
     'Desember'
   ]
-  return months.indexOf(monthName) + 1
+  if (months.filter((month) => month.toLowerCase() === monthName.toLowerCase()).length > 0) {
+    return months.indexOf(monthName) + 1
+  } else {
+    return 0
+  }
 }
 
 const reformatDate = (inputDate: string, originalFormat: string, targetFormat: string): string => {