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:
@@ -41,8 +41,8 @@
|
||||
|
||||
### 外观默认值
|
||||
**条件**: 数据库初始化、外观设置重置或前后端默认主题定义调整。
|
||||
**行为**: `appearance.repository.ts` 负责写入默认 UI 外观设置,`config/default-themes.ts` 保持与前端同名默认主题定义一致,作为默认外观与终端主题的镜像基线。
|
||||
**结果**: 前后端在默认主题和回退值上保持一致,避免前端回退与后端初始化出现风格漂移。
|
||||
**行为**: `appearance.repository.ts` 负责写入默认 UI 外观设置,`config/default-themes.ts` 保持与前端同名默认主题定义一致,作为默认外观与终端主题的镜像基线;当前默认外观中终端文字描边和阴影开关默认开启,但仅作为“无保存值时”的回退,不主动覆盖数据库里已有用户配置。
|
||||
**结果**: 前后端在默认主题、终端文字效果开关和回退值上保持一致,避免前端回退与后端初始化出现风格漂移。
|
||||
|
||||
### 状态监控
|
||||
**条件**: 前端工作区通过 WebSocket 订阅服务器状态。
|
||||
|
||||
@@ -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`。
|
||||
|
||||
## 依赖关系
|
||||
|
||||
|
||||
Reference in New Issue
Block a user