import { Component, OnInit } from '@angular/core';
import { RouterOutlet } from '@angular/router';
import { SidebarComponent } from './layouts/sidebar/sidebar.component';
import { GaugeChartComponent } from './page/gauge-chart/gauge-chart.component';
import { GraphComponent } from './page/graph/graph.component';
import { CommonModule } from '@angular/common';

@Component({
  selector: 'app-dashboard',
  standalone: true,
  imports: [RouterOutlet, SidebarComponent, GaugeChartComponent, GraphComponent, CommonModule],
  templateUrl: './dashboard.component.html',
  styleUrls: ['./dashboard.component.scss']
})
export class DashboardComponent implements OnInit {
  isLoaded: boolean = false; 
  selectedButton: string = '';
  sensorData: any = {
    dht: {
      lightIntensity: '3539',
      temperature: '27',
      humidity: '80'
    },
    npk1: {
      temperature: '28',
      moisture: '99.9',
      conductivity: '1.5',
      ph: '8.51',
      nitrogen: '500',
      phosphorus: '500',
      potassium: '500'
    },
    npk2: {
      temperature: '28.6',
      moisture: '99.8',
      conductivity: '1.4',
      ph: '8.55',
      nitrogen: '510',
      phosphorus: '512',
      potassium: '500'
    }
  };

  ngOnInit(): void {
    this.selectedButton = 'dht';
    this.loadData();
  }

  selectSensor(param: string): void {
    this.selectedButton = param;
    this.loadData();
  }

  loadData(): void {
    this.isLoaded = true;
    setTimeout(() => {
      this.isLoaded = false;
    }, 1000);
  }
}
