update

src/components/Pages/Gangguan/Table_9.vue

@@ -67,13 +67,18 @@
                         css-class="custom-table-column" />
                 </DxColumn>
             </DxColumn>
+
+            <DxSummary>
+                <DxGroupItem :show-in-group-footer="true" column="" summary-type="sum" value-format="number"
+                    display-format="Total: {0}" />
+            </DxSummary>
         </DxDataGrid>
     </div>
 </template>
 
 <script setup lang="ts">
 import { DxDataGrid } from 'devextreme-vue'
-import { DxColumn, DxColumnFixing, DxExport, DxLoadPanel, DxPaging, DxScrolling, DxSearchPanel, DxSelection } from 'devextreme-vue/data-grid'
+import { DxColumn, DxColumnFixing, DxExport, DxGroupItem, DxLoadPanel, DxPaging, DxScrolling, DxSearchPanel, DxSelection, DxSummary } from 'devextreme-vue/data-grid'
 import { jsPDF } from 'jspdf'
 import { exportDataGrid as exportToPdf } from 'devextreme/pdf_exporter'
 import { exportDataGrid as exportToExcel } from 'devextreme/excel_exporter'
@@ -114,4 +119,47 @@ const onSelectionChanged = ({ selectedRowsData }: any) => {
     console.log(data)
 }
 
+const data = [
+    {
+        no: 1,
+        kode: 'A',
+        jenisGangguan: 'Gangguan A',
+        laporan: {
+            total: 10,
+            sudahSelesai: {
+                jml: 5,
+                persen: 50,
+            },
+            belumSelesai: {
+                jml: 5,
+                persen: 50,
+            },
+        },
+        responseTime: {
+            menit: {
+                total: 10,
+                rataRata: 10,
+                max: 10,
+                min: 10,
+            },
+            laporan: {
+                lebihSla: 5,
+                kurangSla: 5,
+            },
+        },
+        recoveryTime: {
+            menit: {
+                total: 10,
+                rataRata: 10,
+                max: 10,
+                min: 10,
+            },
+            laporan: {
+                lebihSla: 5,
+                kurangSla: 5,
+            },
+        }
+    },
+]
+
 </script>