From ce77556eebb6896903be1dc8ac3202b42b96649d Mon Sep 17 00:00:00 2001
From: tony.cheng <chengmingwei_1984122@126.com>
Date: Wed, 04 Feb 2026 21:06:04 +0800
Subject: [PATCH] feat: 实现首页任务时间实时计时功能
---
web-app/src/components/dashboard/FloatingControlPanel.jsx | 33 +++++++++++++++++++++++++++++----
1 files changed, 29 insertions(+), 4 deletions(-)
diff --git a/web-app/src/components/dashboard/FloatingControlPanel.jsx b/web-app/src/components/dashboard/FloatingControlPanel.jsx
index 8d016d9..1a80c74 100644
--- a/web-app/src/components/dashboard/FloatingControlPanel.jsx
+++ b/web-app/src/components/dashboard/FloatingControlPanel.jsx
@@ -1,10 +1,31 @@
import React from 'react';
+import { useCaseData } from '../../contexts/CaseDataContext';
+import { translateMediationState } from '../../utils/stateTranslator';
+import { useTaskTimer } from '../../hooks/useTaskTimer';
/**
* 底部悬浮控制面板
*/
-const FloatingControlPanel = ({ currentStep = 1, elapsedTime = '25分钟', onManualTakeover }) => {
- const stepNames = ['阶段1：意愿调查', '阶段2：材料核实', '阶段3：事实认定', '阶段4：达成协议', '阶段5：履约回访'];
+const FloatingControlPanel = ({ onManualTakeover }) => {
+ const { caseData, taskStartTime, isTaskTimeFallback } = useCaseData();
+ const timeline = caseData || {};
+
+ const state = timeline.mediation?.state;
+ const nodeName = timeline.current_node?.node_name || '';
+ const orderNo = timeline.current_node?.order_no || 1;
+
+ // 使用任务计时Hook获取实时时间
+ const { formattedTime } = useTaskTimer(taskStartTime, isTaskTimeFallback);
+
+ // 根据状态生成状态文本
+ let statusText = '';
+ if (state === 1) {
+ // 调解中状态
+ statusText = `调解进行中-阶段${orderNo}：${nodeName}`;
+ } else {
+ // 其他状态
+ statusText = translateMediationState(state) || '调解进行中';
+ }
const handleTakeover = () => {
if (onManualTakeover) {
@@ -22,8 +43,12 @@
<div className="status-indicator">
<span className="status-dot"></span>
<span className="status-text">
- 调解进行中-{stepNames[currentStep]}{' '}
- <span style={{ color: 'gray' }}>（已进行：{elapsedTime}）</span>
+ {statusText}{' '}
+ <span style={{ color: 'gray' }}>
+ （已进行：{formattedTime}
+ {isTaskTimeFallback && <span style={{ color: '#faad14' }}> *</span>}
+ ）
+ </span>
</span>
</div>
</div>
--
Gitblit v1.8.0