yovision/docs/tasks/T-004.md

id, title, phase, deps, status, created, issue, context_ref, claim_branch, work_branch, write_paths

id	title	phase	deps	status	created	issue	context_ref	claim_branch	work_branch	write_paths
T-004	设计 Sense 与 Bell 交互原型	0	T-002	DOING	2026-08-03	6	32b9859a40	claims/T-004	agent/codex/T-004	docs/tasks/T-004.md docs/design/sense/index.html docs/design/bell/index.html

问题 / 背景

Sense 与 Bell 尚无可供产品确认的页面结构。生产 UI 开工前，需要用两个零构建依赖的单文件 HTML 原型枚举导航、控件、主要状态与高频工作流，避免直接从实现代码猜交互。Sense 可参考 MiBeeNvr 的监控、摄像头与仪表盘信息架构，但必须补齐 YoVision 的设备健康、分片/期望态、批量开通和区域/警戒线编辑；Bell 必须体现事件与 Alert 分离、ack、升级链、证据、误报和权限边界。

产品评审进一步区分“检测区域”和“告警规则”：前者依附具体摄像头画面、分辨率与坐标系，应在摄像头详情中编辑；后者包含场景、继承、时段、持续时间、试运行、发布与升级链，应由 Bell 管理。后端系统边界不得迫使用户丢失当前摄像头或规则草稿上下文。

关联需求与交互（如适用）

• 用户故事：Sense 关联 US-001、US-002，并为 US-005 提供摄像头空间配置；Bell 关联 US-003～US-006，并拥有 US-005 的业务规则工作流。
• 交互清单：Sense 关联 IX-001～IX-004，并提供 IX-010 所需的区域/警戒线几何；Bell 关联 IX-005～IX-013，负责 IX-010～IX-011 的规则继承、试运行和发布。
• 相关页面 / 路由：原型阶段为 docs/design/sense/index.html 与 docs/design/bell/index.html，不定义生产路由。

方案

1. 使用统一的 YoVision 深色安防控制台设计系统，Sense 与 Bell 保持品牌、状态色、控件和导航规律一致。
2. Sense 制作为单页可交互工作台：总览、监控墙、摄像头、接入任务和系统状态；不设置一级“区域规则”。从摄像头列表进入详情，在“画面与检测区域”页签完成多边形、警戒线、撤销、清空、键盘替代、区域版本和待校准反馈。
3. Sense 只保存摄像头空间几何并只读显示关联规则，不提供业务规则绑定、时段、持续时间、试运行或正式发布；摄像头画面参数变化时将区域标记为待校准。
4. Bell 制作为单页可交互值班台：除预警队列、事件证据、ack/处置、升级时间线、误报反馈和升级链外，规则编辑必须选择摄像头与检测区域版本，并负责继承、时段、持续时间、试运行、发布和回滚。
5. Sense 摄像头详情与 Bell 规则草稿通过可演示的相对深链互相进入，携带摄像头/区域上下文；原型可以跨文件，但生产产品不得要求用户重新查找同一摄像头或丢失未完成草稿。
6. 两个原型均内联 CSS/JS，使用假数据，不加载真实视频、客户信息、生产地址或外部依赖；顶部固定标注原型用途。
7. 完成桌面、窄屏、键盘焦点、加载/空态/错误切换和 prefers-reduced-motion 检查，提交人工评审；产品确认前不把任务标为 DONE。

不可变约束

• 阈值 / 数值边界：默认 16 路、单站点上限 128 路；静默最长 4 小时；原型不得暗示 128 路同时播放主码流。
• 判定式 / 状态转换：事件事实不可被处置改写；Alert 的首次投递、送达、看到、ack 和升级必须分开展示；检测区域版本与告警规则版本是不同对象；规则正式发布与试运行必须可区分，保存区域不得自动发布规则。
• 安全边界：不得展示摄像头密码、完整 RTSP/ONVIF 地址、token、真实客户/未成年人数据或人脸入口；破坏性动作须确认。
• 既有契约：原型不修改事件 v0.1、API、路由和生产技术栈，不作为生产实现代码。

验收要点

• 任务相关验证：两个 HTML 可本地打开、无外部依赖；关键按钮和状态切换可用；Sense 一级导航无“区域规则”，摄像头详情可编辑检测区域；Bell 可选择摄像头/区域并演示试运行与正式发布；双向深链保留上下文；运行 HTML 结构检查、git diff --check 与 ./init.ps1。
• 完整门禁：本任务不修改 schema/API/路由，因此不触发契约与导航实现门禁；若范围变化则先更新任务。
• 人工 / 设备验收：必需。项目负责人分别打开 Sense 与 Bell 原型，确认页面结构、控件集合和主要工作流；未确认前不得标记 DONE 或合并为最终设计。
• 构建产物：docs/design/sense/index.html、docs/design/bell/index.html；双击浏览器打开，零构建依赖。

边界（不改什么）

不修改 Sense/、Bell/ 生产代码，不更新已确认的 IX 行为结论，不复制 _reference/mibeenvr 代码或资源，不实现真实视频播放、接口请求、持久化与认证。

协作约束

• 责任 Agent：codex。
• 唯一写入者：codex。
• 委派：不启用。
• Gitea：主 Issue 为 #6；context_ref 为 32b9859a405a4d64c03b6d3ae765340bc37fdfa0，claim 为 claims/T-004，工作分支为 agent/codex/T-004。

任何新增写路径先检查与其他活跃任务是否重叠；同一时刻只有一个 Agent 修改本任务的 write_paths。

执行记录

2026-08-03 任务定义

• 依据用户请求、US-001～US-006、IX-001～IX-013 和 MiBeeNvr 本地只读截图定义两个单文件原型范围。
• 人工验收为必需门禁；原型完成后先进入评审，不自动视为最终设计。

2026-08-03 领取与基线

• dispatcher ila 已将 Issue #6 分配给 codex，claim 与工作分支均从精确 context_ref 创建并读回一致。
• 在独立 worktree D:\OPC\yovision-T-004 开始工作；写入范围仅限本任务声明的三个路径。

2026-08-04 原型实现

• 使用 ui-ux-pro-max 生成并复核统一设计系统：深色专业安防控制台、高信息密度、系统字体、语义状态色、150–300ms 微交互、明确焦点和 reduced-motion；Sense 使用青蓝强调接入/画面，Bell 使用紫色强调处置/状态机。
• 首版 docs/design/sense/index.html 覆盖运行总览、4 路按需监控、摄像头期望态/实际态、批量接入、系统健康，以及多边形/方向警戒线的鼠标绘制、坐标键盘替代、撤销、草稿、试运行和发布确认；后续产品评审修订见下文。
• docs/design/bell/index.html 已覆盖预警队列、事件事实与证据、一次点击 ack、升级倒计时和投递事实、处置结果、误报反馈、规则、升级链、报表和审计；弱网时先显示结构化事实并允许证据后台重试。
• 两个文件均为单文件内联 CSS/JS，无外部依赖、真实视频、客户数据、连接串或人脸入口；顶部均固定显示原型用途提示。

2026-08-04 自测结果

• 标准库 HTML 结构审计通过：两文件均有 viewport、原型横幅、reduced-motion，无重复 id、无未命名按钮、无不可识别表单控件和外部 HTTP 资源；Sense 统计 40 个按钮/21 个控件，Bell 统计 42 个按钮/14 个控件。
• Playwright 在 1440×900 与 375×812 视口实测：两页页面级 scrollWidth == clientWidth，桌面三栏和移动底部导航正常，浏览器控制台 0 error / 0 warning；桌面与移动关键状态截图已人工检查，临时 QA 图片未写入仓库。
• Sense 实测坐标点添加、草稿状态、保存反馈、设备导航、添加摄像头对话框和 Esc 退出；Bell 实测一键 ack、升级计时停止、弱网状态、误报必填校验、错误焦点和 Esc 退出。
• 尚待项目负责人分别打开两个 HTML，确认页面结构、控件集合和主要工作流；在收到确认前任务保持 DOING。

2026-08-04 产品评审修订

• 项目负责人指出 Sense 的区域规则没有融合到摄像头模块。复核 US-001/US-002 与 US-005 的角色和任务后，确认原型把“摄像头空间几何”和“业务告警规则”混为同一一级模块，且让微服务边界影响了用户操作路径。
• 采纳“领域分离、体验连续”的产品方案：Sense 摄像头详情维护检测区域与校准状态；Bell 维护业务规则、试运行和正式发布；通过携带摄像头/区域上下文的深链连接两个原型。
• ui-ux-pro-max 的导航层级、渐进披露、深链与状态保持原则用于本轮修订；默认 16 路从摄像头详情进入，128 路仍通过设备列表的筛选、分页与区域状态列治理，不恢复独立的一级区域编辑入口。

2026-08-04 修订后自测

• 标准库 HTML 审计通过：Sense 69 个唯一 id、40 个有名称按钮、16 个有标签控件；Bell 67 个唯一 id、50 个有名称按钮、21 个有标签控件；两页均无外部 HTTP 资源。专项断言确认 Sense 不再存在一级 zones 页面、规则发布按钮或试运行开关。
• Node.js 对两个内联脚本执行语法编译检查通过。Edge Headless/CDP 在 1440×900 与 375×812 验证摄像头详情、坐标绘制、区域保存、画面参数变化后待校准、Sense→Bell 深链、Bell 规则草稿、Bell→Sense 返回链和正式发布确认；页面无横向溢出，控制台 0 error，运行时 0 exception。
• 浏览器测试首次发现 Sense 移动端区域画布受 min-height + aspect-ratio 影响发生横向溢出，并发现条件上下文条的 hidden 被组件 display 覆盖；两项均已修复并重新通过桌面/移动截图人工检查。临时 QA 截图未写入仓库。
• ./init.ps1 通过：上下文校验、16 个治理单测与完整治理检查均成功；git diff --check 通过。任务继续保持 DOING，等待项目负责人确认修订后的信息架构与工作流。