feat: 完善调解平台功能并集成API服务

tony.cheng

2026-02-04 a6be73d4391080bf012825bcdd95645e0a89bdcb

 web-app/src/components/dashboard/TabContainer.jsx

@@ -1,4 +1,6 @@
import React, { useState } from 'react';
import { useCaseData } from '../../contexts/CaseDataContext';
import { formatDuration, formatSuccessRate, formatRoundCount } from '../../utils/stateTranslator';

/**
 * 选项卡容器组件 - 4个选项卡
@@ -66,6 +68,15 @@
 * 调解数据看板
 */
const MediationDataBoard = () => {
  const { caseData } = useCaseData();
  const timeline = caseData || {};
  
  // 从 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);
  
  return (
    <div className="mediation-metrics">
      {/* 左侧：诉求差距分析 */}
@@ -80,20 +91,9 @@
              <i className="fas fa-exclamation-circle"></i>
              主要分歧点
            </div>
            <div className="gap-update-time">3小时前更新</div>
            <div className="gap-update-time">{updateTime}</div>
            <div className="gap-content">
              双方在以下方面存在明显分歧：
              <ul>
                <li>
                  <strong>拖欠工资金额</strong>：李晓明主张拖欠3个月工资¥42,000，公司承认拖欠但只认可¥35,000
                </li>
                <li>
                  <strong>克扣绩效奖金</strong>：李晓明主张应发绩效奖金¥10,800，公司以未完成KPI为由拒绝支付
                </li>
                <li>
                  <strong>经济补偿金</strong>：李晓明要求支付解除劳动合同经济补偿¥12,000，公司认为员工主动辞职不应支付
                </li>
              </ul>
              {gapContent}
            </div>
          </div>
        </div>
@@ -107,14 +107,14 @@
        </div>
        <div className="metric-content">
          <div className="success-metric">
            <div className="success-value">68%</div>
            <div className="success-value">{successRate}</div>
            <div className="success-label">预计调解成功概率</div>
            <div className="success-change">
              <i className="fas fa-arrow-up"></i>
              <span>较3小时前 +8%</span>
              
              {/* <i className="fas fa-arrow-up"></i><span>较{updateTime} +8%</span> */}
            </div>
            <div style={{ marginTop: 15, fontSize: '0.9rem', color: 'var(--gray-color)' }}>
              协商沟通：<span style={{ color: 'var(--dark-color)', fontWeight: 600 }}>第6轮</span>
              协商沟通：<span style={{ color: 'var(--dark-color)', fontWeight: 600 }}>{roundCount}</span>
            </div>
          </div>
        </div>