From 4eb71775167ae903aea17bb410c6201e872daf66 Mon Sep 17 00:00:00 2001
From: tony.cheng <chengmingwei_1984122@126.com>
Date: Thu, 05 Feb 2026 16:35:50 +0800
Subject: [PATCH] feat: 优化类案推荐功能 - 相似度分级、分页加载、详情字段扩展及法条显示优化

---
 web-app/src/App.js |   84 ++++++++++++++++++++++++-----------------
 1 files changed, 49 insertions(+), 35 deletions(-)

diff --git a/web-app/src/App.js b/web-app/src/App.js
index 19f17fc..05bc219 100644
--- a/web-app/src/App.js
+++ b/web-app/src/App.js
@@ -1,5 +1,9 @@
 import React, { useState } from 'react';
+import { Spin } from 'antd';
 import './App.css';
+
+// Context
+import { CaseDataProvider, useCaseData } from './contexts/CaseDataContext';
 
 // 调解看板组件
 import TopSection from './components/dashboard/TopSection';
@@ -18,8 +22,16 @@
 import SimilarCaseContent from './components/tools/SimilarCaseContent';
 
 function App() {
+  return (
+    <CaseDataProvider>
+      <AppContent />
+    </CaseDataProvider>
+  );
+}
+
+function AppContent() {
   const [activeModal, setActiveModal] = useState(null);
-  const [currentStep, setCurrentStep] = useState(1);
+  const { loading } = useCaseData();
 
   // 工具配置
   const toolConfig = {
@@ -60,46 +72,48 @@
   };
 
   return (
-    <div className="app">
-      {/* Font Awesome CDN */}
-      <link
-        rel="stylesheet"
-        href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"
-      />
+    <Spin spinning={loading} tip="加载案件数据中...">
+      <div className="app">
+        {/* Font Awesome CDN */}
+        <link
+          rel="stylesheet"
+          href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"
+        />
 
-      {/* 顶部区域 */}
-      <TopSection />
+        {/* 顶部区域 */}
+        <TopSection />
 
-      {/* 中间区域 */}
-      <section className="middle-section">
-        {/* A区域:左侧主要内容 */}
-        <div className="area-a">
-          {/* AI调解进度 */}
-          <MediationProgress currentStep={currentStep} />
+        {/* 中间区域 */}
+        <section className="middle-section">
+          {/* A区域:左侧主要内容 */}
+          <div className="area-a">
+            {/* AI调解进度 */}
+            <MediationProgress />
 
-          {/* 选项卡容器 */}
-          <TabContainer />
-        </div>
+            {/* 选项卡容器 */}
+            <TabContainer />
+          </div>
 
-        {/* B区域:右侧工具栏 */}
-        <ToolsPanel onToolClick={handleToolClick} />
-      </section>
+          {/* B区域:右侧工具栏 */}
+          <ToolsPanel onToolClick={handleToolClick} />
+        </section>
 
-      {/* 底部悬浮控制看板 */}
-      <FloatingControlPanel currentStep={currentStep} elapsedTime="25分钟" />
+        {/* 底部悬浮控制看板 */}
+        <FloatingControlPanel />
 
-      {/* 工具弹窗 */}
-      {activeModal && toolConfig[activeModal] && (
-        <ToolModal
-          visible={true}
-          title={toolConfig[activeModal].title}
-          icon={toolConfig[activeModal].icon}
-          onClose={handleCloseModal}
-        >
-          {renderModalContent()}
-        </ToolModal>
-      )}
-    </div>
+        {/* 工具弹窗 */}
+        {activeModal && toolConfig[activeModal] && (
+          <ToolModal
+            visible={true}
+            title={toolConfig[activeModal].title}
+            icon={toolConfig[activeModal].icon}
+            onClose={handleCloseModal}
+          >
+            {renderModalContent()}
+          </ToolModal>
+        )}
+      </div>
+    </Spin>
   );
 }
 

--
Gitblit v1.8.0