import { Component, OnInit } from '@angular/core';
import { CommonModule } from '@angular/common';

interface DesignerPerformance {
  id: string;
  name: string;
  performanceScore: number;
  metrics: {
    deliveryRate: number;
    qualityRate: number;
    satisfactionRate: number;
  };
}

@Component({
  selector: 'app-performance',
  standalone: true,
  imports: [CommonModule],
  templateUrl: './performance.html',
  styleUrls: ['./performance.scss']
})
export class PerformanceComponent implements OnInit {

  allDesigners: DesignerPerformance[] = [];
  sortedDesigners: DesignerPerformance[] = [];
  distribution = {
    top: [] as DesignerPerformance[],
    middle: [] as DesignerPerformance[],
    bottom: [] as DesignerPerformance[],
  };

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

  loadPerformanceData(): void {
    // 模拟数据
    this.allDesigners = this.generateMockData(20);
    this.sortAndDistributeDesigners();
  }

  generateMockData(count: number): DesignerPerformance[] {
    const names = ['Alice', 'Bob', 'Charlie', 'David', 'Eve', 'Frank', 'Grace', 'Heidi', 'Ivan', 'Judy', 'Mallory', 'Niaj', 'Olivia', 'Peggy', 'Rupert', 'Sybil', 'Trent', 'Victor', 'Walter', 'Wendy'];
    const data: DesignerPerformance[] = [];
    for (let i = 0; i < count; i++) {
      const score = Math.floor(Math.random() * 41) + 60; // 60-100
      data.push({
        id: `d${i + 1}`,
        name: names[i % names.length],
        performanceScore: score,
        metrics: {
          deliveryRate: Math.floor(Math.random() * 11) + 90, // 90-100
          qualityRate: Math.floor(Math.random() * 21) + 80, // 80-100
          satisfactionRate: Math.floor(Math.random() * 21) + 80, // 80-100
        }
      });
    }
    return data;
  }

  sortAndDistributeDesigners(): void {
    this.sortedDesigners = [...this.allDesigners].sort((a, b) => b.performanceScore - a.performanceScore);

    const total = this.sortedDesigners.length;
    const topCount = Math.ceil(total * 0.2);
    const bottomCount = Math.floor(total * 0.1);

    this.distribution.top = this.sortedDesigners.slice(0, topCount);
    this.distribution.bottom = this.sortedDesigners.slice(total - bottomCount);
    this.distribution.middle = this.sortedDesigners.slice(topCount, total - bottomCount);
  }

  onFilterChange(type: string, event: Event): void {
    const value = (event.target as HTMLSelectElement).value;
    console.log(`Filter changed: ${type} = ${value}`);
    // 重新加载模拟数据以体现变化
    this.loadPerformanceData();
  }

  exportReport(): void {
    console.log('Exporting performance report...');
    // 实际的导出逻辑
    alert('报告已开始导出！');
  }

  viewDetailReport(designerId: string): void {
    console.log(`Viewing detail report for designer: ${designerId}`);
    // 导航到详细报告页面的逻辑
    alert(`正在查看 ${this.allDesigners.find(d => d.id === designerId)?.name} 的详细报告`);
  }
}