From 88a31d5a960bd10f3799bc00f8aa24461567d06e Mon Sep 17 00:00:00 2001
From: shimai <shimai@example.com>
Date: Tue, 07 Apr 2026 15:23:43 +0800
Subject: [PATCH] Merge branch 'test/tony.cheng/260312' of http://120.79.193.119:9090/r/~chengmw/cloud-melody-front into test/shimai.huang/260309

---
 web-app/src/components/dashboard/TabContainer.jsx |   84 ++++++++++++++++++++++++++++++++----------
 1 files changed, 64 insertions(+), 20 deletions(-)

diff --git a/web-app/src/components/dashboard/TabContainer.jsx b/web-app/src/components/dashboard/TabContainer.jsx
index ca215e3..e390898 100644
--- a/web-app/src/components/dashboard/TabContainer.jsx
+++ b/web-app/src/components/dashboard/TabContainer.jsx
@@ -1,6 +1,6 @@
 import React, { useState, useEffect, forwardRef, useImperativeHandle } from 'react';
 import { useCaseData } from '../../contexts/CaseDataContext';
-import { formatDuration, formatSuccessRate, formatRoundCount } from '../../utils/stateTranslator';
+import { formatDuration, formatSuccessRate } from '../../utils/stateTranslator';
 import ProcessAPIService from '../../services/ProcessAPIService';
 import EvidenceAPIService from '../../services/EvidenceAPIService';
 import MediationAgreementAPIService from '../../services/MediationAgreementAPIService';
@@ -8,6 +8,11 @@
 import { message, Spin, Tag, Modal, Button, Input, Image } from 'antd';
 import { PhoneOutlined } from '@ant-design/icons';
 import { CallRecordModal } from '../call-record';
+
+// 新增组件导入
+import PartyInfoCard from './PartyInfoCard';
+import NegotiationProgress from './NegotiationProgress';
+import AISuggestionCard from './AISuggestionCard';
 
 const { TextArea } = Input;
 
@@ -89,22 +94,53 @@
 });
 
 /**
+ * 获取成功率同比数据
+ */
+const getSuccessRateYoY = (mediation) => {
+  // 优先使用API返回的同比值
+  if (mediation?.yoy_success_rate !== undefined && mediation?.yoy_success_rate !== null) {
+    return {
+      rate: mediation.yoy_success_rate,
+      hours: mediation.yoy_before_hours || 0
+    };
+  }
+  
+  // 计算同比值
+  const currentRate = mediation?.success_rate || 0;
+  const lastRate = mediation?.last_success_rate || 0;
+  const diff = (currentRate - lastRate) * 100;
+  
+  return {
+    rate: diff,
+    hours: mediation?.yoy_before_hours || 0
+  };
+};
+
+/**
  * 调解数据看板
  */
 const MediationDataBoard = () => {
   const { caseData } = useCaseData();
   const timeline = caseData || {};
+  const mediation = timeline.mediation || {};
   
   // 从 timeline 获取数据
   const gapContent = timeline.result || '暂无分歧分析';
   const updateTime = formatDuration(timeline.before_duration);
-  const successRate = formatSuccessRate(timeline.mediation?.success_rate);
-  const roundCount = formatRoundCount(timeline.mediation?.mediation_count);
+  const successRate = formatSuccessRate(mediation.success_rate);
+  
+  // 获取成功率数值(用于进度条)
+  const successRateValue = (mediation.success_rate || 0) * 100;
+  
+  // 获取同比数据
+  const yoyData = getSuccessRateYoY(mediation);
+  const yoyRate = yoyData.rate >= 0 ? `+${yoyData.rate.toFixed(0)}%` : `${yoyData.rate.toFixed(0)}%`;
+  const yoyHours = yoyData.hours;
   
   return (
     <div className="mediation-metrics">
-      {/* 左侧:诉求差距分析 */}
-      <div className="metric-card">
+      {/* 左侧:诉求差距分析 + AI建议 */}
+      <div className="metric-card left-column">
         <div className="metric-title">
           <i className="fas fa-exclamation-circle"></i>
           <span>诉求差距分析</span>
@@ -120,28 +156,36 @@
               {gapContent}
             </div>
           </div>
+          {/* AI调解建议 */}
+          <AISuggestionCard />
         </div>
       </div>
 
-      {/* 右侧:调解数据 */}
-      <div className="metric-card">
-        <div className="metric-title">
-          <i className="fas fa-exchange-alt"></i>
-          <span>调解数据</span>
-        </div>
-        <div className="metric-content">
-          <div className="success-metric">
-            <div className="success-value">{successRate}</div>
-            <div className="success-label">预计调解成功概率</div>
-            <div className="success-change">
-              
-              {/* <i className="fas fa-arrow-up"></i><span>较{updateTime} +8%</span> */}
+      {/* 右侧:申请双方 + 成功率 + 协商沟通 */}
+      <div className="metric-card right-column">
+        {/* 申请双方信息 */}
+        <PartyInfoCard />
+        
+        {/* 预计调解成功率 */}
+        <div className="success-rate-section">
+          <div className="success-rate-label">预计调解成功率</div>
+          <div className="success-rate-row">
+            <span className="success-rate-value">{successRate}</span>
+            <div className="success-rate-yoy">
+              <img src="/mom.png" alt="" className="yoy-icon-img" />
+              <span className="yoy-rate">{yoyRate}</span>
+              <span className="yoy-time">较{yoyHours}小时前</span>
             </div>
-            <div style={{ marginTop: 15, fontSize: '0.9rem', color: 'var(--gray-color)' }}>
-              协商沟通:<span style={{ color: 'var(--dark-color)', fontWeight: 600 }}>{roundCount}</span>
+          </div>
+          <div className="success-rate-progress">
+            <div className="progress-bar-bg">
+              <div className="progress-bar-fill" style={{ width: `${successRateValue}%` }}></div>
             </div>
           </div>
         </div>
+        
+        {/* 协商沟通进度 */}
+        <NegotiationProgress />
       </div>
     </div>
   );

--
Gitblit v1.8.0