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,93 @@
+var util = require('../../utils/util')
+
+Component({
+  properties: {
+    duration: { type: Number, value: 60 },
+    remaining: { type: Number, value: 60 },
+    size: { type: Number, value: 280 },
+    ringWidth: { type: Number, value: 14 },
+    status: { type: String, value: 'idle' },
+    primaryColor: { type: String, value: '#FF6B35' },
+    primaryLightColor: { type: String, value: '#FF8C5A' }
+  },
+
+  data: {
+    displayTime: '00:00',
+    statusText: '准备开始'
+  },
+
+  observers: {
+    'remaining, status, duration, size, ringWidth, primaryColor': function () {
+      var texts = { idle: '准备开始', running: '坚持住', paused: '已暂停', completed: '完成!' }
+      this.setData({
+        displayTime: util.formatTime(this.data.remaining),
+        statusText: texts[this.data.status] || ''
+      })
+      this._draw()
+    }
+  },
+
+  lifetimes: {
+    ready: function () {
+      var self = this
+      var query = this.createSelectorQuery()
+      query.select('#ringCanvas')
+        .fields({ node: true, size: true })
+        .exec(function (res) {
+          if (!res || !res[0] || !res[0].node) return
+          var canvas = res[0].node
+          var dpr = wx.getSystemInfoSync().pixelRatio || 2
+          var displaySize = self.data.size
+          canvas.width = displaySize * dpr
+          canvas.height = displaySize * dpr
+          self._ctx = canvas.getContext('2d')
+          self._dpr = dpr
+          self._draw()
+        })
+    }
+  },
+
+  methods: {
+    _draw: function () {
+      var ctx = this._ctx
+      if (!ctx) return
+
+      var size = this.data.size
+      var dpr = this._dpr
+      var ringWidth = this.data.ringWidth
+      var duration = this.data.duration
+      var remaining = this.data.remaining
+      var primaryColor = this.data.primaryColor
+
+      var w = size * dpr
+      var h = size * dpr
+      ctx.clearRect(0, 0, w, h)
+
+      var cx = w / 2
+      var cy = h / 2
+      var radius = (size - ringWidth) / 2 * dpr
+      var lw = ringWidth * dpr
+
+      // track ring
+      ctx.beginPath()
+      ctx.arc(cx, cy, radius, 0, Math.PI * 2)
+      ctx.strokeStyle = '#EEEEEE'
+      ctx.lineWidth = lw
+      ctx.lineCap = 'round'
+      ctx.stroke()
+
+      // progress arc (clockwise from 12 o'clock, represents remaining time)
+      var ratio = duration > 0 ? Math.max(0, Math.min(1, remaining / duration)) : 0
+      if (ratio > 0.001) {
+        var startAngle = -Math.PI / 2
+        var endAngle = startAngle + ratio * Math.PI * 2
+        ctx.beginPath()
+        ctx.arc(cx, cy, radius, startAngle, endAngle)
+        ctx.strokeStyle = primaryColor
+        ctx.lineWidth = lw
+        ctx.lineCap = 'round'
+        ctx.stroke()
+      }
+    }
+  }
+})
@@ -0,0 +1,4 @@
+{
+  "component": true,
+  "usingComponents": {}
+}
@@ -0,0 +1,7 @@
+<view class="ring-wrap" style="width: {{size}}rpx; height: {{size}}rpx;">
+  <canvas type="2d" id="ringCanvas" class="ring-canvas" style="width: {{size}}rpx; height: {{size}}rpx;"></canvas>
+  <view class="ring-center">
+    <text class="time-text">{{displayTime}}</text>
+    <text class="status-text">{{statusText}}</text>
+  </view>
+</view>
@@ -0,0 +1,37 @@
+.ring-wrap {
+  position: relative;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.ring-canvas {
+  position: absolute;
+  top: 0;
+  left: 0;
+}
+
+.ring-center {
+  position: absolute;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  z-index: 1;
+}
+
+.time-text {
+  font-size: 80rpx;
+  font-weight: 700;
+  color: var(--text);
+  font-variant-numeric: tabular-nums;
+  letter-spacing: 2rpx;
+  line-height: 1;
+}
+
+.status-text {
+  font-size: 28rpx;
+  color: var(--text-secondary);
+  margin-top: 10rpx;
+  line-height: 1;
+}