54 lines
2.5 KiB
Markdown
54 lines
2.5 KiB
Markdown
|
# 文件管理编辑器面板（SPA）
|
|||
|
|
|
|||
|
|
**日期**: 2026-06-01
|
|||
|
|
**状态**: 已确认
|
|||
|
|
**依据**: `2026-05-18-file-manager-v2-design.md` §四、`2026-05-30-monaco-ide-editor` changelog
|
|||
|
|
|
|||
|
|
## 背景
|
|||
|
|
|
|||
|
|
当前 `MonacoEditor.vue` 使用 `v-dialog fullscreen`，遮挡整个应用，与历史设计不符：
|
|||
|
|
|
|||
|
|
| 文档 | 编辑器形态 |
|
|||
|
|
|------|------------|
|
|||
|
|
| v2 设计 §四 | 工具栏 + 编辑区 + **底部状态栏**（行/列/语言），非占满视口 |
|
|||
|
|
| v2 计划任务 5 | 对话框约 **95vw × 90vh** |
|
|||
|
|
| 2026-05-30 IDE 重构 | **分屏 IDE**、多标签、可最小化/最大化，非唯一全屏 |
|
|||
|
|
|
|||
|
|
## 目标
|
|||
|
|
|
|||
|
|
1. 编辑器默认嵌入 `#/files` 页面底部，文件列表仍可见（约上半屏）
|
|||
|
|
2. 多文件标签页，切换保留各文件内容与修改状态
|
|||
|
|
3. 状态栏：行、列、语言、远程路径
|
|||
|
|
4. 工具栏：保存、主题、**最大化**、关闭面板、**最小化**到底部标签条
|
|||
|
|
5. 保留 Ctrl+S、Esc、未保存关闭确认
|
|||
|
|
|
|||
|
|
## 布局（v2 完整）
|
|||
|
|
|
|||
|
|
```
|
|||
|
|
┌─ 工具栏 / 面包屑 / 文件表（可滚动，约 42vh）────────┐
|
|||
|
|
├─ 编辑器面板 ────────────────────────────────────────┤
|
|||
|
|
│ [tab1●] [tab2] [保存][主题][⛶][─][×] │
|
|||
|
|
│ ┌─ Monaco ─────────────────────────────────────┐ │
|
|||
|
|
│ └──────────────────────────────────────────────┘ │
|
|||
|
|
│ 行 12, 列 4 │ python │ /www/.../main.py │
|
|||
|
|
└────────────────────────────────────────────────────┘
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
最小化：仅显示底部标签条，点击恢复。最大化：`position: fixed` 铺满视口，文件表隐藏。
|
|||
|
|
|
|||
|
|
## v2 补齐（2026-06-01）
|
|||
|
|
|
|||
|
|
- 左侧目录树懒加载（`browse` 子目录）
|
|||
|
|
- 新建空文件、压缩/解压、排序、扩展名筛选
|
|||
|
|
- 右键：复制路径、终端、压缩、解压
|
|||
|
|
- 快捷键 F5 / F2 / Delete / Backspace / Ctrl+A
|
|||
|
|
|
|||
|
|
## 验收
|
|||
|
|
|
|||
|
|
- [x] 打开编辑器后仍能看到文件列表并切换目录
|
|||
|
|
- [x] 同时打开 2+ 文件，标签切换内容正确
|
|||
|
|
- [x] 状态栏行列随光标更新
|
|||
|
|
- [x] 最大化/最小化/关闭面板行为符合预期
|
|||
|
|
- [x] 未保存关闭单标签或整面板有确认
|
|||
|
|
- [x] 目录树、新建文件、压缩解压、排序筛选、快捷键
|