# 事件中心生产设计基线(方案 A:事件收件箱) ## 产品模型 事件中心不是“告警列表”。它由四个可追溯对象组成: 1. `Event`:三类协议统一抽象出的不可变事实。 2. `Automation`:按“当—如果—就”匹配事件并产生动作。 3. `Execution`:事件从接收、命中、通知到人工处置的执行轨迹。 4. `Delivery`:通知动作的排队、发送、送达、已读或失败审计。 事件页负责处理事件,自动化页负责定义规则,通知记录页只负责审计送达;三者不再混用状态。 ## 视觉源 - `event-inbox-desktop.png`:桌面事件收件箱与常驻详情面板,主视觉基线。 - `automation-workspace-desktop.png`:自动化清单、逻辑画布、运行记录和契约面板。 - `automation-editor-desktop.png`:四步编辑器与样例事件测试。 - `notification-audit-desktop.png`:通知送达表与送达详情。 - `event-inbox-mobile.png`:移动端边到边事件列表与全高详情。 ## 设计令牌 | 角色 | 值 | 用法 | | --- | --- | --- | | 页面背景 | `#F6F8FB` | 工作区底色 | | 表面 | `#FFFFFF` | 表格、面板、抽屉 | | 主文字 | `#17243D` | 标题、关键数据 | | 次文字 | `#65748A` | 标签、元数据 | | 边框 | `#E2E8F0` | 表格分隔、控件轮廓 | | 主色 | `#1267E8` | 选中、焦点、主操作 | | 危险 | `#D43C3C` | 待处理、失败 | | 警示 | `#C66A16` | 地理围栏、重要提示 | | 成功 | `#278254` | 恢复、完成、送达 | | 中性 | `#78869A` | 忽略、禁用 | - 仅使用真实白色表面,不使用奶油色、渐变或装饰性光晕。 - 圆角:控件 `6px`,面板 `8px`;不使用大圆角卡片容器。 - 阴影:默认无阴影,仅详情面板/模态焦点允许 `0 8px 28px rgba(23,36,61,.12)`。 - 间距:`4 / 8 / 12 / 16 / 24 / 32px`;桌面主 gutter `16px`。 ## 字体与密度 - 字体沿用系统中文无衬线栈;正文与控件均显式定义。 - 页面标题 `20px/28px 700`;面板标题 `16px/24px 650`;正文/控件 `14px/20px 500`;元数据 `12px/18px 400`。 - 表头 `12px/18px 600`;事件行最小高度 `72px`;移动事件行最小高度 `108px`。 - 桌面控件高度 `40px`,移动触控目标不小于 `44px`。 ## 容器模型 - 顶部只保留文本标签页与单行查询工具栏。 - 事件流:主表格 + 选中时 400px 常驻详情;不再显示 KPI 条和协议来源条。 - 自动化:340px 列表 rail + 逻辑画布 + 最近运行表;事件契约作为窄 inspector。 - 通知记录:单一审计表 + 400px 送达详情;禁止碎片化三列。 - 移动端:边到边列表;详情为全高 sheet,处置按钮粘底。 ## 事件契约 三类协议只影响来源,不改变事件顶层字段: ```text event.id event.type event.category event.title subject.type = vehicle subject.vin subject.plate source.protocol = GB32960 | JT808 | YUTONG_MQTT source.event_id occurred_at received_at automation.id automation.version execution.state = pending | processing | recovered | completed | ignored payload.* ``` 事件类型必须由触发语义生成,例如: - `vehicle.geofence.exited` - `vehicle.telemetry.soc_low` - `vehicle.motion.acceleration_high` - `vehicle.connectivity.offline` - `vehicle.mileage.daily_completed` 禁止把分类和指标简单拼接成重复或实现细节型名称。 ## 状态与交互 - 事件状态:`待处理 / 处理中 / 已恢复 / 已完成 / 已忽略`。 - 点击事件行选中并打开详情;键盘 Enter/Space 等价。 - 过滤条件写入 URL;切换标签页保留未提交草稿。 - 人工处置采用版本号并发控制,成功后同步刷新列表、汇总、详情和通知。 - 自动化编辑器:`事件 → 条件 → 动作 → 测试并发布`;发布前可运行样例事件测试。 - 通知送达与已读是独立维度;失败记录必须可见失败原因与重试入口。 - 所有异步区域覆盖加载、空、错误、重试与陈旧数据保留状态。 ## 响应式与无障碍 - `>= 1180px`:表格 + 常驻 inspector。 - `768–1179px`:表格全宽,详情用覆盖式 side sheet。 - `< 768px`:事件行列表 + 全高 detail sheet;过滤器为 bottom sheet。 - 焦点环使用 2px 主色外框;状态不只依赖颜色;图标按钮有可读标签。 - 支持键盘、200% 文本缩放、`prefers-reduced-motion`、安全区和长 VIN/中文文本换行。