From 461735705de20ff7c9ce1db102b5058ae89adadd Mon Sep 17 00:00:00 2001 From: Fuzi_fauzia Date: Sat, 25 May 2024 15:38:45 +0700 Subject: [PATCH] integrasi building list dan room list --- .../building/building.component.html | 2 +- .../monitoring/building/building.component.ts | 50 ++++++++----------- .../hemat-app/monitoring/monitoring.module.ts | 2 +- .../monitoring/room/room.component.html | 9 ++-- .../monitoring/room/room.component.ts | 30 ++++++++--- .../service/monitoring-api.service.ts | 18 +++++++ .../sass/scss/core/layouts/_content.scss | 4 +- 7 files changed, 73 insertions(+), 42 deletions(-) diff --git a/src/app/content/hemat-app/monitoring/building/building.component.html b/src/app/content/hemat-app/monitoring/building/building.component.html index 7d317df..8e21085 100644 --- a/src/app/content/hemat-app/monitoring/building/building.component.html +++ b/src/app/content/hemat-app/monitoring/building/building.component.html @@ -131,7 +131,7 @@ class="btn btn-float btn-square btn-outline-secondary" triggers="hover:click:hover" ngbTooltip="Room" - [routerLink]="['/monitoring/monitoring-room']" + (click)="viewRoom(data)" > diff --git a/src/app/content/hemat-app/monitoring/building/building.component.ts b/src/app/content/hemat-app/monitoring/building/building.component.ts index 5f50ac8..fafc53f 100644 --- a/src/app/content/hemat-app/monitoring/building/building.component.ts +++ b/src/app/content/hemat-app/monitoring/building/building.component.ts @@ -47,39 +47,28 @@ export class BuildingComponent { showLabel: false, }, }; - this.fetchData(); - // this.buildingData(); + this.listBuilding(); } - fetchData() { - // this.monitoringApiService.getBuildingData().subscribe((res) => { - // this.data = res; - // this.filteredRows = res.data; - // console.log(this.filteredRows); - - // this.dataTop = []; - // for (let i = 0; i < res.length; i++) { - // if (res[i].topUse.label[i]) { - // this.dataTop.push({ - // label: res[i].topUse.label ? res[i].topUse.label : '', - // value: res[i].topUse.value ? res[i].topUse.value : 0, - // }); - // } - // } - // }); - this.monitoringService.getMonitoringBuildingData().subscribe((res) => { - this.data = res; - this.filteredRows = res; + listBuilding() { + this.monitoringApiService.listBuilding().subscribe((res) => { + console.log(res.data); + this.data = res.data; + this.filteredRows = res.data; this.dataTop = []; - for (let i = 0; i < res.length; i++) { - if (res[i].topUse.label[i]) { - this.dataTop.push({ - label: res[i].topUse.label, - value: res[i].topUse.value, - }); + const maxItems = 4; + + res.data.forEach((item) => { + for (let i = 0; i < maxItems; i++) { + if (item.topUse.label[i] !== undefined) { + this.dataTop.push({ + label: item.topUse.label, + value: item.topUse.value, + }); + } } - } + }); }); } @@ -114,4 +103,9 @@ export class BuildingComponent { editRow(row) { this.router.navigate(["/monitoring/edit-new-building", row.id]); } + + viewRoom(row){ + console.log(row); + this.router.navigate(["/monitoring/monitoring-room", row.id]); + } } diff --git a/src/app/content/hemat-app/monitoring/monitoring.module.ts b/src/app/content/hemat-app/monitoring/monitoring.module.ts index 495dabc..75be901 100644 --- a/src/app/content/hemat-app/monitoring/monitoring.module.ts +++ b/src/app/content/hemat-app/monitoring/monitoring.module.ts @@ -59,7 +59,7 @@ import { UiSwitchModule } from 'ngx-ui-switch'; component: BuildingComponent, }, { - path: 'monitoring-room', + path: 'monitoring-room/:id', component: RoomComponent, data: { mode: 'room' } }, diff --git a/src/app/content/hemat-app/monitoring/room/room.component.html b/src/app/content/hemat-app/monitoring/room/room.component.html index 75ad23d..72f9ade 100644 --- a/src/app/content/hemat-app/monitoring/room/room.component.html +++ b/src/app/content/hemat-app/monitoring/room/room.component.html @@ -39,7 +39,7 @@ class="text-muted mb-0" style="font-family: Montserrat, sans-serif" > - {{ data.product }} + {{ data.name }} @@ -48,7 +48,8 @@
-

{{ data.value }} kWh

+ +

265 kWh

Consumtion
@@ -61,8 +62,8 @@
diff --git a/src/app/content/hemat-app/monitoring/room/room.component.ts b/src/app/content/hemat-app/monitoring/room/room.component.ts index 6e13b14..17216a3 100644 --- a/src/app/content/hemat-app/monitoring/room/room.component.ts +++ b/src/app/content/hemat-app/monitoring/room/room.component.ts @@ -1,6 +1,7 @@ import { Component, OnInit } from "@angular/core"; import { ActivatedRoute, Router } from "@angular/router"; import { TableMonitoringService } from "../monitoring.service"; +import { BuildingService } from "../../service/monitoring-api.service"; @Component({ selector: "app-room", @@ -17,12 +18,22 @@ export class RoomComponent implements OnInit { constructor( private route: ActivatedRoute, private monitoringService: TableMonitoringService, - private router: Router + private router: Router, + private monitoringApiService: BuildingService, ) {} ngOnInit() { this.route.data.subscribe((data) => { this.mode = data.mode; + console.log(this.mode); + + }); + this.route.params.subscribe(params => { + const buildingId = params['id']; + console.log(buildingId); + if (buildingId) { + this.fetchData(buildingId); + } }); this.breadcrumb = { mainlabel: "Room", @@ -40,14 +51,21 @@ export class RoomComponent implements OnInit { }, ], }; - this.fetchData(); - } - fetchData() { + fetchData(buildingId) { this.monitoringService.getMonitoringRoomData().subscribe((Response) => { - this.data = Response; - this.filteredRows = Response; + console.log(Response); + + // this.data = Response; + // this.filteredRows = Response; + }); + this.monitoringApiService.getRoomByBuildingId(buildingId).subscribe((res) => { + const roomEntities = res.resp.map(entry => entry.roomEntity); + this.data = roomEntities; + this.filteredRows = roomEntities; + console.log(roomEntities, 'roomEntities'); + }); } diff --git a/src/app/content/hemat-app/service/monitoring-api.service.ts b/src/app/content/hemat-app/service/monitoring-api.service.ts index 345ae05..8d5cab3 100644 --- a/src/app/content/hemat-app/service/monitoring-api.service.ts +++ b/src/app/content/hemat-app/service/monitoring-api.service.ts @@ -17,6 +17,15 @@ export class BuildingService { return this.http.post(url, data, { headers }); } + listBuilding(): Observable { + const url = `https://kapi.absys.ninja/hemat/building/dashboard/list`; + const headers = new HttpHeaders({ + 'Content-Type': 'application/json', + 'x-api-key': 'j2yaYvPSQcsEEmHh3NEobfiXyyXmmnHT' + }); + return this.http.get(url, { headers }); + } + getBuildingData(page: number = 1, limit: number = 10): Observable { const url = `https://kapi.absys.ninja/hemat/building?page=${page}&limit=${limit}`; // const headers = new HttpHeaders().set('Content-Type', 'application/json'); @@ -27,6 +36,15 @@ export class BuildingService { return this.http.get(url, { headers }); } + getRoomByBuildingId(buildingId: any): Observable { + const url = `https://kapi.absys.ninja/hemat/room-building/list/byIds?buildingId=${buildingId}`; + const headers = new HttpHeaders({ + 'Content-Type': 'application/json', + 'x-api-key': 'j2yaYvPSQcsEEmHh3NEobfiXyyXmmnHT' + }); + return this.http.get(url, { headers }); + } + getDeviceData(page: number = 1, limit: number = 10): Observable { const url = `https://kapi.absys.ninja/hemat/devices?page=${page}&limit=${limit}`; const headers = new HttpHeaders({ diff --git a/src/assets/sass/scss/core/layouts/_content.scss b/src/assets/sass/scss/core/layouts/_content.scss index 8e8d736..0a951e0 100644 --- a/src/assets/sass/scss/core/layouts/_content.scss +++ b/src/assets/sass/scss/core/layouts/_content.scss @@ -16,7 +16,7 @@ html { width: 100%; body { - height: 1000px; + height: 900px; &.fixed-navbar { padding-top: $navbar-height; @@ -102,7 +102,7 @@ html { } .content-wrapper { - padding: 2.1rem 2rem 0; + padding: 2.0rem 2rem 0; overflow: hidden; // padding: 1.8rem 2.2rem 0;