feat: 处理监控页面显示步骤简要数值

- 显示内容库搜索结果数
- 显示互联网搜索结果数
- 显示抓取成功数
- 显示数据提取/填充状态
- 显示审核ID
This commit is contained in:
2026-07-14 12:42:59 +08:00
parent d18e80016b
commit 1712fb0756
2 changed files with 122 additions and 2 deletions
+46
View File
@@ -180,6 +180,52 @@
50% { transform: scale(1.1); } 50% { transform: scale(1.1); }
} }
/* 步骤简要数值 */
.steps-summary {
display: flex;
flex-wrap: wrap;
gap: 10px;
padding: 12px 15px;
background: #f8f9fa;
border-radius: 8px;
margin-top: 10px;
}
.step-summary-item {
display: flex;
align-items: center;
gap: 5px;
padding: 4px 10px;
background: white;
border-radius: 4px;
font-size: 13px;
}
.step-summary-item.completed {
background: #d1fae5;
}
.step-summary-item.running {
background: #e0e7ff;
}
.step-summary-item.failed {
background: #fee2e2;
}
.step-summary-item.skipped {
background: #f3f4f6;
}
.step-summary-label {
color: #666;
}
.step-summary-value {
font-weight: 600;
color: #333;
}
/* 操作按钮 */ /* 操作按钮 */
.process-actions { .process-actions {
display: flex; display: flex;
+76 -2
View File
@@ -133,15 +133,23 @@ function displayActiveProcesses(sessions) {
function renderStepsProgress(steps, currentStep) { function renderStepsProgress(steps, currentStep) {
const totalSteps = 6; const totalSteps = 6;
const stepStatuses = {}; const stepStatuses = {};
const stepDataMap = {};
// 构建步骤状态映射 // 构建步骤状态和数据映射
steps.forEach(s => { steps.forEach(s => {
stepStatuses[s.step_number] = s.step_status; stepStatuses[s.step_number] = s.step_status;
if (s.step_data) {
try {
stepDataMap[s.step_number] = typeof s.step_data === 'string' ? JSON.parse(s.step_data) : s.step_data;
} catch (e) {
stepDataMap[s.step_number] = s.step_data;
}
}
}); });
const stepNames = ['搜索内容库', '搜索互联网', '抓取网页', '提取数据', '填充字段', '提交审核']; const stepNames = ['搜索内容库', '搜索互联网', '抓取网页', '提取数据', '填充字段', '提交审核'];
let html = ''; let html = '<div class="steps-progress">';
for (let i = 1; i <= totalSteps; i++) { for (let i = 1; i <= totalSteps; i++) {
const status = stepStatuses[i] || (i > currentStep ? 'pending' : ''); const status = stepStatuses[i] || (i > currentStep ? 'pending' : '');
let className = ''; let className = '';
@@ -158,6 +166,72 @@ function renderStepsProgress(steps, currentStep) {
</div> </div>
`; `;
} }
html += '</div>';
// 添加简要数值显示
html += '<div class="steps-summary">';
// 步骤1:内容库搜索结果数
if (stepDataMap[1]) {
const count = stepDataMap[1].count || 0;
const status = stepStatuses[1];
html += `<div class="step-summary-item ${status || ''}">
<span class="step-summary-label">内容库:</span>
<span class="step-summary-value">${count} 篇</span>
</div>`;
}
// 步骤2:互联网搜索结果数
if (stepDataMap[2]) {
const count = stepDataMap[2].count || 0;
const status = stepStatuses[2];
html += `<div class="step-summary-item ${status || ''}">
<span class="step-summary-label">互联网:</span>
<span class="step-summary-value">${count} 条</span>
</div>`;
}
// 步骤3:抓取成功数
if (stepDataMap[3]) {
const count = stepDataMap[3].count || 0;
const status = stepStatuses[3];
html += `<div class="step-summary-item ${status || ''}">
<span class="step-summary-label">抓取成功:</span>
<span class="step-summary-value">${count} 个</span>
</div>`;
}
// 步骤4:提取状态
if (stepDataMap[4]) {
const hasData = stepDataMap[4].has_data || stepDataMap[4].extracted;
const status = stepStatuses[4];
html += `<div class="step-summary-item ${status || ''}">
<span class="step-summary-label">数据提取:</span>
<span class="step-summary-value">${hasData ? '成功' : '无数据'}</span>
</div>`;
}
// 步骤5:填充状态
if (stepDataMap[5]) {
const filled = stepDataMap[5].filled;
const status = stepStatuses[5];
html += `<div class="step-summary-item ${status || ''}">
<span class="step-summary-label">字段填充:</span>
<span class="step-summary-value">${filled ? '完成' : '失败'}</span>
</div>`;
}
// 步骤6:审核ID
if (stepDataMap[6]) {
const reviewId = stepDataMap[6].review_id;
const status = stepStatuses[6];
html += `<div class="step-summary-item ${status || ''}">
<span class="step-summary-label">审核ID:</span>
<span class="step-summary-value">${reviewId || '-'}</span>
</div>`;
}
html += '</div>';
return html; return html;
} }