iot-bedroom-environment-controller/微信小程序源码/iot-home/.codebuddy/plans/添加闹钟设置功能_1e8354f9.md

name, overview, design, todos

name	overview	design	todos
添加闹钟设置功能	在模式设置tab中添加三个闹钟时间设置功能，支持时分设置、开关启用/禁用、以及通过MQTT下发控制指令到设备端。	architecture styleKeywords fontSystem colorSystem component tdesign 简洁 卡片式 列表 fontFamily heading subheading body PingFang SC size weight 16px 500 size weight 14px 400 size weight 14px 400 primary background text functional #1989fa #f7f8fa #ffffff #323233 #969799 #07c160 #ee0a24	id content status add-alarm-data 在homeContril.js中添加3个闹钟的数据定义 completed id content status dependencies add-alarm-ui 在homeContril.wxml"模式设置"tab中添加闹钟设置UI completed add-alarm-data id content status dependencies add-alarm-handlers 在homeContril.js中添加闹钟时间选择和开关事件处理 completed add-alarm-data id content status dependencies add-alarm-parse 在parseESP32Data中添加闹钟状态解析 completed add-alarm-handlers

产品概述

在"模式设置"Tab中添加闹钟设置功能，支持3个闹钟的配置，每个闹钟包含时间和启用状态。

核心功能

• 3个独立闹钟设置（闹钟1、闹钟2、闹钟3）
• 每个闹钟可设置时间（时:分）
• 每个闹钟可启用/禁用
• 闹钟设置通过MQTT控制指令下发到设备
• 保持与现有代码风格一致，使用Vant Weapp组件

技术栈

• 微信小程序原生框架
• Vant Weapp UI组件库
• MQTT通信协议

实现方案

在现有homeContril.js和homeContril.wxml基础上扩展：

1. 数据模型：添加3个闹钟的状态数据（时间、启用状态）
2. UI界面：使用van-cell-group和van-cell构建闹钟列表，每个闹钟包含：

• 时间选择器（使用picker组件）
• 开关控制启用/禁用

3. 控制指令：复用现有的sendControlCommand方法，发送格式：

{"alarm1_time": "07:30", "alarm1_enable": true, "alarm2_time": "08:00", ...}

4. 设备数据解析：在parseESP32Data中解析设备上报的闹钟状态

目录结构

pages/homeControl/
├── homeContril.wxml  # [MODIFY] 在"模式设置"tab添加闹钟设置UI
├── homeContril.js    # [MODIFY] 添加闹钟数据定义和事件处理
└── homeContril.wxss  # [MODIFY] 添加闹钟样式（如需要）

设计内容

在"模式设置"Tab中实现3个闹钟设置卡片，每个卡片包含：

• 左侧：闹钟图标+编号（闹钟1/2/3）
• 中间：时间显示（点击弹出时间选择器）
• 右侧：启用/禁用开关

使用Vant Weapp的van-cell-group组织布局，保持与"传感器数据"tab一致的设计风格。