From d192769dbecca017312b7cc4bb5666b149fee156 Mon Sep 17 00:00:00 2001
From: cnliucheng <brokenway@163.com>
Date: Wed, 8 Jul 2026 11:37:25 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20timer=20=E5=AE=8C=E6=88=90=E5=85=A8?=
 =?UTF-8?q?=E5=B1=8F=E5=BD=A9=E5=B8=A6=E5=8A=A8=E7=94=BB=20(10=20=E6=9D=A1?=
 =?UTF-8?q?=E5=BD=A9=E8=89=B2=E7=A2=8E=E7=89=87=E9=A3=98=E8=90=BD)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 pages/timer/timer.wxml | 14 ++++++++++++++
 pages/timer/timer.wxss | 37 +++++++++++++++++++++++++++++++++++++
 2 files changed, 51 insertions(+)

diff --git a/pages/timer/timer.wxml b/pages/timer/timer.wxml
index 9fd8644..ddfe3c3 100644
--- a/pages/timer/timer.wxml
+++ b/pages/timer/timer.wxml
@@ -1,5 +1,19 @@
 <view class="container timer-page page-enter" style="{{themeStyle}}">
 
+  <!-- 全屏彩带完成庆祝 -->
+  <view class="confetti" wx:if="{{isCompleted}}">
+    <view class="confetti-piece c1"></view>
+    <view class="confetti-piece c2"></view>
+    <view class="confetti-piece c3"></view>
+    <view class="confetti-piece c4"></view>
+    <view class="confetti-piece c5"></view>
+    <view class="confetti-piece c6"></view>
+    <view class="confetti-piece c7"></view>
+    <view class="confetti-piece c8"></view>
+    <view class="confetti-piece c9"></view>
+    <view class="confetti-piece c10"></view>
+  </view>
+
   <!-- 呼吸引导环 + 进度条 -->
   <view class="ring-wrapper">
     <view class="breathe-ring breathe-ring-1 {{status === 'running' ? 'fast' : ''}}"
diff --git a/pages/timer/timer.wxss b/pages/timer/timer.wxss
index a4c08e3..a288696 100644
--- a/pages/timer/timer.wxss
+++ b/pages/timer/timer.wxss
@@ -139,3 +139,40 @@
   justify-content: center;
   align-items: center;
 }
+
+/* ---- full-screen confetti ---- */
+.confetti {
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 100vw;
+  height: 100vh;
+  pointer-events: none;
+  z-index: 9999;
+  overflow: hidden;
+}
+
+.confetti-piece {
+  position: absolute;
+  top: -20rpx;
+  width: 16rpx;
+  height: 32rpx;
+  border-radius: 4rpx;
+  animation: confettiFall 2.4s ease-out forwards;
+}
+
+.c1  { left: 10%;  background: #FF6B35; animation-delay: 0.00s; transform: rotate(15deg); }
+.c2  { left: 22%;  background: #FFD93D; animation-delay: 0.10s; transform: rotate(-20deg); }
+.c3  { left: 34%;  background: #4CAF50; animation-delay: 0.20s; transform: rotate(30deg); }
+.c4  { left: 46%;  background: #2979FF; animation-delay: 0.05s; transform: rotate(-10deg); }
+.c5  { left: 58%;  background: #EC407A; animation-delay: 0.15s; transform: rotate(45deg); }
+.c6  { left: 70%;  background: #7E57C2; animation-delay: 0.25s; transform: rotate(-30deg); }
+.c7  { left: 82%;  background: #FF8C5A; animation-delay: 0.08s; transform: rotate(20deg); }
+.c8  { left: 14%;  background: #5C9CFF; animation-delay: 0.18s; transform: rotate(-40deg); }
+.c9  { left: 38%;  background: #6EC072; animation-delay: 0.28s; transform: rotate(50deg); }
+.c10 { left: 90%;  background: #FFD93D; animation-delay: 0.12s; transform: rotate(-25deg); }
+
+@keyframes confettiFall {
+  0%   { opacity: 1; transform: translateY(0) rotate(0deg); }
+  100% { opacity: 0.6; transform: translateY(100vh) rotate(720deg); }
+}