style: token 统计图标、数值、消息 token 信息加颜色
- header token 统计:琥珀色 (#FFD580),含背景色和边框 - 消息内 token 数:琥珀色 (.stat-tokens) - 消息内耗时:主题蓝色 (.stat-duration) - SVG token 图标同步上色,移除 opacity 透明度
This commit is contained in:
@@ -158,11 +158,12 @@ export function appendMessageDOM(msg: ChatMessage, index: number): void {
|
||||
}
|
||||
|
||||
const stats: string[] = [];
|
||||
if (msg.timestamp) stats.push(formatTime(msg.timestamp));
|
||||
if (msg.eval_count != null && msg.eval_count > 0) stats.push(`${msg.eval_count} tokens`);
|
||||
if (msg.total_duration != null && msg.total_duration > 0) stats.push(`${(msg.total_duration / 1e9).toFixed(1)}s`);
|
||||
const statClasses: string[] = [];
|
||||
if (msg.timestamp) { stats.push(formatTime(msg.timestamp)); statClasses.push(''); }
|
||||
if (msg.eval_count != null && msg.eval_count > 0) { stats.push(`${msg.eval_count} tokens`); statClasses.push('stat-tokens'); }
|
||||
if (msg.total_duration != null && msg.total_duration > 0) { stats.push(`${(msg.total_duration / 1e9).toFixed(1)}s`); statClasses.push('stat-duration'); }
|
||||
if (stats.length > 0) {
|
||||
contentHtml += `<div class="msg-stats">${stats.map(s => `<span>${s}</span>`).join(' · ')}</div>`;
|
||||
contentHtml += `<div class="msg-stats">${stats.map((s, i) => `<span${statClasses[i] ? ` class="${statClasses[i]}"` : ''}>${s}</span>`).join(' · ')}</div>`;
|
||||
}
|
||||
|
||||
if (msg.role === 'assistant' && msg.ragSources && msg.ragSources.length > 0) {
|
||||
@@ -337,8 +338,8 @@ export function updateLastAssistantMessage(content: string, think: string | null
|
||||
lastMsg.querySelector('.msg-body')!.appendChild(statsDiv);
|
||||
}
|
||||
const parts: string[] = [];
|
||||
if (stats.eval_count != null && stats.eval_count > 0) parts.push(`${stats.eval_count} tokens`);
|
||||
if (stats.total_duration != null && stats.total_duration > 0) parts.push(`${(stats.total_duration / 1e9).toFixed(1)}s`);
|
||||
if (stats.eval_count != null && stats.eval_count > 0) parts.push(`<span class="stat-tokens">${stats.eval_count} tokens</span>`);
|
||||
if (stats.total_duration != null && stats.total_duration > 0) parts.push(`<span class="stat-duration">${(stats.total_duration / 1e9).toFixed(1)}s</span>`);
|
||||
if (parts.length) statsDiv.innerHTML = parts.join(' · ');
|
||||
}
|
||||
|
||||
|
||||
@@ -376,8 +376,9 @@ html, body {
|
||||
margin-left: 8px;
|
||||
padding: 2px 8px;
|
||||
font-size: 11px;
|
||||
color: var(--text-secondary);
|
||||
background: var(--bg-subtle, rgba(255,255,255,0.04));
|
||||
color: #FFD580;
|
||||
background: rgba(255, 213, 128, 0.06);
|
||||
border: 1px solid rgba(255, 213, 128, 0.12);
|
||||
border-radius: 10px;
|
||||
white-space: nowrap;
|
||||
user-select: none;
|
||||
@@ -387,7 +388,7 @@ html, body {
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
flex-shrink: 0;
|
||||
opacity: 0.8;
|
||||
color: #FFD580;
|
||||
}
|
||||
|
||||
/* ═══ 模型选择栏 ═══ */
|
||||
@@ -1004,6 +1005,14 @@ html, body {
|
||||
color: var(--text-tertiary);
|
||||
}
|
||||
|
||||
.msg-stats .stat-tokens {
|
||||
color: #FFD580;
|
||||
}
|
||||
|
||||
.msg-stats .stat-duration {
|
||||
color: var(--accent);
|
||||
}
|
||||
|
||||
/* RAG 知识库来源 */
|
||||
.rag-sources {
|
||||
margin-top: 8px;
|
||||
|
||||
Reference in New Issue
Block a user