85 lines
2.5 KiB
TypeScript
85 lines
2.5 KiB
TypeScript
import { Component, OnInit, ViewChild, ElementRef, ChangeDetectorRef } from '@angular/core';
|
|
import { Chart, registerables } from 'chart.js';
|
|
import { SensorService } from '../../../../cores/services/sensor.service';
|
|
import { ApiResponse, ParameterSensor } from '../../../../cores/interface/sensor-data';
|
|
import { CommonModule } from '@angular/common';
|
|
|
|
Chart.register(...registerables);
|
|
|
|
@Component({
|
|
selector: 'app-actualgraph',
|
|
standalone: true,
|
|
imports: [CommonModule],
|
|
templateUrl: './actualgraph.component.html',
|
|
styleUrls: ['./actualgraph.component.scss']
|
|
})
|
|
export class ActualgraphComponent implements OnInit {
|
|
@ViewChild('chartCanvas', { static: false }) chartCanvas?: ElementRef<HTMLCanvasElement>;
|
|
private chart: Chart | undefined;
|
|
selectedButton: string = 'npk1';
|
|
isLoading: boolean = true;
|
|
isNoData: boolean = false;
|
|
greeting = '';
|
|
|
|
actualDataValues = {
|
|
nitrogen: 0,
|
|
phosphorus: 0,
|
|
kalium: 0
|
|
};
|
|
|
|
constructor(
|
|
private sensorService: SensorService,
|
|
private cdr: ChangeDetectorRef
|
|
) {}
|
|
|
|
ngOnInit(): void {
|
|
this.updateGreeting();
|
|
this.loadData('npk1');
|
|
}
|
|
|
|
loadData(sensorType: string): void {
|
|
this.selectedButton = sensorType;
|
|
this.isLoading = true;
|
|
this.isNoData = false;
|
|
|
|
this.sensorService.getLatestData().subscribe(
|
|
(response: ApiResponse) => {
|
|
if (response.statusCode === 200) {
|
|
const selectedData = (response.data as { [key: string]: any[] })[sensorType];
|
|
|
|
if (selectedData && selectedData.length > 0) {
|
|
const npkData: ParameterSensor = selectedData[0];
|
|
|
|
this.actualDataValues = {
|
|
nitrogen: npkData.soilnitrogen ?? 0,
|
|
phosphorus: npkData.soilphosphorus ?? 0,
|
|
kalium: npkData.soilpotassium ?? 0
|
|
};
|
|
|
|
this.isLoading = false;
|
|
this.cdr.detectChanges();
|
|
} else {
|
|
this.isNoData = true;
|
|
this.isLoading = false;
|
|
this.cdr.detectChanges();
|
|
}
|
|
} else {
|
|
console.error('Error loading data: ', response.message);
|
|
this.isLoading = false;
|
|
this.cdr.detectChanges();
|
|
}
|
|
},
|
|
(error) => {
|
|
console.error('Error loading data:', error);
|
|
this.isLoading = false;
|
|
this.cdr.detectChanges();
|
|
}
|
|
);
|
|
}
|
|
|
|
updateGreeting(): void {
|
|
const hour = new Date().getHours();
|
|
this.greeting = hour < 12 ? 'Good Morning' : hour < 18 ? 'Good Afternoon' : 'Good Evening';
|
|
}
|
|
}
|