加入审查详情页面转换

2025-04-11 15:29:18 +08:00
parent 71c70696a7
commit 26fa33dbfd
11 changed files with 2725 additions and 42 deletions
@@ -0,0 +1,132 @@
+/**
+ * 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>
+  );
+}