import { CommonModule } from '@angular/common';
import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core';
import { IonIcon } from '@ionic/angular/standalone';
import { addIcons } from 'ionicons';
import { star } from 'ionicons/icons';
import { starOutline } from 'ionicons/icons';
addIcons({star,starOutline})

@Component({
  selector: 'edit-rating-star',
  templateUrl: './edit-rating-star.component.html',
  styleUrls: ['./edit-rating-star.component.scss'],
  imports:[IonIcon,CommonModule],
  standalone:true,
})
export class EditRatingStarComponent {
  @Input() score: number = 0; // 默认分值为0
  @Input() scoreMax: number = 5; // 最大分值
  starList: boolean[] = []; // 星星状态数组

  @Output() onScoreChange: EventEmitter<number> = new EventEmitter<number>();

  constructor() {
    this.updateStarList();
  }

  ngOnInit(){
    this.updateStarList();
  }
  ngOnChanges() {
    this.updateStarList();
  }

  // 更新星星数组
  private updateStarList() {
    this.starList = Array(this.scoreMax).fill(false);
    for (let i = 0; i < this.score; i++) {
      this.starList[i] = true;
    }
  }

  // 打分方法
  rate(index: number) {
    if (this.score === index + 1) {
      // 如果点击的是当前分值，清零
      this.score = 0;
    } else {
      // 否则更新分值
      this.score = index + 1;
    }
    this.updateStarList();
    this.onScoreChange.emit(this.score); // 触发分值变化事件
  }
}