import { Component } 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',
  styleUrl: './dashboard.component.scss'
})
export class DashboardComponent{

  selectedButton: string = 'dht';

  // Fungsi untuk mengatur tombol yang dipilih
  selectParameter(param: string) {
    this.selectedButton = param;
  }

  //kelembaban
  kelembabanData: number = 90;
  kelembabanColorStops: [number, string][] = [[0, '#16423C'], [1, '#16423C']];
  kelembabanMaxValue: number = 100;
  kelembabanSatuanData: string = '%';
  kelembabanTitle: string = 'Kelembapan Udara';

  //suhu 
  suhuData: number = 35;
  suhuColorStops: [number, string][] = [[0, '#663440'], [1, '#663440']];
  suhuMaxValue: number = 100;
  suhuSatuanData: string = '°C';
  suhuTitle: string = 'Suhu';

  //intensitas cahaya
  intensitasCahayaData: number = 3469;
  intensitasCahayaColorStops: [number, string][] = [[0, '#b35b03'], [1, '#b35b03']];
  intensitasCahayaMaxValue: number = 4000;
  intensitasCahayaSatuanData: string = 'lux';
  intensitasCahayaTitle: string = 'Intensitas Cahaya';

  //kelembaban tanah
  kelembabanTanahData: number = 90;
  kelembabanTanahColorStops: [number, string][] = [[0, '#493e30'], [1, '#493e30']];
  kelembabanTanahMaxValue: number = 100;
  kelembabanTanahSatuanData: string = '%';
  kelembabanTanahTitle: string = 'Kelembapan Tanah';

    //nitrogen
  nitrogenData: number = 1063;
  nitrogenColorStops: [number, string][] = [[0, '#364732'], [1, '#364732']];
  nitrogenMaxValue: number = 2000;
  nitrogenSatuanData: string = 'NPM';
  nitrogenTitle: string = 'Nitrogen';

  //pottasium
  pottasiumData: number = 1000;
  pottasiumColorStops: [number, string][] = [[0, '#472e49'], [1, '#472e49']];
  pottasiumMaxValue: number = 2000;
  pottasiumSatuanData: string = 'NPM';
  pottasiumTitle: string = 'Pottasium';

  //phospor
  phosphorusData: number = 1000;
  phosphorusColorStops: [number, string][] = [[0, '#663440'], [1, '#663440']];
  phosphorusMaxValue: number = 2000;
  phosphorusSatuanData: string = 'NPM';
  phosphorusTitle: string = 'Phosporus';

}