import { Component, OnInit, ViewChild, ElementRef } from '@angular/core';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';
import { TrainingReportsComponent } from './report-viewer.component';
import { TrainingService } from './training.service';
import { Report, Scene } from './report.interface';

@Component({
  selector: 'page-crm-training',
  standalone: true,
  imports: [CommonModule, FormsModule, TrainingReportsComponent],
  templateUrl: './page-crm-training.html',
  styleUrls: ['./page-crm-training.scss']
})
export class PageCrmTraining implements OnInit {
  @ViewChild('chatMessagesContainer') chatMessagesContainer!: ElementRef;

  // 场景数据
  sceneLevels: { value: string; label: string }[] = [];
  customerTypes: { value: string; label: string }[] = [];
  allScenes: Scene[] = [];
  filteredScenes: Scene[] = [];
  selectedLevel: string = '';
  selectedCustomerType: string = '';
  selectedScene: Scene | null = null;

  // 对话数据
  chatMessages: Array<{
    type: 'user' | 'bot';
    content: string;
    timestamp: Date;
  }> = [];
  chatInput: string = '';
  currentRound: number = 1;
  maxRounds: number = 5;
  conversationScore: number | null = null;

  // 报告数据
  generatedReports: Report[] = [];
  selectedReport: Report | null = null;

  constructor(private trainingService: TrainingService) {}

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

  private loadInitialData(): void {
    this.trainingService.getSceneLevels().subscribe(levels => {
      this.sceneLevels = levels;
    });

    this.trainingService.getCustomerTypes().subscribe(types => {
      this.customerTypes = types;
    });

    this.trainingService.getAllScenes().subscribe(scenes => {
      this.allScenes = scenes;
      this.filteredScenes = [...scenes];
    });
  }

  filterScenes(): void {
    this.filteredScenes = this.allScenes.filter(scene => {
      const levelMatch = !this.selectedLevel || scene.level === this.selectedLevel;
      const typeMatch = !this.selectedCustomerType || scene.customerType === this.selectedCustomerType;
      return levelMatch && typeMatch;
    });
  }

  getLevelLabel(levelValue: string): string {
    const level = this.sceneLevels.find(l => l.value === levelValue);
    return level ? level.label : levelValue;
  }

  getCustomerLabel(typeValue: string): string {
    const type = this.customerTypes.find(t => t.value === typeValue);
    return type ? type.label : typeValue;
  }

  selectScene(scene: Scene): void {
    this.selectedScene = scene;
    this.currentRound = 1;
    this.conversationScore = null;
    this.chatMessages = [{
      type: 'bot',
      content: scene.initialMessage,
      timestamp: new Date()
    }];
    this.scrollToBottom();
  }

  sendMessage(): void {
    if (!this.chatInput.trim() || !this.selectedScene) return;

    // 添加用户消息
    const userMessage = {
      type: 'user' as const,
      content: this.chatInput,
      timestamp: new Date()
    };
    this.chatMessages.push(userMessage);
    this.chatInput = '';
    this.scrollToBottom();

    // 模拟AI回复
    setTimeout(() => {
      const botResponse = this.trainingService.generateResponse(
        this.selectedScene!.id, 
        userMessage.content
      );
      
      this.chatMessages.push({
        type: 'bot' as const,
        content: botResponse,
        timestamp: new Date()
      });

      // 更新轮次和评分
      this.currentRound = Math.ceil(this.chatMessages.length / 2);
      if (this.currentRound <= this.maxRounds) {
        this.updateScore();
      }

      this.scrollToBottom();
    }, 800);
  }

  private updateScore(): void {
    const baseScore = 80;
    const roundBonus = (this.currentRound - 1) * 5;
    const randomVariation = Math.floor(Math.random() * 10);
    
    this.conversationScore = Math.min(baseScore + roundBonus + randomVariation, 100);

    // 如果完成所有轮次，生成报告
    if (this.currentRound === this.maxRounds) {
      this.generateReport();
    }
  }

  private generateReport(): void {
    if (!this.selectedScene) return;

    const newReport: Report = {
      id: `report-${Date.now()}`,
      name: this.selectedScene.name,
      sceneId: this.selectedScene.id,
      date: new Date().toISOString(),
      difficulty: this.selectedScene.level,
      customerRole: this.selectedScene.customerType,
      score: this.conversationScore || 0,
      evaluations: {
        responsiveness: Math.min(this.conversationScore! + Math.floor(Math.random() * 10) - 5, 100),
        话术: Math.min((this.conversationScore || 80) + Math.floor(Math.random() * 8) - 4, 100),
        persuasion: Math.min((this.conversationScore || 75) + Math.floor(Math.random() * 12) - 6, 100),
        professionalism: Math.min((this.conversationScore || 85) + Math.floor(Math.random() * 6) - 3, 100)
      },
      summary: this.generateSummaryText()
    };

    this.generatedReports.unshift(newReport);
  }

  private generateSummaryText(): string {
    const strengths = [
      '展现了出色的沟通技巧',
      '对产品知识掌握扎实',
      '能够有效处理客户异议',
      '表现出了高度的专业性',
      '对话流畅自然',
      '反应迅速准确'
    ];
    
    const improvements = [
      '可以进一步提高反应速度',
      '建议丰富案例说明',
      '需要加强价格谈判技巧',
      '可优化话术结构',
      '应更关注客户需求',
      '可增加数据支持论点'
    ];

    return `在${this.selectedScene?.name}场景训练中，${
      strengths[Math.floor(Math.random() * strengths.length)]
    }，${improvements[Math.floor(Math.random() * improvements.length)]}。`;
  }

  resetConversation(): void {
    if (this.selectedScene) {
      this.selectScene(this.selectedScene);
    }
  }

  viewReport(report: Report): void {
    this.selectedReport = report;
    console.log('查看完整报告:', report);
  }

  closeReport(): void {
    this.selectedReport = null;
  }

  private scrollToBottom(): void {
    setTimeout(() => {
      if (this.chatMessagesContainer) {
        this.chatMessagesContainer.nativeElement.scrollTop = 
          this.chatMessagesContainer.nativeElement.scrollHeight;
      }
    }, 100);
  }
}