运营管理后台页面清单
UI/UX设计注意事项
屏幕适配
- 目标设备：PC端管理后台，推荐分辨率 1920×1080，最小支持 1280×720
- 布局结构：左侧固定导航栏（宽度 220px），右侧主内容区域（flex: 1），顶部可选header区域
- 内容区域：表格、表单、标签页等标准企业后台组件，内容区宽度自适应，最大不超过屏幕宽度
- 滚动处理：内容区内部滚动，导航栏固定不滚动
- 响应式：在小屏幕上左侧导航可收缩为图标模式
UI/UX设计注意事项
- 目标用户：运营人员、客服人员、系统管理员
- 设计理念：专业、简洁、功能导向 - 注重效率和清晰度
- 渐进式披露：先展示必要信息，需要时再展开详情
- 关键原则：
- 采用美国企业用户熟悉的标准后台仪表盘模式
- 清晰的数据表格，支持排序和筛选
- 一致的操作按钮和表单布局
- 清晰的状态指示和反馈信息
- 语言：页面中显示的按钮、标签、提示等UI文字使用英文，应用描述保持中文
页面清单
| 序号 | 页面名称 | 界面排版描述 | 前端交互描述 | 接口交互描述 |
|---|---|---|---|---|
| 1 | 登录页 | 页面居中登录卡片，包含Logo、Username输入框、Password输入框、"Login"按钮 | 输入用户名密码点击Login，后端验证后返回Token并跳转首页；登录失败显示错误提示 | POST /api/admin/auth/login |
| 2 | 首页/仪表盘 | 顶部显示系统标题和当前登录用户信息，左侧固定导航栏，右侧主内容区显示关键指标卡片（Total Users、Online Devices、Today's Alerts、Pending Events），底部显示最近预警事件列表 | 点击指标卡片可跳转对应详情页；点击最近事件进入事件详情 | GET /api/admin/dashboard 获取仪表盘数据 |
| 3 | 家属用户列表页 | 顶部标题"Family User Management"，搜索栏（支持按手机号搜索），用户数据表格（列：ID、Phone、Register Time、Linked Families、Status），分页组件 | 输入手机号搜索；点击行查看详情；在表格中进行启用/禁用操作 | GET /api/admin/user/list 获取用户列表；GET /api/admin/user/:id 获取用户详情 |
| 4 | 家庭与老人档案管理页 | 顶部标题"Family Management"，搜索栏（支持按Family ID/老人姓名搜索），家庭列表表格（列：Family ID、Elder Name、Emergency Contact Count、Device Count、Status），点击行可展开显示详细信息 | 搜索家庭；点击行查看/编辑家庭档案；编辑保存后更新 | GET /api/admin/family/list 获取家庭列表；GET /api/admin/family/:id 获取详情；PUT /api/admin/family/:id 更新档案 |
| 5 | 设备列表与状态页 | 顶部标题"Device Management"，搜索栏（支持按Device ID/设备类型/所属家庭搜索），设备表格（列：Device ID、Device Type、Assigned Family、Online Status、Last Online Time、Binding Time），状态筛选器（All/Online/Offline） | 搜索和筛选设备；点击行查看设备详情；下拉刷新获取最新状态 | GET /api/admin/device/list 获取设备列表；GET /api/admin/device/:id 获取设备详情 |
| 6 | 设备解绑/换绑页 | 顶部标题"Device Unbind/Rebind"，表单区域：Device ID输入/选择，Target Family选择（换绑时），操作类型单选（Unbind/Rebind），二次确认弹窗区域 | 输入Device ID或从列表选择；选择Target Family；点击Confirm弹出二次确认框；确认后执行操作并记录审计日志 | POST /api/admin/device/unbind 设备解绑；POST /api/admin/device/rebind 设备换绑 |
| 7 | 预警事件总览列表页 | 顶部标题"Alerts"，筛选栏（Time Range、Alert Type、Alert Level、Status），事件表格（列：Event ID、Type、Level、Time、Family ID、Status），分页组件 | 选择筛选条件刷新列表；点击行进入事件详情；支持导出CSV | GET /api/admin/alert/list 获取预警列表；GET /api/admin/alert/count 获取统计数 |
| 8 | 预警事件详情与时间线页 | 顶部返回按钮和Event ID，事件概要区域（Type、Level、Time、Family Info），时间线区域（前后30分钟内的设备状态、指标数据、交互记录按时间倒序排列），底部操作按钮（Mark Processed、Mark False Alarm、Add Note） | 查看事件详情和时间线；点击标记处理/误报；点击Add Note输入备注内容；点击Export Evidence | GET /api/admin/alert/:id/detail 获取详情；GET /api/admin/alert/:id/timeline 获取时间线；POST /api/admin/alert/:id/handle 处理事件；POST /api/admin/alert/:id/remark 添加备注 |
| 9 | 证据包导出页 | 顶部标题"Export Evidence"，事件信息摘要，导出格式选择（PDF），Export按钮 | 选择导出格式后点击Export，后端生成PDF返回下载 | POST /api/admin/alert/:id/export 生成导出文件 |
| 10 | 消息推送创建页 | 顶部标题"Create Push"，推送目标选择（All Users/Specific Family），消息内容编辑区（Title+Body），发送时间选择（Send Now/Schedule），Preview，Confirm Send按钮 | 选择推送目标和时间；编辑消息内容；点击Preview查看效果；点击Confirm Send发送 | POST /api/admin/message/create 创建推送任务 |
| 11 | 消息推送记录页 | 顶部标题"Push History"，推送历史表格（列：Push ID、Target Scope、Title、Send Time、Status、Read Count），详情展开查看 | 查看历史推送记录；点击查看详情 | GET /api/admin/message/history 获取推送历史 |
| 12 | 关怀话术模板管理页 | 顶部标题"Script Templates"，模板列表（显示Name、Type、Last Update Time），Add/Edit/Delete/Version按钮 | 点击Add创建新话术；点击Edit修改；点击Version查看历史版本；支持版本对比和回滚 | GET /api/admin/template/care/list 获取话术列表；POST /api/admin/template/care 创建；PUT /api/admin/template/care/:id 更新；GET /api/admin/template/care/:id/versions 获取版本历史 |
| 13 | 提醒模板管理页 | 顶部标题"Reminder Templates"，模板列表（显示ID、Name、Type、Scenario），Add/Edit/Delete按钮 | 点击Add创建新模板；点击Edit修改；点击Delete确认后删除 | GET /api/admin/template/reminder/list 获取提醒模板列表；POST /api/admin/template/reminder 创建；PUT /api/admin/template/reminder/:id 更新；DELETE /api/admin/template/reminder/:id 删除 |
| 14 | 生理指标阈值配置页 | 顶部标题"Alert Threshold Config"，指标类型选择（Heart Rate/Blood Oxygen/Activity等），阈值表单（Normal Range、Low Risk、High Risk），Save按钮 | 选择指标类型；设置阈值范围；点击Save | GET /api/admin/config/threshold 获取阈值配置；PUT /api/admin/config/threshold 更新阈值 |
| 15 | 节律缺失规则配置页 | 顶部标题"Rhythm Rule Config"，规则列表（显示Name、Trigger Condition、Alert Level），Add/Edit/Delete按钮 | 点击Add创建新规则；设置触发条件（如连续X天未在Y区域检测到活动）；点击Save | GET /api/admin/config/rhythm 获取节律规则；POST /api/admin/config/rhythm 创建规则；PUT /api/admin/config/rhythm/:id 更新规则 |
| 16 | 配置灰度发布页 | 顶部标题"Config Release"，选择配置类型（Script/Threshold/Rhythm），Version选择，生效范围选择（All Families/Pilot Families），Release/Rollback按钮 | 选择配置和版本；选择目标家庭；点击Release；支持回滚到旧版本 | POST /api/admin/config/publish 发布配置；POST /api/admin/config/rollback 回滚配置 |
| 17 | 系统日志查询页 | 顶部标题"System Logs"，筛选栏（Family ID/Device ID/Time Range/Log Type），日志表格（列：Time、Log Type、Device ID、Description），分页组件，支持导出CSV | 选择筛选条件查询；点击Export CSV | GET /api/admin/log/system 获取系统日志；POST /api/admin/log/export 导出日志 |
| 18 | 用户数据导出页 | 顶部标题"Data Export"，Family ID输入框，导出范围选择（All/Partial data types），Confirm Export按钮，二次确认弹窗 | 输入目标Family ID；选择导出数据范围；确认后后端打包数据返回下载链接 | POST /api/admin/data/export 执行数据导出 |
| 19 | 用户数据删除页 | 顶部标题"Data Delete"，Family ID输入框，删除范围选择，Confirm Delete按钮，二次确认弹窗（高风险操作警示） | 输入目标Family ID；确认删除操作；执行后返回成功提示；操作记入审计日志 | POST /api/admin/data/delete 执行数据删除 |
| 20 | 试点运营看板页 | 顶部标题"Pilot Operations Dashboard"，关键指标卡片（Device Online Rate、Fall Events、False Alarm Rate、Luma Interaction Frequency、Ritual Compliance Rate、High Risk Families），趋势图表（7/30天），家庭列表（显示关键指标和标记） | 查看聚合指标；点击指标下钻到家庭详情；点击家庭进入单户报告；点击Export PDF | GET /api/admin/pilot/dashboard 获取试点看板数据；GET /api/admin/pilot/family/:id 获取家庭详情 |
| 21 | 单户详情报告页 | 顶部返回按钮和家庭信息，指标卡片（Online Time、Alert Count、False Alarm Rate、Interaction Frequency），时间线图表，Export PDF按钮 | 查看单户详细数据；点击Export PDF | GET /api/admin/pilot/family/:id/report 获取单户报告；POST /api/admin/pilot/family/:id/report/export 导出报告 |
| 22 | 角色权限管理页 | 顶部标题"Role Management"，角色列表（显示Name、Description、Permission Count），Add/Edit/Delete按钮 | 点击Add创建角色；点击Edit分配菜单/操作权限；点击用户列表为用户分配角色 | GET /api/admin/role/list 获取角色列表；POST /api/admin/role 创建角色；PUT /api/admin/role/:id 更新角色；DELETE /api/admin/role/:id 删除角色 |
| 23 | 管理员账户管理页 | 顶部标题"Admin Accounts"，管理员列表表格（列：Username、Role、Last Login、Status），Add/Enable/Disable/Reset Password按钮 | 点击Add创建管理员；点击Disable/Enable切换状态；点击Reset Password发送重置邮件 | GET /api/admin/admin/list 获取管理员列表；POST /api/admin/admin 创建管理员；PUT /api/admin/admin/:id 更新管理员 |
| 24 | 操作审计日志页 | 顶部标题"Audit Logs"，筛选栏（Operator/Time Range/Action Type），审计日志表格（列：Time、Operator、IP、Action Type、Target、Details），分页组件，支持导出CSV | 选择筛选条件查询；点击Export CSV | GET /api/admin/audit/log 获取审计日志；POST /api/admin/audit/export 导出日志 |
| 25 | 配置版本管理页 | 顶部标题"Config Version Management"，配置类型选择，版本历史列表（Version、Time、Status、Notes），Compare、Release、Rollback按钮 | 选择配置类型查看版本历史；选择两个版本进行对比；选择版本Release或Rollback | GET /api/admin/config/version/list 获取版本列表；POST /api/admin/config/version/compare 版本对比；POST /api/admin/config/version/publish 发布版本 |