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

@Component({
  selector: 'app-edit-rating-star',
  templateUrl: './edit-rating-star.component.html',
  styleUrls: ['./edit-rating-star.component.scss'],
  standalone: true,
  imports: [IonicModule, CommonModule],
})
export class EditRatingStarComponent implements OnInit, OnChanges {
  @Input() score: number = 0;
  @Input() scoreMax: number = 5;
  @Output() onScoreChange: EventEmitter<number> = new EventEmitter<number>();

  starList: string[] = [];

  ngOnInit(): void {
    this.updateStarList();
  }

  ngOnChanges(changes: SimpleChanges): void {
    if (changes['score']) {
      this.updateStarList();
    }
  }

  private updateStarList(): void {
    // 确保分值合法
    if (this.score < 0) this.score = 0;
    if (this.score > this.scoreMax) this.score = this.scoreMax;

    // 根据分值生成星星图标名称
    this.starList = Array.from({ length: this.scoreMax }, (_, i) =>
      i < this.score ? 'star' : 'star-outline'
    );
  }

  rate(newScore: number): void {
    this.score = newScore;
    this.updateStarList();
    this.onScoreChange.emit(this.score);
  }
}