From 2c6123c54c86e76265b7ecd55eddd72d973375b8 Mon Sep 17 00:00:00 2001 From: Desy Ayurianti Date: Wed, 6 Nov 2024 13:38:20 +0700 Subject: [PATCH] fix(graph); change time range start and end --- .../src/app/cores/services/sensor.service.ts | 23 ++- .../dashboard/page/graph/graph.component.ts | 162 +++++++++++++----- 2 files changed, 140 insertions(+), 45 deletions(-) diff --git a/agrilink_vocpro/src/app/cores/services/sensor.service.ts b/agrilink_vocpro/src/app/cores/services/sensor.service.ts index 3988c74..ac599ac 100644 --- a/agrilink_vocpro/src/app/cores/services/sensor.service.ts +++ b/agrilink_vocpro/src/app/cores/services/sensor.service.ts @@ -27,9 +27,28 @@ export class SensorService extends ApiService { }); } - getSensorData(sensor: string, metric: string, startEnd: string, timeRange: string): Observable { + getSensorDataHourly(sensor: string, metric: string, start: string, end: string, timeRange: string): Observable { const params = new HttpParams() - .set('range[end]', startEnd) + .set('range[start]', start) + .set('range[end]', end) + .set('range[time_range]', timeRange) + .set('sensor', sensor) + .set('metric', metric); + + const headers= this.createAuthHeaders(); + + return this.http.get(this.getDataUrl, { params, headers }).pipe( + catchError(error => { + // this.toast.error('Failed to get sensor data for graphic, please try again'); + return throwError(error); + }) + ); + } + + getSensorDataDaily(sensor: string, metric: string, start: string, end: string, timeRange: string): Observable { + const params = new HttpParams() + .set('range[start]', start) + .set('range[end]', end) .set('range[time_range]', timeRange) .set('sensor', sensor) .set('metric', metric); diff --git a/agrilink_vocpro/src/app/pages/dashboard/page/graph/graph.component.ts b/agrilink_vocpro/src/app/pages/dashboard/page/graph/graph.component.ts index 3929da9..22d18a5 100644 --- a/agrilink_vocpro/src/app/pages/dashboard/page/graph/graph.component.ts +++ b/agrilink_vocpro/src/app/pages/dashboard/page/graph/graph.component.ts @@ -114,62 +114,138 @@ export class GraphComponent implements OnInit, AfterViewInit, OnDestroy, OnChang return `${year}-${month}-${day}`; } + getDateAgo():string{ + const today = new Date(); + today.setDate(today.getDate() - 7); + + const year = today.getFullYear(); + const month = String(today.getMonth() + 1).padStart(2, '0'); + const day = String(today.getDate()).padStart(2, '0'); + + return `${year}-${month}-${day}`; + } + fetchDHTData(timeRange: string): void { - const startEnd = this.getDate(); - this.sensorService.getSensorData('dht', 'npk', startEnd, timeRange).subscribe({ - next: (response) => { - this.isLoadingDHT = false; - if (response.statusCode === 200 && response.data.dht?.length > 0) { - this.createChart(this.dhtChartElement.nativeElement, response, 'dht', 'npk'); - this.isNoDataDHT = false; - } else { + const hEnd = this.getDate(); + const hStart = this.getDate(); + const dEnd = this.getDate(); + const dStart = this.getDateAgo(); + + if(timeRange === 'HOURLY'){ + this.sensorService.getSensorDataHourly('dht', 'npk', hStart, hEnd, timeRange).subscribe({ + next: (response) => { + this.isLoadingDHT = false; + if (response.statusCode === 200 && response.data.dht?.length > 0) { + this.createChart(this.dhtChartElement.nativeElement, response, 'dht', 'npk'); + this.isNoDataDHT = false; + } else { + this.isNoDataDHT = true; + } + }, + error: () => { + this.isLoadingDHT = false; this.isNoDataDHT = true; } - }, - error: () => { - this.isLoadingDHT = false; - this.isNoDataDHT = true; - } - }); + }); + } else if(timeRange === 'DAILY'){ + this.sensorService.getSensorDataDaily('dht', 'npk', dStart, dEnd, timeRange).subscribe({ + next: (response) => { + this.isLoadingDHT = false; + if (response.statusCode === 200 && response.data.dht?.length > 0) { + this.createChart(this.dhtChartElement.nativeElement, response, 'dht', 'npk'); + this.isNoDataDHT = false; + } else { + this.isNoDataDHT = true; + } + }, + error: () => { + this.isLoadingDHT = false; + this.isNoDataDHT = true; + } + }); + } } fetchNPK1Data(timeRange: string): void { - const startEnd = this.getDate(); - this.sensorService.getSensorData('npk1', this.selectedNPK1, startEnd, timeRange).subscribe({ - next: (response) => { - this.isLoadingNPK1 = false; - if (response.statusCode === 200 && response.data.npk1?.length > 0) { - this.createChart(this.npk1ChartElement.nativeElement, response, 'npk1', this.selectedNPK1); - this.isNoDataNPK1 = false; - } else { + const hEnd = this.getDate(); + const hStart = this.getDate(); + const dEnd = this.getDate(); + const dStart = this.getDateAgo(); + + if(timeRange === 'HOURLY'){ + this.sensorService.getSensorDataHourly('npk1', this.selectedNPK1, hEnd, hStart, timeRange).subscribe({ + next: (response) => { + this.isLoadingNPK1 = false; + if (response.statusCode === 200 && response.data.npk1?.length > 0) { + this.createChart(this.npk1ChartElement.nativeElement, response, 'npk1', this.selectedNPK1); + this.isNoDataNPK1 = false; + } else { + this.isNoDataNPK1 = true; + } + }, + error: () => { + this.isLoadingNPK1 = false; this.isNoDataNPK1 = true; } - }, - error: () => { - this.isLoadingNPK1 = false; - this.isNoDataNPK1 = true; - } - }); + }) + }else if(timeRange === 'DAILY'){ + this.sensorService.getSensorDataDaily('npk1', this.selectedNPK1, dStart, dEnd, timeRange).subscribe({ + next: (response) => { + this.isLoadingNPK1 = false; + if (response.statusCode === 200 && response.data.npk1?.length > 0) { + this.createChart(this.npk1ChartElement.nativeElement, response, 'npk1', this.selectedNPK1); + this.isNoDataNPK1 = false; + } else { + this.isNoDataNPK1 = true; + } + }, + error: () => { + this.isLoadingNPK1 = false; + this.isNoDataNPK1 = true; + } + }); + } } fetchNPK2Data(savedTimeRange: string): void { - const startEnd = this.getDate(); - this.sensorService.getSensorData('npk2', this.selectedNPK2, startEnd, savedTimeRange).subscribe({ - next: (response) => { - console.log(savedTimeRange); - this.isLoadingNPK2 = false; - if (response.statusCode === 200 && response.data.npk2?.length > 0) { - this.createChart(this.npk2ChartElement.nativeElement, response, 'npk2', this.selectedNPK2); - this.isNoDataNPK2 = false; - } else { + const hEnd = this.getDate(); + const hStart = this.getDate(); + const dEnd = this.getDate(); + const dStart = this.getDateAgo(); + + if(savedTimeRange === 'HOURLY'){ + this.sensorService.getSensorDataHourly('npk2', this.selectedNPK2, hStart, hEnd, savedTimeRange).subscribe({ + next: (response) => { + this.isLoadingNPK2 = false; + if (response.statusCode === 200 && response.data.npk2?.length > 0) { + this.createChart(this.npk2ChartElement.nativeElement, response, 'npk2', this.selectedNPK2); + this.isNoDataNPK2 = false; + } else { + this.isNoDataNPK2 = true; + } + }, + error: () => { + this.isLoadingNPK2 = false; this.isNoDataNPK2 = true; } - }, - error: () => { - this.isLoadingNPK2 = false; - this.isNoDataNPK2 = true; - } - }); + }); + } else if(savedTimeRange === 'DAILY'){ + this.sensorService.getSensorDataDaily('npk2', this.selectedNPK2, dStart, dEnd, savedTimeRange).subscribe({ + next: (response) => { + this.isLoadingNPK2 = false; + if (response.statusCode === 200 && response.data.npk2?.length > 0) { + this.createChart(this.npk2ChartElement.nativeElement, response, 'npk2', this.selectedNPK2); + this.isNoDataNPK2 = false; + } else { + this.isNoDataNPK2 = true; + } + }, + error: () => { + this.isLoadingNPK2 = false; + this.isNoDataNPK2 = true; + } + }); + } } updateCharts(): void {