功能说明
实现小区IoT中控大屏前端页面，遵循设计架构并对接后端接口。
关联任务
- 依赖设计：[设计] iot大屏页面设计
- 依赖后端：[后端] iot大屏接口开发
- 关联测试：[测试-前端] iot大屏页面测试
页面架构（来自设计任务，必须一致）
IoTCommunityDashboard // 页面主容器
├── Header // 顶部抬头
│ ├── Title[小区IoT中控大屏]
│ └── StatusBar[时间/天气/在线状态]
├── NavBarBottom // 底部导航
│ ├── Tab[全景浏览]
│ ├── Tab[社区安全]
│ ├── Tab[运营管理]
│ └── Tab[监控录像]
├── MainArea // 主体区域
│ ├── SceneView[3D模型] // 中央3D模型
│ └── SidePanel // 侧边数据面板
│ ├── Panel[全景浏览]
│ │ ├── Card[数据总览]
│ │ ├── Search[房屋搜索]
│ │ └── List[配套设施]
│ ├── Panel[社区安全]
│ │ ├── Card[设备总览]
│ │ ├── Chart[设备类型分布]
│ │ ├── Board[报警统计]
│ │ └── List[报警滚动]
│ ├── Panel[运营管理]
│ │ ├── Chart[入住趋势]
│ │ ├── Chart[人员构成]
│ │ ├── Chart[车辆占比]
│ │ ├── List[异常通行]
│ │ ├── List[工单最新]
│ │ ├── List[投诉分析]
│ │ └── Table[值班排班]
│ └── Panel[监控录像]
│ ├── Grid[多画面播放器]
│ └── List[重点区域快捷]
└── FloatWidgets
├── Tooltip[模型点位详情]
└── MiniMap[快速定位]接口对接表
| 接口 | 后端任务 | 参数来源(控件) | 响应用途(展示) |
|---|---|---|---|
| GET /api/v1/community/overview | 全景数据总览 | communityId←全局 | 概况卡片 |
| GET /api/v1/community/buildings/{buildingId} | 楼栋详情 | buildingId←模型点选/搜索 | 楼栋卡片 |
| GET /api/v1/security/alerts | 实时报警与设备 | status←筛选 | 报警看板/滚动 |
| GET /api/v1/operation/analytics | 运营分析数据 | dateRange←时间筛选 | 趋势/列表 |
| GET /api/v1/monitor/streams | 监控流列表 | area,count←区域/布局 | 播放器流 |
控件交互实现（来自设计任务）
| 控件 | 事件 | 交互行为 | 调用接口 | 后续动作 |
|---|---|---|---|---|
| 底部Tab | click | 切换场景视图，更新侧边面板 | - | 状态切换面板可见性 |
| 房屋搜索框 | enter | 按房号搜索并定位模型 | GET /api/v1/community/buildings/{buildingId} | 更新模型高亮 |
| 模型楼栋点 | click | 展示楼栋详情卡片 | GET /api/v1/community/buildings/{buildingId} | 弹出卡片 |
| 设备类型图例 | click | 定位设备点位 | GET /api/v1/security/alerts | 模型高亮 |
| 报警列表项 | click | 定位报警点位 | - | 镜头跳转 |
| 报警状态筛选 | change | 切换报警状态统计与列表 | GET /api/v1/security/alerts | 刷新看板 |
| 运营时间筛选 | change | 刷新运营分析数据 | GET /api/v1/operation/analytics | 更新趋势 |
| 重点区域快捷 | click | 切换监控流 | GET /api/v1/monitor/streams | 更新播放器 |
| 多画面播放器单元 | click | 放大单画面 | - | 全屏显示 |
| 报警滚动暂停 | hover | 暂停滚动 | - | 停留展示 |
控件实现说明
底部Tab通过路由或状态切换，SceneView与SidePanel联动；房屋搜索触发接口后调用模型定位API；模型点选监听点击事件拉取详情；设备/报警筛选触发接口重新渲染图表与列表；监控快捷入口调用流接口并重载播放器；滚动列表支持hover暂停。
状态管理
- loading: 全局与模块级loading
- dataList/overview/buildingDetail/alerts/analytics/streams: 各模块数据
- pagination: 报警/列表分页
- searchParams: 状态筛选、时间筛选、区域选择