fix pbg task add toggle and rab krk dlh

resources/js/dashboards/bigdata.js

@@ -3,6 +3,21 @@ import GlobalConfig, { addThousandSeparators } from "../global-config.js";
 import InitDatePicker from "../utils/InitDatePicker.js";
 
 class BigData {
+    // Helper function to safely access nested object properties with default values
+    safeGet(obj, path, defaultValue = 0) {
+        try {
+            return path.split(".").reduce((current, key) => {
+                return current &&
+                    current[key] !== null &&
+                    current[key] !== undefined
+                    ? current[key]
+                    : defaultValue;
+            }, obj);
+        } catch (error) {
+            return defaultValue;
+        }
+    }
+
     async init() {
         try {
             new InitDatePicker(
@@ -25,6 +40,14 @@ class BigData {
         try {
             this.resumeBigData = await this.getBigDataResume(filterDate);
 
+            // Ensure resumeBigData is not null/undefined
+            if (!this.resumeBigData) {
+                this.resumeBigData = {};
+                console.warn(
+                    "No data received, using empty object with default values"
+                );
+            }
+
             this.initChartTargetPAD(filterDate);
             this.initChartUsaha();
             this.initChartNonUsaha();
@@ -43,6 +66,8 @@ class BigData {
             this.initChartNonBusinessDLH();
         } catch (e) {
             console.error(e);
+            // Initialize with empty data if there's an error
+            this.resumeBigData = {};
         }
     }
 
@@ -92,14 +117,24 @@ class BigData {
         document
             .querySelectorAll(".document-total.chart-target-pad")
             .forEach((element) => {
+                const sum = this.safeGet(
+                    this.resumeBigData,
+                    "target_pad.sum",
+                    0
+                );
                 element.innerText = `Rp.${addThousandSeparators(
-                    this.resumeBigData.target_pad.sum.toString()
+                    sum.toString()
                 )}`;
             });
         document
             .querySelectorAll(".small-percentage.chart-target-pad")
             .forEach((element) => {
-                element.innerText = `${this.resumeBigData.target_pad.percentage}%`;
+                const percentage = this.safeGet(
+                    this.resumeBigData,
+                    "target_pad.percentage",
+                    0
+                );
+                element.innerText = `${percentage}%`;
             });
     }
     initChartTotalPotensi() {
@@ -108,44 +143,68 @@ class BigData {
         document
             .querySelectorAll(".document-count.chart-total-potensi")
             .forEach((element) => {
-                // element.innerText = `${countAll}`;
-                element.innerText = `${this.resumeBigData.total_potensi.count}`;
+                const count = this.safeGet(
+                    this.resumeBigData,
+                    "total_potensi.count",
+                    0
+                );
+                element.innerText = `${count}`;
             });
         document
             .querySelectorAll(".document-total.chart-total-potensi")
             .forEach((element) => {
+                const sum = this.safeGet(
+                    this.resumeBigData,
+                    "total_potensi.sum",
+                    0
+                );
                 element.innerText = `Rp.${addThousandSeparators(
-                    // this.bigTotalPotensi.toString()
-                    this.resumeBigData.total_potensi.sum.toString()
+                    sum.toString()
                 )}`;
             });
         document
             .querySelectorAll(".small-percentage.chart-total-potensi")
             .forEach((element) => {
-                // element.innerText = `${this.resultPercentage}%`;
-                element.innerText = `${this.resumeBigData.total_potensi.percentage}%`;
+                const percentage = this.safeGet(
+                    this.resumeBigData,
+                    "total_potensi.percentage",
+                    0
+                );
+                element.innerText = `${percentage}%`;
             });
     }
     initChartVerificationDocuments() {
         document
             .querySelectorAll(".document-count.chart-berkas-terverifikasi")
             .forEach((element) => {
-                // element.innerText = `${this.dataVerification.count}`;
-                element.innerText = `${this.resumeBigData.verified_document.count}`;
+                const count = this.safeGet(
+                    this.resumeBigData,
+                    "verified_document.count",
+                    0
+                );
+                element.innerText = `${count}`;
             });
         document
             .querySelectorAll(".document-total.chart-berkas-terverifikasi")
             .forEach((element) => {
+                const sum = this.safeGet(
+                    this.resumeBigData,
+                    "verified_document.sum",
+                    0
+                );
                 element.innerText = `Rp.${addThousandSeparators(
-                    // this.bigTotalVerification.toString()
-                    this.resumeBigData.verified_document.sum.toString()
+                    sum.toString()
                 )}`;
             });
         document
             .querySelectorAll(".small-percentage.chart-berkas-terverifikasi")
             .forEach((element) => {
-                // element.innerText = `${this.percetageResultVerification}%`;
-                element.innerText = `${this.resumeBigData.verified_document.percentage}%`;
+                const percentage = this.safeGet(
+                    this.resumeBigData,
+                    "verified_document.percentage",
+                    0
+                );
+                element.innerText = `${percentage}%`;
             });
     }
     initChartNonVerificationDocuments() {
@@ -154,17 +213,25 @@ class BigData {
                 ".document-count.chart-berkas-belum-terverifikasi"
             )
             .forEach((element) => {
-                // element.innerText = `${this.dataNonVerification.count}`;
-                element.innerText = `${this.resumeBigData.non_verified_document.count}`;
+                const count = this.safeGet(
+                    this.resumeBigData,
+                    "non_verified_document.count",
+                    0
+                );
+                element.innerText = `${count}`;
             });
         document
             .querySelectorAll(
                 ".document-total.chart-berkas-belum-terverifikasi"
             )
             .forEach((element) => {
+                const sum = this.safeGet(
+                    this.resumeBigData,
+                    "non_verified_document.sum",
+                    0
+                );
                 element.innerText = `Rp.${addThousandSeparators(
-                    // this.bigTotalNonVerification.toString()
-                    this.resumeBigData.non_verified_document.sum.toString()
+                    sum.toString()
                 )}`;
             });
         document
@@ -172,52 +239,80 @@ class BigData {
                 ".small-percentage.chart-berkas-belum-terverifikasi"
             )
             .forEach((element) => {
-                // element.innerText = `${this.percentageResultNonVerification}%`;
-                element.innerText = `${this.resumeBigData.non_verified_document.percentage}%`;
+                const percentage = this.safeGet(
+                    this.resumeBigData,
+                    "non_verified_document.percentage",
+                    0
+                );
+                element.innerText = `${percentage}%`;
             });
     }
     initChartUsaha() {
         document
             .querySelectorAll(".document-count.chart-business")
             .forEach((element) => {
-                // element.innerText = `${this.dataBusiness.count}`;
-                element.innerText = `${this.resumeBigData.business_document.count}`;
+                const count = this.safeGet(
+                    this.resumeBigData,
+                    "business_document.count",
+                    0
+                );
+                element.innerText = `${count}`;
             });
         document
             .querySelectorAll(".document-total.chart-business")
             .forEach((element) => {
+                const sum = this.safeGet(
+                    this.resumeBigData,
+                    "business_document.sum",
+                    0
+                );
                 element.innerText = `Rp.${addThousandSeparators(
-                    // this.bigTotalBusiness.toString()
-                    this.resumeBigData.business_document.sum.toString()
+                    sum.toString()
                 )}`;
             });
         document
             .querySelectorAll(".small-percentage.chart-business")
             .forEach((element) => {
-                // element.innerText = `${this.percentageResultBusiness}%`;
-                element.innerText = `${this.resumeBigData.business_document.percentage}%`;
+                const percentage = this.safeGet(
+                    this.resumeBigData,
+                    "business_document.percentage",
+                    0
+                );
+                element.innerText = `${percentage}%`;
             });
     }
     initChartNonUsaha() {
         document
             .querySelectorAll(".document-count.chart-non-business")
             .forEach((element) => {
-                // element.innerText = `${this.dataNonBusiness.count}`;
-                element.innerText = `${this.resumeBigData.non_business_document.count}`;
+                const count = this.safeGet(
+                    this.resumeBigData,
+                    "non_business_document.count",
+                    0
+                );
+                element.innerText = `${count}`;
             });
         document
             .querySelectorAll(".document-total.chart-non-business")
             .forEach((element) => {
+                const sum = this.safeGet(
+                    this.resumeBigData,
+                    "non_business_document.sum",
+                    0
+                );
                 element.innerText = `Rp.${addThousandSeparators(
-                    // this.bigTotalNonBusiness.toString()
-                    this.resumeBigData.non_business_document.sum.toString()
+                    sum.toString()
                 )}`;
             });
         document
             .querySelectorAll(".small-percentage.chart-non-business")
             .forEach((element) => {
-                // element.innerText = `${this.percentageResultNonBusiness}%`;
-                element.innerText = `${this.resumeBigData.non_business_document.percentage}%`;
+                const percentage = this.safeGet(
+                    this.resumeBigData,
+                    "non_business_document.percentage",
+                    0
+                );
+                element.innerText = `${percentage}%`;
             });
     }
     initChartKekuranganPotensi() {
@@ -229,129 +324,226 @@ class BigData {
         document
             .querySelectorAll(".document-total.chart-kekurangan-potensi")
             .forEach((element) => {
+                const sum = this.safeGet(
+                    this.resumeBigData,
+                    "kekurangan_potensi.sum",
+                    0
+                );
                 element.innerText = `Rp.${addThousandSeparators(
-                    // this.totalKekuranganPotensi.toString()
-                    this.resumeBigData.kekurangan_potensi.sum.toString()
+                    sum.toString()
                 )}`;
             });
         document
             .querySelectorAll(".small-percentage.chart-kekurangan-potensi")
             .forEach((element) => {
-                // element.innerText = `${this.percentageKekuranganPotensi}%`;
-                element.innerText = `${this.resumeBigData.kekurangan_potensi.percentage}%`;
+                const percentage = this.safeGet(
+                    this.resumeBigData,
+                    "kekurangan_potensi.percentage",
+                    0
+                );
+                element.innerText = `${percentage}%`;
             });
     }
     initChartRealisasiTerbitPBG() {
         document
             .querySelectorAll(".document-count.chart-realisasi-tebit-pbg")
             .forEach((element) => {
-                // element.innerText = `${this.dataCountRealisasiTerbit}`;
-                element.innerText = `${this.resumeBigData.realisasi_terbit.count}`;
+                const count = this.safeGet(
+                    this.resumeBigData,
+                    "realisasi_terbit.count",
+                    0
+                );
+                element.innerText = `${count}`;
             });
         document
             .querySelectorAll(".document-total.chart-realisasi-tebit-pbg")
             .forEach((element) => {
+                const sum = this.safeGet(
+                    this.resumeBigData,
+                    "realisasi_terbit.sum",
+                    0
+                );
                 element.innerText = `Rp.${addThousandSeparators(
-                    // this.dataSumRealisasiTerbit
-                    this.resumeBigData.realisasi_terbit.sum.toString()
+                    sum.toString()
                 )}`;
             });
         document
             .querySelectorAll(".small-percentage.chart-realisasi-tebit-pbg")
             .forEach((element) => {
-                element.innerText = `${this.resumeBigData.realisasi_terbit.percentage}%`;
+                const percentage = this.safeGet(
+                    this.resumeBigData,
+                    "realisasi_terbit.percentage",
+                    0
+                );
+                element.innerText = `${percentage}%`;
             });
     }
     initChartMenungguKlikDPMPTSP() {
         document
             .querySelectorAll(".document-count.chart-menunggu-klik-dpmptsp")
             .forEach((element) => {
-                // element.innerText = `${this.dataCountMenungguKlikDPMPTSP}`;
-                element.innerText = `${this.resumeBigData.menunggu_klik_dpmptsp.count}`;
+                const count = this.safeGet(
+                    this.resumeBigData,
+                    "menunggu_klik_dpmptsp.count",
+                    0
+                );
+                element.innerText = `${count}`;
             });
         document
             .querySelectorAll(".document-total.chart-menunggu-klik-dpmptsp")
             .forEach((element) => {
+                const sum = this.safeGet(
+                    this.resumeBigData,
+                    "menunggu_klik_dpmptsp.sum",
+                    0
+                );
                 element.innerText = `Rp.${addThousandSeparators(
-                    // this.dataSumMenungguKlikDPMPTSP
-                    this.resumeBigData.menunggu_klik_dpmptsp.sum.toString()
+                    sum.toString()
                 )}`;
             });
         document
             .querySelectorAll(".small-percentage.chart-menunggu-klik-dpmptsp")
             .forEach((element) => {
-                element.innerText = `${this.resumeBigData.menunggu_klik_dpmptsp.percentage}%`;
+                const percentage = this.safeGet(
+                    this.resumeBigData,
+                    "menunggu_klik_dpmptsp.percentage",
+                    0
+                );
+                element.innerText = `${percentage}%`;
             });
     }
     initChartProsesDinasTeknis() {
         document
             .querySelectorAll(".document-count.chart-proses-dinas-teknis")
             .forEach((element) => {
-                // element.innerText = `${this.dataCountProsesDinasTeknis}`;
-                element.innerText = `${this.resumeBigData.proses_dinas_teknis.count}`;
+                const count = this.safeGet(
+                    this.resumeBigData,
+                    "proses_dinas_teknis.count",
+                    0
+                );
+                element.innerText = `${count}`;
             });
         document
             .querySelectorAll(".document-total.chart-proses-dinas-teknis")
             .forEach((element) => {
+                const sum = this.safeGet(
+                    this.resumeBigData,
+                    "proses_dinas_teknis.sum",
+                    0
+                );
                 element.innerText = `Rp.${addThousandSeparators(
-                    // this.dataSumProsesDinasTeknis
-                    this.resumeBigData.proses_dinas_teknis.sum.toString()
+                    sum.toString()
                 )}`;
             });
         document
             .querySelectorAll(".small-percentage.chart-proses-dinas-teknis")
             .forEach((element) => {
-                element.innerText = `${this.resumeBigData.proses_dinas_teknis.percentage}%`;
+                const percentage = this.safeGet(
+                    this.resumeBigData,
+                    "proses_dinas_teknis.percentage",
+                    0
+                );
+                element.innerText = `${percentage}%`;
             });
     }
     initChartPotensiTataRuang() {
         document
             .querySelectorAll(".document-count.chart-potensi-tata-ruang")
             .forEach((element) => {
-                element.innerText = `${this.resumeBigData.tata_ruang.count}`;
+                const count = this.safeGet(
+                    this.resumeBigData,
+                    "tata_ruang.count",
+                    0
+                );
+                element.innerText = `${count}`;
             });
         document
             .querySelectorAll(".document-total.chart-potensi-tata-ruang")
             .forEach((element) => {
+                const sum = this.safeGet(
+                    this.resumeBigData,
+                    "tata_ruang.sum",
+                    0
+                );
                 element.innerText = `Rp.${addThousandSeparators(
-                    this.resumeBigData.tata_ruang.sum.toString()
+                    sum.toString()
                 )}`;
             });
         document
             .querySelectorAll(".small-percentage.chart-potensi-tata-ruang")
             .forEach((element) => {
-                element.innerText = `${this.resumeBigData.tata_ruang.percentage}%`;
+                const percentage = this.safeGet(
+                    this.resumeBigData,
+                    "tata_ruang.percentage",
+                    0
+                );
+                element.innerText = `${percentage}%`;
             });
     }
     initChartBusinessRAB() {
         document.querySelectorAll("#business-rab-count").forEach((element) => {
-            element.innerText = `${this.resumeBigData.business_rab_count}`;
+            const count = this.safeGet(
+                this.resumeBigData,
+                "business_rab_count",
+                0
+            );
+            element.innerText = `${count}`;
         });
     }
     initChartBusinessKRK() {
         document.querySelectorAll("#business-krk-count").forEach((element) => {
-            element.innerText = `${this.resumeBigData.business_krk_count}`;
+            const count = this.safeGet(
+                this.resumeBigData,
+                "business_krk_count",
+                0
+            );
+            element.innerText = `${count}`;
+        });
+    }
+    initChartBusinessDLH() {
+        document.querySelectorAll("#business-dlh-count").forEach((element) => {
+            const count = this.safeGet(
+                this.resumeBigData,
+                "business_dlh_count",
+                0
+            );
+            element.innerText = `${count}`;
         });
     }
     initChartNonBusinessRAB() {
         document
             .querySelectorAll("#non-business-rab-count")
             .forEach((element) => {
-                element.innerText = `${this.resumeBigData.non_business_rab_count}`;
+                const count = this.safeGet(
+                    this.resumeBigData,
+                    "non_business_rab_count",
+                    0
+                );
+                element.innerText = `${count}`;
             });
     }
     initChartNonBusinessKRK() {
         document
             .querySelectorAll("#non-business-krk-count")
             .forEach((element) => {
-                element.innerText = `${this.resumeBigData.non_business_krk_count}`;
+                const count = this.safeGet(
+                    this.resumeBigData,
+                    "non_business_krk_count",
+                    0
+                );
+                element.innerText = `${count}`;
             });
     }
     initChartNonBusinessDLH() {
         document
             .querySelectorAll("#non-business-dlh-count")
             .forEach((element) => {
-                element.innerText = `${this.resumeBigData.non_business_dlh_count}`;
+                const count = this.safeGet(
+                    this.resumeBigData,
+                    "non_business_dlh_count",
+                    0
+                );
+                element.innerText = `${count}`;
             });
     }
 }