lxy/DevFlow
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

优化: 前端u-agent令牌对齐与组件拆分续批

Browse Source 
- 全局样式类(df-sec-h/df-toast族)替换散装实现,主题token去硬编码兜底
- 拆分子组件:ai-chat/queue-panel(队列时钟与编辑随迁)、
  conversation-sidebar/ConversationList、settings/provider-panel
- 父组件死副本清理(队列编辑/时钟/键位表,TS6133清零)并补
  fill-draft父侧转发(重构半成品断链修复)
- 验收:vue-tsc EXIT 0
This commit is contained in:
lxy
2026-10-18 23:15:57 +08:00
parent 302c4bcf52
commit 25ec9cf69a
62 changed files with 3475 additions and 2006 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/views/AuditLog.vue
+23 -40
View File
@@ -12,11 +12,11 @@
<!-- Tab 导航 -->
<nav class="detail-tabs audit-tabs">
<button class="tab-btn" :class="{ 'tab-active': activeTab === 'audit' }" type="button" @click="switchTab('audit')">
<button class="df-tab" :class="{ 'df-tab--active': activeTab === 'audit' }" type="button" @click="switchTab('audit')">
<svg aria-hidden="true" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z"/></svg>
{{ t('auditLog.tabAudit') }}
</button>
<button class="tab-btn" :class="{ 'tab-active': activeTab === 'conversations' }" type="button" @click="switchTab('conversations')">
<button class="df-tab" :class="{ 'df-tab--active': activeTab === 'conversations' }" type="button" @click="switchTab('conversations')">
<svg aria-hidden="true" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M21 15a2 2 0 01-2 2H7l-4 4V5a2 2 0 012-2h14a2 2 0 012 2z"/></svg>
{{ t('auditLog.tabConversations') }}
</button>
@@ -91,11 +91,11 @@
<td colspan="7">
<div class="audit-detail">
<div class="detail-section">
<span class="detail-label">{{ t('auditLog.col.args') }}</span>
<span class="df-sec-h">{{ t('auditLog.col.args') }}</span>
<pre class="detail-pre">{{ r.arguments_brief || '—' }}</pre>
</div>
<div class="detail-section">
<span class="detail-label">{{ t('auditLog.col.result') }}</span>
<span class="df-sec-h">{{ t('auditLog.col.result') }}</span>
<!-- 外置句柄(D2a):显「结果已外置」+ 展开经 IPC 读回原文全文 -->
<template v-if="offloadHandle">
<OffloadedResultBar
@@ -512,12 +512,9 @@ onMounted(() => {
/* ===== 加载/错误状态 ===== */
.audit-loading { display: flex; align-items: center; justify-content: center; padding: 40px; }
.audit-error { color: var(--df-danger); }
.audit-spinner { animation: audit-spin 0.9s linear infinite; }
/* 消费 global.css df-spin(原本地 audit-spin 重复定义已删,2026-10-18 整洁波) */
.audit-spinner { animation: df-spin 0.9s linear infinite; }
.audit-spinner--lg { color: var(--df-text-dim); }
@keyframes audit-spin {
from { transform: rotate(0deg); }
to { transform: rotate(360deg); }
}
/* ===== 表格 ===== */
.audit-table-wrap {
@@ -550,9 +547,9 @@ onMounted(() => {
vertical-align: top;
}
.audit-table tbody tr:last-child td { border-bottom: none; }
.audit-table tbody tr:hover td { background: var(--df-bg-hover, rgba(255,255,255,0.03)); }
.audit-table tbody tr:hover td { background: var(--df-hover); }
/* 展开/hover 行高亮由 .audit-row:hover/.expanded 管理,避免选择器冲突 */
.audit-table tbody tr.audit-row:hover td { background: var(--df-bg-hover, rgba(255,255,255,0.03)); }
.audit-table tbody tr.audit-row:hover td { background: var(--df-hover); }
.col-time { min-width: 120px; }
.col-tool { min-width: 130px; }
@@ -573,14 +570,14 @@ onMounted(() => {
/* 可点击行 */
.audit-row { cursor: pointer; transition: background 0.12s; }
.audit-row:hover td { background: var(--df-bg-hover, rgba(255,255,255,0.03)); }
.audit-row.expanded td { background: var(--df-bg-hover, rgba(255,255,255,0.04)); }
.audit-row:hover td { background: var(--df-hover); }
.audit-row.expanded td { background: var(--df-hover); }
/* 展开详情行 */
.audit-detail-row td { padding: 0 !important; border-bottom: 0.5px solid var(--df-border); }
.audit-detail { padding: 12px 16px; display: flex; flex-direction: column; gap: 10px; }
.detail-section { display: flex; flex-direction: column; gap: 4px; }
.detail-label { font-size: 11px; color: var(--df-text-dim); text-transform: uppercase; letter-spacing: 0.5px; }
/* 小节头走公共 .df-sec-h */
.detail-pre {
margin: 0; padding: 8px 10px;
background: var(--df-bg);
@@ -604,7 +601,7 @@ onMounted(() => {
font-size: 11px;
color: var(--df-accent);
background: var(--df-accent-bg);
padding: 1px 6px;
padding: var(--df-pad-chip);
border-radius: var(--df-radius-xs);
}
@@ -621,7 +618,7 @@ onMounted(() => {
display: inline-block;
font-size: 10px;
font-weight: 600;
padding: 1px 7px;
padding: var(--df-pad-chip);
border-radius: var(--df-radius-xs);
background: var(--df-warning-bg);
color: var(--df-warning);
@@ -636,7 +633,7 @@ onMounted(() => {
padding: 2px 8px;
border-radius: var(--df-radius-xs);
}
.risk-low { background: rgba(90,99,128,0.2); color: var(--df-text-dim); }
.risk-low { background: var(--df-neutral-bg); color: var(--df-text-dim); }
.risk-medium { background: var(--df-warning-bg); color: var(--df-warning); }
.risk-high { background: var(--df-danger-bg); color: var(--df-danger); }
@@ -645,7 +642,7 @@ onMounted(() => {
display: inline-block;
font-size: 11px;
font-weight: 500;
padding: 3px 10px;
padding: var(--df-pad-badge);
border-radius: var(--df-radius-sm);
white-space: nowrap;
}
@@ -655,7 +652,7 @@ onMounted(() => {
.status-executing { background: var(--df-info-bg); color: var(--df-info); }
.status-completed { background: var(--df-success-bg); color: var(--df-success); }
.status-failed { background: var(--df-danger-bg); color: var(--df-danger); }
.status-interrupted { background: rgba(90,99,128,0.2); color: var(--df-text-dim); }
.status-interrupted { background: var(--df-neutral-bg); color: var(--df-text-dim); }
/* 决策者 tag */
.decided-tag {
@@ -667,7 +664,7 @@ onMounted(() => {
white-space: nowrap; /* 窄列防 CJK 逐字竖排(对齐 .status-tag) */
}
.decided-human { background: var(--df-accent-bg); color: var(--df-accent); }
.decided-auto { background: rgba(90,99,128,0.2); color: var(--df-text-dim); }
.decided-auto { background: var(--df-neutral-bg); color: var(--df-text-dim); }
.decided-none { color: var(--df-text-dim); }
/* ===== 分页 ===== */
@@ -691,29 +688,15 @@ onMounted(() => {
/* empty-state 已提取到 global.css 全局 */
/* ===== Tab 导航(对齐 ProjectDetail 同款交互) ===== */
/* ===== Tab 导航(公共 .df-tab 下划线范式,此处仅补底线叠齐/hover) ===== */
.audit-tabs {
display: flex;
gap: 4px;
border-bottom: 0.5px solid var(--df-border);
margin-bottom: 16px;
}
.audit-tabs .tab-btn {
padding: 8px 16px;
background: transparent;
border: none;
border-bottom: 2px solid transparent;
color: var(--df-text-dim);
font-size: 13px;
cursor: pointer;
transition: color 0.15s, border-color 0.15s;
margin-bottom: -0.5px;
}
.audit-tabs .tab-btn:hover { color: var(--df-text); }
.audit-tabs .tab-btn.tab-active {
color: var(--df-text);
border-bottom-color: var(--df-accent);
}
.audit-tabs .df-tab { margin-bottom: -0.5px; }
.audit-tabs .df-tab:hover { color: var(--df-text); }
/* ===== 对话历史 ===== */
.conv-split {
@@ -782,9 +765,9 @@ onMounted(() => {
}
.conv-msg-role { font-size: 12px; font-weight: 500; color: var(--df-text); }
.conv-msg-model, .conv-msg-toolname, .conv-msg-token {
font-size: 10px; padding: 1px 6px;
font-size: 10px; padding: var(--df-pad-chip);
border-radius: var(--df-radius-xs);
background: rgba(90,99,128,0.2); color: var(--df-text-dim);
background: var(--df-neutral-bg); color: var(--df-text-dim);
}
.conv-msg-token { font-family: var(--df-font-mono); color: var(--df-info); background: var(--df-info-bg); }
.conv-msg-time { font-size: 10px; color: var(--df-text-dim); margin-left: auto; }
@@ -818,7 +801,7 @@ onMounted(() => {
padding: 6px 10px;
border-radius: var(--df-radius-sm);
background: var(--df-warning-bg);
border: 0.5px solid rgba(240,199,94,0.2);
border: 0.5px solid var(--df-warning-bd);
}
.conv-msg-toolcall-head {
display: flex; align-items: center; gap: 8px; margin-bottom: 4px;