修复智能外呼气泡组件变量初始化错误和时间格式问题

tony.cheng

2026-02-11 6f344a5292739e21d0c8f06c346be44c31c38552

 web-app/src/contexts/CaseDataContext.jsx

@@ -3,9 +3,10 @@
 * 提供案件数据的全局状态管理和localStorage持久化
 */

import React, { createContext, useContext, useState, useEffect } from 'react';
import React, { createContext, useContext, useState, useEffect, useRef } from 'react';
import { message } from 'antd';
import ProcessAPIService from '../services/ProcessAPIService';
import OutboundBotAPIService from '../services/OutboundBotAPIService';
import { getMergedParams } from '../utils/urlParams';
import { mockTimelineData } from '../mocks/timeline';
import { getFallbackStartTime, parseTimeString } from '../utils/timeFormatter';
@@ -15,6 +16,7 @@

// localStorage键名
const STORAGE_KEY = 'case_data_timeline';
const OUTBOUND_JOBS_KEY = 'outbound_call_jobs';

/**
 * CaseDataProvider组件
@@ -22,25 +24,12 @@
 */
export const CaseDataProvider = ({ children }) => {
  const [caseData, setCaseData] = useState(null);
  const [processNodes, setProcessNodes] = useState([]);  // 流程节点数据
  const [loading, setLoading] = useState(false);
  const [error, setError] = useState(null);
  const [taskStartTime, setTaskStartTime] = useState(null);  // 任务开始时间
  const [isTaskTimeFallback, setIsTaskTimeFallback] = useState(false);  // 是否降级模式

  /**
   * 从localStorage读取数据
   */
  const loadFromStorage = () => {
    try {
      const stored = localStorage.getItem(STORAGE_KEY);
      if (stored) {
        return JSON.parse(stored);
      }
    } catch (err) {
      console.error('Failed to load data from localStorage:', err);
    }
    return null;
  };
  const [hasLoaded, setHasLoaded] = useState(false);  // 防止重复加载

  /**
   * 保存数据到localStorage
@@ -50,6 +39,139 @@
      localStorage.setItem(STORAGE_KEY, JSON.stringify(data));
    } catch (err) {
      console.error('Failed to save data to localStorage:', err);
    }
  };

  /**
   * 检查是否有活跃的外呼任务
   * @returns {boolean} 是否有活跃任务
   */
  const hasActiveOutboundJobs = () => {
    try {
      const stored = localStorage.getItem(OUTBOUND_JOBS_KEY);
      if (!stored) return false;
      
      const jobs = JSON.parse(stored);
      const activeStatuses = ['Scheduling', 'Executing', 'Paused', 'Drafted'];
      
      // 过滤出活跃状态的任务
      const activeJobs = jobs.filter(job => activeStatuses.includes(job.callStatus));
      return activeJobs.length > 0;
    } catch (err) {
      console.error('检查活跃外呼任务失败:', err);
      return false;
    }
  };

  /**
   * 触发智能外呼
   * @param {Object} timeline - 案件时间线数据
   */
  const triggerOutboundCall = async (timeline) => {
    try {
      // 检查是否已有活跃任务，如有则跳过
      if (hasActiveOutboundJobs()) {
        console.log('检测到活跃外呼任务，跳过发起新外呼');
        return;
      }

      const mediationId = timeline.id;
      const caseId = timeline.case_id;

      if (!mediationId || !caseId) {
        console.warn('缺少必要参数，跳过外呼触发:', { mediationId, caseId });
        return;
      }

      console.log('发起智能外呼，mediationId:', mediationId, ', caseId:', caseId);

      // 调用外呼API
      const response = await OutboundBotAPIService.makeCallV2({
        mediationId: String(mediationId),
        caseId: String(caseId),
        callAuto: 0,
        callPersonId: ''
      });

      // 处理响应
      if (response?.data && Array.isArray(response.data)) {
        const successJobs = [];
        const failedJobs = [];

        // 分类成功和失败的记录
        response.data.forEach(item => {
          if (item.errorCode === 0 && item.jobId) {
            successJobs.push({
              jobId: item.jobId,
              callStatus: item.callStatus || 'Scheduling',
              personId: item.personId,
              mediationId: item.mediationId,
              caseId: String(caseId), // 添加 caseId 字段用于轮询
              perClassName: item.perClassName || '', // 添加人员类型名称
              trueName: item.trueName || '', // 添加真实姓名
              startTime: item.createdTime || item.start_time,
              pollStartTime: Date.now(),
              retryCount: 0
            });
          } else if (item.errorCode > 0) {
            failedJobs.push({
              personId: item.personId,
              message: item.message || '未知错误',
              perClassName: item.perClassName || '', // 添加人员类型名称
              trueName: item.trueName || '', // 添加真实姓名
              errorCode: item.errorCode, // 添加错误码
              startTime: new Date(item.startTime || item.start_time).getTime() // 转换为时间戳
            });
          }
        });

        // 存储成功的任务到 localStorage
        if (successJobs.length > 0) {
          localStorage.setItem(OUTBOUND_JOBS_KEY, JSON.stringify(successJobs));
          console.log('存储外呼任务成功，数量:', successJobs.length);
        }

        // 存储失败的任务到 localStorage（用于气泡显示）
        if (failedJobs.length > 0) {
          console.log('准备存储失败任务:', failedJobs);
          // 读取现有的失败任务
          const storedFailedJobs = JSON.parse(localStorage.getItem(`${OUTBOUND_JOBS_KEY}_failed`) || '[]');
          
          // 去重：按 personId 去重，保留最新的错误信息
          const uniqueFailedJobs = [...storedFailedJobs];
          failedJobs.forEach(newJob => {
            const existingIndex = uniqueFailedJobs.findIndex(job => job.personId === newJob.personId);
            if (existingIndex >= 0) {
              // 更新已存在的失败任务
              uniqueFailedJobs[existingIndex] = newJob;
            } else {
              // 添加新的失败任务
              uniqueFailedJobs.push(newJob);
            }
          });
          
          // 清理超过24小时的失败任务
          const now = Date.now();
          const cleanedFailedJobs = uniqueFailedJobs.filter(job => {
            return (now - job.startTime) < 24 * 60 * 60 * 1000; // 24小时
          });
          
          localStorage.setItem(`${OUTBOUND_JOBS_KEY}_failed`, JSON.stringify(cleanedFailedJobs));
          console.log('存储外呼失败任务，数量:', cleanedFailedJobs.length);
        }

        // 提示失败的任务
        if (failedJobs.length > 0) {
          const failedMsg = failedJobs
            .map(job => `${job.personId}（${job.message}）`)
            .join('、');
          message.warning(`部分联系人外呼失败：${failedMsg}`);
          console.warn('部分外呼失败:', failedJobs);
        }
      }
    } catch (err) {
      console.error('智能外呼发起失败:', err);
      message.error('智能外呼发起失败，请检查网络后重试');
    }
  };

@@ -97,13 +219,10 @@
   * 加载案件数据
   */
  const loadCaseData = async (forceRefresh = false) => {
    // 如果不是强制刷新，先尝试从localStorage读取
    if (!forceRefresh) {
      const cachedData = loadFromStorage();
      if (cachedData) {
        setCaseData(cachedData);
        console.log('Loaded case data from localStorage');
      }
    // 防止重复加载（除非强制刷新）
    if (hasLoaded && !forceRefresh) {
      console.log('Data already loaded, skipping...');
      return;
    }

    setLoading(true);
@@ -126,12 +245,24 @@

      // 提取timeline数据
      const timelineData = response.timeline || response.data?.timeline || response;

      
      // 提取nodes数据（确保为数组）
      const nodesData = response.nodes || response.data?.nodes || [];
      
      console.log('API Response:', response);
      console.log('Extracted nodesData:', nodesData);
      
      // 更新状态
      setCaseData(timelineData);
      setProcessNodes(Array.isArray(nodesData) ? nodesData : []);  // 确保为数组
      setHasLoaded(true);  // 标记已加载
      
      // 保存到localStorage
      saveToStorage(timelineData);
      
      // 触发智能外呼
      await triggerOutboundCall(timelineData);
      

      // 加载任务时间数据
      await loadTaskTime(timelineData);
@@ -144,23 +275,9 @@
      // 显示错误提示
      message.error('加载案件数据失败，请稍后重试');
      
      // 如果localStorage有数据，尝试使用缓存
      const cachedData = loadFromStorage();
      if (cachedData && !forceRefresh) {
        message.warning('已加载历史数据');
        setCaseData(cachedData);
        // 缓存数据也加载任务时间
        await loadTaskTime(cachedData);
      } else {
        // 使用Mock数据
        console.log('使用Mock数据');
        const mockData = mockTimelineData.data.timeline;
        setCaseData(mockData);
        saveToStorage(mockData);
        
        // Mock数据也加载任务时间
        await loadTaskTime(mockData);
      }
      // 使用Mock数据（缓存数据不包含nodes，所以统一使用Mock）
      setHasLoaded(true);
      
    } finally {
      setLoading(false);
    }
@@ -173,17 +290,33 @@
    loadCaseData(true);
  };

  // 防止重复加载的引用标识
  const loadInitRef = useRef(false);
  
  /**
   * 组件挂载时加载数据
   */
  useEffect(() => {
    loadCaseData();
    console.log('===== CaseDataContext useEffect triggered =====');
    console.log('loadInitRef.current:', loadInitRef.current);
    console.log('hasLoaded:', hasLoaded);
    console.log('processNodes:', processNodes);
    
    // StrictMode下防止双重调用
    if (!loadInitRef.current) {
      loadInitRef.current = true;
      console.log('Calling loadCaseData()...');
      loadCaseData();
    } else {
      console.log('loadCaseData() skipped due to loadInitRef.current === true');
    }
    // eslint-disable-next-line react-hooks/exhaustive-deps
  }, []); // 只在挂载时执行一次

  // 提供的值
  const value = {
    caseData,
    processNodes,      // 流程节点数据
    loading,
    error,
    refreshData,