Update function to handle edge case

src/components/Pages/Gangguan/Rekap/RGangguan_ALL.vue

@@ -70,6 +70,36 @@
           css-class="custom-table-column"
           cell-template="formatDPT"
         />
+        <DxColumn
+          :visible="false"
+          :width="150"
+          alignment="center"
+          data-field="count_durasi_dispatch"
+          data-type="number"
+          caption="Jumlah Dispatch"
+          :allow-resizing="false"
+          css-class="custom-table-column"
+          cell-template="formatNumber"
+        />
+        <DxColumn
+          :visible="false"
+          :width="150"
+          alignment="center"
+          data-type="number"
+          caption="Total Durasi Dispatch"
+          name="total_durasi_dispatch"
+          :allow-resizing="false"
+          css-class="custom-table-column"
+          :calculate-display-value="
+            (rowData: any) =>
+              parseFloat(rowData.count_durasi_dispatch) * parseFloat(rowData.avg_durasi_dispatch)
+          "
+          :calculate-cell-value="
+            (rowData: any) =>
+              parseFloat(rowData.count_durasi_dispatch) * parseFloat(rowData.avg_durasi_dispatch)
+          "
+          cell-template="formatNumber"
+        />
         <DxColumn
           :width="150"
           alignment="center"
@@ -122,6 +152,36 @@
           css-class="custom-table-column"
           cell-template="formatRPT"
         />
+        <DxColumn
+          :visible="false"
+          :width="150"
+          alignment="center"
+          data-field="count_durasi_response"
+          data-type="number"
+          caption="Jumlah Response"
+          :allow-resizing="false"
+          css-class="custom-table-column"
+          cell-template="formatNumber"
+        />
+        <DxColumn
+          :visible="false"
+          :width="150"
+          alignment="center"
+          data-type="number"
+          caption="Total Durasi Response"
+          name="total_durasi_response"
+          :allow-resizing="false"
+          css-class="custom-table-column"
+          :calculate-display-value="
+            (rowData: any) =>
+              parseFloat(rowData.count_durasi_response) * parseFloat(rowData.avg_durasi_response)
+          "
+          :calculate-cell-value="
+            (rowData: any) =>
+              parseFloat(rowData.count_durasi_response) * parseFloat(rowData.avg_durasi_response)
+          "
+          cell-template="formatNumber"
+        />
         <DxColumn
           :width="150"
           alignment="center"
@@ -174,6 +234,36 @@
           css-class="custom-table-column"
           cell-template="formatRCT"
         />
+        <DxColumn
+          :visible="false"
+          :width="150"
+          alignment="center"
+          data-field="count_durasi_recovery"
+          data-type="number"
+          caption="Jumlah Recovery"
+          :allow-resizing="false"
+          css-class="custom-table-column"
+          cell-template="formatNumber"
+        />
+        <DxColumn
+          :visible="false"
+          :width="150"
+          alignment="center"
+          data-type="number"
+          caption="Total Durasi Recovery"
+          name="total_durasi_recovery"
+          :allow-resizing="false"
+          css-class="custom-table-column"
+          :calculate-display-value="
+            (rowData: any) =>
+              parseFloat(rowData.count_durasi_recovery) * parseFloat(rowData.avg_durasi_recovery)
+          "
+          :calculate-cell-value="
+            (rowData: any) =>
+              parseFloat(rowData.count_durasi_recovery) * parseFloat(rowData.avg_durasi_recovery)
+          "
+          cell-template="formatNumber"
+        />
         <DxColumn
           :width="150"
           alignment="center"
@@ -221,7 +311,8 @@
           :show-in-group-footer="false"
           :align-by-column="true"
           column="total"
-          summary-type="sum"
+          name="total"
+          summary-type="custom"
           css-class="!text-right"
           :customize-text="(e: any) => formatNumber(e.value)"
         />
@@ -229,7 +320,8 @@
           :show-in-group-footer="false"
           :align-by-column="true"
           column="total_selesai"
-          summary-type="sum"
+          name="total_selesai"
+          summary-type="custom"
           css-class="!text-right"
           :customize-text="(e: any) => formatNumber(e.value)"
         />
@@ -237,23 +329,17 @@
           :show-in-group-footer="false"
           :align-by-column="true"
           column="persen_selesai"
-          summary-type="avg"
+          name="persen_selesai"
+          summary-type="custom"
           css-class="!text-right"
           :customize-text="(e: any) => formatPercentage(e.value)"
         />
-        <!-- <DxGroupItem
-          :show-in-group-footer="false"
-          :align-by-column="true"
-          column="persen_selesai"
-          name="persenSelesai"
-          summary-type="custom"
-          css-class="!text-right"
-        /> -->
         <DxGroupItem
           :show-in-group-footer="false"
           :align-by-column="true"
           column="total_inproses"
-          summary-type="sum"
+          name="total_inproses"
+          summary-type="custom"
           css-class="!text-right"
           :customize-text="(e: any) => formatNumber(e.value)"
         />
@@ -261,7 +347,8 @@
           :show-in-group-footer="false"
           :align-by-column="true"
           column="persen_inproses"
-          summary-type="avg"
+          name="persen_inproses"
+          summary-type="custom"
           css-class="!text-right"
           :customize-text="(e: any) => formatPercentage(e.value)"
         />
@@ -269,7 +356,26 @@
           :show-in-group-footer="false"
           :align-by-column="true"
           column="avg_durasi_dispatch"
-          summary-type="avg"
+          name="avg_durasi_dispatch"
+          summary-type="custom"
+          css-class="!text-right"
+          :customize-text="(e: any) => formatNumber(e.value)"
+        />
+        <DxGroupItem
+          :show-in-group-footer="false"
+          :align-by-column="true"
+          column="total_durasi_dispatch"
+          name="total_durasi_dispatch"
+          summary-type="custom"
+          css-class="!text-right"
+          :customize-text="(e: any) => formatNumber(e.value)"
+        />
+        <DxGroupItem
+          :show-in-group-footer="false"
+          :align-by-column="true"
+          column="count_durasi_dispatch"
+          name="count_durasi_dispatch"
+          summary-type="custom"
           css-class="!text-right"
           :customize-text="(e: any) => formatNumber(e.value)"
         />
@@ -310,7 +416,26 @@
           :show-in-group-footer="false"
           :align-by-column="true"
           column="avg_durasi_response"
-          summary-type="avg"
+          name="avg_durasi_response"
+          summary-type="custom"
+          css-class="!text-right"
+          :customize-text="(e: any) => formatNumber(e.value)"
+        />
+        <DxGroupItem
+          :show-in-group-footer="false"
+          :align-by-column="true"
+          column="total_durasi_response"
+          name="total_durasi_response"
+          summary-type="custom"
+          css-class="!text-right"
+          :customize-text="(e: any) => formatNumber(e.value)"
+        />
+        <DxGroupItem
+          :show-in-group-footer="false"
+          :align-by-column="true"
+          column="count_durasi_response"
+          name="count_durasi_response"
+          summary-type="custom"
           css-class="!text-right"
           :customize-text="(e: any) => formatNumber(e.value)"
         />
@@ -350,7 +475,26 @@
           :show-in-group-footer="false"
           :align-by-column="true"
           column="avg_durasi_recovery"
-          summary-type="avg"
+          name="avg_durasi_recovery"
+          summary-type="custom"
+          css-class="!text-right"
+          :customize-text="(e: any) => formatNumber(e.value)"
+        />
+        <DxGroupItem
+          :show-in-group-footer="false"
+          :align-by-column="true"
+          column="total_durasi_recovery"
+          name="total_durasi_recovery"
+          summary-type="custom"
+          css-class="!text-right"
+          :customize-text="(e: any) => formatNumber(e.value)"
+        />
+        <DxGroupItem
+          :show-in-group-footer="false"
+          :align-by-column="true"
+          column="count_durasi_recovery"
+          name="count_durasi_recovery"
+          summary-type="custom"
           css-class="!text-right"
           :customize-text="(e: any) => formatNumber(e.value)"
         />
@@ -804,21 +948,139 @@ const setAgreementDialog = (column: string) => {
   }
 }
 
+let total = 0
+let total_selesai = 0
+let total_inproses = 0
+let count_durasi_dispatch = 0
+let total_durasi_dispatch = 0
+let count_durasi_response = 0
+let total_durasi_response = 0
+let count_durasi_recovery = 0
+let total_durasi_recovery = 0
 const calculateCustomSummary = (options: any) => {
-  if (options.name == 'persenSelesai') {
+  if (options.name === 'total') {
-    console.log(options.component.persen_selesai)
+    if (options.summaryProcess === 'calculate') {
+      total += options.value
+    } else if (options.summaryProcess === 'finalize') {
+      options.totalValue = total
+    }
+  }
 
-    switch (options.summaryProcess) {
+  if (options.name === 'total_selesai') {
-      case 'start':
+    if (options.summaryProcess === 'calculate') {
-        // Initializing "totalValue" here
+      total_selesai += options.value
-        options.totalValue = 1
+    } else if (options.summaryProcess === 'finalize') {
-        break
+      options.totalValue = total_selesai
-      case 'calculate':
+    }
-        // Modifying "totalValue" here
+  }
-        break
+
-      case 'finalize':
+  if (options.name === 'total_inproses') {
-        // Assigning the final value to "totalValue" here
+    if (options.summaryProcess === 'calculate') {
-        break
+      total_inproses += options.value
+    } else if (options.summaryProcess === 'finalize') {
+      options.totalValue = total_inproses
+    }
+  }
+
+  if (options.name === 'persen_selesai') {
+    if (options.summaryProcess === 'start') {
+      total = 0
+      total_selesai = 0
+    } else if (options.summaryProcess === 'finalize') {
+      options.totalValue = (total_selesai / total) * 100
+    }
+  }
+
+  if (options.name === 'persen_inproses') {
+    if (options.summaryProcess === 'start') {
+      total = 0
+      total_inproses = 0
+    } else if (options.summaryProcess === 'finalize') {
+      options.totalValue = (total_inproses / total) * 100
+    }
+  }
+
+  if (options.name === 'persen_selesai') {
+    if (options.summaryProcess === 'start') {
+      total = 0
+      total_selesai = 0
+    } else if (options.summaryProcess === 'finalize') {
+      options.totalValue = (total_selesai / total) * 100
+    }
+  }
+
+  if (options.name === 'count_durasi_dispatch') {
+    if (options.summaryProcess === 'calculate') {
+      count_durasi_dispatch += options.value
+    } else if (options.summaryProcess === 'finalize') {
+      options.totalValue = count_durasi_dispatch
+    }
+  }
+
+  if (options.name === 'total_durasi_dispatch') {
+    if (options.summaryProcess === 'calculate') {
+      total_durasi_dispatch += options.value
+    } else if (options.summaryProcess === 'finalize') {
+      options.totalValue = total_durasi_dispatch
+    }
+  }
+
+  if (options.name === 'avg_durasi_dispatch') {
+    if (options.summaryProcess === 'start') {
+      count_durasi_dispatch = 0
+      total_durasi_dispatch = 0
+    } else if (options.summaryProcess === 'finalize') {
+      options.totalValue = total_durasi_dispatch / count_durasi_dispatch
+    }
+  }
+
+  if (options.name === 'count_durasi_response') {
+    if (options.summaryProcess === 'calculate') {
+      count_durasi_response += options.value
+    } else if (options.summaryProcess === 'finalize') {
+      options.totalValue = count_durasi_response
+    }
+  }
+
+  if (options.name === 'total_durasi_response') {
+    if (options.summaryProcess === 'calculate') {
+      total_durasi_response += options.value
+    } else if (options.summaryProcess === 'finalize') {
+      options.totalValue = total_durasi_response
+    }
+  }
+
+  if (options.name === 'avg_durasi_response') {
+    if (options.summaryProcess === 'start') {
+      count_durasi_response = 0
+      total_durasi_response = 0
+    } else if (options.summaryProcess === 'finalize') {
+      options.totalValue = total_durasi_response / count_durasi_response
+    }
+  }
+
+  if (options.name === 'count_durasi_recovery') {
+    if (options.summaryProcess === 'calculate') {
+      count_durasi_recovery += options.value
+    } else if (options.summaryProcess === 'finalize') {
+      options.totalValue = count_durasi_recovery
+    }
+  }
+
+  if (options.name === 'total_durasi_recovery') {
+    if (options.summaryProcess === 'calculate') {
+      total_durasi_recovery += options.value
+    } else if (options.summaryProcess === 'finalize') {
+      options.totalValue = total_durasi_recovery
+    }
+  }
+
+  if (options.name === 'avg_durasi_recovery') {
+    if (options.summaryProcess === 'start') {
+      count_durasi_recovery = 0
+      total_durasi_recovery = 0
+    } else if (options.summaryProcess === 'finalize') {
+      options.totalValue = total_durasi_recovery / count_durasi_recovery
     }
   }
 }