四种视图详解

TodoHeap 提供四种视图展示任务，每种视图适用于不同的使用场景。

视图对比

视图	特点	最适合	性能
📋 列表视图	简洁、快速	快速浏览和编辑	最优
🌳 树视图	层级清晰、可拖放	复杂层级管理	优秀
🧠 思维导图	可视化、全局	规划和头脑风暴	良好
📚 堆视图	优先级聚焦	明确执行顺序	优秀

---

📋 列表视图

最简洁的任务列表展示

特点

• 按优先级顺序排列任务
• 支持快速搜索和筛选
• 支持拖放重新排序
• 支持批量操作
• 轻量级，适合任务众多的情况

界面说明

[搜索框] [筛选器] [排序] [视图切换]

□ 高优先级任务 1          [编辑] [删除]
□ 高优先级任务 2          [编辑] [删除]
□ 中优先级任务            [编辑] [删除]
  └─ 这是一个子任务       [编辑] [删除]
□ 低优先级任务            [编辑] [删除]

常见操作

快速创建

在列表顶部输入框输入任务名称，按 Enter 创建：

输入："完成周报"
↓
新任务添加到列表顶部

搜索任务

点击搜索框，输入关键词：

搜索："Vue"
↓
过滤所有包含"Vue"的任务

筛选任务

点击筛选器按钮，选择条件：

筛选条件：
- 状态：待办 / 进行中 / 已完成 / 已删除
- 优先级：全部 / 高 / 中 / 低
- 截止日期：今天 / 本周 / 本月 / 所有

拖放排序

鼠标拖动任务条目改变顺序：

按住 │任务1│，拖到其他位置
↓
任务顺序改变，自动保存

批量操作

1. 勾选多个任务
2. 点击「批量操作」
3. 选择操作：
   • 改变状态
   • 改变优先级
   • 删除 / 恢复
   • 添加标签

使用场景

✅ 日常快速编辑
✅ 大量任务浏览
✅ 移动设备查看
✅ 快速搜索特定任务

---

🌳 树视图

清晰的层级结构展示

特点

• 完整展示任务层级关系
• 支持展开/收起子任务
• 支持拖放改变层级
• 中心节点显示任务详情
• 最适合复杂项目管理

界面说明

📌 项目 A (高优先级)
  ├─ 📌 Phase 1
  │   ├─ 📋 设计评审
  │   ├─ 📋 需求细化
  │   └─ 📋 技术选型
  ├─ 📌 Phase 2
  │   ├─ 📋 后端开发
  │   ├─ 📋 前端开发
  │   └─ 📋 联调测试
  └─ 📌 Phase 3
      └─ 📋 上线发布

[右侧面板：任务详情编辑]

图例：

• 📌 = 有子任务的任务（可展开/收起）
• 📋 = 叶子节点，无子任务

常见操作

展开/收起

点击任务前的箭头：

▼ 项目 A          ← 点击 ▼ 收起
  ├─ Phase 1
  └─ Phase 2

▶ 项目 A          ← 点击 ▶ 展开

拖放改层级

改变为兄弟任务：

拖放 [任务 B] 到 [任务 A] 的同级位置
↓
任务 B 和任务 A 成为同级

改变为子任务：

拖放 [任务 B] 到 [任务 A] 下方的缩进位置
↓
任务 B 成为任务 A 的子任务

改为顶级任务：

拖放 [任务 B] 到最左边
↓
任务 B 成为顶级任务

展开全部/收起全部

使用快捷键：

• Ctrl + Shift + →：展开全部层级
• Ctrl + Shift + ←：收起全部层级

使用场景

✅ 项目规划与管理
✅ 理清复杂的任务关系
✅ 调整任务层级
✅ 展示完整的工作分解结构 (WBS)

---

🧠 思维导图视图

可视化的全局规划展示

特点

• 中心节点为主任务，分支为子任务
• 支持缩放和平移
• 支持拖放移动节点
• 直观、适合头脑风暴和规划
• 可导出为图片

界面说明

                    ┌─ 子任务 1
            ┌─ 分支 A ┼─ 子任务 2
            │         └─ 子任务 3
主任务 ─────┼─ 分支 B ─ 子任务 4
            │
            └─ 分支 C ─ 子任务 5

常见操作

缩放

• 鼠标滚轮：上滚放大，下滚缩小
• 触控板：两指张开放大，捏合缩小

平移

• 鼠标拖放：按住空白处拖动整个图表
• 触控板：三指拖动

编辑节点

• 双击节点：编辑任务名称
• 右键节点：显示上下文菜单
  • 添加子任务
  • 编辑任务
  • 删除任务

导出为图片

点击工具栏的「导出」按钮：

导出为 PNG 图片
↓
保存到本地，用于分享或演示

使用场景

✅ 项目整体规划展示
✅ 学习路径规划
✅ 头脑风暴和创意记录
✅ 向他人讲解任务结构
✅ 会议演示和汇报

性能提示

思维导图在任务众多时可能较慢，建议：

• 任务数 < 50 个：流畅
• 任务数 50-100 个：可接受
• 任务数 > 100 个：建议切换到列表或树视图

---

📚 堆视图

优先级聚焦的执行视图

特点

• 按优先级排序，从高到低堆叠
• 直观展示需执行的顺序
• 只显示「待办」和「进行中」的任务
• 最适合明确执行顺序
• 支持快速状态切换

界面说明

优先级 2（高）
┌──────────────────┐
│ 最高优先任务 1    │ ← 下一个要做的
├──────────────────┤
│ 最高优先任务 2    │
└──────────────────┘

优先级 1（中）
┌──────────────────┐
│ 中优先级任务 1    │
├──────────────────┤
│ 中优先级任务 2    │
├──────────────────┤
│ 中优先级任务 3    │
└──────────────────┘

优先级 0（低）
┌──────────────────┐
│ 低优先级任务 1    │
└──────────────────┘

常见操作

快速标记完成

点击任务卡片上的「完成」按钮：

点击 [✓ 完成]
↓
该任务移入已完成列表
↓
下一个优先级任务自动上升到顶部

快速改变优先级

点击任务卡片 → 编辑优先级：

将优先级从 1 改为 2
↓
该任务立即上升到对应的优先级区块

查看任务详情

点击任务卡片：

右侧面板弹出详情编辑器
↓
可编辑任务的各项属性

隐藏已完成任务

点击「显示/隐藏已完成」切换：

默认隐藏已完成任务，只显示待办和进行中的
↓
点击切换可显示所有任务

使用场景

✅ 明确每天最重要的任务
✅ 避免"选择困难症"
✅ 快速完成任务并推进
✅ 突发任务加入堆中
✅ 团队站会中明确优先级

堆视图最佳实践

1. 每天早上查看堆视图：确认今天的优先级顺序
2. 按顺序执行：优先完成顶部任务
3. 完成后刷新：用完成的任务消失、新任务上升的反馈激励自己
4. 定期重排：当新任务加入时，用「AI 优化」重新计算优先级

---

视图切换

在任何视图中，点击底部或侧边栏的视图按钮快速切换：

[列表] [树] [思维导图] [堆]

快捷键

视图	快捷键
列表视图	Ctrl + 1
树视图	Ctrl + 2
思维导图	Ctrl + 3
堆视图	Ctrl + 4

---

常见问题

Q: 哪个视图最好？

A: 没有"最好"，取决于你的场景：

• 快速编辑 → 列表视图
• 复杂管理 → 树视图
• 全局规划 → 思维导图
• 焦点执行 → 堆视图

Q: 能同时打开多个视图吗？

A: 不能，但切换很快（快捷键 1-2 秒切换），可根据需要灵活切换。

Q: 思维导图和树视图有什么区别？

A:

• 树视图：文本表示，适合详细编辑，性能最佳
• 思维导图：图形表示，适合规划展示，更直观但性能稍差