fix: 修复进度条问题
This commit is contained in:
parent
29e77c2b6f
commit
293c1e29c7
|
|
@ -1,4 +1,4 @@
|
||||||
import React, { useEffect, useState, useCallback } from 'react';
|
import React, { useEffect, useState, useCallback, useMemo } from 'react';
|
||||||
import {
|
import {
|
||||||
Brain, Clock, CheckCircle, XCircle, AlertCircle, Pause, Play, Square,
|
Brain, Clock, CheckCircle, XCircle, AlertCircle, Pause, Play, Square,
|
||||||
TrendingUp, BarChart3, Eye, Star, Target
|
TrendingUp, BarChart3, Eye, Star, Target
|
||||||
|
|
@ -158,10 +158,10 @@ export const VideoClassificationProgress: React.FC<VideoClassificationProgressPr
|
||||||
};
|
};
|
||||||
|
|
||||||
// 计算进度百分比
|
// 计算进度百分比
|
||||||
const getOverallProgress = () => {
|
const getOverallProgress = useCallback(() => {
|
||||||
if (!typedQueueStats || typedQueueStats.total_tasks === 0) return 0;
|
if (!typedQueueStats || typedQueueStats.total_tasks === 0) return 0;
|
||||||
return Math.round((typedQueueStats.completed_tasks / typedQueueStats.total_tasks) * 100);
|
return Math.round(((typedQueueStats.completed_tasks + typedQueueStats.failed_tasks) / typedQueueStats.total_tasks) * 100);
|
||||||
};
|
}, [typedQueueStats]);
|
||||||
|
|
||||||
// 过滤相关任务
|
// 过滤相关任务
|
||||||
const relevantTasks = materialId
|
const relevantTasks = materialId
|
||||||
|
|
@ -173,7 +173,9 @@ export const VideoClassificationProgress: React.FC<VideoClassificationProgressPr
|
||||||
}
|
}
|
||||||
|
|
||||||
const statusInfo = typedQueueStats ? getStatusInfo(typedQueueStats.status) : null;
|
const statusInfo = typedQueueStats ? getStatusInfo(typedQueueStats.status) : null;
|
||||||
const overallProgress = getOverallProgress();
|
const overallProgress = useMemo(() => {
|
||||||
|
return getOverallProgress()
|
||||||
|
}, [getOverallProgress]);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="bg-white rounded-lg shadow-sm border border-gray-200 overflow-hidden">
|
<div className="bg-white rounded-lg shadow-sm border border-gray-200 overflow-hidden">
|
||||||
|
|
@ -219,8 +221,7 @@ export const VideoClassificationProgress: React.FC<VideoClassificationProgressPr
|
||||||
<button
|
<button
|
||||||
onClick={handlePauseResume}
|
onClick={handlePauseResume}
|
||||||
disabled={isLoading || (typedQueueStats.status !== 'Running' && typedQueueStats.status !== 'Paused')}
|
disabled={isLoading || (typedQueueStats.status !== 'Running' && typedQueueStats.status !== 'Paused')}
|
||||||
className={`p-2 rounded-md transition-colors ${
|
className={`p-2 rounded-md transition-colors ${isLoading || (typedQueueStats.status !== 'Running' && typedQueueStats.status !== 'Paused')
|
||||||
isLoading || (typedQueueStats.status !== 'Running' && typedQueueStats.status !== 'Paused')
|
|
||||||
? 'text-gray-400 cursor-not-allowed'
|
? 'text-gray-400 cursor-not-allowed'
|
||||||
: 'text-gray-600 hover:text-gray-900 hover:bg-gray-100'
|
: 'text-gray-600 hover:text-gray-900 hover:bg-gray-100'
|
||||||
}`}
|
}`}
|
||||||
|
|
@ -241,8 +242,7 @@ export const VideoClassificationProgress: React.FC<VideoClassificationProgressPr
|
||||||
<button
|
<button
|
||||||
onClick={handleStop}
|
onClick={handleStop}
|
||||||
disabled={isLoading || typedQueueStats.status === 'Stopped'}
|
disabled={isLoading || typedQueueStats.status === 'Stopped'}
|
||||||
className={`p-2 rounded-md transition-colors ${
|
className={`p-2 rounded-md transition-colors ${isLoading || typedQueueStats.status === 'Stopped'
|
||||||
isLoading || typedQueueStats.status === 'Stopped'
|
|
||||||
? 'text-gray-400 cursor-not-allowed'
|
? 'text-gray-400 cursor-not-allowed'
|
||||||
: 'text-gray-600 hover:text-red-600 hover:bg-red-50'
|
: 'text-gray-600 hover:text-red-600 hover:bg-red-50'
|
||||||
}`}
|
}`}
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue