65 lines
1.9 KiB
Markdown
65 lines
1.9 KiB
Markdown
# 设备绑定首页设计说明
|
||
|
||
**日期:** 2026-05-07
|
||
|
||
## 目标
|
||
|
||
把首页调整为“设备绑定首页(无设备状态)”,并在不接入真实后端接口的前提下,补齐扫码绑定、蓝牙搜索、权限提示和底部导航的前端交互骨架。
|
||
|
||
## 范围
|
||
|
||
- 保留当前单页结构,不新增独立页面
|
||
- 使用 `Taro + React + TypeScript`
|
||
- 扫码使用 `Taro.scanCode`
|
||
- 蓝牙流程优先调用小程序蓝牙相关 API
|
||
- 蓝牙搜索结果允许使用前端占位数据兜底,方便开发阶段演示流程
|
||
- 不接入真实后端接口,不保存真实绑定关系
|
||
|
||
## 页面结构
|
||
|
||
- 顶部区:登录按钮、设备标题、设备数量、添加入口
|
||
- 功能区:扫码添加设备、蓝牙搜索设备
|
||
- 状态区:蓝牙搜索状态、搜索结果列表、绑定成功提示
|
||
- 权限提示区:展示绑定前注意事项
|
||
- 底部导航:首页、报告、小e、消息、我的
|
||
|
||
## 交互设计
|
||
|
||
### 扫码绑定
|
||
|
||
1. 点击“扫码 添加新设备”
|
||
2. 调用扫码能力
|
||
3. 从扫码结果中提取设备编码
|
||
4. 弹出“查询中”提示
|
||
5. 用本地状态模拟绑定成功,并把设备数量更新为 `1`
|
||
|
||
异常处理:
|
||
|
||
- 用户取消扫码:提示已取消
|
||
- 扫码失败:提示二维码无法识别或扫码失败
|
||
- 权限不足:提示前往系统设置开启相机权限
|
||
|
||
### 蓝牙绑定
|
||
|
||
1. 点击“蓝牙搜附近的设备”
|
||
2. 检查定位授权状态
|
||
3. 尝试申请定位授权
|
||
4. 打开蓝牙适配器
|
||
5. 开始搜索附近蓝牙设备
|
||
6. 展示“搜索中”状态
|
||
7. 收集搜索结果;如果短时间内没有结果,显示前端占位设备列表
|
||
8. 点击设备项后执行绑定成功流程
|
||
|
||
异常处理:
|
||
|
||
- 未开启定位或授权失败:提示开启定位权限
|
||
- 蓝牙不可用:提示开启系统蓝牙
|
||
- 未发现设备:展示空状态提示
|
||
|
||
## 实现边界
|
||
|
||
- 只修改首页和文档
|
||
- 不新增全局状态管理
|
||
- 不新增依赖
|
||
- 不删除任何目录或批量删除任何文件
|