工作/休息切换

本节目标

实现番茄工作法的核心节奏：25 分钟工作结束后，自动切换到 5 分钟休息；休息结束后，再回到工作模式。

告诉 AI

在聊天面板中输入：

给番茄时钟加上工作/休息切换功能。25 分钟工作结束后自动切换到 5 分钟休息，休息结束后再切换回 25 分钟工作。页面上要显示当前是"工作中"还是"休息中"的状态。

看看效果

接受更改，刷新浏览器。你应该能看到：

• 页面上多了一个状态提示，比如"工作中"或者"休息中"
• 倒计时从 25:00 开始，到 00:00 后自动切换为 05:00 并显示"休息中"

测试技巧

你不需要真的等 25 分钟来测试。可以让 AI 暂时把时间改短：

为了方便测试，暂时把工作时间改成 10 秒，休息时间改成 5 秒

测试完确认功能正常后，再让 AI 改回来：

测试没问题，把工作时间改回 25 分钟，休息时间改回 5 分钟

常见问题

切换后倒计时没有自动开始

告诉 AI：

工作时间结束后切换到了休息模式，但是倒计时没有自动开始，需要手动点"开始"。能不能让它自动继续？

状态文字没有变化

告诉 AI：

倒计时结束后时间虽然变了，但页面上的状态文字还是显示"工作中"，没有切换成"休息中"

想要更明显的切换提示

告诉 AI：

工作和休息切换的时候太不明显了，能不能在切换时改变页面的背景色？比如工作时红色调，休息时绿色调

下一步

功能已经完整了！你的番茄时钟可以计时、暂停、重置，还能自动切换工作和休息模式。下一节我们来让它变好看。