backup: snapshot before optimization

2026-06-04 16:25:43 +08:00
commit ff2700c067
47 changed files with 3332 additions and 0 deletions
@@ -0,0 +1,117 @@
+var Timer = require('../../utils/timer')
+var storage = require('../../utils/storage')
+var planMod = require('../../utils/plan')
+var themeMod = require('../../utils/theme')
+
+Page({
+  data: {
+    theme: { primary: '#FF6B35', primaryLight: '#FF8C5A', primaryBg: '#FFF3ED', primaryRgb: '255,107,53' },
+    themeStyle: '',
+    duration: 60,
+    remaining: 60,
+    status: 'idle',
+    isRunning: false,
+    isPaused: false,
+    isCompleted: false,
+    overtime: 0,
+    todayTarget: 0,
+    planDay: 1,
+    isFreeMode: false
+  },
+
+  onLoad: function (options) {
+    themeMod.applyThemeToPage(this)
+
+    var target
+    var planDay = 1
+    var isFreeMode = false
+
+    if (options && options.free) {
+      target = parseInt(options.free) || 60
+      isFreeMode = true
+    } else {
+      var settings = storage.getSettings()
+      var records = []
+      var allRecords = storage.getRecords()
+      Object.keys(allRecords).forEach(function (key) {
+        records = records.concat(allRecords[key])
+      })
+
+      var plan = planMod.getPlan(settings.planId)
+      planDay = planMod.getPlanDay(settings.planId, records)
+      target = planMod.getTodayTarget(settings.planId, Math.min(planDay, plan.totalDays))
+    }
+
+    this.setData({
+      duration: target,
+      remaining: target,
+      todayTarget: target,
+      planDay: isFreeMode ? 0 : Math.min(planDay, 99),
+      isFreeMode: isFreeMode
+    })
+
+    var self = this
+    this._timer = new Timer({
+      onTick: function (tick) {
+        self.setData({
+          remaining: tick.remaining > 0 ? tick.remaining : 0,
+          overtime: tick.remaining <= 0 ? tick.elapsed - self.data.duration : 0
+        })
+      },
+      onComplete: function () {
+        self.setData({ status: 'completed', isCompleted: true })
+        if (storage.getSettings().vibrate) {
+          try { wx.vibrateLong() } catch (e) {}
+        }
+        wx.showToast({ title: '目标完成! 太棒了!', icon: 'success', duration: 2000 })
+      }
+    })
+  },
+
+  onUnload: function () {
+    if (this._timer) this._timer.stop()
+  },
+
+  onStart: function () {
+    if (this.data.isPaused) {
+      this._timer.resume()
+      this.setData({ isRunning: true, isPaused: false, status: 'running' })
+      return
+    }
+    if (this.data.isRunning) return
+    this._timer.start(this.data.duration)
+    this.setData({ isRunning: true, status: 'running' })
+  },
+
+  onPause: function () {
+    if (!this.data.isRunning || this.data.isPaused) return
+    this._timer.pause()
+    this.setData({ isPaused: true, status: 'paused' })
+  },
+
+  onStop: function () {
+    var self = this
+    wx.showModal({
+      title: '结束训练',
+      content: '确定要结束本次训练吗?',
+      success: function (res) {
+        if (res.confirm) self.finishTraining()
+      }
+    })
+  },
+
+  finishTraining: function () {
+    var elapsed = this._timer.stop()
+    var today = storage.getToday()
+    storage.saveRecord({
+      date: today,
+      duration: elapsed,
+      planId: storage.getSettings().planId,
+      day: this.data.planDay
+    })
+    storage.updateStreak(today)
+
+    wx.showToast({ title: '已记录 ' + elapsed + '秒', icon: 'none', duration: 1500 })
+    setTimeout(function () { wx.navigateBack() }, 1500)
+  }
+})
@@ -0,0 +1,6 @@
+{
+  "usingComponents": {
+    "progress-ring": "../../components/progress-ring/progress-ring"
+  },
+  "navigationBarTitleText": "训练中"
+}
@@ -0,0 +1,95 @@
+<view class="container timer-page" style="{{themeStyle}}">
+
+  <!-- 呼吸引导环 + 进度条 -->
+  <view class="ring-wrapper">
+    <view class="breathe-ring breathe-ring-1 {{status === 'running' ? 'fast' : ''}}"
+      wx:if="{{status !== 'completed'}}"></view>
+    <view class="breathe-ring breathe-ring-2 {{status === 'running' ? 'fast' : ''}}"
+      wx:if="{{status !== 'completed'}}"></view>
+    <view class="breathe-ring breathe-ring-3 {{status === 'running' ? 'fast' : ''}}"
+      wx:if="{{status !== 'completed'}}"></view>
+
+    <progress-ring
+      duration="{{duration}}"
+      remaining="{{isCompleted ? 0 : remaining}}"
+      size="{{360}}"
+      ringWidth="{{16}}"
+      status="{{status}}"
+      primaryColor="{{theme.primary}}"
+      primaryLightColor="{{theme.primaryLight}}"
+    ></progress-ring>
+
+    <!-- 完成庆祝粒子 -->
+    <view class="celebrate-burst" wx:if="{{isCompleted}}">
+      <view class="spark s1">✨</view>
+      <view class="spark s2">⭐</view>
+      <view class="spark s3">💫</view>
+      <view class="spark s4">🌟</view>
+      <view class="spark s5">✨</view>
+      <view class="spark s6">💪</view>
+    </view>
+
+    <view class="overtime-badge" wx:if="{{isCompleted && overtime > 0}}">
+      <text class="overtime-icon">🔥</text>
+      <text>+{{overtime}}s</text>
+    </view>
+  </view>
+
+  <!-- 状态提示 -->
+  <view class="hint-section">
+    <view class="hint-row" wx:if="{{status === 'idle'}}">
+      <text class="hint-emoji">🧘</text>
+      <text class="hint-text">
+        <block wx:if="{{isFreeMode}}">自由训练 · 目标 {{duration}} 秒</block>
+        <block wx:else>今日目标 {{duration}} 秒 · 第 {{planDay}} 天</block>
+      </text>
+    </view>
+    <view class="hint-row" wx:elif="{{status === 'running'}}">
+      <text class="hint-emoji running-pulse">💪</text>
+      <text class="hint-text running">保持姿势，核心收紧!</text>
+    </view>
+    <view class="hint-row" wx:elif="{{status === 'paused'}}">
+      <text class="hint-emoji">⏸</text>
+      <text class="hint-text paused">已暂停</text>
+    </view>
+    <view class="hint-row completed-hint" wx:elif="{{status === 'completed'}}">
+      <text class="hint-emoji completed-bounce">🎉</text>
+      <text class="hint-text completed">目标完成! 继续坚持!</text>
+    </view>
+  </view>
+
+  <!-- 控制按钮 -->
+  <view class="controls">
+    <button
+      wx:if="{{!isRunning && !isPaused}}"
+      class="ctrl-btn start-btn"
+      bindtap="onStart"
+    >
+      <text class="ctrl-icon">▶</text>
+      <text>开始</text>
+    </button>
+
+    <view class="ctrl-row" wx:if="{{isRunning || isPaused}}">
+      <button
+        wx:if="{{!isPaused}}"
+        class="ctrl-btn pause-btn"
+        bindtap="onPause"
+      >
+        <text class="ctrl-icon">⏸</text>
+        <text>暂停</text>
+      </button>
+      <button
+        wx:if="{{isPaused}}"
+        class="ctrl-btn resume-btn"
+        bindtap="onStart"
+      >
+        <text class="ctrl-icon">▶</text>
+        <text>继续</text>
+      </button>
+      <button class="ctrl-btn stop-btn" bindtap="onStop">
+        <text class="ctrl-icon">⏹</text>
+        <text>结束</text>
+      </button>
+    </view>
+  </view>
+</view>
@@ -0,0 +1,245 @@
+.timer-page {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: space-between;
+  padding-top: 80rpx;
+  padding-bottom: calc(170rpx + env(safe-area-inset-bottom));
+  min-height: 100vh;
+  box-sizing: border-box;
+}
+
+/* ---- ring wrapper ---- */
+.ring-wrapper {
+  position: relative;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+/* breathing guide rings — three concentric layers */
+.breathe-ring {
+  position: absolute;
+  border-radius: 50%;
+  border: 3rpx solid rgba(var(--primary-rgb), 0.15);
+  animation: breathePulse 3.5s ease-in-out infinite;
+  pointer-events: none;
+  z-index: 0;
+}
+
+.breathe-ring-1 {
+  width: 480rpx;
+  height: 480rpx;
+  animation-delay: 0s;
+}
+
+.breathe-ring-2 {
+  width: 400rpx;
+  height: 400rpx;
+  animation-delay: 0.5s;
+  border-color: rgba(var(--primary-rgb), 0.25);
+  border-width: 4rpx;
+}
+
+.breathe-ring-3 {
+  width: 320rpx;
+  height: 320rpx;
+  animation-delay: 1s;
+  border-color: rgba(var(--primary-rgb), 0.35);
+  border-width: 5rpx;
+}
+
+.breathe-ring.fast {
+  animation: breathePulseFast 1.4s ease-in-out infinite;
+}
+
+.breathe-ring.fast.breathe-ring-1 {
+  animation-delay: 0s;
+  border-color: rgba(var(--primary-rgb), 0.3);
+}
+
+.breathe-ring.fast.breathe-ring-2 {
+  animation-delay: 0.25s;
+  border-color: rgba(var(--primary-rgb), 0.45);
+}
+
+.breathe-ring.fast.breathe-ring-3 {
+  animation-delay: 0.5s;
+  border-color: rgba(var(--primary-rgb), 0.6);
+}
+
+/* celebration burst */
+.celebrate-burst {
+  position: absolute;
+  width: 520rpx;
+  height: 520rpx;
+  pointer-events: none;
+  z-index: 2;
+}
+
+.spark {
+  position: absolute;
+  font-size: 36rpx;
+  animation: sparkBurst 1s ease-out forwards;
+}
+
+.s1 { top: -10rpx; left: 50%; margin-left: -18rpx; animation-delay: 0s; }
+.s2 { top: 30rpx; right: -10rpx; animation-delay: 0.1s; }
+.s3 { bottom: -10rpx; right: 50rpx; animation-delay: 0.2s; }
+.s4 { bottom: 20rpx; left: 30rpx; animation-delay: 0.15s; }
+.s5 { top: 50%; right: -20rpx; animation-delay: 0.25s; }
+.s6 { top: -20rpx; left: 40rpx; animation-delay: 0.05s; }
+
+@keyframes sparkBurst {
+  0% {
+    opacity: 0;
+    transform: translate(0, 0) scale(0.3);
+  }
+  40% {
+    opacity: 1;
+    transform: translate(0, -30rpx) scale(1.3);
+  }
+  100% {
+    opacity: 0;
+    transform: translate(0, -80rpx) scale(0.4);
+  }
+}
+
+/* overtime badge */
+.overtime-badge {
+  position: absolute;
+  bottom: 10rpx;
+  left: 50%;
+  transform: translateX(-50%);
+  background: rgba(76, 175, 80, 0.12);
+  border: 2rpx solid rgba(76, 175, 80, 0.3);
+  color: var(--success);
+  padding: 8rpx 24rpx;
+  border-radius: 24rpx;
+  font-size: 28rpx;
+  font-weight: 600;
+  display: flex;
+  align-items: center;
+  gap: 6rpx;
+  animation: popIn 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
+}
+
+.overtime-icon {
+  font-size: 28rpx;
+  line-height: 1;
+}
+
+/* ---- hint section ---- */
+.hint-section {
+  margin-top: 36rpx;
+  text-align: center;
+}
+
+.hint-row {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  gap: 10rpx;
+}
+
+.hint-emoji {
+  font-size: 28rpx;
+  line-height: 1;
+}
+
+.running-pulse {
+  animation: float 1.5s ease-in-out infinite;
+}
+
+.completed-bounce {
+  animation: bounceSoft 0.6s ease infinite;
+}
+
+.hint-text {
+  font-size: 28rpx;
+  color: var(--text-secondary);
+  line-height: 1.3;
+}
+
+.hint-text.running {
+  color: var(--primary);
+  font-weight: 600;
+}
+
+.hint-text.paused {
+  color: var(--primary-light);
+}
+
+.hint-text.completed {
+  color: var(--success);
+  font-weight: 600;
+}
+
+.completed-hint {
+  animation: popIn 0.5s ease;
+}
+
+/* ---- controls ---- */
+.controls {
+  margin-top: 60rpx;
+  width: 100%;
+  display: flex;
+  justify-content: center;
+}
+
+.ctrl-btn {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  gap: 12rpx;
+  width: 300rpx;
+  height: 108rpx;
+  border-radius: 54rpx;
+  font-size: 36rpx;
+  font-weight: 600;
+  text-align: center;
+  border: none;
+  padding: 0;
+}
+
+.ctrl-btn:active {
+  transform: scale(0.94);
+}
+
+.ctrl-btn::after {
+  border: none;
+}
+
+.ctrl-icon {
+  font-size: 32rpx;
+  line-height: 1;
+}
+
+.start-btn {
+  background: linear-gradient(135deg, var(--primary), var(--primary-light));
+  color: #fff;
+  box-shadow: 0 8rpx 28rpx rgba(var(--primary-rgb), 0.35);
+}
+
+.pause-btn {
+  background: var(--primary-bg);
+  color: var(--primary);
+  margin-right: 28rpx;
+}
+
+.resume-btn {
+  background: linear-gradient(135deg, var(--primary), var(--primary-light));
+  color: #fff;
+  margin-right: 28rpx;
+  box-shadow: 0 8rpx 28rpx rgba(var(--primary-rgb), 0.35);
+}
+
+.stop-btn {
+  background: #F5F5F5;
+  color: var(--text-secondary);
+}
+
+.ctrl-row {
+  display: flex;
+  justify-content: center;
+}