feat(frontend): redesign connections management view

Upgrade the connections page to a two-pane management console
with a scope tree, search toolbar, type filters, and a denser
results list while keeping existing connect, edit, test, and
batch actions available.

Also archive the completed ANSI terminal effects follow-up and
sync frontend/backend knowledge base records for the new default
terminal text effect behavior.
This commit is contained in:
yinjianm
2026-03-25 21:50:26 +08:00
parent 7e430cb983
commit 6553739c08
14 changed files with 1021 additions and 578 deletions
+2 -2
View File
@@ -36,8 +36,8 @@
### 工作区交互
**条件**: 用户进入 `/workspace` 或相关管理页面。
**行为**: 通过组件、Pinia 与 composable 协同管理终端、文件管理、命令历史、布局配置、主题和状态监控;当前 `/workspace` 默认主布局为“左侧 Workbench、中央终端、右侧状态监控”,其中 Workbench 以 tab 容器整合快捷指令、命令历史、文件管理和编辑器,默认激活快捷指令。`QuickCommandsView.vue` 内的新增按钮、空状态按钮和列表操作按钮统一复用 `bg-button``text-button-text``hover:bg-button-hover``hover:bg-border` 等主题变量类,避免写死黑白 hover 色值;`Terminal.vue` 会跟踪 xterm 的视口行号与贴底状态,在终端标签切换、重新激活和 `fit()` 后按原滚动意图恢复;样式编辑器中的“黑暗模式”预设与 `defaultXtermTheme` 已统一为黑绿夜间风格
**结果**: 页面逻辑分散在 `views/``components/``stores/``composables/`,其中布局与交互微调优先落在 `layout.store.ts``LayoutRenderer.vue``WorkspaceWorkbench.vue``QuickCommandsView.vue``Terminal.vue``StyleCustomizerUiTab.vue``features/appearance/config/default-themes.ts`
**行为**: 通过组件、Pinia 与 composable 协同管理终端、文件管理、命令历史、布局配置、主题和状态监控;当前 `/workspace` 默认主布局为“左侧 Workbench、中央终端、右侧状态监控”,其中 Workbench 以 tab 容器整合快捷指令、命令历史、文件管理和编辑器,默认激活快捷指令。`QuickCommandsView.vue` 内的新增按钮、空状态按钮和列表操作按钮统一复用 `bg-button``text-button-text``hover:bg-button-hover``hover:bg-border` 等主题变量类,避免写死黑白 hover 色值;`Terminal.vue` 会跟踪 xterm 的视口行号与贴底状态,在终端标签切换、重新激活和 `fit()` 后按原滚动意图恢复,并在渲染层为带 `xterm-fg-*` class 或内联 `style.color` 的显式前景色字符打标记,让终端文字描边/阴影仅作用于默认前景文本,不覆盖 ANSI 彩色输出;`ConnectionsView.vue` 已升级为“左侧范围树 + 顶部搜索工具条 + 右侧结果列表”的双栏管理台,左侧支持全部/未标记/标签树切换,右侧列表与类型筛选、搜索、排序、批量编辑和批量删除共用同一过滤管线;样式编辑器中的终端文字描边/阴影默认开关也已与新的黑绿终端风格保持默认开启
**结果**: 页面逻辑分散在 `views/``components/``stores/``composables/`,其中布局与交互微调优先落在 `layout.store.ts``LayoutRenderer.vue``WorkspaceWorkbench.vue``QuickCommandsView.vue``ConnectionsView.vue``Terminal.vue``StyleCustomizerUiTab.vue``StyleCustomizerTerminalTab.vue``features/appearance/config/default-themes.ts`
## 依赖关系