import { Component, EventEmitter, Input, Output } from '@angular/core';
import { horizontalInOutReverse } from '../../../../../common.animation';
import { CommonNzModule } from './../../../../../common.nz.module';
import { KnowledgeService } from './../../../../../services/knowledge.service';
import { RadioItemComponent } from './radio-item/radio-item.component';

export interface ControlSelectOption {
  label: string;
  value: number;
  color: string;
  key: string;
  checked: boolean;
}

@Component({
  selector: 'datav-control-panel',
  standalone: true,
  imports: [CommonNzModule, RadioItemComponent],
  templateUrl: './control-panel.component.html',
  styleUrl: './control-panel.component.less',
  animations: [horizontalInOutReverse],
})
export class ControlPanelComponent {
  @Input() activeType = '';
  @Input() visible = false;
  @Input() riskLevels: ControlSelectOption[] = [];
  @Input() hazardLevels: ControlSelectOption[] = [];
  @Output() activeTypeChange = new EventEmitter<string>();
  @Output() checkPropertyChange = new EventEmitter<ControlSelectOption>();
  @Output() allClick = new EventEmitter<boolean>();
  constructor(private knowledge: KnowledgeService) {}

  get isRiskActive() {
    return this.activeType === 'risk';
  }
  get isHazardActive() {
    return this.activeType === 'hazard';
  }
  setActiveType(type: string) {
    this.activeTypeChange.emit(type);
  }

  onOptionClick(item: ControlSelectOption) {
    this.checkPropertyChange.emit(item);
  }
  onAllClick() {
    this.allClick.emit(!this.allChecked);
  }
  get currentOptions() {
    return this.isRiskActive ? this.riskLevels : this.hazardLevels;
  }

  get riskTotal() {
    return this.riskLevels.reduce((total, item) => total + item.value, 0);
  }
  get hazardTotal() {
    return this.hazardLevels.reduce((total, item) => total + item.value, 0);
  }
  get allChecked() {
    return this.currentOptions.every(item => item.checked);
  }
}
