/**
 * AI智能分析组件
 * 显示AI对文档的分析结果、风险提示和优化建议
 */

// 分析项类型
interface AnalysisItem {
  title: string;
  content: string;
  description: string;
}

// 分析数据类型
interface AnalysisData {
  riskAlerts: AnalysisItem[];
  suggestions: AnalysisItem[];
  summary: string;
}

interface AIAnalysisProps {
  analysisData: AnalysisData;
  score: number;
  onConfirmResults: () => void;
}

export function AIAnalysis({ analysisData, score, onConfirmResults }: AIAnalysisProps) {
  const handleExportReport = () => {
    alert('导出评查报告功能');
  };
  
  // 渲染风险提示项
  const renderRiskAlerts = () => {
    return analysisData.riskAlerts.map((item, index) => (
      <div key={`risk-${index}`} className="bg-gray-50 rounded-md p-4 mb-4">
        <div className="flex items-start">
          <i className="ri-lightbulb-line text-warning text-lg mr-2"></i>
          <div>
            <p className="text-sm mb-2">
              <span className="font-medium">{item.title}：</span>
              {item.content}
            </p>
            <p className="text-xs text-secondary">{item.description}</p>
          </div>
        </div>
      </div>
    ));
  };
  
  // 渲染优化建议项
  const renderSuggestions = () => {
    return analysisData.suggestions.map((item, index) => (
      <div key={`suggestion-${index}`} className="bg-gray-50 rounded-md p-4 mb-4">
        <div className="flex items-start">
          <i className="ri-lightbulb-line text-primary text-lg mr-2"></i>
          <div>
            <p className="text-sm mb-2">
              <span className="font-medium">{item.title}：</span>
              {item.content}
            </p>
            <p className="text-xs text-secondary">{item.description}</p>
          </div>
        </div>
      </div>
    ));
  };
  
  // 获取评分对应的颜色类
  const getScoreColorClass = (score: number) => {
    if (score >= 90) return 'text-success';
    if (score >= 70) return 'text-warning';
    return 'text-error';
  };
  
  // 获取评分条对应的颜色类
  const getScoreBarColorClass = (score: number) => {
    if (score >= 90) return 'bg-success';
    if (score >= 70) return 'bg-warning';
    return 'bg-error';
  };
  
  return (
    <div>
      <div className="analysis-card bg-white rounded-lg shadow-sm p-4">
        <h3 className="text-lg font-medium mb-4">AI智能分析</h3>
        
        {/* 风险提示 */}
        {analysisData.riskAlerts.length > 0 && renderRiskAlerts()}
        
        {/* 优化建议 */}
        {analysisData.suggestions.length > 0 && renderSuggestions()}
      </div>
      
      <div className="mt-8">
        <h3 className="text-lg font-medium mb-4">综合评价</h3>
        <div className="bg-white border border-gray-200 p-4 rounded-md">
          {/* 评价摘要 */}
          <p className="text-sm">{analysisData.summary}</p>
          
          {/* 评分 */}
          <div className="mt-4">
            <p className="text-sm font-medium">
              合规性评分：
              <span className={`${getScoreColorClass(score)} font-medium`}>{score}分</span>
            </p>
            <div className="mt-2 bg-gray-200 rounded-full h-2.5 w-full">
              <div 
                className={`${getScoreBarColorClass(score)} h-2.5 rounded-full`} 
                style={{ width: `${score}%` }}
              ></div>
            </div>
          </div>
          
          {/* 操作按钮 */}
          {/* <div className="mt-4 flex space-x-4">
            <button 
              className="ant-btn ant-btn-default flex items-center"
              onClick={handleExportReport}
            >
              <i className="ri-file-download-line mr-1"></i> 导出评查报告
            </button>
            <button 
              className="ant-btn ant-btn-primary flex items-center"
              onClick={onConfirmResults}
            >
              <i className="ri-check-double-line mr-1"></i> 确认评查结果
            </button>
          </div> */}
        </div>
      </div>
    </div>
  );
}