perbaikan cost management service

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

@@ -168,8 +168,10 @@
                         type="button"
                         class="btn btn-outline-success ml-2"
                         (click)="doFilter()"
+                        [disabled]="spinnerFilterActive"
                       >
-                        <i class="la la-search"></i>
+                        <i class="la la-search" *ngIf="!spinnerFilterActive"></i>
+                        <i class="la la-spinner spinner" *ngIf="spinnerFilterActive"></i>
                       </button>
                     </div>
                   </div>
@@ -358,15 +360,9 @@
                       >
                         <button
                           class="btn btn-sm btn-warning mr-1"
-                          (click)="editRow(row)"
+                          (click)="viewRow(row)"
                         >
-                          <i class="ficon feather ft-edit"></i>
-                        </button>
-                        <button
-                          class="btn btn-sm btn-danger"
-                          (click)="deleteRow(row)"
-                        >
-                          <i class="ficon feather ft-trash-2"></i>
+                          <i class="ficon feather ft-eye"></i>
                         </button>
                       </ng-template>
                     </ngx-datatable-column>

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

@@ -26,6 +26,7 @@ export class CostManagementComponent implements OnInit {
   public focucedElement = "";
   spinnerActive = false;
   spinnerActiveActual = false;
+  spinnerFilterActive = false;
 
   donutChart2: any;
 
@@ -67,32 +68,37 @@ export class CostManagementComponent implements OnInit {
     const currentDate = new Date();
     this.dateSelected = currentDate.toISOString().slice(0, 7);
 
-    this.fetchData(this.storedData.buildingId, this.dateSelected, this.categorySelected);
+    this.fetchData(
+      this.storedData.buildingId,
+      this.dateSelected,
+      this.categorySelected
+    );
     this.dataListMaster();
     this.dataListBuilding();
 
     this.dataCompWaterElectCost(this.storedData.buildingId);
     this.dataCompPrevMonthCost(this.storedData.buildingId);
     this.dataCompActEstCost(this.storedData.buildingId);
-    
   }
 
   fetchData(id, period, category) {
-    this.costService.getCostManagement(id, period, category).subscribe((response) => {
-      this.data = response.results.data;
-      this.filteredRows = this.data;
-      this.kwhTerm = response.results.kwh;
-      this.costTerm = response.results.cost;
+    this.costService
+      .getCostManagement(id, period, category)
+      .subscribe((response) => {
+        this.data = response.results.data;
+        this.filteredRows = this.data;
+        this.kwhTerm = response.results.kwh;
+        this.costTerm = response.results.cost;
 
-      this.data_cost = this.filteredRows.map((item) => ({
-        building: item.name,
-        categoryName: item.category_name,
-        estimationCost: item.estimation_cost,
-        totalUse: item.total_use,
-        endDate: item.end_date,
-        statusId: item.status_id,
-      }));
-    });
+        this.data_cost = this.filteredRows.map((item) => ({
+          building: item.name,
+          categoryName: item.category_name,
+          estimationCost: item.estimation_cost,
+          totalUse: item.total_use,
+          endDate: item.end_date,
+          statusId: item.status_id,
+        }));
+      });
   }
 
   dataListMaster() {
@@ -222,7 +228,11 @@ export class CostManagementComponent implements OnInit {
     });
     setTimeout(() => {
       this.spinnerActive = false;
-      this.fetchData(this.buildingSelected, this.dateSelected, this.categorySelected );
+      this.fetchData(
+        this.buildingSelected,
+        this.dateSelected,
+        this.categorySelected
+      );
     }, 3000);
   }
 
@@ -236,7 +246,11 @@ export class CostManagementComponent implements OnInit {
       });
     setTimeout(() => {
       this.spinnerActiveActual = false;
-      this.fetchData(this.buildingSelected, this.dateSelected, this.categorySelected );
+      this.fetchData(
+        this.buildingSelected,
+        this.dateSelected,
+        this.categorySelected
+      );
     }, 3000);
   }
 
@@ -247,10 +261,18 @@ export class CostManagementComponent implements OnInit {
       date: this.dateSelected,
       searchTerm: this.searchTerm,
     };
-    this.fetchData(this.buildingSelected, this.dateSelected, this.categorySelected );
-    this.dataCompWaterElectCost(this.buildingSelected);
-    this.dataCompPrevMonthCost(this.buildingSelected);
-    this.dataCompActEstCost(this.buildingSelected);
+    this.spinnerFilterActive = true;
+    setTimeout(() => {
+      this.spinnerFilterActive = false;
+      this.fetchData(
+        this.buildingSelected,
+        this.dateSelected,
+        this.categorySelected
+      );
+      this.dataCompWaterElectCost(this.buildingSelected);
+      this.dataCompPrevMonthCost(this.buildingSelected);
+      this.dataCompActEstCost(this.buildingSelected);
+    }, 3000);
   }
 
   addFieldValue() {
@@ -301,19 +323,4 @@ export class CostManagementComponent implements OnInit {
     console.log("View row:", row);
     this.router.navigate(["/cost-management/view", row.name]);
   }
-
-  editRow(row) {
-    console.log("Edit row:", row);
-    this.router.navigate(["/cost-management/edit", row.name]);
-  }
-
-  deleteRow(row) {
-    console.log("Delete row:", row);
-  }
-
-  onTouchStart(event: Event) {
-    event.preventDefault(); // Add this if necessary
-  }
-
-  
 }