-
-
diff --git a/web/static/script.js b/web/static/script.js
index 9778c54..e030006 100644
--- a/web/static/script.js
+++ b/web/static/script.js
@@ -6,17 +6,44 @@ const startBtn = document.getElementById('startBtn');
const requirementInput = document.getElementById('requirementInput');
const statusDot = document.getElementById('statusDot');
const statusText = document.getElementById('statusText');
-const logOutput = document.getElementById('logOutput');
const reportContainer = document.getElementById('reportContainer');
const downloadScriptBtn = document.getElementById('downloadScriptBtn');
let isRunning = false;
let pollingInterval = null;
let currentSessionId = null;
+let selectedTemplate = '';
// 报告段落数据（用于润色功能）
let reportParagraphs = [];
+// Supporting data from report API
+let supportingData = {};
+
+// Execution Process state
+let lastRenderedRound = 0;
+
+// --- Progress Bar ---
+function updateProgressBar(percentage, message, currentRound, maxRounds) {
+ const container = document.getElementById('progressBarContainer');
+ const fill = document.getElementById('progressBarFill');
+ const label = document.getElementById('progressLabel');
+ const percent = document.getElementById('progressPercent');
+ const msg = document.getElementById('progressMessage');
+ if (!container || !fill) return;
+
+ container.classList.remove('hidden');
+ fill.style.width = percentage + '%';
+ if (label) label.textContent = `Round ${currentRound || 0}/${maxRounds || 0}`;
+ if (percent) percent.textContent = Math.round(percentage) + '%';
+ if (msg) msg.textContent = message || '';
+}
+
+function hideProgressBar() {
+ const container = document.getElementById('progressBarContainer');
+ if (container) container.classList.add('hidden');
+}
+
// --- Upload Logic ---
if (uploadZone) {
uploadZone.addEventListener('dragover', (e) => {
@@ -60,6 +87,34 @@ async function handleFiles(files) {
}
}
+// --- Template Logic ---
+async function loadTemplates() {
+ try {
+ const res = await fetch('/api/templates');
+ if (!res.ok) return;
+ const data = await res.json();
+ const selector = document.getElementById('templateSelector');
+ if (!selector || !data.templates) return;
+
+ for (const tpl of data.templates) {
+ const card = document.createElement('div');
+ card.className = 'template-card';
+ card.setAttribute('data-template', tpl.name);
+ card.onclick = function() { selectTemplate(this, tpl.name); };
+ card.innerHTML = `';
+ tableHtml += '
';
+
+ container.innerHTML = tableHtml;
+ panel.classList.remove('hidden');
+ } catch (e) {
+ console.error('Preview failed', e);
+ }
+}
+
+window.downloadDataFile = function(filename) {
+ if (!currentSessionId) return;
+ const link = document.createElement('a');
+ link.href = `/api/data-files/download?session_id=${currentSessionId}&filename=${encodeURIComponent(filename)}`;
+ link.download = '';
+ document.body.appendChild(link);
+ link.click();
+ document.body.removeChild(link);
+}
+
+window.closePreview = function() {
+ const panel = document.getElementById('dataPreviewPanel');
+ if (panel) panel.classList.add('hidden');
+}
+
+// --- Report Logic with Supporting Data (Task 14) ---
async function loadReport() {
if (!currentSessionId) return;
@@ -166,13 +458,13 @@ async function loadReport() {
if (!data.content || data.content === "Report not ready.") {
reportContainer.innerHTML = '';
reportParagraphs = [];
+ supportingData = {};
return;
}
- // 保存段落数据
reportParagraphs = data.paragraphs || [];
+ supportingData = data.supporting_data || {};
- // 渲染段落化的报告（支持点击润色）
renderParagraphReport(reportParagraphs);
} catch (e) {
@@ -190,9 +482,14 @@ function renderParagraphReport(paragraphs) {
for (const p of paragraphs) {
const renderedContent = marked.parse(p.content);
const typeClass = `para-${p.type}`;
+ const hasSupportingData = supportingData[p.id] && supportingData[p.id].length > 0;
+ const supportingBtn = hasSupportingData
+ ? ``
+ : '';
html += `
`;
- info.innerHTML = `
-
${tpl.display_name}
${tpl.description}
`;
+ selector.appendChild(card);
+ }
+ } catch (e) {
+ console.error('Failed to load templates', e);
+ }
+}
+
+window.selectTemplate = function(el, name) {
+ document.querySelectorAll('.template-card').forEach(c => c.classList.remove('selected'));
+ el.classList.add('selected');
+ selectedTemplate = name;
+}
+
// --- Analysis Logic ---
if (startBtn) {
startBtn.addEventListener('click', startAnalysis);
@@ -75,19 +130,30 @@ async function startAnalysis() {
}
setRunningState(true);
+ // Reset execution state for new analysis
+ lastRenderedRound = 0;
+ const wrapper = document.getElementById('roundCardsWrapper');
+ if (wrapper) wrapper.innerHTML = '';
+ const emptyState = document.getElementById('executionEmptyState');
+ if (emptyState) emptyState.remove();
try {
+ const body = { requirement };
+ if (selectedTemplate) {
+ body.template = selectedTemplate;
+ }
+
const res = await fetch('/api/start', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
- body: JSON.stringify({ requirement })
+ body: JSON.stringify(body)
});
if (res.ok) {
const data = await res.json();
currentSessionId = data.session_id;
startPolling();
- switchTab('logs');
+ switchTab('execution');
} else {
const err = await res.json();
alert('Failed to start: ' + err.detail);
@@ -112,6 +178,8 @@ function setRunningState(running) {
const followUpSection = document.getElementById('followUpSection');
if (followUpSection) followUpSection.classList.add('hidden');
if (downloadScriptBtn) downloadScriptBtn.classList.add('hidden');
+ const tplGroup = document.getElementById('templateSelectorGroup');
+ if (tplGroup) tplGroup.classList.add('hidden');
} else {
startBtn.innerHTML = ' Start Analysis';
statusDot.className = 'status-dot';
@@ -122,6 +190,7 @@ function setRunningState(running) {
}
}
+// --- Polling ---
function startPolling() {
if (pollingInterval) clearInterval(pollingInterval);
if (!currentSessionId) return;
@@ -132,14 +201,29 @@ function startPolling() {
if (!res.ok) return;
const data = await res.json();
- logOutput.innerText = data.log || "Waiting for output...";
- const logTab = document.getElementById('logsTab');
- if (logTab) logTab.scrollTop = logTab.scrollHeight;
+ // Render round cards incrementally
+ const rounds = data.rounds || [];
+ renderRoundCards(rounds);
+
+ // Load data files during polling
+ loadDataFiles();
+
+ // Update progress bar during analysis
+ if (data.is_running && data.progress_percentage !== undefined) {
+ updateProgressBar(data.progress_percentage, data.status_message, data.current_round, data.max_rounds);
+ }
if (!data.is_running && isRunning) {
+ updateProgressBar(100, 'Analysis complete', data.current_round || data.max_rounds, data.max_rounds);
+ setTimeout(hideProgressBar, 3000);
+
setRunningState(false);
clearInterval(pollingInterval);
+ // Final render of rounds
+ renderRoundCards(data.rounds || []);
+ loadDataFiles();
+
if (data.has_report) {
await loadReport();
switchTab('report');
@@ -155,7 +239,215 @@ function startPolling() {
}, 2000);
}
-// --- Report Logic (with paragraph-level polishing) ---
+// --- Execution Process Tab (Task 11) ---
+
+function renderRoundCards(rounds) {
+ if (!rounds || rounds.length === 0) return;
+
+ const wrapper = document.getElementById('roundCardsWrapper');
+ if (!wrapper) return;
+
+ // Handle server restart: if rounds shrunk, re-render all
+ if (rounds.length < lastRenderedRound) {
+ lastRenderedRound = 0;
+ wrapper.innerHTML = '';
+ }
+
+ // Remove empty state if present
+ const emptyState = document.getElementById('executionEmptyState');
+ if (emptyState) emptyState.remove();
+
+ // Only render new rounds
+ for (let i = lastRenderedRound; i < rounds.length; i++) {
+ const rd = rounds[i];
+ const card = createRoundCard(rd);
+ wrapper.appendChild(card);
+ }
+
+ lastRenderedRound = rounds.length;
+
+ // Auto-scroll when running
+ if (isRunning) {
+ const executionTab = document.getElementById('executionTab');
+ if (executionTab) {
+ executionTab.scrollTop = executionTab.scrollHeight;
+ }
+ }
+}
+
+function createRoundCard(rd) {
+ const roundNum = rd.round || 0;
+ const summary = escapeHtml(rd.result_summary || '');
+ const reasoning = escapeHtml(rd.reasoning || '');
+ const code = escapeHtml(rd.code || '');
+ const rawLog = escapeHtml(rd.raw_log || '');
+
+ const card = document.createElement('div');
+ card.className = 'round-card';
+ card.setAttribute('data-round', roundNum);
+
+ // Build evidence table HTML
+ let evidenceHtml = '';
+ const evidenceRows = rd.evidence_rows || [];
+ if (evidenceRows.length > 0) {
+ const cols = Object.keys(evidenceRows[0]);
+ evidenceHtml = `
+
+
+
+
`;
+ }
+
+ card.innerHTML = `
+ 本轮数据案例
+ | ${escapeHtml(c)} | `).join('')}
|---|
| ${escapeHtml(String(row[c] ?? ''))} | `).join('')}
+ Round ${roundNum}
+ ${summary}
+
+
+
+ `;
+
+ return card;
+}
+
+window.toggleRoundCard = function(roundNum) {
+ const card = document.querySelector(`.round-card[data-round="${roundNum}"]`);
+ if (!card) return;
+ const body = card.querySelector('.round-card-body');
+ const icon = card.querySelector('.round-toggle-icon');
+ if (!body) return;
+
+ body.classList.toggle('hidden');
+ if (icon) {
+ icon.classList.toggle('fa-chevron-down');
+ icon.classList.toggle('fa-chevron-up');
+ }
+ card.classList.toggle('expanded');
+}
+
+function escapeHtml(text) {
+ const div = document.createElement('div');
+ div.textContent = text;
+ return div.innerHTML;
+}
+
+// --- Data Files Tab (Task 12) ---
+
+async function loadDataFiles() {
+ if (!currentSessionId) return;
+ try {
+ const res = await fetch(`/api/data-files?session_id=${currentSessionId}`);
+ if (!res.ok) return;
+ const data = await res.json();
+ const files = data.files || [];
+
+ const grid = document.getElementById('fileCardsGrid');
+ const emptyState = document.getElementById('datafilesEmptyState');
+ if (!grid) return;
+
+ if (files.length === 0) {
+ grid.innerHTML = '';
+ if (emptyState) emptyState.classList.remove('hidden');
+ return;
+ }
+
+ if (emptyState) emptyState.classList.add('hidden');
+
+ grid.innerHTML = files.map(f => {
+ const desc = escapeHtml(f.description || '');
+ const name = escapeHtml(f.filename || '');
+ const rows = f.rows || 0;
+ const iconClass = name.endsWith('.xlsx') ? 'fa-file-excel' : 'fa-file-csv';
+ return `
+
+
+
`;
+ }).join('');
+ } catch (e) {
+ console.error('Failed to load data files', e);
+ }
+}
+
+window.previewDataFile = async function(filename) {
+ if (!currentSessionId) return;
+ try {
+ const res = await fetch(`/api/data-files/preview?session_id=${currentSessionId}&filename=${encodeURIComponent(filename)}`);
+ if (!res.ok) {
+ alert('Failed to load preview');
+ return;
+ }
+ const data = await res.json();
+ const columns = data.columns || [];
+ const rows = data.rows || [];
+
+ const panel = document.getElementById('dataPreviewPanel');
+ const nameEl = document.getElementById('previewFileName');
+ const container = document.getElementById('previewTableContainer');
+ if (!panel || !container) return;
+
+ nameEl.textContent = filename;
+
+ let tableHtml = '
+
+
+ ${name}
+ ${desc} · ${rows}行
+ | ${escapeHtml(c)} | `).join('') + '
|---|
| ${escapeHtml(String(row[c] ?? ''))} | `).join('') + '
Analysis in progress or no report generated yet.
${renderedContent}
+ ${supportingBtn}
`;
- // 用 addEventListener 绑定，避免内联 onclick 中特殊字符破坏 HTML
document.getElementById(`acceptBtn-${paraId}`).addEventListener('click', (e) => {
e.stopPropagation();
applyPolish(paraId, polished);
@@ -322,7 +641,6 @@ window.applyPolish = async function(paraId, newContent) {
});
if (res.ok) {
- // 重新加载报告
await loadReport();
} else {
alert('应用失败');
@@ -334,7 +652,6 @@ window.applyPolish = async function(paraId, newContent) {
}
window.rejectPolish = function(paraId) {
- // 重新加载报告恢复原状
loadReport();
}
@@ -371,55 +688,6 @@ window.submitCustomPolish = function(paraId) {
polishParagraph(paraId, 'custom', instruction);
}
-// --- Gallery Logic ---
-let galleryImages = [];
-let currentImageIndex = 0;
-
-async function loadGallery() {
- if (!currentSessionId) return;
- try {
- const res = await fetch(`/api/figures?session_id=${currentSessionId}`);
- const data = await res.json();
- galleryImages = data.figures || [];
- currentImageIndex = 0;
- renderGalleryImage();
- } catch (e) {
- console.error("Gallery load failed", e);
- document.getElementById('carouselSlide').innerHTML = 'Failed to load images.
'; - } -} - -function renderGalleryImage() { - const slide = document.getElementById('carouselSlide'); - const info = document.getElementById('imageInfo'); - - if (galleryImages.length === 0) { - slide.innerHTML = 'No images generated in this session.
'; - info.innerHTML = ''; - return; - } - - const img = galleryImages[currentImageIndex]; - slide.innerHTML = `${img.filename} (${currentImageIndex + 1}/${galleryImages.length})
- ${img.description || 'No description available.'}
- ${img.analysis ? `${img.analysis}
` : ''}
- `;
-}
-
-window.prevImage = function () {
- if (galleryImages.length === 0) return;
- currentImageIndex = (currentImageIndex - 1 + galleryImages.length) % galleryImages.length;
- renderGalleryImage();
-}
-
-window.nextImage = function () {
- if (galleryImages.length === 0) return;
- currentImageIndex = (currentImageIndex + 1) % galleryImages.length;
- renderGalleryImage();
-}
-
// --- Download / Export ---
window.downloadScript = async function () {
if (!currentSessionId) return;
@@ -471,8 +739,12 @@ window.sendFollowUp = async function () {
if (res.ok) {
input.value = '';
setRunningState(true);
+ // Reset round rendering for follow-up
+ lastRenderedRound = 0;
+ const wrapper = document.getElementById('roundCardsWrapper');
+ if (wrapper) wrapper.innerHTML = '';
startPolling();
- switchTab('logs');
+ switchTab('execution');
} else {
alert('Failed to send request');
}
@@ -524,18 +796,26 @@ window.loadSession = async function (sessionId) {
const activeItem = document.getElementById(`hist-${sessionId}`);
if (activeItem) activeItem.classList.add('active');
- logOutput.innerText = "Loading session data...";
reportContainer.innerHTML = "";
if (downloadScriptBtn) downloadScriptBtn.classList.add('hidden');
+ const tplGroup = document.getElementById('templateSelectorGroup');
+ if (tplGroup) tplGroup.classList.add('hidden');
+
+ // Reset execution state for loaded session
+ lastRenderedRound = 0;
+ const wrapper = document.getElementById('roundCardsWrapper');
+ if (wrapper) wrapper.innerHTML = '';
try {
const res = await fetch(`/api/status?session_id=${sessionId}`);
if (res.ok) {
const data = await res.json();
- logOutput.innerText = data.log || "No logs available.";
- const logTab = document.getElementById('logsTab');
- if (logTab) logTab.scrollTop = logTab.scrollHeight;
+ // Render rounds for historical session
+ renderRoundCards(data.rounds || []);
+
+ // Load data files for historical session
+ loadDataFiles();
if (data.has_report) {
await loadReport();
@@ -545,16 +825,17 @@ window.loadSession = async function (sessionId) {
}
switchTab('report');
} else {
- switchTab('logs');
+ switchTab('execution');
}
}
} catch (e) {
- logOutput.innerText = "Error loading session.";
+ console.error("Error loading session", e);
}
}
-// --- Init & Navigation ---
+// --- Init & Navigation (Task 13) ---
document.addEventListener('DOMContentLoaded', () => {
+ loadTemplates();
loadHistory();
});
@@ -563,25 +844,29 @@ window.switchView = function (viewName) {
}
window.switchTab = function (tabName) {
+ // Deactivate all tabs
document.querySelectorAll('.tab').forEach(t => t.classList.remove('active'));
- ['logs', 'report', 'gallery'].forEach(name => {
+ // Hide all tab content
+ ['execution', 'datafiles', 'report'].forEach(name => {
const content = document.getElementById(`${name}Tab`);
if (content) content.classList.add('hidden');
});
+ // Activate the clicked tab button
document.querySelectorAll('.tab').forEach(btn => {
if (btn.getAttribute('onclick') && btn.getAttribute('onclick').includes(`'${tabName}'`)) {
btn.classList.add('active');
}
});
- if (tabName === 'logs') {
- document.getElementById('logsTab').classList.remove('hidden');
+ // Show the selected tab content
+ if (tabName === 'execution') {
+ document.getElementById('executionTab').classList.remove('hidden');
+ } else if (tabName === 'datafiles') {
+ document.getElementById('datafilesTab').classList.remove('hidden');
+ if (currentSessionId) loadDataFiles();
} else if (tabName === 'report') {
document.getElementById('reportTab').classList.remove('hidden');
- } else if (tabName === 'gallery') {
- document.getElementById('galleryTab').classList.remove('hidden');
- if (currentSessionId) loadGallery();
}
}