From 42d77157beca354bec129b56317904bc666b7938 Mon Sep 17 00:00:00 2001
From: Dede Fuji Abdul <defuj.official@gmail.com>
Date: Fri, 15 Mar 2024 09:55:13 +0700
Subject: [PATCH] Add DxGrouping component and update DxColumn properties

---
 .../Pages/Keluhan/Rekap/RKeluhan_ALL.vue      | 19 +++++++++++++++----
 .../Pages/Keluhan/Rekap/RKeluhan_PerUnit.vue  |  8 +++-----
 src/utils/api/api.graphql.ts                  |  2 --
 3 files changed, 18 insertions(+), 11 deletions(-)

diff --git a/src/components/Pages/Keluhan/Rekap/RKeluhan_ALL.vue b/src/components/Pages/Keluhan/Rekap/RKeluhan_ALL.vue
index 5de4f07..d503aa0 100755
--- a/src/components/Pages/Keluhan/Rekap/RKeluhan_ALL.vue
+++ b/src/components/Pages/Keluhan/Rekap/RKeluhan_ALL.vue
@@ -23,6 +23,7 @@
       column-resizing-mode="widget"
       :word-wrap-enabled="true"
     >
+      <DxGrouping :auto-expand-all="false" />
       <DxSelection mode="single" />
       <DxPaging :enabled="false" />
       <DxScrolling column-rendering-mode="virtual" mode="virtual" />
@@ -51,6 +52,15 @@
         cell-template="formatText"
       />
 
+      <DxColumn
+        :width="150"
+        alignment="center"
+        data-field=""
+        caption="Semua Unit"
+        css-class="custom-table-column"
+        cell-template="formatText"
+        :group-index="0"
+      />
       <DxColumn
         :width="150"
         alignment="center"
@@ -58,7 +68,7 @@
         caption="Regional"
         css-class="custom-table-column"
         cell-template="formatText"
-        :group-index="0"
+        :group-index="1"
       />
       <DxColumn
         :width="150"
@@ -67,7 +77,7 @@
         caption="UID"
         css-class="custom-table-column"
         cell-template="formatText"
-        :group-index="1"
+        :group-index="2"
       />
       <DxColumn
         :width="150"
@@ -76,7 +86,7 @@
         caption="UP3"
         css-class="custom-table-column"
         cell-template="formatText"
-        :group-index="2"
+        :group-index="3"
       />
 
       <DxColumn alignment="center" caption="Response Time" css-class="custom-table-column">
@@ -768,7 +778,8 @@ import {
   DxSearchPanel,
   DxSelection,
   DxSummary,
-  DxGroupItem
+  DxGroupItem,
+  DxGrouping
 } from 'devextreme-vue/data-grid'
 import { jsPDF } from 'jspdf'
 import { exportDataGrid as exportToPdf } from 'devextreme/pdf_exporter'
diff --git a/src/components/Pages/Keluhan/Rekap/RKeluhan_PerUnit.vue b/src/components/Pages/Keluhan/Rekap/RKeluhan_PerUnit.vue
index beb75d1..e4872c2 100755
--- a/src/components/Pages/Keluhan/Rekap/RKeluhan_PerUnit.vue
+++ b/src/components/Pages/Keluhan/Rekap/RKeluhan_PerUnit.vue
@@ -549,7 +549,7 @@
       <div class="p-4 bg-white rounded-xl lg:mr-4">
         <DxDataGrid
           class="max-h-[calc(100vh-140px)]"
-          :data-source="data"
+          :data-source="dataSub"
           :show-column-lines="true"
           :show-row-lines="false"
           :show-borders="true"
@@ -590,9 +590,7 @@
             css-class="custom-table-column"
             :width="50"
             alignment="center"
-            :calculateCellValue="
-              (item: any) => dummyData.gangguan.rekap.detailGangguan.findIndex((i) => i == item) + 1
-            "
+            :calculateCellValue="(item: any) => dataSub.findIndex((i) => i == item) + 1"
             data-type="number"
             caption="No"
             cell-template="formatNumber"
@@ -968,7 +966,7 @@ const filterData = (params: any) => {
 }
 
 const getDetail = () => {
-  dataSub.value = dummyData.keluhan.rekap.rekapitulasiKeluhanPerUnit
+  // dataSub.value = dummyData.keluhan.rekap.rekapitulasiKeluhanPerUnit
 }
 
 const showDialogDataSelected = () => {
diff --git a/src/utils/api/api.graphql.ts b/src/utils/api/api.graphql.ts
index c33e30f..3cbcc79 100755
--- a/src/utils/api/api.graphql.ts
+++ b/src/utils/api/api.graphql.ts
@@ -328,8 +328,6 @@ export const queries = {
             persen_selesai
             total_inproses
             persen_inproses
-            total_durasi_response
-            total_durasi_recovery
             avg_durasi_response
             min_durasi_response
             max_durasi_response