From c435e6ae4ec04bc5a2a52b768d205f41a36cc7f6 Mon Sep 17 00:00:00 2001 From: long <452591453@qq.com> Date: Thu, 28 May 2026 14:33:31 +0800 Subject: [PATCH 1/7] Update main.js --- TUICallKit-Vue3/main.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/TUICallKit-Vue3/main.js b/TUICallKit-Vue3/main.js index f1d13fa0..5fd1d831 100644 --- a/TUICallKit-Vue3/main.js +++ b/TUICallKit-Vue3/main.js @@ -1,5 +1,5 @@ import App from './App' -var baseUrl ='https://css.zhenyangtang.com.cn/'; +var baseUrl ='https://admin.zhenyangtang.com.cn/'; // #ifndef VUE3 import Vue from 'vue' import './uni.promisify.adaptor' From 8d635bb7ed85eb476cc6a20f29327577477e919b Mon Sep 17 00:00:00 2001 From: long <452591453@qq.com> Date: Thu, 28 May 2026 15:10:06 +0800 Subject: [PATCH 2/7] update --- .../pages/components/grip-ring-canvas.vue | 98 +-- TUICallKit-Vue3/training/pages/grip-ring.vue | 802 ++++++++++++++---- 2 files changed, 680 insertions(+), 220 deletions(-) diff --git a/TUICallKit-Vue3/training/pages/components/grip-ring-canvas.vue b/TUICallKit-Vue3/training/pages/components/grip-ring-canvas.vue index a6361748..5e0f040b 100644 --- a/TUICallKit-Vue3/training/pages/components/grip-ring-canvas.vue +++ b/TUICallKit-Vue3/training/pages/components/grip-ring-canvas.vue @@ -23,7 +23,7 @@ - 点击开始 + {{ hintText || '点击开始' }} @@ -42,9 +42,12 @@ import CrushCanvas from './crush-canvas.vue' interface Props { bpm: number isPlaying: boolean + hintText?: string } -const props = defineProps() +const props = withDefaults(defineProps(), { + hintText: '点击开始', +}) const emit = defineEmits<{ togglePlay: [] @@ -78,25 +81,24 @@ defineExpose({ justify-content: center; position: relative; overflow: hidden; - /* 与页面背景一致,无可见边界 */ - background: #f8fafc; + background: linear-gradient(180deg, #f0fdfa 0%, #f8fafc 55%, #f1f5f9 100%); } -/* 环境氛围 - 中心大放射光晕,营造空间感 */ +/* 环境氛围 - 中心放射光晕 */ .ambient-glow { position: absolute; - width: 1400rpx; - height: 1400rpx; + width: 1200rpx; + height: 1200rpx; top: 50%; left: 50%; transform: translate(-50%, -50%); border-radius: 50%; background: radial-gradient(circle, - rgba(255, 255, 255, 1) 0%, - rgba(241, 245, 249, 0.6) 25%, - rgba(226, 232, 240, 0.3) 50%, - transparent 75%); + rgba(204, 251, 241, 0.9) 0%, + rgba(240, 253, 250, 0.5) 30%, + rgba(241, 245, 249, 0.2) 55%, + transparent 72%); pointer-events: none; } @@ -105,8 +107,8 @@ defineExpose({ * ============================================================ */ .ring-container { position: relative; - width: 640rpx; - height: 640rpx; + width: 560rpx; + height: 560rpx; display: flex; align-items: center; justify-content: center; @@ -117,13 +119,13 @@ defineExpose({ /* 外发光 - 只在播放时显示(节省 GPU) */ .ring-aura { position: absolute; - width: 700rpx; - height: 700rpx; + width: 620rpx; + height: 620rpx; border-radius: 50%; background: radial-gradient(circle, - rgba(244, 114, 182, 0.45) 0%, - rgba(244, 114, 182, 0.15) 35%, - rgba(244, 114, 182, 0) 70%); + rgba(20, 184, 166, 0.4) 0%, + rgba(45, 212, 191, 0.15) 35%, + rgba(20, 184, 166, 0) 70%); opacity: 0; transition: opacity 0.3s ease; will-change: transform, opacity; @@ -150,8 +152,8 @@ defineExpose({ * ============================================================ */ .grip-ring { position: relative; - width: 520rpx; - height: 520rpx; + width: 460rpx; + height: 460rpx; display: flex; align-items: center; justify-content: center; @@ -163,28 +165,28 @@ defineExpose({ transform: scale(0.96); } -/* 外圈 - 粉色渐变(精致质感) */ +/* 外圈 - 青绿渐变(与页面品牌色一致) */ .ring-outer-circle { position: absolute; width: 100%; height: 100%; border-radius: 50%; background: linear-gradient(135deg, - #fda4af 0%, - #f472b6 50%, - #ec4899 100%); + #5eead4 0%, + #2dd4bf 45%, + #14b8a6 100%); box-shadow: - 0 24rpx 64rpx rgba(236, 72, 153, 0.4), - 0 12rpx 32rpx rgba(244, 114, 182, 0.3), - inset 0 -20rpx 40rpx rgba(190, 24, 93, 0.35), - inset 0 20rpx 40rpx rgba(255, 255, 255, 0.5); + 0 20rpx 56rpx rgba(20, 184, 166, 0.35), + 0 10rpx 28rpx rgba(45, 212, 191, 0.25), + inset 0 -18rpx 36rpx rgba(15, 118, 110, 0.3), + inset 0 18rpx 36rpx rgba(255, 255, 255, 0.45); } /* 顶部高光 - 模拟材质感 */ .ring-highlight { position: absolute; - width: 420rpx; - height: 120rpx; + width: 360rpx; + height: 100rpx; top: 40rpx; border-radius: 50%; background: radial-gradient(ellipse, @@ -196,13 +198,13 @@ defineExpose({ /* 内圈中空 */ .ring-inner-circle { position: absolute; - width: 280rpx; - height: 280rpx; + width: 250rpx; + height: 250rpx; border-radius: 50%; - background: linear-gradient(135deg, #ffffff 0%, #f8fafc 100%); + background: linear-gradient(135deg, #ffffff 0%, #f0fdfa 100%); box-shadow: - inset 0 8rpx 20rpx rgba(190, 24, 93, 0.3), - inset 0 -2rpx 8rpx rgba(255, 255, 255, 0.8); + inset 0 8rpx 20rpx rgba(15, 118, 110, 0.25), + inset 0 -2rpx 8rpx rgba(255, 255, 255, 0.85); } /* 播放时的挤压动画(只影响 transform,GPU 加速) */ @@ -245,15 +247,15 @@ defineExpose({ } .hint-icon { - width: 108rpx; - height: 108rpx; + width: 96rpx; + height: 96rpx; display: flex; align-items: center; justify-content: center; background: rgba(255, 255, 255, 0.98); border-radius: 50%; box-shadow: - 0 12rpx 32rpx rgba(236, 72, 153, 0.35), + 0 12rpx 32rpx rgba(20, 184, 166, 0.28), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.9); animation: hint-bounce 2s ease-in-out infinite; will-change: transform; @@ -262,10 +264,10 @@ defineExpose({ .play-triangle { width: 0; height: 0; - border-left: 36rpx solid #ec4899; - border-top: 24rpx solid transparent; - border-bottom: 24rpx solid transparent; - margin-left: 10rpx; + border-left: 32rpx solid #0f766e; + border-top: 22rpx solid transparent; + border-bottom: 22rpx solid transparent; + margin-left: 8rpx; } @keyframes hint-bounce { @@ -278,10 +280,10 @@ defineExpose({ } .hint-text { - font-size: 28rpx; - color: #be185d; + font-size: 26rpx; + color: #0f766e; font-weight: 700; - letter-spacing: 4rpx; + letter-spacing: 3rpx; text-shadow: 0 2rpx 8rpx rgba(255, 255, 255, 0.9); } @@ -299,8 +301,8 @@ defineExpose({ } .bpm-value { - font-size: 88rpx; - color: #be185d; + font-size: 80rpx; + color: #0f766e; font-weight: 900; line-height: 1; letter-spacing: -2rpx; @@ -310,7 +312,7 @@ defineExpose({ .bpm-label { font-size: 22rpx; - color: #ec4899; + color: #14b8a6; font-weight: 700; letter-spacing: 6rpx; margin-top: 2rpx; diff --git a/TUICallKit-Vue3/training/pages/grip-ring.vue b/TUICallKit-Vue3/training/pages/grip-ring.vue index 300aecb6..1e2d63e1 100644 --- a/TUICallKit-Vue3/training/pages/grip-ring.vue +++ b/TUICallKit-Vue3/training/pages/grip-ring.vue @@ -1,48 +1,102 @@ @@ -1139,26 +1190,190 @@ $shadow-sm: 0 4rpx 12rpx rgba(15, 23, 42, 0.04); } /* ============================================================ - * 动作要领条 + * 视频教学入口卡片 * ============================================================ */ -.tips-strip { +.tutorial-card { display: flex; - flex-wrap: wrap; - gap: 10rpx; + align-items: center; + gap: 16rpx; + padding: 18rpx 24rpx 18rpx 18rpx; + background: linear-gradient(135deg, #ffffff 0%, #f0fdfa 100%); + border-radius: 24rpx; + border: 2rpx solid rgba(20, 184, 166, 0.18); + box-shadow: + 0 4rpx 16rpx rgba(15, 23, 42, 0.04), + 0 1rpx 0 rgba(255, 255, 255, 0.9) inset; + transition: transform 0.15s; + + &:active { + transform: scale(0.98); + background: linear-gradient(135deg, #f0fdfa 0%, #ecfeff 100%); + } +} + +.tutorial-icon { + width: 72rpx; + height: 72rpx; + border-radius: 50%; + background: linear-gradient(140deg, $brand 0%, $brand-deep 100%); + display: flex; + align-items: center; justify-content: center; + flex-shrink: 0; + box-shadow: 0 4rpx 12rpx rgba(20, 184, 166, 0.35); } -.tip-chip { - padding: 10rpx 20rpx; - background: rgba(255, 255, 255, 0.7); - border-radius: 999rpx; - border: 2rpx solid $card-border; +.tutorial-play-triangle { + width: 0; + height: 0; + border-left: 22rpx solid #fff; + border-top: 14rpx solid transparent; + border-bottom: 14rpx solid transparent; + margin-left: 6rpx; } -.tip-text { +.tutorial-info { + flex: 1; + display: flex; + flex-direction: column; + gap: 4rpx; + min-width: 0; +} + +.tutorial-title { + font-size: 28rpx; + font-weight: 700; + color: $text-1; + letter-spacing: 1rpx; +} + +.tutorial-sub { font-size: 22rpx; + color: $text-3; + letter-spacing: 0.5rpx; +} + +.tutorial-arrow { + font-size: 36rpx; + color: #cbd5e1; + font-weight: 300; + line-height: 1; + flex-shrink: 0; +} + +/* ============================================================ + * 视频教学弹层 + * ============================================================ */ +.tutorial-mask { + position: fixed; + inset: 0; + background: rgba(15, 23, 42, 0.65); + backdrop-filter: blur(8rpx); + display: flex; + align-items: center; + justify-content: center; + z-index: 950; + padding: 0 24rpx; + animation: fade-in 0.2s ease; +} + +.tutorial-modal { + width: 100%; + max-width: 700rpx; + background: #fff; + border-radius: 28rpx; + overflow: hidden; + display: flex; + flex-direction: column; + animation: tutorial-pop 0.25s cubic-bezier(0.34, 1.56, 0.64, 1); +} + +@keyframes tutorial-pop { + from { + transform: scale(0.92); + opacity: 0; + } + to { + transform: scale(1); + opacity: 1; + } +} + +.tutorial-header { + display: flex; + align-items: center; + justify-content: space-between; + padding: 24rpx 28rpx 16rpx; +} + +.tutorial-modal-title { + font-size: 32rpx; + font-weight: 700; + color: $text-1; + letter-spacing: 1rpx; +} + +.tutorial-close { + width: 56rpx; + height: 56rpx; + border-radius: 50%; + display: flex; + align-items: center; + justify-content: center; + background: #f1f5f9; + + &:active { + background: #e2e8f0; + } +} + +.tutorial-close-icon { + font-size: 40rpx; color: $text-2; - line-height: 1.3; + line-height: 1; + font-weight: 300; +} + +.tutorial-video { + width: 100%; + // 视频源 720×720 方形, 容器同比贴合避免左右黑边 + // modal max-width = 700rpx, 这里也用 700rpx 完美 1:1 + height: 700rpx; + background: #000; +} + +.tutorial-tips { + padding: 24rpx 28rpx 32rpx; + display: flex; + flex-direction: column; + gap: 12rpx; +} + +.tutorial-tips-title { + font-size: 24rpx; + color: $text-3; + letter-spacing: 1rpx; + margin-bottom: 4rpx; +} + +.tutorial-tip-item { + display: flex; + align-items: center; + gap: 12rpx; +} + +.tip-dot { + width: 8rpx; + height: 8rpx; + border-radius: 50%; + background: $brand; + flex-shrink: 0; +} + +.tip-content { + font-size: 26rpx; + color: $text-2; + line-height: 1.5; } /* ============================================================ From 9b5cd5b2b97b1e26fef76a8a8146ff7d0c67a776 Mon Sep 17 00:00:00 2001 From: long <452591453@qq.com> Date: Fri, 29 May 2026 10:59:17 +0800 Subject: [PATCH 5/7] =?UTF-8?q?=E4=BC=98=E5=8C=96=E6=8F=A1=E5=8A=9B?= =?UTF-8?q?=E7=8E=AF=E8=AE=AD=E7=BB=83=E9=A1=B5=EF=BC=9A=E5=86=85=E8=81=94?= =?UTF-8?q?=E8=A7=86=E9=A2=91=E8=88=9E=E5=8F=B0=E5=B9=B6=E4=BF=AE=E5=A4=8D?= =?UTF-8?q?=E5=B0=8F=E7=A8=8B=E5=BA=8F=E5=85=BC=E5=AE=B9=E4=B8=8E=E5=AE=8C?= =?UTF-8?q?=E6=88=90=E6=B5=AE=E5=B1=82=E5=B8=83=E5=B1=80=E3=80=82?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 将示范视频从自定义组件移至页面主体，避免 mp 端 vOn/ref 崩溃；奖励特效改为 prop 信号驱动，完成弹层移出 page 容器修复右侧裁切，并修正后台音频配置与 CLI 热重载监听。 Co-authored-by: Cursor --- TUICallKit-Vue3/manifest.json | 1 + TUICallKit-Vue3/pages.json | 6 +- .../pages/components/crush-canvas.vue | 440 +++++++++++--- .../pages/components/grip-ring-canvas.vue | 320 ---------- TUICallKit-Vue3/training/pages/grip-ring.vue | 564 ++++++++++-------- TUICallKit-Vue3/vite.config.ts | 15 + 6 files changed, 661 insertions(+), 685 deletions(-) delete mode 100644 TUICallKit-Vue3/training/pages/components/grip-ring-canvas.vue diff --git a/TUICallKit-Vue3/manifest.json b/TUICallKit-Vue3/manifest.json index 672b3365..146f31f1 100644 --- a/TUICallKit-Vue3/manifest.json +++ b/TUICallKit-Vue3/manifest.json @@ -58,6 +58,7 @@ "subPackages" : true }, "usingComponents" : true, + "requiredBackgroundModes" : ["audio"], "plugins" : { "WechatSI" : { diff --git a/TUICallKit-Vue3/pages.json b/TUICallKit-Vue3/pages.json index 100b8395..d9f3fe15 100644 --- a/TUICallKit-Vue3/pages.json +++ b/TUICallKit-Vue3/pages.json @@ -121,8 +121,7 @@ "navigationBarTitleText": "握力环训练", "navigationBarBackgroundColor": "#f8fafc", "navigationBarTextStyle": "black", - "backgroundColor": "#f8fafc", - "requiredBackgroundModes": ["audio"] + "backgroundColor": "#f8fafc" } }, { @@ -131,8 +130,7 @@ "navigationBarTitleText": "耗糖节拍器", "navigationBarBackgroundColor": "#f8fafc", "navigationBarTextStyle": "black", - "backgroundColor": "#f8fafc", - "requiredBackgroundModes": ["audio"] + "backgroundColor": "#f8fafc" } } ] diff --git a/TUICallKit-Vue3/training/pages/components/crush-canvas.vue b/TUICallKit-Vue3/training/pages/components/crush-canvas.vue index b286236d..5a70c4f2 100644 --- a/TUICallKit-Vue3/training/pages/components/crush-canvas.vue +++ b/TUICallKit-Vue3/training/pages/components/crush-canvas.vue @@ -9,7 +9,7 @@ diff --git a/TUICallKit-Vue3/training/pages/grip-ring.vue b/TUICallKit-Vue3/training/pages/grip-ring.vue index 7426bf10..fa9aa76e 100644 --- a/TUICallKit-Vue3/training/pages/grip-ring.vue +++ b/TUICallKit-Vue3/training/pages/grip-ring.vue @@ -12,15 +12,56 @@ - + - + + + + + + + + + + + + + + + - - + + {{ currentReward.emoji }} {{ currentReward.title }} @@ -111,46 +153,6 @@ - - - - - - - 观看动作示范 - 视频教学 · 学会正确握法 - - › - - - - - - - 动作示范 - - × - - - - @@ -175,15 +177,15 @@ 🔥 - {{ totalSugar.toFixed(1) }}g - 消耗糖分 + ≈{{ totalSugar.toFixed(1) }}g + 消耗糖分 (估算) - 相当于消耗了 + 大约相当于 这些食物的糖分 🍭 @@ -212,14 +214,13 @@ - + + diff --git a/TUICallKit-Vue3/training/pages/foot-pedal.vue b/TUICallKit-Vue3/training/pages/foot-pedal.vue new file mode 100644 index 00000000..fefc7691 --- /dev/null +++ b/TUICallKit-Vue3/training/pages/foot-pedal.vue @@ -0,0 +1,1895 @@ + + + + + diff --git a/TUICallKit-Vue3/training/pages/grip-ring.vue b/TUICallKit-Vue3/training/pages/grip-ring.vue index fa9aa76e..50735d5a 100644 --- a/TUICallKit-Vue3/training/pages/grip-ring.vue +++ b/TUICallKit-Vue3/training/pages/grip-ring.vue @@ -112,6 +112,11 @@ {{ p.desc }} + + + 🔥 + {{ estimateText }} + @@ -134,10 +139,38 @@ - - - 已暂停 · 点击握力环继续 - 结束训练 › + + + + + + 训练功效 + {{ benefitExpanded ? '收起 ▲' : '展开 ▼' }} + + + + 主要锻炼 + + {{ m }} + + + + 训练效果 + {{ TRAINING_BENEFIT.effect }} + + + + + + + + @@ -218,7 +251,7 @@ From e4312ab5d10b1a15a5a86a17a2d91c0fe277edd5 Mon Sep 17 00:00:00 2001 From: long <452591453@qq.com> Date: Fri, 29 May 2026 12:12:07 +0800 Subject: [PATCH 7/7] update --- TUICallKit-Vue3/training/pages/dumbbell.vue | 11 +++++++---- TUICallKit-Vue3/training/pages/foot-pedal.vue | 11 +++++++---- TUICallKit-Vue3/training/pages/grip-ring.vue | 11 +++++++---- TUICallKit-Vue3/training/pages/pilates-ring.vue | 11 +++++++---- 4 files changed, 28 insertions(+), 16 deletions(-) diff --git a/TUICallKit-Vue3/training/pages/dumbbell.vue b/TUICallKit-Vue3/training/pages/dumbbell.vue index 5c4b0087..e3bec311 100644 --- a/TUICallKit-Vue3/training/pages/dumbbell.vue +++ b/TUICallKit-Vue3/training/pages/dumbbell.vue @@ -238,8 +238,8 @@ - - + + @@ -595,13 +595,16 @@ function onEndTraining() { showSummary.value = true } +// 关闭结算(点遮罩) → 回到初始待开始态,避免卡在暂停态死循环 function dismissSummary() { showSummary.value = false + resetStats() } -function onContinue() { +// 完成: 退出结算并回到初始待开始态 +function onFinish() { showSummary.value = false - startTrainingInternal() + resetStats() } // 再来一次 diff --git a/TUICallKit-Vue3/training/pages/foot-pedal.vue b/TUICallKit-Vue3/training/pages/foot-pedal.vue index fefc7691..8671561a 100644 --- a/TUICallKit-Vue3/training/pages/foot-pedal.vue +++ b/TUICallKit-Vue3/training/pages/foot-pedal.vue @@ -238,8 +238,8 @@ - - + + @@ -595,13 +595,16 @@ function onEndTraining() { showSummary.value = true } +// 关闭结算(点遮罩) → 回到初始待开始态,避免卡在暂停态死循环 function dismissSummary() { showSummary.value = false + resetStats() } -function onContinue() { +// 完成: 退出结算并回到初始待开始态 +function onFinish() { showSummary.value = false - startTrainingInternal() + resetStats() } // 再来一次 diff --git a/TUICallKit-Vue3/training/pages/grip-ring.vue b/TUICallKit-Vue3/training/pages/grip-ring.vue index 50735d5a..ddb4ed87 100644 --- a/TUICallKit-Vue3/training/pages/grip-ring.vue +++ b/TUICallKit-Vue3/training/pages/grip-ring.vue @@ -242,8 +242,8 @@ - - + + @@ -663,13 +663,16 @@ function onEndTraining() { showSummary.value = true } +// 关闭结算(点遮罩) → 回到初始待开始态,避免卡在暂停态死循环 function dismissSummary() { showSummary.value = false + resetStats() } -function onContinue() { +// 完成: 退出结算并回到初始待开始态 +function onFinish() { showSummary.value = false - startTrainingInternal() + resetStats() } // 再来一次 diff --git a/TUICallKit-Vue3/training/pages/pilates-ring.vue b/TUICallKit-Vue3/training/pages/pilates-ring.vue index 4fa48331..66f0fd37 100644 --- a/TUICallKit-Vue3/training/pages/pilates-ring.vue +++ b/TUICallKit-Vue3/training/pages/pilates-ring.vue @@ -238,8 +238,8 @@ - - + + @@ -595,13 +595,16 @@ function onEndTraining() { showSummary.value = true } +// 关闭结算(点遮罩) → 回到初始待开始态,避免卡在暂停态死循环 function dismissSummary() { showSummary.value = false + resetStats() } -function onContinue() { +// 完成: 退出结算并回到初始待开始态 +function onFinish() { showSummary.value = false - startTrainingInternal() + resetStats() } // 再来一次