132 lines
10 KiB
Markdown
132 lines
10 KiB
Markdown
# 用户端 App 最新参考产品设计说明 v1.1
|
||
|
||
## 1. 本次交付
|
||
|
||
- 交付目录：`doc/用户端APP-最新参考产品设计`。
|
||
- 共保留 49 个主编号页面组；“添加设备”包含三个并存流程，“智能角阀功能介绍”包含四个独立标签状态，“安全内容中心”包含五个独立分类状态，因此目录内共有 58 张 PNG 设计图。
|
||
- 本轮按用户最新要求执行：每种页面类型只生成一张，不再等待逐张选稿；后续按用户对具体图片的反馈定向修改。
|
||
- 本轮仅交付产品设计图片与说明文档，不修改 Flutter 代码，不把后续规划能力标记为已经上线。
|
||
|
||
## 2. 设计依据
|
||
|
||
新版设计同时对照以下三类资料：
|
||
|
||
1. 原产品设计：`doc/用户端APP-产品设计`。
|
||
2. 当前用户端 App：`apps/user_app` 中已经存在的登录、首页、商城、订单、钱包、地址、合同与工单能力。
|
||
3. 正式需求：`docs/03-用户端App需求.md` 中的首期边界与后续设备、安全、押金、消息、发票等能力。
|
||
4. 开发实施文档：`docs/项目文档_用户端APP全量功能开发_v1.0.md`，用于落实页面路由、UI 优化、接口、数据模型、测试与分阶段交付。
|
||
|
||
设计稿保留完整产品方向，但开发时必须继续区分“当前真实可用”和“等待 Client API 落地”两种状态。设备控制、安全事件、押金、消息、发票、收藏、紧急联系人、账户注销及完整售后等未落地能力，不得用静态成功页面冒充真实业务结果。
|
||
|
||
## 3. 视觉规范
|
||
|
||
- 主色：`#2563EB`。
|
||
- 背景：`#F7F8FA`。
|
||
- 成功色：`#16875D`。
|
||
- 警告色：`#B86400`。
|
||
- 危险色：`#C7352A`。
|
||
- 组件：白色卡片、1px 浅灰边框、10dp/12dp/16dp 圆角、4dp 基础间距网格、扁平线性图标。
|
||
- 导航：一级页面使用“首页、商城、订单、我的”四栏底部导航；二级页面使用返回导航，不重复放底栏。
|
||
- 禁止项：紫色、渐变、AI 元素、Emoji、玻璃拟态、三维装饰、发光、浏览器栏、手机外壳和系统状态栏。
|
||
- 安全原则：危险告警不可关闭；开阀必须经过在线、权限、告警和传感器校验；离线、超时或失败不得伪造成成功。
|
||
|
||
## 4. 页面清单
|
||
|
||
### 4.1 入口、首页与设备
|
||
|
||
| 文件 | 页面类型 | 关键功能 |
|
||
| --- | --- | --- |
|
||
| `01-登录页.png` | 登录 | 手机号验证码、密码登录、协议、记住状态、忘记密码 |
|
||
| `02-智能角阀功能介绍.png` | 首次安全宣导 | 功能介绍、安全案例、法规、安全注意事项与阅读确认 |
|
||
| `02-1-安全案例.png` | 安全案例标签 | 泄漏自动关阀案例、设备离线案例、处理过程与安全提醒 |
|
||
| `02-2-法律法规.png` | 法律法规标签 | 国家法规、国家标准、地方指引、平台规则与外链提示 |
|
||
| `02-3-气价信息.png` | 气价信息标签 | 服务归属、气瓶规格价格、更新时间、押金与配送费说明 |
|
||
| `03-首页.png` | 首页 | 服务归属、安全公告、设备概览、快捷服务、四栏导航 |
|
||
| `04-智能角阀控制.png` | 角阀详情与控制 | 在线状态、遥测、安全检查、开关阀、命令结果入口 |
|
||
| `05-一键报修.png` | 报修提交 | 故障类型、语音、照片、联系人、地址、定位与紧急电话 |
|
||
| `06-1-扫码添加确认.png` | 扫码添加 | 扫码结果、设备校验、昵称、安装地址与确认绑定 |
|
||
| `06-2-蓝牙连接设备.png` | 蓝牙添加 | 附近设备、信号、权限、连接状态与失败引导 |
|
||
| `06-3-手动输入设备码.png` | 手动添加 | 设备码格式、编号位置、校验与其他添加方式 |
|
||
| `07-气瓶基本信息.png` | 气瓶信息 | 规格、钢瓶号、充装、制造、有效期、来源与异常提示 |
|
||
| `08-设备分组控制.png` | 设备分组 | 厨房/热水/暖气分组、全开全关、编辑删除与失败明细 |
|
||
| `09-安全告警与报警器.png` | 安全告警 | 报警器列表、在线状态、最近告警、测试、紧急电话 |
|
||
| `10-紧急联系人.png` | 紧急联系人 | 联系顺序、告警通知、查看/控制权限与编辑 |
|
||
|
||
### 4.2 商城、押金与购买
|
||
|
||
| 文件 | 页面类型 | 关键功能 |
|
||
| --- | --- | --- |
|
||
| `11-燃气商城.png` | 商城首页 | 搜索、分类、商品、收藏、购物车与库存状态 |
|
||
| `12-商品详情.png` | 商品详情 | 轮播主图、规格、配送、服务、押金、收藏与购买 |
|
||
| `13-购物车.png` | 购物车 | 单选全选、数量、失效商品、押金提示与结算 |
|
||
| `14-提交订单.png` | 商城结算 | 地址、配送时间、商品、费用、发票、备注和支付方式 |
|
||
| `15-我的收藏.png` | 收藏 | 分类、取消收藏、加入购物车与下架保留 |
|
||
| `16-押金管理.png` | 押金管理 | 押金汇总、使用中、退款中、已退回与规则 |
|
||
| `17-退瓶退押金.png` | 退瓶退款 | 气瓶选择、上门回收、状态确认、预计退款与审核规则 |
|
||
| `18-气瓶下单.png` | 气瓶购买 | 气站、规格数量、库存、配送时段、换气免重复押金 |
|
||
| `19-支付确认.png` | 支付 | 微信/支付宝/余额、支付密码、优惠与订单明细 |
|
||
|
||
### 4.3 订单、配送与售后
|
||
|
||
| 文件 | 页面类型 | 关键功能 |
|
||
| --- | --- | --- |
|
||
| `20-订单中心.png` | 订单中心 | 气瓶/商城/报修切换、状态筛选与常用操作 |
|
||
| `21-订单详情.png` | 订单详情 | 商品、费用、支付、合同、履约、人员、进度与售后 |
|
||
| `22-配送详情.png` | 配送详情 | 配送员、车辆资质、订单、受控联系与安全交付 |
|
||
| `23-配送轨迹.png` | 配送轨迹 | 最近位置、路线进度、预计时间、更新时间与历史节点 |
|
||
| `24-电子发票.png` | 发票申请 | 订单、可开票金额、抬头、税号、邮箱与申请状态 |
|
||
| `35-安全记录详情.png` | 安全事件 | 风险等级、自动关阀、证据、时间线、复检与不可删除 |
|
||
| `36-申请售后.png` | 售后申请 | 类型、原因、方案、图像/视频、联系人与退款审核 |
|
||
| `42-报修工单详情.png` | 报修详情 | 工单进度、故障证据、工程师、改期、记录与联系 |
|
||
| `48-服务评价.png` | 服务评价 | 总体/分项评分、标签、凭证与安全交付确认 |
|
||
| `49-预约安全巡检.png` | 巡检预约 | 服务内容、设备、日期时段、联系人、周期巡检与须知 |
|
||
|
||
### 4.4 个人中心、账户与消息
|
||
|
||
| 文件 | 页面类型 | 关键功能 |
|
||
| --- | --- | --- |
|
||
| `25-个人中心.png` | 个人中心 | 资料、钱包、订单、设备、安全家庭与常用功能入口 |
|
||
| `26-我的记录.png` | 记录中心 | 用气、设备、告警、报修、押金与发票统一追溯 |
|
||
| `27-用气统计.png` | 用气统计 | 日周月年、用气趋势、构成、安全趋势与明细 |
|
||
| `28-我的钱包.png` | 钱包 | 余额、押金、优惠券、充值、提现、账单与资金安全 |
|
||
| `29-地址管理.png` | 地址 | 默认地址、编辑、服务范围校验与新增 |
|
||
| `30-消息中心.png` | 消息 | 安全、订单、服务、公告、已读与跳转对象 |
|
||
| `31-设置.png` | 设置 | 账号、通知、权限、支付密码、协议、退出与注销入口 |
|
||
| `32-供气合同.png` | 合同 | 待签/生效/到期、查看、下载、变更与续签 |
|
||
| `33-家庭成员与设备共享.png` | 家庭共享 | 成员、设备、查看/控制权限、邀请与撤销 |
|
||
| `34-我的设备.png` | 设备总览 | 搜索、筛选、分组、在线/离线、快捷控制与添加 |
|
||
| `37-邀请注册.png` | 邀请注册 | 气站二维码、服务地址、服务关系与异常校验 |
|
||
| `38-余额充值.png` | 充值 | 套餐、自定义金额、渠道支付、限额与回调说明 |
|
||
| `39-余额提现.png` | 提现 | 到账卡、金额、手续费、支付密码、审核与受限资金 |
|
||
| `40-银行卡管理.png` | 银行卡 | 储蓄卡、默认到账卡、实名验证与解除绑定 |
|
||
| `41-个人资料.png` | 资料编辑 | 头像、昵称、手机号、认证、服务关系与默认地址 |
|
||
|
||
### 4.5 内容、安全设置与扩展能力
|
||
|
||
| 文件 | 页面类型 | 关键功能 |
|
||
| --- | --- | --- |
|
||
| `43-安全内容中心.png` | 内容中心 | 全部内容聚合、宣传、视频、法规、公告、外链风险与版本确认 |
|
||
| `43-1-安全宣传.png` | 安全宣传 | 宣传文章、阅读状态、分类筛选、专题学习与平台发布信息 |
|
||
| `43-2-安全视频.png` | 安全视频 | 推荐视频、视频分类、时长、阅读状态与继续学习 |
|
||
| `43-3-法律法规.png` | 法律法规 | 法规检索、适用层级筛选、版本与生效日期、外部链接风险提示 |
|
||
| `43-4-平台公告.png` | 平台公告 | 公告检索、类型筛选、重要公告、已读状态与所属气站/区域展示 |
|
||
| `44-自动关阀设置.png` | 定时关阀 | 规则、重复周期、提前提醒、执行记录与告警优先 |
|
||
| `45-电子保修卡.png` | 保修卡 | 保修状态、范围、服务商、维修记录与凭证 |
|
||
| `46-设备健康月报.png` | 健康月报 | 健康评分、在线率、异常、预测、来源与更新时间 |
|
||
| `47-安全知识考试.png` | 安全考试 | 题目、计时、进度、及格规则与危险题约束 |
|
||
|
||
## 5. 核心业务约束
|
||
|
||
- “扫码添加、蓝牙连接、手动输入”是并存方式，不是三选一视觉候选。
|
||
- 所属气站与服务配送点分开显示；无配送点时显示气站直接服务。
|
||
- 设备开阀、群组全开、定时控制都不能绕过高风险告警、设备离线和权限限制。
|
||
- 气瓶订单与普通商城订单共用支付能力，但气瓶订单必须保留气站、气瓶规格、换气、押金和预约时段规则。
|
||
- 商品金额、气瓶押金、配送费、优惠与可开票金额分别展示；押金不能作为普通商品收入开票。
|
||
- 配送位置必须展示最近更新时间；无有效位置时显示“暂未获取位置”，不伪造实时轨迹。
|
||
- 余额充值以支付渠道回调为准，提现与退款以服务端审核和资金流水为准。
|
||
- 用户、联系人、配送员、银行卡和证件信息使用脱敏展示。
|
||
|
||
## 6. 后续修改方式
|
||
|
||
用户可直接按文件名提出修改，例如“修改 `23-配送轨迹.png` 的地图占比”或“修改 `31-设置.png` 的通知分组”。每次修改只调整指定页面及其必要的关联说明，不重做已确认的其他图片。
|