51 lines
1.8 KiB
Markdown
51 lines
1.8 KiB
Markdown
# Device Binding Home Implementation Plan
|
|
|
|
> **For agentic workers:** REQUIRED SUB-SKILL: Use superpowers:subagent-driven-development (recommended) or superpowers:executing-plans to implement this plan task-by-task. Steps use checkbox (`- [ ]`) syntax for tracking.
|
|
|
|
**Goal:** 将首页实现为带扫码和蓝牙占位交互的设备绑定页。
|
|
|
|
**Architecture:** 保持单页实现，使用本地 `useState` 管理设备数量、蓝牙搜索状态、搜索结果和绑定结果。扫码和蓝牙优先调用 Taro 小程序能力，在无法完成真实设备搜索时使用轻量前端兜底数据维持流程闭环。
|
|
|
|
**Tech Stack:** Taro 4、React 18、TypeScript、SCSS
|
|
|
|
---
|
|
|
|
### Task 1: 更新首页交互逻辑
|
|
|
|
**Files:**
|
|
- Modify: `src/pages/index/index.tsx`
|
|
|
|
- [ ] 定义设备绑定页所需的本地状态：设备数量、蓝牙状态、搜索结果、最近绑定设备
|
|
- [ ] 实现扫码按钮逻辑，调用 `Taro.scanCode`
|
|
- [ ] 实现蓝牙搜索流程，串联授权、蓝牙适配器、设备发现和占位兜底
|
|
- [ ] 实现设备列表点击绑定逻辑
|
|
- [ ] 为未完成的登录、设备列表、底部导航保留 Toast 占位
|
|
|
|
### Task 2: 更新首页视觉样式
|
|
|
|
**Files:**
|
|
- Modify: `src/pages/index/index.scss`
|
|
|
|
- [ ] 调整顶部区域、功能按钮、权限卡片和底部导航样式
|
|
- [ ] 新增蓝牙状态区、设备结果列表、成功提示区样式
|
|
- [ ] 保持深色背景与参考图一致的视觉方向
|
|
|
|
### Task 3: 更新项目说明
|
|
|
|
**Files:**
|
|
- Modify: `README.md`
|
|
|
|
- [ ] 更新首页说明为设备绑定页
|
|
- [ ] 补充扫码和蓝牙交互当前已实现的范围
|
|
- [ ] 说明蓝牙功能更适合真机调试
|
|
|
|
### Task 4: 验证
|
|
|
|
**Files:**
|
|
- Modify: `src/pages/index/index.tsx`
|
|
- Modify: `src/pages/index/index.scss`
|
|
- Modify: `README.md`
|
|
|
|
- [ ] 运行 `npm run build:weapp`
|
|
- [ ] 确认构建通过且没有新增依赖问题
|