backtrace-console 0.0.3 → 0.0.5

package/public/chat-core.js

@@ -0,0 +1,635 @@
+const chatContainer = document.getElementById('chat-container');
+    const chatInput = document.getElementById('chat-input');
+    const sendBtn = document.getElementById('send-btn');
+    const composerStatus = document.getElementById('composer-status');
+    const infoPanel = document.getElementById('info-panel');
+    const infoPanelContent = document.getElementById('info-panel-content');
+    const sessionList = document.getElementById('session-list');
+    const imageBtn = document.getElementById('image-btn');
+    const imageInput = document.getElementById('image-input');
+    const imagePreviewBar = document.getElementById('image-preview-bar');
+
+    // 待发送的图片列表 [{ data: base64, mimeType, name, previewUrl }]
+    let pendingImages = [];
+
+    imageBtn.addEventListener('click', function() { imageInput.click(); });
+
+    imageInput.addEventListener('change', function() {
+      const files = Array.from(imageInput.files || []);
+      files.forEach(function(file) {
+        const reader = new FileReader();
+        reader.onload = function(e) {
+          const dataUrl = e.target.result;
+          const base64 = dataUrl.split(',')[1];
+          pendingImages.push({ data: base64, mimeType: file.type, name: file.name, previewUrl: dataUrl });
+          renderImagePreviews();
+        };
+        reader.readAsDataURL(file);
+      });
+      imageInput.value = '';
+    });
+
+    chatInput.addEventListener('paste', function(e) {
+      const items = Array.from((e.clipboardData || e.originalEvent && e.originalEvent.clipboardData || {}).items || []);
+      const imageItems = items.filter(function(item) { return item.type.startsWith('image/'); });
+      if (imageItems.length === 0) return;
+      e.preventDefault();
+      imageItems.forEach(function(item) {
+        const file = item.getAsFile();
+        if (!file) return;
+        const reader = new FileReader();
+        reader.onload = function(ev) {
+          const dataUrl = ev.target.result;
+          const base64 = dataUrl.split(',')[1];
+          pendingImages.push({ data: base64, mimeType: file.type, name: 'pasted-image.' + (file.type.split('/')[1] || 'png'), previewUrl: dataUrl });
+          renderImagePreviews();
+        };
+        reader.readAsDataURL(file);
+      });
+    });
+
+    function renderImagePreviews() {
+      if (pendingImages.length === 0) {
+        imagePreviewBar.style.display = 'none';
+        imagePreviewBar.innerHTML = '';
+        return;
+      }
+      imagePreviewBar.style.display = 'flex';
+      imagePreviewBar.innerHTML = pendingImages.map(function(img, idx) {
+        return `<div class="image-preview-item" data-idx="${idx}">
+          <img src="${img.previewUrl}" alt="${escapeHtml(img.name)}">
+          <button class="image-preview-remove" data-idx="${idx}">×</button>
+        </div>`;
+      }).join('');
+      imagePreviewBar.querySelectorAll('.image-preview-remove').forEach(function(btn) {
+        btn.addEventListener('click', function() {
+          pendingImages.splice(parseInt(btn.dataset.idx), 1);
+          renderImagePreviews();
+        });
+      });
+    }
+
+    // 获取 URL 中的 fingerprint 参数，后续可用于 API 请求
+    const urlParams = new URLSearchParams(window.location.search);
+    const fingerprint = urlParams.get('fingerprint');
+
+    let currentThreadId = null;
+    let currentFingerprintData = null;
+    let currentSessionId = null;
+    let currentSessionMessages = [];
+
+    if (fingerprint) {
+      console.log('当前对话关联的 fingerprint:', fingerprint);
+      infoPanel.style.display = 'flex';
+      fetchFingerprintInfo(fingerprint);
+      loadSessionList(fingerprint);
+    }
+
+    function restoreWelcomeMessage() {
+      chatContainer.innerHTML = '';
+      if (currentFingerprintData) {
+        chatContainer.appendChild(createSystemMessageElement(buildFingerprintContextMessage(currentFingerprintData)));
+      } else {
+        chatContainer.appendChild(createSystemMessageElement('你是一个非常专业并资深的C++开发工程师和UE工程师。当前崩溃的关键信息如下：\nError Message: -\nClassifiers: -\n\n请结合这些上下文，帮助用户定位问题并给出修复建议。'));
+      }
+      scrollToBottom();
+    }
+
+    function buildFingerprintContextMessage(meta) {
+      const errorMessage = meta && meta.errorMessage ? meta.errorMessage : '-';
+      const classifiers = meta && meta.classifiers ? meta.classifiers : '-';
+      return `你是一个非常专业并资深的C++开发工程师和UE工程师。当前崩溃的关键信息如下：\nError Message: ${errorMessage}\nClassifiers: ${classifiers}\n\n请结合这些上下文，帮助用户定位问题并给出修复建议。`;
+    }
+
+    function setActiveSession(sessionId) {
+      currentSessionId = sessionId || null;
+      const items = Array.from(sessionList.querySelectorAll('.session-item'));
+      items.forEach(item => {
+        const isActive = String(item.dataset.sessionId || '') === String(currentSessionId || '');
+        item.classList.toggle('active', isActive);
+        item.style.background = isActive ? 'rgba(16,163,127,0.16)' : 'transparent';
+        item.style.borderColor = isActive ? 'rgba(16,163,127,0.55)' : 'rgba(255,255,255,0.08)';
+        item.style.boxShadow = isActive ? 'inset 0 0 0 1px rgba(16,163,127,0.25)' : 'none';
+      });
+    }
+
+    function renderSessionList(sessions, activeSessionId) {
+      sessionList.innerHTML = '';
+      if (!Array.isArray(sessions) || sessions.length === 0) {
+        sessionList.innerHTML = '<div class="session-empty">暂无历史会话</div>';
+        return;
+      }
+      sessions.forEach(session => {
+        const item = document.createElement('button');
+        item.type = 'button';
+        item.dataset.sessionId = session.sessionId;
+        item.className = `session-item${session.sessionId === activeSessionId ? ' active' : ''}`;
+        item.innerHTML = `<div class="session-title">${session.title || session.sessionId}</div><div class="session-time">${session.updatedAt || session.createdAt || ''}</div>`;
+        item.addEventListener('click', () => {
+          if (session.sessionId !== currentSessionId) {
+            setActiveSession(session.sessionId);
+            loadSession(session.sessionId);
+          }
+        });
+        sessionList.appendChild(item);
+      });
+    }
+
+    function loadSessionList(fp) {
+      fetch(`/api/backtrace/chat-sessions?fingerprint=${encodeURIComponent(fp)}`)
+        .then(res => res.json())
+        .then(data => {
+          if (!data.ok) {
+            throw new Error(data.error || '加载会话列表失败');
+          }
+          const sessions = data.sessions || [];
+          const selectedSessionId = data.activeSessionId || currentSessionId || (sessions[0] ? sessions[0].sessionId : null);
+          renderSessionList(sessions, selectedSessionId);
+          if (selectedSessionId) {
+            if (selectedSessionId !== currentSessionId || currentSessionMessages.length === 0) {
+              loadSession(selectedSessionId, { skipRefreshList: true });
+            } else {
+              setActiveSession(selectedSessionId);
+            }
+          } else {
+            createNewSession();
+          }
+        })
+        .catch(err => {
+          console.error('加载会话列表失败:', err);
+          restoreWelcomeMessage();
+        });
+    }
+
+    function loadSession(sessionId, options = {}) {
+      if (!fingerprint || !sessionId) return;
+      fetch(`/api/backtrace/chat-session?fingerprint=${encodeURIComponent(fingerprint)}&sessionId=${encodeURIComponent(sessionId)}`)
+        .then(res => res.json())
+        .then(data => {
+          if (!data.ok) {
+            throw new Error(data.error || '加载会话失败');
+          }
+          setActiveSession(data.session.sessionId);
+          currentThreadId = data.session.threadId || null;
+          currentSessionMessages = Array.isArray(data.session.messages) ? data.session.messages : [];
+          renderSessionMessages(currentSessionMessages);
+          if (!options.skipRefreshList) {
+            //loadSessionList(fingerprint);
+          }
+        })
+        .catch(err => {
+          console.error('加载会话失败:', err);
+        });
+    }
+
+    function createNewSession() {
+      if (!fingerprint) return;
+      fetch('/api/backtrace/chat-session/create', {
+        method: 'POST',
+        headers: {
+          'Content-Type': 'application/json'
+        },
+        body: JSON.stringify({ fingerprint })
+      })
+        .then(res => res.json())
+        .then(data => {
+          if (!data.ok) {
+            throw new Error(data.error || '创建会话失败');
+          }
+          setActiveSession(data.session.sessionId);
+          currentThreadId = data.session.threadId || null;
+          currentSessionMessages = Array.isArray(data.session.messages) ? data.session.messages : [];
+          renderSessionMessages(currentSessionMessages);
+          loadSessionList(fingerprint);
+        })
+        .catch(err => {
+          console.error('创建会话失败:', err);
+        });
+    }
+
+    function renderSessionMessages(messages) {
+      if (!Array.isArray(messages) || messages.length === 0) {
+        restoreWelcomeMessage();
+        return;
+      }
+      chatContainer.innerHTML = '';
+      let toolPanel = null;
+      let currentTurn = null;
+      messages.forEach(message => {
+        if (!message) return;
+        const role = message.role || 'agent';
+        const text = typeof message.text === 'string' ? message.text : '';
+        let msgEl = null;
+
+        if (role === 'user') {
+          toolPanel = null;
+          currentTurn = document.createElement('div');
+          currentTurn.className = 'turn-container';
+          msgEl = createMessageElement(text, true);
+          currentTurn.appendChild(msgEl);
+          chatContainer.appendChild(currentTurn);
+          return;
+        }
+
+        if (!currentTurn) {
+          currentTurn = document.createElement('div');
+          currentTurn.className = 'turn-container';
+          chatContainer.appendChild(currentTurn);
+        }
+
+        if (message.kind && message.kind.startsWith('tool_')) {
+          const payload = {
+            toolName: message.meta?.itemType || message.text || 'tool',
+            toolId: message.meta?.toolId || '',
+            args: message.meta?.args || null,
+            output: message.kind === 'tool_call_output' ? text : '',
+            result: message.kind === 'tool_call_completed' ? text : '',
+            text,
+            meta: message.meta || null,
+          };
+          if (!toolPanel) {
+            toolPanel = createToolMessageElement(message.kind, payload);
+            msgEl = toolPanel;
+          } else {
+            updateToolMessageElement(toolPanel, message.kind, payload);
+          }
+        } else if (role === 'system') {
+          toolPanel = null;
+          msgEl = createSystemMessageElement(text);
+        } else if (role === 'agent') {
+          toolPanel = null;
+          msgEl = createMessageElement('', false);
+          const content = msgEl.querySelector('.message-content');
+          renderAgentBlocks(content, [message.kind === 'agent_draft' && text ? text + '\n\n_回复中断或仍在生成中_' : text]);
+        } else {
+          toolPanel = null;
+          msgEl = createMessageElement(text, false);
+        }
+
+        if (msgEl) {
+          currentTurn.appendChild(msgEl);
+        }
+      });
+      scrollToBottom();
+    }
+
+    function fetchFingerprintInfo(fp) {
+      fetch(`/api/backtrace/fingerprint?fingerprint=${encodeURIComponent(fp)}`)
+        .then(res => res.json())
+        .then(data => {
+          if (data.ok && data.result) {
+            const resData = data.result;
+            // 保存给聊天请求提供上下文
+            currentFingerprintData = resData;
+
+            let objectsHtml = (resData.objects || []).slice(0, 5).map(o =>
+              `<div style="font-size: 0.85rem; margin-bottom: 0.25rem;">- ${escapeHtml(o.objectIdHex)} <span style="color: var(--text-muted)">(${new Date(o.timestamp * 1000).toLocaleString()})</span></div>`
+            ).join('');
+
+            const firstSeenValue = String(resData.firstSeen || '').trim();
+            const firstSeenDate = /^\d+$/.test(firstSeenValue)
+              ? new Date(Number(firstSeenValue) * 1000)
+              : (firstSeenValue ? new Date(firstSeenValue) : null);
+
+            infoPanelContent.innerHTML = `
+              <div class="info-item">
+                <div class="info-label">Fingerprint</div>
+                <div class="info-value" style="font-family: monospace;">${escapeHtml(resData.fingerprint || '-')}</div>
+              </div>
+              <div class="info-item">
+                <div class="info-label">First Seen</div>
+                <div class="info-value">${firstSeenDate && !Number.isNaN(firstSeenDate.getTime()) ? firstSeenDate.toLocaleString() : '-'}</div>
+              </div>
+              <div class="info-item">
+                <div class="info-label">Issue State</div>
+                <div class="info-value">${escapeHtml(resData.issueState || '-')}</div>
+              </div>
+              <div class="info-item">
+                <div class="info-label">Classifiers</div>
+                <div class="info-value">${escapeHtml(resData.classifiers || '-')}</div>
+              </div>
+              <div class="info-item">
+                <div class="info-label">Error Message</div>
+                <div class="info-value error-message">${escapeHtml(resData.errorMessage || '-')}</div>
+              </div>
+              <div class="info-item">
+                <button class="logs-btn" onclick="openLogsModal()">查看日志</button>
+              </div>
+            `;
+          } else {
+            infoPanelContent.innerHTML = `<div style="color: red; padding: 1rem;">加载失败: ${data.error || '未知错误'}</div>`;
+          }
+        })
+        .catch(err => {
+          infoPanelContent.innerHTML = `<div style="color: red; padding: 1rem;">请求错误: ${err.message}</div>`;
+        });
+    }
+
+    // 自动调整 textarea 高度
+    chatInput.addEventListener('input', function() {
+      this.style.height = 'auto';
+      this.style.height = (this.scrollHeight) + 'px';
+
+      if(this.value.trim().length > 0) {
+        sendBtn.disabled = false;
+      } else {
+        sendBtn.disabled = true;
+      }
+    });
+
+    // 处理回车发送 (Shift+Enter 换行)
+    chatInput.addEventListener('keydown', function(e) {
+      if (e.key === 'Enter' && !e.shiftKey) {
+        e.preventDefault();
+        sendMessage();
+      }
+    });
+
+    sendBtn.addEventListener('click', sendMessage);
+
+    function isFixIntent(text) {
+      const normalized = String(text || '').trim();
+      if (!normalized) return false;
+      return /(修复|修改|改下|改成|apply fix|fix this|patch|改代码|修改代码|直接修改|帮我改)/i.test(normalized);
+    }
+
+    function getDefaultReportPath() {
+      if (!currentFingerprintData) return '';
+      return currentFingerprintData.defaultReportPath || currentFingerprintData.reportPath || '';
+    }
+
+    // ── 日志模态框 ──────────────────────────────────────────────
+
+    function openLogsModal() {
+      if (!fingerprint) return;
+
+      const overlay = document.createElement('div');
+      overlay.className = 'modal-overlay';
+      overlay.id = 'logs-modal';
+      overlay.innerHTML = `
+        <div class="modal-box">
+          <div class="modal-header">
+            <span>日志列表</span>
+            <button class="modal-close" onclick="closeLogsModal()">×</button>
+          </div>
+          <div class="modal-status" id="modal-status">加载中...</div>
+          <div class="modal-body" id="modal-body"></div>
+        </div>
+      `;
+      overlay.addEventListener('click', function(e) {
+        if (e.target === overlay) closeLogsModal();
+      });
+      document.body.appendChild(overlay);
+
+      loadLogsModalData();
+    }
+
+    function closeLogsModal() {
+      const el = document.getElementById('logs-modal');
+      if (el) el.remove();
+    }
+
+    async function loadLogsModalData() {
+      const statusEl = document.getElementById('modal-status');
+      const bodyEl = document.getElementById('modal-body');
+
+      try {
+        // 先读本地目录
+        const localRes = await fetch(`/api/backtrace/files/list?path=${encodeURIComponent(fingerprint)}`)
+          .then(r => r.json()).catch(() => ({ ok: false }));
+
+        const localDirs = (localRes.ok && localRes.logDirectories) ? localRes.logDirectories : [];
+
+        let remoteObjects = [];
+
+        if (localDirs.length === 0) {
+          // 本地无缓存，请求远端并触发目录创建
+          statusEl.textContent = '本地无缓存，正在从远端获取...';
+          const remoteRes = await fetch('/api/backtrace/run', {
+            method: 'POST',
+            headers: { 'Content-Type': 'application/json' },
+            body: JSON.stringify({ command: 'fingerprint', fingerprint }),
+          }).then(r => r.json()).catch(() => ({ ok: false }));
+
+          remoteObjects = (remoteRes.ok && remoteRes.result && remoteRes.result.objects) ? remoteRes.result.objects : [];
+
+          // 重新读本地（远端请求已创建目录）
+          const localRes2 = await fetch(`/api/backtrace/files/list?path=${encodeURIComponent(fingerprint)}`)
+            .then(r => r.json()).catch(() => ({ ok: false }));
+          localDirs.push(...((localRes2.ok && localRes2.logDirectories) ? localRes2.logDirectories : []));
+        } else {
+          // 本地有缓存，读取每个目录下的 object-meta.json 获取 timestamp
+          const metaResults = await Promise.all(localDirs.map(d =>
+            fetch(`/api/backtrace/files/content?kind=logs&path=${encodeURIComponent(d.path + '/object-meta.json')}`)
+              .then(r => r.json()).catch(() => ({ ok: false }))
+          ));
+          metaResults.forEach((r, i) => {
+            if (r.ok && r.content) {
+              try {
+                const m = JSON.parse(r.content);
+                remoteObjects.push({ objectIdHex: localDirs[i].name, timestamp: m.timestamp || '' });
+              } catch (_) {
+                remoteObjects.push({ objectIdHex: localDirs[i].name, timestamp: '' });
+              }
+            } else {
+              remoteObjects.push({ objectIdHex: localDirs[i].name, timestamp: '' });
+            }
+          });
+        }
+
+        const localDirMap = {};
+        localDirs.forEach(d => { localDirMap[d.name] = d; });
+
+        const remoteMap = {};
+        remoteObjects.forEach(o => { remoteMap[o.objectIdHex] = o; });
+
+        const allKeys = Array.from(new Set([
+          ...remoteObjects.map(o => o.objectIdHex),
+          ...localDirs.map(d => d.name),
+        ])).sort(function(a, b) {
+          const tsA = Number((remoteMap[a] && remoteMap[a].timestamp) || 0);
+          const tsB = Number((remoteMap[b] && remoteMap[b].timestamp) || 0);
+          return tsB - tsA;
+        });
+
+        if (allKeys.length === 0) {
+          statusEl.textContent = '暂无 object 数据';
+          return;
+        }
+
+        // 区分有实际日志文件的目录（排除只有 object-meta.json 的）
+        const hasRealFiles = {};
+        await Promise.all(localDirs.map(async d => {
+          const r = await fetch(`/api/backtrace/files/list?path=${encodeURIComponent(fingerprint)}&logDir=${encodeURIComponent(d.name)}`)
+            .then(r => r.json()).catch(() => ({ ok: false }));
+          const files = (r.ok && r.logFiles) ? r.logFiles.filter(f => f.name !== 'object-meta.json') : [];
+          hasRealFiles[d.name] = files.length > 0;
+        }));
+
+        const downloadedCount = Object.values(hasRealFiles).filter(Boolean).length;
+        statusEl.textContent = `共 ${allKeys.length} 个 object（已下载日志 ${downloadedCount} 个）`;
+
+        bodyEl.innerHTML = '';
+        allKeys.forEach(hex => {
+          const remote = remoteMap[hex];
+          const local = localDirMap[hex];
+          const ts = remote && remote.timestamp ? new Date(Number(remote.timestamp) * 1000).toLocaleString() : '';
+          const downloaded = hasRealFiles[hex] || false;
+
+          const row = document.createElement('div');
+          row.className = 'object-row';
+
+          const header = document.createElement('div');
+          header.className = 'object-row-header';
+
+          const badgeClass = downloaded ? 'object-badge downloaded' : 'object-badge';
+          const badgeText = downloaded ? '已下载' : (local ? '未下载' : '仅本地');
+          header.innerHTML = `
+            <span class="object-arrow">▶</span>
+            <span class="object-hex">${escapeHtml(hex)}</span>
+            ${ts ? `<span class="object-time">${escapeHtml(ts)}</span>` : ''}
+            <span class="${badgeClass}">${badgeText}</span>
+          `;
+
+          const filesPanel = document.createElement('div');
+          filesPanel.className = 'object-files';
+          filesPanel.dataset.loaded = 'false';
+          filesPanel.dataset.hex = hex;
+
+          if (!downloaded) {
+            const dlBtn = document.createElement('button');
+            dlBtn.className = 'download-btn';
+            dlBtn.textContent = '下载';
+            dlBtn.style.marginLeft = '0.4rem';
+            dlBtn.addEventListener('click', function(e) {
+              e.stopPropagation();
+              downloadObject(hex, dlBtn, header, filesPanel, row);
+            });
+            header.appendChild(dlBtn);
+          }
+
+          header.addEventListener('click', function() {
+            const isExpanded = header.classList.toggle('expanded');
+            filesPanel.classList.toggle('open', isExpanded);
+            if (isExpanded && filesPanel.dataset.loaded === 'false') {
+              loadObjectFiles(filesPanel, hex);
+            }
+          });
+
+          row.appendChild(header);
+          row.appendChild(filesPanel);
+          bodyEl.appendChild(row);
+        });
+      } catch (err) {
+        statusEl.textContent = '加载失败: ' + err.message;
+      }
+    }
+
+    async function downloadObject(hex, btn, header, filesPanel, row) {
+      btn.disabled = true;
+      btn.textContent = '下载中...';
+      try {
+        const res = await fetch('/api/backtrace/download-object', {
+          method: 'POST',
+          headers: { 'Content-Type': 'application/json' },
+          body: JSON.stringify({ fingerprint, objectIdHex: hex }),
+        }).then(r => r.json());
+
+        if (!res.ok) {
+          btn.disabled = false;
+          btn.textContent = '下载';
+          alert('下载失败: ' + (res.error || '未知错误'));
+          return;
+        }
+
+        // 更新 badge 为已下载，移除下载按钮
+        const badge = header.querySelector('.object-badge');
+        if (badge) {
+          badge.textContent = '已下载';
+          badge.className = 'object-badge downloaded';
+        }
+        btn.remove();
+
+        // 刷新远端附件缓存，再更新文件列表
+        await fetch('/api/backtrace/query-object-attachments', {
+          method: 'POST',
+          headers: { 'Content-Type': 'application/json' },
+          body: JSON.stringify({ fingerprint, objectIdHex: hex }),
+        }).catch(() => {});
+
+        filesPanel.dataset.loaded = 'false';
+        if (filesPanel.classList.contains('open')) {
+          loadObjectFiles(filesPanel, hex);
+        }
+      } catch (err) {
+        btn.disabled = false;
+        btn.textContent = '下载';
+        alert('下载失败: ' + err.message);
+      }
+    }
+
+    async function loadObjectFiles(panel, hex) {
+      panel.dataset.loaded = 'true';
+      panel.innerHTML = '<div style="color: var(--text-muted); font-size: 0.85rem; padding: 0.4rem 0;">加载中...</div>';
+
+      try {
+        // 先读本地 object-meta.json，有缓存的 attachments 直接用
+        let attachments = null;
+        const metaRes = await fetch(
+          `/api/backtrace/files/content?kind=logs&path=${encodeURIComponent(fingerprint + '/logs/' + hex + '/object-meta.json')}`
+        ).then(r => r.json()).catch(() => null);
+
+        if (metaRes && metaRes.ok && metaRes.content) {
+          try {
+            const meta = JSON.parse(metaRes.content);
+            if (Array.isArray(meta.attachments) && meta.attachments.length > 0) {
+              attachments = meta.attachments;
+            }
+          } catch (_) {}
+        }
+
+        // 没有缓存才请求远端
+        if (!attachments) {
+          const queryResult = await fetch('/api/backtrace/query-object-attachments', {
+            method: 'POST',
+            headers: { 'Content-Type': 'application/json' },
+            body: JSON.stringify({ fingerprint: fingerprint, objectIdHex: hex })
+          }).then(r => r.json());
+
+          if (!queryResult.ok) {
+            throw new Error(queryResult.error || '查询附件列表失败');
+          }
+          attachments = queryResult.attachments || [];
+        }
+        if (attachments.length === 0) {
+          panel.innerHTML = '<div style="color: var(--text-muted); font-size: 0.85rem; padding: 0.4rem 0;">无附件</div>';
+          return;
+        }
+
+        // 根据 downloaded 状态渲染：已下载显示文件名链接，未下载仅显示文件名和大小
+        panel.innerHTML = attachments.map(att => {
+          const fileName = escapeHtml(att.name);
+          const filePath = `${fingerprint}/logs/${hex}/${att.name}`;
+          const sizeStr = att.size ? formatFileSize(att.size) : '';
+          const viewUrl = `/api/backtrace/files/view?kind=logs&path=${encodeURIComponent(filePath)}`;
+
+          if (att.downloaded) {
+            return `
+              <div class="file-row">
+                <a class="file-name file-link" href="${viewUrl}" target="_blank">${fileName}</a>
+                ${sizeStr ? `<span class="file-size">${sizeStr}</span>` : ''}
+              </div>
+            `;
+          } else {
+            return `
+              <div class="file-row">
+                <span class="file-name">${fileName}</span>
+                ${sizeStr ? `<span class="file-size">${sizeStr}</span>` : ''}
+              </div>
+            `;
+          }
+        }).join('');
+      } catch (err) {
+        panel.innerHTML = `<div style="color: red; font-size: 0.85rem; padding: 0.4rem 0;">加载失败: ${escapeHtml(err.message)}</div>`;
+      }
+    }