「图片1」### 顶部导航栏 - 左侧：返回箭头 `<` -… - 图片创意预览

「图片1」### 顶部导航栏 - 左侧：返回箭头 `<` -…

「图片1」### 顶部导航栏 - 左侧：返回箭头 `<` - 中间标题：**告警** - 右侧：更多菜单图标 `⋯` ### 2. 顶部 Tab 标签栏 当前页面处于告警管理相关模块，Tab

用户头像

spirittrap

2026.07.14
「图片1」## 顶部全局导航栏（页面最顶端） 1. 左侧：返回箭头按钮，可退回上一级设备列表页 2. 中间横向三标签（页面一级路由） - 设备档案（当前所属大模块，蓝色下划线高亮） - 设备物联 - 数据统计 3. 右侧：刷新图标，一键刷新全页面设备实时数据 ## 二、顶部简易实时物联数据栏（导航下方） 折叠简化版数据卡片，双栏展示设备核心运行状态： - 左栏：在线状态 → 在线 - 右栏：运行模式 → 制冷 完整数据需在「设备物联」标签页查看详情。 ## 三、二级功能 Tab 标签栏（页面子路由切换） 横向 7 个分类标签，蓝色下划线代表当前激活页面「生命周期」，所有设备管理功能全部收拢在此： 1. 控制：设备远程操控（开关、温度、模式调节） 2. 概览：设备基础参数总览 3. 动态：设备实时运行消息推送 4. 维保：保养工单、维保计划 5. 巡检：定期巡检任务与记录 6. 告警：设备异常告警清单、处置记录 7. 生命周期（当前页）：设备全流程时间线档案 ## 四、核心区域：生命周期时间轴列表模块 ### 模块基础框架 左侧垂直**时间轴引导线** + 右侧独立事件卡片，每条事件左侧搭配对应功能图标区分业务类型，按时间由远到近从上至下排序。 ### 单条事件卡片统一字段模板 每条生命周期记录固定包含： 1. 事件标题（设备编号 + 业务类型：SB-CAMERA-0001 XXX） 2. 精确发生时间（年 - 月 - 日 时分秒） 3. 多组明细键值对（内容 / 位置 / 操作人员 / 投运状态等，随业务类型动态变化） ### 页面已展示 4 条生命周期节点（时间由早到晚） 1. **设备建档（2025-12-22）** 图标：档案文件；内容：录入设备基础参数，操作人：超级管理员 2. **设备投运（2026-01-21）** 图标：播放启动；完成联调正式上线，绑定安装位置暖通演示楼 2F 东侧 3. **巡检复核（2026-03-22）** 图标：勾选清单；季度巡检，核对设备运行参数 4. **维保记录（2026-04-11）** 图标：维修扳手；页面仅展示标题与时间，完整明细需下滑查看帮我设计APP「图片1」## 顶部全局导航栏（页面最顶端） 1. 左侧：返回箭头按钮，可退回上一级设备列表页 2. 中间横向三标签（页面一级路由） - 设备档案（当前所属大模块，蓝色下划线高亮） - 设备物联 - 数据统计 3. 右侧：刷新图标，一键刷新全页面设备实时数据 ## 二、顶部简易实时物联数据栏（导航下方） 折叠简化版数据卡片，双栏展示设备核心运行状态： - 左栏：在线状态 → 在线 - 右栏：运行模式 → 制冷 完整数据需在「设备物联」标签页查看详情。 ## 三、二级功能 Tab 标签栏（页面子路由切换） 横向 7 个分类标签，蓝色下划线代表当前激活页面「生命周期」，所有设备管理功能全部收拢在此： 1. 控制：设备远程操控（开关、温度、模式调节） 2. 概览：设备基础参数总览 3. 动态：设备实时运行消息推送 4. 维保：保养工单、维保计划 5. 巡检：定期巡检任务与记录 6. 告警：设备异常告警清单、处置记录 7. 生命周期（当前页）：设备全流程时间线档案 ## 四、核心区域：生命周期时间轴列表模块 ### 模块基础框架 左侧垂直**时间轴引导线** + 右侧独立事件卡片，每条事件左侧搭配对应功能图标区分业务类型，按时间由远到近从上至下排序。 ### 单条事件卡片统一字段模板 每条生命周期记录固定包含： 1. 事件标题（设备编号 + 业务类型：SB-CAMERA-0001 XXX） 2. 精确发生时间（年 - 月 - 日 时分秒） 3. 多组明细键值对（内容 / 位置 / 操作人员 / 投运状态等，随业务类型动态变化） ### 页面已展示 4 条生命周期节点（时间由早到晚） 1. **设备建档（2025-12-22）** 图标：档案文件；内容：录入设备基础参数，操作人：超级管理员 2. **设备投运（2026-01-21）** 图标：播放启动；完成联调正式上线，绑定安装位置暖通演示楼 2F 东侧 3. **巡检复核（2026-03-22）** 图标：勾选清单；季度巡检，核对设备运行参数 4. **维保记录（2026-04-11）** 图标：维修扳手；页面仅展示标题与时间，完整明细需下滑查看帮我设计APP
spirittrapspirittrap
参考原图的清新简约UI设计风格，生成设备运维APP首页界面： 1. 顶部状态栏：显示时间15:28，包含移动信号、WiFi和电量图标 2. 用户信息区：头像是紫色圆形标识，内含"超"字，账号名"超级管理员"，所属部门"技术部・设备运维组"，右上角有搜索按钮和消息通知按钮，消息按钮带红色角标显示"18" 3. 核心运行数据概览区：3张并列数据卡片，蓝色主题设备卡片显示"在线设备：18/21台 故障设备：3台"，绿色主题安全卡片显示"AI值守摄像头：12路 今日安全事件：2起"，橙色主题能耗卡片显示"今日用能：1,284 kWh 碳排量：0.73 t" 4. 常用功能入口区：2行4列宫格布局，共8个功能入口：第一行从左到右：设备管理、设备体检、楼宇态势、设备处置；第二行从左到右：设备维保、AI值守、设备巡检、能耗管理 5. 业务提醒横幅区：分类标签"安全值守"，标题"AI摄像头布防提醒"，说明文字"核对重点区域摄像头在线与告警状态"，横向卡片横幅搭配监控场景背景图 6. 待办事项区：区域标题"待办事项"，右侧带"流程中心 >"跳转入口，第一条待办工单（设备维保类）状态"待处置"，工单名称"摄像头 CAM-023 年度维保"，明细"编号 WB260506010、类型 零星维修、对应设备 摄像头 - 1"，负责人"超级管理员"，创建时间"2026-05-26 11:19"，第二条仅露出"设备巡检"分类头部，内容被底部导航遮挡 7. 底部主导航栏：共5个Tab入口，当前停留在蓝色高亮的"首页"，依次是：首页（当前选中）、设备、紫蓝渐变圆形主快捷按钮、工作台（右上角红点未读提示）、我的 整体保持清新干净的现代UI设计风格，浅蓝渐变背景，信息分区清晰，层次分明参考原图的清新简约UI设计风格，生成设备运维APP首页界面： 1. 顶部状态栏：显示时间15:28，包含移动信号、WiFi和电量图标 2. 用户信息区：头像是紫色圆形标识，内含"超"字，账号名"超级管理员"，所属部门"技术部・设备运维组"，右上角有搜索按钮和消息通知按钮，消息按钮带红色角标显示"18" 3. 核心运行数据概览区：3张并列数据卡片，蓝色主题设备卡片显示"在线设备：18/21台 故障设备：3台"，绿色主题安全卡片显示"AI值守摄像头：12路 今日安全事件：2起"，橙色主题能耗卡片显示"今日用能：1,284 kWh 碳排量：0.73 t" 4. 常用功能入口区：2行4列宫格布局，共8个功能入口：第一行从左到右：设备管理、设备体检、楼宇态势、设备处置；第二行从左到右：设备维保、AI值守、设备巡检、能耗管理 5. 业务提醒横幅区：分类标签"安全值守"，标题"AI摄像头布防提醒"，说明文字"核对重点区域摄像头在线与告警状态"，横向卡片横幅搭配监控场景背景图 6. 待办事项区：区域标题"待办事项"，右侧带"流程中心 >"跳转入口，第一条待办工单（设备维保类）状态"待处置"，工单名称"摄像头 CAM-023 年度维保"，明细"编号 WB260506010、类型 零星维修、对应设备 摄像头 - 1"，负责人"超级管理员"，创建时间"2026-05-26 11:19"，第二条仅露出"设备巡检"分类头部，内容被底部导航遮挡 7. 底部主导航栏：共5个Tab入口，当前停留在蓝色高亮的"首页"，依次是：首页（当前选中）、设备、紫蓝渐变圆形主快捷按钮、工作台（右上角红点未读提示）、我的 整体保持清新干净的现代UI设计风格，浅蓝渐变背景，信息分区清晰，层次分明
spirittrapspirittrap
参考图片的清新浅蓝渐变天空白云、圆角卡片、青蓝渐变主色调、轻盈通透的APP界面风格，重新生成一个智慧园区设备管理APP页面，手机竖屏界面，顶部状态栏显示时间9:41和信号电量图标。 页面结构如下： 1. 顶部横向Tab栏：区分三大业务模块「设备」「安全」「能耗」，当前停留「设备」板块并高亮显示。 2. 顶部筛选信息栏（蓝色通栏卡片）： - 空间选择器：演示园区 / 1号楼 / 3层，带下拉箭头可切换楼栋楼层 - 运行等级：A级 - 数据更新时间：06-24 15:36 - 统计周期切换：今日 / 近7天 / 近30天，默认选中「今日」高亮 - 右上角有刷新按钮 3. 核心指标四宫格（关键KPI卡片，圆角白色卡片）： - 设备总数：126台，小字说明当前空间纳管全部设备数量 - 在线率：94.4%，小字标注较昨日上升1.2%（绿色向上箭头代表向好） - 故障设备：7台，小字标注其中2台待处理（红色警示，重点工单） - 离线设备：5台，小字标注最长离线时长41天（黄色预警） 4. 设备状态分布·环形饼图模块： - 标题：设备状态分布 - 环形饼图展示四类状态占比：在线119台（绿色主体）、维保中8台（橙色）、故障7台（红色）、离线5台（浅灰色） - 右侧图文对照图例说明 5. 设备事件趋势柱状图模块： - 标题：设备事件趋势（今日） - 不同颜色柱子区分事件类型，展示全天不同时段设备事件发生频次，红色柱体有明显峰值代表故障类事件集中时段 色彩预警体系：绿色代表正常向好，橙色代表维保提醒，红色代表故障高危，灰色代表离线闲置。整体保持参考图的清新柔和、圆角卡片、渐变色彩、轻盈通透的UI设计风格，界面简洁现代，数据清晰易读，符合运维人员浏览习惯。参考图片的清新浅蓝渐变天空白云、圆角卡片、青蓝渐变主色调、轻盈通透的APP界面风格，重新生成一个智慧园区设备管理APP页面，手机竖屏界面，顶部状态栏显示时间9:41和信号电量图标。 页面结构如下： 1. 顶部横向Tab栏：区分三大业务模块「设备」「安全」「能耗」，当前停留「设备」板块并高亮显示。 2. 顶部筛选信息栏（蓝色通栏卡片）： - 空间选择器：演示园区 / 1号楼 / 3层，带下拉箭头可切换楼栋楼层 - 运行等级：A级 - 数据更新时间：06-24 15:36 - 统计周期切换：今日 / 近7天 / 近30天，默认选中「今日」高亮 - 右上角有刷新按钮 3. 核心指标四宫格（关键KPI卡片，圆角白色卡片）： - 设备总数：126台，小字说明当前空间纳管全部设备数量 - 在线率：94.4%，小字标注较昨日上升1.2%（绿色向上箭头代表向好） - 故障设备：7台，小字标注其中2台待处理（红色警示，重点工单） - 离线设备：5台，小字标注最长离线时长41天（黄色预警） 4. 设备状态分布·环形饼图模块： - 标题：设备状态分布 - 环形饼图展示四类状态占比：在线119台（绿色主体）、维保中8台（橙色）、故障7台（红色）、离线5台（浅灰色） - 右侧图文对照图例说明 5. 设备事件趋势柱状图模块： - 标题：设备事件趋势（今日） - 不同颜色柱子区分事件类型，展示全天不同时段设备事件发生频次，红色柱体有明显峰值代表故障类事件集中时段 色彩预警体系：绿色代表正常向好，橙色代表维保提醒，红色代表故障高危，灰色代表离线闲置。整体保持参考图的清新柔和、圆角卡片、渐变色彩、轻盈通透的UI设计风格，界面简洁现代，数据清晰易读，符合运维人员浏览习惯。
1r98gbqoauWgptiQ-HB1r98gbqoauWgptiQ-HB
GD402244360GD402244360
设计小灵猫设计小灵猫
1q2rqdj61m-HB1q2rqdj61m-HB
GD193819676GD193819676
1q2rqdj61m-HB1q2rqdj61m-HB
用户k1pOHgi6用户k1pOHgi6
1ral85abp4tZPyWQ-HB1ral85abp4tZPyWQ-HB
爱上鲨鱼的人鱼112爱上鲨鱼的人鱼112
高德崇高德崇
高德崇高德崇
GD620174842GD620174842
1ral85abp4tZPyWQ-HB1ral85abp4tZPyWQ-HB
HeyСcHeyСc
GD435363940GD435363940
МойкомандирМойкомандир
МойкомандирМойкомандир
胖嘟嘟豆豆777胖嘟嘟豆豆777
GD402244360GD402244360
МойкомандирМойкомандир
GD193819676GD193819676
1q2c8q3vwt2k7u4q2-HB1q2c8q3vwt2k7u4q2-HB
1q2c8q3vwt2k7u4q2-HB1q2c8q3vwt2k7u4q2-HB