重构：文件系统模块化架构，优化应用启动流程

2026-01-28 00:28:54 +08:00
parent 4a9b25a505
commit 8c577f70e7
123 changed files with 32030 additions and 967 deletions
--- a/docs/04-功能迭代/GO-DESK-2.数据库客户端/设计文档/功能设计/多表结构查看方案分析.md
+++ b/docs/04-功能迭代/GO-DESK-2.数据库客户端/设计文档/功能设计/多表结构查看方案分析.md
@@ -0,0 +1,314 @@
+# 多表结构查看方案分析
+
+**分析日期**：2025-01-28  
+**分析范围**：多表结构查看的不同实现方案  
+**状态**：方案分析
+
+---
+
+## 一、需求分析
+
+### 1.1 使用场景
+
+用户可能需要：
+- 同时查看多个表的结构，进行对比
+- 查看表结构时，需要查看其他表的结构作为参考
+- 在SQL编写过程中，需要频繁查看不同表的结构
+
+### 1.2 当前限制
+
+- **方案一**：单表查看，查看新表时替换当前结构
+  - 优点：简单直接，界面不混乱
+  - 缺点：无法同时查看多个表的结构
+
+---
+
+## 二、方案对比
+
+### 方案一：结果面板Tab中查看（当前方案）
+
+**实现方式**：
+- 在结果面板的"结构"Tab中查看
+- 查看新表时替换当前结构
+
+**优点**：
+- ✅ 实现简单
+- ✅ 界面简洁
+- ✅ 符合当前架构
+
+**缺点**：
+- ❌ 无法同时查看多个表
+- ❌ 切换表时丢失之前的结构信息
+
+**适用场景**：
+- 单表结构查看
+- 临时查看表结构
+
+---
+
+### 方案二：SQL编辑器Tab中展示
+
+**实现方式**：
+- 在SQL编辑器的Tab区域，新增"结构"类型的Tab
+- 每个表结构作为一个独立的Tab
+- Tab标题：`结构: database.table`
+
+**界面布局**：
+```
+┌─────────────────────────────────────────────────────────┐
+│  SQL编辑器区域                                           │
+├─────────────────────────────────────────────────────────┤
+│  [查询 1] [查询 2] [结构: test.users] [结构: test.orders] │
+├─────────────────────────────────────────────────────────┤
+│                                                         │
+│  [结构内容区域]                                          │
+│  - 字段信息                                             │
+│  - 索引信息                                             │
+│                                                         │
+└─────────────────────────────────────────────────────────┘
+```
+
+**优点**：
+- ✅ 可以同时查看多个表的结构
+- ✅ Tab管理统一，用户习惯好
+- ✅ 结构Tab和SQL Tab可以并存，方便对比
+
+**缺点**：
+- ⚠️ SQL编辑器Tab区域可能变得拥挤
+- ⚠️ 需要区分SQL Tab和结构Tab
+- ⚠️ Tab切换逻辑更复杂
+
+**实现细节**：
+```typescript
+// Tab类型定义
+interface Tab {
+  id: string
+  key: string
+  title: string
+  type: 'sql' | 'structure'  // Tab类型
+  content?: string  // SQL内容（仅SQL Tab）
+  structureData?: StructureData  // 结构数据（仅结构Tab）
+  connectionId?: number
+  database?: string
+  tableName?: string
+}
+
+// Tab管理
+const tabs = ref<Tab[]>([])
+
+// 创建结构Tab
+const createStructureTab = (data: TableStructureEvent) => {
+  const tabKey = `structure-${data.connectionId}-${data.database}-${data.tableName}`
+  // 检查是否已存在
+  const existingTab = tabs.value.find(t => t.key === tabKey)
+  if (existingTab) {
+    activeTab.value = existingTab.key
+    return
+  }
+  
+  // 创建新Tab
+  const newTab: Tab = {
+    id: null,
+    key: tabKey,
+    title: `结构: ${data.database}.${data.tableName}`,
+    type: 'structure',
+    connectionId: data.connectionId,
+    database: data.database,
+    tableName: data.tableName,
+    structureData: null  // 异步加载
+  }
+  
+  tabs.value.push(newTab)
+  activeTab.value = newTab.key
+  
+  // 异步加载结构数据
+  loadStructureData(newTab)
+}
+```
+
+---
+
+### 方案三：结构Tab内部子Tab
+
+**实现方式**：
+- 在结果面板的"结构"Tab内部，使用子Tab区分不同表
+- 子Tab标题：`database.table`
+
+**界面布局**：
+```
+┌─────────────────────────────────────────────────────────┐
+│  结果面板                                              │
+├─────────────────────────────────────────────────────────┤
+│  [结果] [消息] [结构]                                   │
+├─────────────────────────────────────────────────────────┤
+│  [test.users] [test.orders] [test.products]            │
+├─────────────────────────────────────────────────────────┤
+│                                                         │
+│  [当前表结构内容]                                        │
+│                                                         │
+└─────────────────────────────────────────────────────────┘
+```
+
+**优点**：
+- ✅ 结构查看区域独立，不影响SQL编辑器
+- ✅ 可以同时查看多个表的结构
+- ✅ 结构Tab位置固定，用户习惯好
+
+**缺点**：
+- ⚠️ 结构Tab内部Tab管理，复杂度中等
+- ⚠️ Tab层级较深，可能影响用户体验
+
+---
+
+### 方案四：侧边栏结构查看器
+
+**实现方式**：
+- 在左侧连接树区域，新增一个可折叠的结构查看面板
+- 或者使用抽屉（Drawer）从侧边滑出
+
+**界面布局**：
+```
+┌──────────┬─────────────────────────────────────────┐
+│ 连接树   │  SQL编辑器                               │
+│          │                                          │
+│ [结构]   │                                          │
+│ ────────│                                          │
+│ test.users│                                        │
+│ - 字段   │                                          │
+│ - 索引   │                                          │
+└──────────┴─────────────────────────────────────────┘
+```
+
+**优点**：
+- ✅ 结构查看区域独立
+- ✅ 可以同时查看多个表（使用Tab）
+- ✅ 不影响SQL编辑器和结果区域
+
+**缺点**：
+- ⚠️ 需要额外的UI空间
+- ⚠️ 可能影响连接树的显示
+
+---
+
+## 三、方案推荐
+
+### 3.1 短期方案（P0）
+
+**推荐：方案一（当前方案）+ 方案二（可选）**
+
+- **默认使用方案一**：在结果面板的"结构"Tab中查看，查看新表时替换
+- **可选支持方案二**：通过右键菜单选项"在新Tab中查看结构"，在SQL编辑器Tab区域创建结构Tab
+
+**实现策略**：
+1. 右键菜单添加"查看结构"和"在新Tab中查看结构"两个选项
+2. "查看结构"：使用方案一（结果面板）
+3. "在新Tab中查看结构"：使用方案二（SQL编辑器Tab）
+
+---
+
+### 3.2 长期方案（P2）
+
+**推荐：方案三（结构Tab内部子Tab）**
+
+- 在结果面板的"结构"Tab内部，使用子Tab管理多个表结构
+- 提供更好的多表对比体验
+- 不影响SQL编辑器Tab区域
+
+---
+
+## 四、实现建议
+
+### 4.1 方案二实现要点
+
+**Tab类型区分**：
+```typescript
+// Tab类型
+type TabType = 'sql' | 'structure'
+
+// Tab渲染
+<template>
+  <a-tab-pane 
+    v-for="tab in tabs" 
+    :key="tab.key"
+    :title="tab.title"
+  >
+    <!-- SQL Tab -->
+    <SqlEditorContent v-if="tab.type === 'sql'" :tab="tab" />
+    
+    <!-- 结构Tab -->
+    <StructureContent v-else-if="tab.type === 'structure'" :tab="tab" />
+  </a-tab-pane>
+</template>
+```
+
+**Tab标题样式**：
+- SQL Tab：`查询 1`、`查询 2`
+- 结构Tab：`结构: database.table`（使用不同颜色或图标区分）
+
+**Tab关闭逻辑**：
+- SQL Tab：可以关闭（最后一个不可关闭）
+- 结构Tab：可以关闭，关闭时清除结构数据
+
+---
+
+### 4.2 方案三实现要点
+
+**子Tab管理**：
+```typescript
+// 结构Tab状态
+const structureTabs = ref<Array<{
+  key: string
+  title: string
+  connectionId: number
+  database: string
+  tableName: string
+  data: StructureData | null
+}>>([])
+
+const activeStructureTab = ref<string>('')
+```
+
+**Tab切换**：
+- 查看新表结构时，如果已存在则切换到对应Tab
+- 如果不存在，创建新Tab并加载数据
+
+---
+
+## 五、用户体验对比
+
+| 方案 | 多表查看 | 界面简洁 | 实现复杂度 | 用户习惯 |
+|------|---------|---------|-----------|---------|
+| 方案一 | ❌ | ✅ | ✅ 低 | ✅ 好 |
+| 方案二 | ✅ | ⚠️ | ⚠️ 中 | ✅ 好 |
+| 方案三 | ✅ | ✅ | ⚠️ 中 | ⚠️ 中 |
+| 方案四 | ✅ | ⚠️ | ⚠️ 中 | ⚠️ 中 |
+
+---
+
+## 六、最终建议
+
+### 6.1 实现策略
+
+**阶段一（P0）**：
+- 实现方案一：结果面板"结构"Tab，单表查看
+- 右键菜单：添加"查看结构"选项
+
+**阶段二（P1）**：
+- 扩展方案二：支持"在新Tab中查看结构"
+- 右键菜单：添加"在新Tab中查看结构"选项
+- SQL编辑器Tab区域支持结构Tab类型
+
+**阶段三（P2）**：
+- 考虑方案三：结构Tab内部子Tab
+- 提供更好的多表对比体验
+
+### 6.2 决策要点
+
+- **先实现方案一**：满足基本需求，实现简单
+- **后续扩展方案二**：提供多表查看能力，不影响现有功能
+- **未来考虑方案三**：如果用户反馈需要更好的多表查看体验
+
+---
+
+**结论**：先使用方案一（单表查看），后续根据用户反馈决定是否实现方案二（SQL编辑器Tab）或方案三（结构Tab子Tab）。
+