0003-web-page-information-architecture.md 3.3 KB


status: accepted

Web page information architecture

Web 驾驶舱的一级模式为总体概览、基础设施、运行监测、预警处置。切换一级模式时,中央一张图保持常驻;模式内的全部二级面板同时出现在左右两栏,不再使用 subview 或独立二级路由。

布局采用 A 四面板总览方案:顶栏 + 一级模式 + 左右各两块二级面板 + 中央一张图。四个一级模式都固定 4 个二级面板。总体概览为态势总览、基础设施、运行监测、预警设置;基础设施为基础档案、运行信息、管理信息、应急保障;运行监测为监测概览、监测分布、运行概况、监测点台账;预警处置为当前预警、历史分析、预警效率、预警分析。不把环境监测升格为二级面板。每个二级面板通过标题栏展开/收起;切换一级模式时重置为默认展开。同步实现 9 个共享地图/详情视图和 5 个预警/报警模式变体。首期视觉沿用深色指挥大屏、深中性背景和青色强调色;正式视觉资源由设计公司后续交付后替换。

模式与面板使用稳定英文键,中文只用于展示:

一级模式 mode 左栏上 左栏下 右栏上 右栏下
overview situationSummary infrastructureSummary monitoringSummary alertSettings
infrastructure archive operation management emergency
monitoring monitoringOverview monitoringDistribution operationOverview monitoringPointLedger
warningResponse currentEvents historyAnalysis responseEfficiency eventAnalysis

panelId 扁平且全局唯一,不带模式前缀;expandedPanelIds 即 panelId 字符串集合。中文标题由独立的 panelLabels 映射按 panelId 解析,业务逻辑不读中文。

加载、成功、空数据、字段缺失、数据过期、数据不可用、请求失败、无坐标等状态均为首期正式状态;详情分区必须能独立失败,不使用整页错误遮罩。当前事件列表默认 10-15 条,历史列表提供 7/30/90 天和自定义时间范围。工单只读展示 0–7 共八个状态:待派单、待接单、已接单、处理中、待验收、已结案、延期中、已取消;验收驳回表现为「待验收回退处理中」的动作轨迹。推进主线是 0→5,延期中(6) 与已取消(7) 都是路径外节点(6 是处理旁路、7 是终态),不接在主线上冒充下一步。

2026-09-29 修订(票 20):本节原写「工单只读展示七态:待派单…已取消;不展示延期」。两处已被后端权威枚举推翻:① 状态是 WorkOrderStatusEnum 的 0–7 八个码,旧的 1–7 七态让每一态错位一格(「已结案」曾标在码 6 上,而后端 6 是「延期中」、5 才是「已结案」);② 6 延期中是正式状态(后端 ACTIVE_CODES 含它、FINISHED_CODES 只含 5/7,类注释称其为「旁路」),不再是"不展示"的档位。前端唯一字典在 src/modules/cockpit/domain/workOrder.js。

UI 组件优先沿用当前 TvT.js 前端项目已有组件生态,首期 Fes Design / Naive UI;后续可按大屏定制需要调整,但不应为此重做页面信息架构。