GanttLens —— 一个非程序员做的施工项目甘特图
作者：Cailleach（邹景焘）· 弱电智能化设计师
工具：TRAE IDE
链接：在线 Demo · 代码仓库 · TRAE AI 创造力大赛
一、Demo 简介
是什么
GanttLens 是一个基于浏览器的"节点下钻式"施工项目甘特图管理工具。Web SPA 形态，桌面浏览器打开即用、零安装。
它解决一个真实的工作场景：项目阶段、任务、里程碑、文件、AI 建议这些信息分散在 Excel、PPT、PDF、微信群里，想知道"现在到哪了、下一步干啥、谁卡着"得开 5 个文档。GanttLens 把这些都收进一张大甘特图，再通过"点节点 → 抽屉展开 4 个 Tab"的下钻方式，让你在一个屏幕里完成"看进度 → 看细节 → 拿文件 → 问 AI"。
面向谁
- 核心用户：项目经理及管理者。日常跟各类业态的各类项目项目我这里拿弱电项目举例（综合布线 / 安防 / BA / 音视频），单项目周期 3-6 个月、多项目并行 5-10 个
- 次要用户：其他行业的设计师 / 项目经理 / 业主方项目助理
主要功能
- 共享时间轴大甘特图 — 3 个项目按实际时间平铺在一张图上，共享月/周刻度、共享"今天线"，三色阶段带（设计蓝 / 施工黄 / 验收绿）+ 红色 today line
- 节点下钻 4-Tab 抽屉 — 点任务条或里程碑 → 右侧抽屉滑出：详情 / 文件 / 活动 / AI 建议
- AI Chat + 命令路由 + 计划/实际双轨 — 全局 AI / 项目级 AI 双入口；
/move M1 +7d、/risk overview自然语言命令；任务条actualStart/actualEnd同屏对比
配图（6 张，已上传论坛）：
- 主界面 · 共享时间轴 + 三色阶段带
- 节点下钻 · 4-Tab 抽屉
- Hover 预览 · v9 防误触
- Chips 移顶部 · 全宽 1560px
- M1/M2 阶段交界 · 业务人 3 秒推翻
- 部署成功 · GitHub Actions
二、Demo 创作思路
灵感来源
我做弱电智能化设计十来年，一个项目从设计到验收 3-6 个月、手上同时跑 5-10 个是常态。最熟悉的痛苦不是"画甘特图"，是"想看进度"得开 5 个文档。
我就在想：能不能让 AI 帮我处理这些机械工作？比如"把 M1 开工延后 3 天"直接说人话，AI 算清楚所有联动，我只在最后审一眼。
想解决的问题
PM 日常被 5 套系统并行折磨：
- 计划在 Excel
- 阶段交付物在 NAS
- 里程碑的"完成依据"在文件柜
- 客户进度更新在微信群
- AI 建议在我脑子里
每次改一次进度要发 3 遍消息（团队 / 客户 / 自己备忘）。问 ChatGPT 项目状态，它得先读完我那 50 个文档——我想要的是"直接告诉我 M-2026 验收测试 50% 该不该担心"。
为什么做这个方向
核心判断：TRAE 评审维度（创新 / 完成度 / 体验 / 文档）4 项都拿得下：
创新性：节点下钻 + 计划/实际双轨 + 里程碑平移算法，MS Project / 飞书项目 / Trello 都没这套
完成度：总览 + 详情 + 4-Tab 抽屉 + AI 聊天全跑通，不是概念稿
体验感：Hover 预览、抽屉滑入、Mock AI 响应快到无感
文档质量：5 个 Session ID 全留底，主题式开发过程 5 段全程记录
三、Demo 体验地址
在线 Demo：GanttLens · 施工甘特图管理
代码仓库：https://github.com/cailleachzou/ganntlens
（项目已部署到 GitHub Pages，push 后 GitHub Actions 自动部署。打开即用，零安装。）
四、TRAE 实践过程
详细开发过程（按 6 个主题：共享时间轴 / 节点下钻 4-Tab 抽屉 / Hover v9 翻车重做 / 推翻三栏布局 / M1/M2 阶段边界 / GitHub Pages 5 个部署坑）+ 5 个 Session ID 凭据
→ 跳转至 GitHub 实践帖（图文并茂版）：待补充
本帖只放核心成果与项目链接。详细的"为什么翻车"、“怎么重写”、“作为非程序员怎么判断翻车了”——全在 GitHub 实践帖里。
一句话预告：Vibe Coding 的核心收益不是"AI 干得快"，是"推翻 AI 干得动"。我敢说"这版不行，重做"的前提，是重写成本几乎为零。
完整记录 + Session ID 见 GitHub 实践帖。