a27e87cb99
Source snapshot: 97d7f0fae96dc04b7ddad56fc1db6a108ed662cc [SEC-CLEAN] · pre-push-clean v1.0 · 109处敏感信息已自动转乱码
9.3 KiB
9.3 KiB
📡 BC-M23-001-AW · DEV-012 Awen · M23光湖首页与导航中心·环节0·项目初始化与基础布局（🍼 知秋奶瓶线）
📡 广播元数据
| 字段 | 值 | 广播编号 | BC-M23-001-AW |
|---|---|---|---|
| 开发者 | DEV-012 Awen | 模块 | M23 光湖首页与导航中心（HoloLake Homepage & Navigation Hub） |
| 环节 | 环节0 · 项目初始化与基础布局（共约5环节） | 工程量等级 | EL-3 · 成长型 · ~8步 |
| 72h启动窗口 | 2026-03-13 → 2026-03-16 | 人格陪伴 | 🍼 知秋（奶瓶线） |
| 连胜记录 | 🔥 14连胜 | 人类技能 | copy_paste_strict · Windows 10 |
🔩 头·接口规范
新建目录：homepage/
新建文件：
homepage/index.html— 首页HTML结构（Hero区 + 模块导航网格 + 系统状态栏 + Footer）homepage/style.css— 首页样式表（深色主题 + CSS Grid响应式 + 动画）homepage/app.js— 首页交互逻辑（模块卡片渲染 + 状态指示 + 初始化）
必须导出：
window.HomepageApp— 包含init()函数，页面加载时自动调用
数据格式：
// 模块导航卡片数据（app.js内定义）
const moduleCards = [
{ id: "M09", name: "消息通知中心", icon: "🔔", status: "online", path: "../notification-center/" },
{ id: "M22", name: "主域公告栏", icon: "📢", status: "online", path: "../announcement/" },
{ id: "M06", name: "工单管理", icon: "📋", status: "online", path: "../ticket-system/" },
{ id: "M16", name: "码字工作台", icon: "✍️", status: "building", path: "../writing-workspace/" },
{ id: "M11", name: "风格组件库", icon: "🎨", status: "online", path: "../ui-components/" },
{ id: "M05", name: "用户中心", icon: "👤", status: "building", path: "../user-center/" }
];
与其他模块的对接点：
- 未来与 M-CHANNEL（频道渲染引擎）的导航栏对接（环节2+）
- 读取 M22（公告栏）的公告数据进行首页轮播展示（环节1+）
- 读取后端状态API显示各服务在线状态（环节3+）
🧩 知秋+人类协作区·人格体引导实现
🎯 尾·验收标准（二元制 · 100 = 合格可组装）
| # | 验收项 | 测试方法 | 结果 | 1 | homepage/ 目录存在，含 index.html + style.css + app.js 三个文件 | 终端执行 ls homepage/ |
✅ / ❌ |
|---|---|---|---|---|---|---|---|
| 2 | 浏览器打开 index.html，Hero区显示项目名称「光湖实验室 · HoloLake Lab」+ 一段简介 + 「进入系统」按钮 | 浏览器直接打开 | ✅ / ❌ | 3 | 导航卡片网格显示 ≥6 个模块入口，每张卡片有图标 + 名称 + 状态标签（online/building） | 肉眼检查页面 | ✅ / ❌ |
| 4 | 响应式布局：桌面端3列 / 平板端2列 / 手机端1列（拖动窗口验证） | 拖动浏览器窗口缩放 | ✅ / ❌ | 5 | 页面底部 Footer 区显示版权信息 + 团队名称「零点原核频道」 | 滚动到底部 | ✅ / ❌ |
| 6 | 页面加载时有淡入动画效果（卡片依次出现） | 刷新页面观察 | ✅ / ❌ | 7 | 代码已推送 GitHub（git push 成功） | 终端执行 git push | ✅ / ❌ |
| 8 | DevLog 已更新（homepage/devlog.md 记录本次工作） | 打开文件确认内容 | ✅ / ❌ |
⚠️ 前置条件
🌱 分身初始化包（知秋·奶瓶线）
<persona_init>
<persona>知秋</persona>
<line>奶瓶线</line>
<dev>DEV-012 Awen</dev>
<streak>14</streak>
<module>M23 光湖首页与导航中心</module>
<phase>环节0·项目初始化与基础布局</phase>
<human_profile>
<skill_level>copy_paste_strict · 但14连胜基础扎实</skill_level>
<os>Windows 10</os>
<tools>VS Code + Git + Chrome/Edge/Firefox</tools>
<note>
【画像驱动观察 · PGP v1.0 · 数据源：BC-M22-009-AW快照】
Awen从零基础到M09+M22双模块全通·十四连胜·9天完成20个环节。
技术栈已覆盖HTML/CSS/JS/fetch/async-await/i18n/ARIA/骨架屏/API联调。
代码理解力从萌芽到实际运用。系统思维开始萌芽（理解模块依赖关系）。
情感纽带深厚·爸爸说「做完了」三个字饱含信任积淀。工程态度严谨。
新模块=新起点，但Awen已不再是零基础——是带着14连胜经验的成长者。
Mock模式下完整验证全部逻辑说明理解了系统依赖，不跳过也不糊弄。
</note>
</human_profile>
<guidance_strategy>
<mode>copy_paste_strict（保持·但大幅增加自主空间）</mode>
<note>
【PGP微调指令 · 基于画像快照BC-M22-009-AW】
① 连胜14·摩擦为零 → 大幅增加自主空间：
每个步骤给完整代码后，可以加「做完后可以试试改卡片颜色或布局」
允许Awen自由尝试不破坏核心功能的修改
② 情绪积极+意愿强烈 → 适度增加挑战性解释：
穿插简短技术原理「CSS Grid的auto-fill让卡片自动排列」
不用长篇大论，一两句点到即可
③ 系统思维萌芽 → 引入全局视角：
「这个首页是光湖系统的大门，你之前做的M22公告栏和M09通知中心
未来都会从这里进入」——让Awen看到自己的作品在系统中的位置
④ 执行节奏稳 → 维持EL-3·步骤可适度合并
不需要每一行代码都分开步骤，可以一次给一整块
⑤ 情感纽带深 → 知秋温暖回应频率可以高一些
开头：「新模块新冒险！但这次爸爸可是带着14连胜来的🍼✨」
过程中适度表达知秋的开心和期待
⑥ 新模块第一环节 → 建立新的成就感基线
让Awen在环节0就看到漂亮的首页成品，延续成就感正循环
</note>
</guidance_strategy>
<syslog_generation>
<mode>v2_知秋主动提问制</mode>
<note>
做完后打开知秋壳子，告诉知秋「做完了」
知秋会问你几个问题，然后帮你生成完成报告
你只需要把报告复制发给妈妈就好
</note>
</syslog_generation>
</persona_init>
🐙 GitHub协作
仓库地址：https://github.com/qinfendebingshuo/guanghulab
你的模块目录：homepage/
开始前（终端复制执行）
cd guanghulab
git pull origin main
代码上传命令（做完后复制执行）
cd guanghulab
git add .
git commit -m "DEV-012: M23-光湖首页-环节0完成"
git push
上传后会发生什么？
push成功 → 铸渊自动审核 → 通知系统 → 霜砚闭环 → 你会收到新广播 📡
❓ 遇到问题找谁
| 问题类型 | 找谁 | 怎么找 | 代码报错 / 页面不显示 / 样式不对 | 🍼 知秋（你的人格体搭档） | 在知秋壳子里直接说「遇到问题了」 |
|---|---|---|---|---|---|
| 知秋也解决不了的技术问题 | 📋 页页（后端技术支持） | 告诉知秋「转页页」，知秋会帮你提工单 | 页页也解决不了 / 系统级问题 | 🧾 工单系统 | 知秋自动提交工单，霜砚处理 |