perbaikan master

src/app/content/hemat-app/cost-management/cost-management.component.ts

@@ -92,7 +92,7 @@ export class CostManagementComponent implements OnInit {
       .subscribe((response) => {
         this.data = response.results.data;
         this.filteredRows = this.data;
-        let kwhData = parseFloat(response.results.kwh)
+        let kwhData = parseFloat(response.results.kwh);
         this.kwhTerm = kwhData.toFixed(1);
 
         this.costTerm = response.results.cost;
@@ -135,8 +135,9 @@ export class CostManagementComponent implements OnInit {
 
   dataListBuilding() {
     this.monitoringApiService.getBuildingList().subscribe((data) => {
-      this.dataBuildingList = data.data.filter((item) => item.statusName.toLowerCase() === "aktif");
+      this.dataBuildingList = data.data.filter(
-      
+        (item) => item.statusName.toLowerCase() === "aktif"
+      );
     });
   }
 
@@ -144,57 +145,44 @@ export class CostManagementComponent implements OnInit {
     this.costService.getCompPrevMonthCost(buildingId).subscribe((data) => {
       this.dataCompPrev = data.data;
       this.chartOption = {
+        tooltip: {
+          trigger: "axis",
+          axisPointer: {
+            type: "shadow",
+          },
+          formatter: function (params) {
+            var tar = params[1];
+            return tar.name + "<br/>" + tar.seriesName + " : " + tar.value;
+          },
+        },
+
         grid: {
           left: "25%",
           right: "25%",
           top: "20%",
           bottom: "20%",
         },
-
-        // Add tooltip
-        tooltip: {
-          trigger: "axis",
-          enterable: false,
-          formatter: function (params) {
-            return `${params[0].name}<br/>${
-              params[0].seriesName
-            }: Rp. ${params[0].value.toLocaleString()}`;
-          },
-        },
-
-        // Add legend
-        legend: false,
-
-        // Add custom colors
         color: ["#37A647"],
-
+        xAxis: {
-        // Horizontal axis
-        xAxis: [
-          {
           type: "category",
+          splitLine: { show: false },
           data: [this.dataCompPrev[0].name, this.dataCompPrev[1].name],
           axisLine: {
             show: true,
             lineStyle: {
               color: "#37A647",
-                width: 4,
+              width: 7,
             },
           },
           axisTick: {
             show: false,
           },
-            splitLine: {
-              show: false,
-            },
           axisLabel: {
             show: false,
           },
         },
-        ],
 
-        // Vertical axis
+        yAxis: {
-        yAxis: [
-          {
           type: "value",
           axisLine: {
             show: false,
@@ -209,14 +197,28 @@ export class CostManagementComponent implements OnInit {
             show: false,
           },
         },
-        ],
 
-        // Add series
         series: [
+          {
+            name: "Placeholder",
+            type: "bar",
+            stack: "Total",
+            itemStyle: {
+              borderColor: "transparent",
+              color: "transparent",
+            },
+            emphasis: {
+              itemStyle: {
+                borderColor: "transparent",
+                color: "transparent",
+              },
+            },
+            data: [1000, 1000],
+          },
           {
             name: "Cost",
             type: "bar",
-            data: [this.dataCompPrev[0].rupiah, this.dataCompPrev[1].rupiah],
+            stack: "Total",
             label: {
               show: true,
               position: "top",
@@ -225,7 +227,8 @@ export class CostManagementComponent implements OnInit {
                 return `Rp. ${params.value.toLocaleString()}`;
               },
             },
-            barWidth: "50%",
+            // barWidth: "50%",
+            data: [this.dataCompPrev[0].rupiah, this.dataCompPrev[1].rupiah],
           },
         ],
       };
@@ -236,57 +239,44 @@ export class CostManagementComponent implements OnInit {
     this.costService.getCompActEstCost(buildingId).subscribe((data) => {
       this.dataCompAct = data.data[0];
       this.chartOption2 = {
+        tooltip: {
+          trigger: "axis",
+          axisPointer: {
+            type: "shadow",
+          },
+          formatter: function (params) {
+            var tar = params[1];
+            return tar.name + "<br/>" + tar.seriesName + " : " + tar.value;
+          },
+        },
+
         grid: {
           left: "25%",
           right: "25%",
           top: "20%",
           bottom: "20%",
         },
-
-        // Add tooltip
-        tooltip: {
-          trigger: "axis",
-          enterable: false,
-          formatter: function (params) {
-            return `${params[0].name}<br/>${
-              params[0].seriesName
-            }: Rp. ${params[0].value.toLocaleString()}`;
-          },
-        },
-
-        // Add legend
-        legend: false,
-
-        // Add custom colors
         color: ["#37A647"],
-
+        xAxis: {
-        // Horizontal axis
-        xAxis: [
-          {
           type: "category",
+          splitLine: { show: false },
           data: ["Estimation Cost", "Actual Cost"],
           axisLine: {
             show: true,
             lineStyle: {
               color: "#37A647",
-                width: 4,
+              width: 7,
             },
           },
           axisTick: {
             show: false,
           },
-            splitLine: {
-              show: false,
-            },
           axisLabel: {
             show: false,
           },
         },
-        ],
 
-        // Vertical axis
+        yAxis: {
-        yAxis: [
-          {
           type: "value",
           axisLine: {
             show: false,
@@ -301,14 +291,28 @@ export class CostManagementComponent implements OnInit {
             show: false,
           },
         },
-        ],
 
-        // Add series
         series: [
+          {
+            name: "Placeholder",
+            type: "bar",
+            stack: "Total",
+            itemStyle: {
+              borderColor: "transparent",
+              color: "transparent",
+            },
+            emphasis: {
+              itemStyle: {
+                borderColor: "transparent",
+                color: "transparent",
+              },
+            },
+            data: [2500, 2500],
+          },
           {
             name: "Cost",
             type: "bar",
-            data: [this.dataCompAct.est_cost, this.dataCompAct.real_cost],
+            stack: "Total",
             label: {
               show: true,
               position: "top",
@@ -317,7 +321,8 @@ export class CostManagementComponent implements OnInit {
                 return `Rp. ${params.value.toLocaleString()}`;
               },
             },
-            barWidth: "50%", // Adjust bar width
+            // barWidth: "50%",
+            data: [this.dataCompAct.est_cost, this.dataCompAct.real_cost],
           },
         ],
       };

src/app/content/hemat-app/master/master-room/add-edit-master-room/add-edit-master-room.component.html

@@ -36,6 +36,7 @@
           id="code"
           formControlName="code"
           maxlength="10"
+          (input)="toUppercase($event)"
         />
         <div
           *ngIf="myForm.get('code').touched && myForm.get('code').invalid"

src/app/content/hemat-app/master/master-room/add-edit-master-room/add-edit-master-room.component.ts

@@ -64,6 +64,12 @@ export class AddEditMasterRoomComponent {
     });
   }
 
+  toUppercase(event: Event) {
+    const input = event.target as HTMLInputElement;
+    input.value = input.value.toUpperCase();
+    this.myForm.get('code').setValue(input.value);
+  }
+
   listDataStatus() {
     this.monitoringApiService.getMasterData().subscribe((res) => {
       this.data = res.results.data;

src/app/content/hemat-app/monitoring/detail/detail.component.ts

@@ -284,6 +284,7 @@ export class DetailComponent {
           legend: {},
           toolbox: {
             show: true,
+            orient: 'vertical',
             feature: {
               dataView: { show: true, readOnly: false },
               magicType: { show: true, type: ['line', 'bar'] },