|
|
@@ -5,9 +5,9 @@
|
|
|
<view class="onboarding-topbar"></view>
|
|
|
|
|
|
<!-- 步骤内容 -->
|
|
|
- <view class="onboarding-content" :key="currentStep">
|
|
|
+ <view class="onboarding-content" :key="currentStep" :class="{ 'onboarding-content--intro': steps[currentStep].isIntro }">
|
|
|
<text class="onboarding-icon">{{ steps[currentStep].icon }}</text>
|
|
|
- <text class="onboarding-title">{{ steps[currentStep].title }}</text>
|
|
|
+ <text class="onboarding-title" :class="{ 'onboarding-title--intro': steps[currentStep].isIntro }">{{ steps[currentStep].title }}</text>
|
|
|
<text class="onboarding-desc">{{ steps[currentStep].desc }}</text>
|
|
|
</view>
|
|
|
|
|
|
@@ -36,24 +36,36 @@
|
|
|
|
|
|
<script>
|
|
|
var PARENT_STEPS = [
|
|
|
+ {
|
|
|
+ icon: '🔍',
|
|
|
+ title: '你真的了解孩子的状态吗?',
|
|
|
+ desc: '情绪低落没察觉、习惯变化没注意、能力短板没发现——很多问题等爆发了才看见。浠艾福帮你在问题发生前,看清孩子真实的身心状态。',
|
|
|
+ isIntro: true
|
|
|
+ },
|
|
|
{
|
|
|
icon: '🌏',
|
|
|
- title: '五维能量沙盘',
|
|
|
- desc: '这是你家的五维全景图,身·心·智·行·富,每个维度一目了然,帮你全面掌握家庭成长状态'
|
|
|
+ title: '五维沙盘,看见全家',
|
|
|
+ desc: '身·心·智·行·富,一张全景图看清每个维度。孩子身体好不好、情绪怎么样、能力到哪了——不用猜,看得见。'
|
|
|
},
|
|
|
{
|
|
|
icon: '📋',
|
|
|
- title: '任务激励系统',
|
|
|
- desc: '给孩子布置小任务,完成后获得星星积分,养成好习惯就这么简单'
|
|
|
+ title: '小任务,大改变',
|
|
|
+ desc: '布置每日小任务,完成就能攒星星。每天一点点积累,好习惯自然养成。'
|
|
|
},
|
|
|
{
|
|
|
icon: '🎁',
|
|
|
- title: '心愿兑换',
|
|
|
- desc: '孩子用积分兑换心愿,努力就有回报,培养目标感和延迟满足能力'
|
|
|
+ title: '心愿墙,看得见努力',
|
|
|
+ desc: '孩子攒够星星就能兑换心愿。努力有回报,目标感和坚持力一起培养。'
|
|
|
}
|
|
|
]
|
|
|
|
|
|
var CHILD_STEPS = [
|
|
|
+ {
|
|
|
+ icon: '🔍',
|
|
|
+ title: '你的每一点成长,都被看见',
|
|
|
+ desc: '今天完成了几个任务?比昨天进步了多少?浠艾福帮你记录每一点努力,让成长看得见。',
|
|
|
+ isIntro: true
|
|
|
+ },
|
|
|
{
|
|
|
icon: '🌟',
|
|
|
title: '赚星星',
|
|
|
@@ -187,6 +199,20 @@ export default {
|
|
|
padding: 0 16rpx;
|
|
|
}
|
|
|
|
|
|
+/* ============================================================
|
|
|
+ 介绍步骤 — 开场身份定义页
|
|
|
+ ============================================================ */
|
|
|
+.onboarding-content--intro {
|
|
|
+ padding: 64rpx 56rpx 48rpx;
|
|
|
+}
|
|
|
+
|
|
|
+.onboarding-title--intro {
|
|
|
+ font-size: 32rpx;
|
|
|
+ font-weight: 800;
|
|
|
+ color: var(--color-primary, #F97316);
|
|
|
+ line-height: 1.4;
|
|
|
+}
|
|
|
+
|
|
|
/* ============================================================
|
|
|
步进器圆点
|
|
|
============================================================ */
|