feat: 工作空间文件预览改为侧边栏内嵌面板

- 将文件预览从模态弹窗改为侧边栏内嵌面板,不打断用户操作流程
- 支持双拖动调整:外部调整整体宽度(400-800px),内部调整文件树宽度(180-300px)
- 左右分栏布局:左侧文件树 + 右侧预览面板
- 对话区域保留最小宽度 480px,保证可用性
- 新建 FilePreviewPanel 组件,删除 FilePreviewModal 组件
- 更新相关样式和规格文档
This commit is contained in:
2026-04-17 19:34:29 +08:00
parent 5f333b116a
commit ff4217c72a
8 changed files with 548 additions and 208 deletions

View File

@@ -158,3 +158,37 @@
#### Scenario: 包含空文件夹示例
- **WHEN** 文件树加载
- **THEN** 显示至少一个空文件夹
### Requirement: 文件树宽度可调整
文件树宽度应支持拖动调整。
#### Scenario: 文件树默认宽度
- **WHEN** 侧边栏打开
- **THEN** 文件树默认宽度为 200px
#### Scenario: 文件树宽度范围
- **WHEN** 用户拖动分隔线调整文件树宽度
- **THEN** 文件树宽度在 180px 到 300px 之间变化
#### Scenario: 文件树宽度约束
- **WHEN** 文件树宽度调整到边界值
- **THEN** 最小 180px 保证文件名可读,最大 300px 避免压缩预览面板
### Requirement: 文件树作为侧边栏左侧面板
文件树应作为侧边栏的左侧面板显示。
#### Scenario: 文件树固定在左侧
- **WHEN** 侧边栏打开
- **THEN** 文件树固定在侧边栏左侧flex-shrink: 0不被压缩
#### Scenario: 文件树独立滚动
- **WHEN** 文件树内容过多
- **THEN** 文件树独立滚动overflow-y: auto不影响预览面板
#### Scenario: 文件树背景色
- **WHEN** 文件树显示
- **THEN** 文件树背景色为 var(--color-bg-2),与侧边栏整体一致
#### Scenario: 文件树右侧边框
- **WHEN** 文件树显示
- **THEN** 文件树右侧显示 1px 边框var(--color-border-2)),与预览面板分隔