Files
msh-system/msh_single_uniapp/pages/tool/points-rules.vue

230 lines
5.8 KiB
Vue
Raw Normal View History

<template>
<view class="points-rules-page">
<!-- 内容区域 -->
<scroll-view class="content-scroll" scroll-y>
<!-- 积分获取规则 -->
<view class="section">
<view class="section-title">积分获取规则</view>
<!-- 1. 每日签到 -->
<view class="rule-item">
<view class="rule-title">1. 每日签到</view>
<view class="rule-content">
<text class="rule-text">每日打开应用签到即可获得积分</text>
<text class="rule-text">获得积分+5</text>
<text class="rule-text">频率每日</text>
</view>
</view>
<!-- 2. 饮食打卡 -->
<view class="rule-item">
<view class="rule-title">2. 饮食打卡</view>
<view class="rule-content">
<text class="rule-text">每日上传饮食记录照片/文字记录您的健康饮食</text>
<text class="rule-text">获得积分+10</text>
<text class="rule-text">频率每日</text>
</view>
</view>
<!-- 3. 完善健康档案 -->
<view class="rule-item">
<view class="rule-title">3. 完善健康档案</view>
<view class="rule-content">
<text class="rule-text">完善您的基本信息病史透析情况等健康档案</text>
<text class="rule-text">获得积分+30</text>
<text class="rule-text">频率仅限1次</text>
</view>
</view>
<!-- 4. 采纳营养方案 -->
<view class="rule-item">
<view class="rule-title">4. 采纳营养方案</view>
<view class="rule-content">
<text class="rule-text">使用营养计算器并采纳个性化营养方案</text>
<text class="rule-text">获得积分+20</text>
<text class="rule-text">频率每次</text>
</view>
</view>
<!-- 5. 内容分享 -->
<view class="rule-item">
<view class="rule-title">5. 内容分享</view>
<view class="rule-content">
<text class="rule-text">分享打卡内容食谱到社区或社交平台</text>
<text class="rule-text">获得积分+15</text>
<text class="rule-text">频率每次</text>
</view>
</view>
<!-- 6. 点赞与收藏 -->
<view class="rule-item">
<view class="rule-title">6. 点赞与收藏</view>
<view class="rule-content">
<text class="rule-text">给社区内容点赞或收藏优质食谱营养知识</text>
<text class="rule-text">获得积分+2</text>
<text class="rule-text">频率每日最多10次</text>
</view>
</view>
<!-- 7. 生成AI视频 -->
<view class="rule-item">
<view class="rule-title">7. 生成AI视频</view>
<view class="rule-content">
<text class="rule-text">在打卡时开启AI视频生成功能系统将自动为您生成营养分析视频</text>
<text class="rule-text">获得积分+20</text>
<text class="rule-text">频率每次</text>
</view>
</view>
</view>
<!-- 积分用途 -->
<view class="section">
<view class="section-title">积分用途</view>
<view class="usage-list">
<text class="usage-item">1. 兑换专属福利礼包和健康用品</text>
<text class="usage-item">2. 参与积分抽奖活动赢取丰厚奖品</text>
<text class="usage-item">3. 解锁专属营养师咨询服务</text>
<text class="usage-item">4. 获取高级健康数据分析报告</text>
</view>
</view>
<!-- 温馨提示 -->
<view class="section">
<view class="section-title">温馨提示</view>
<view class="tips-list">
<text class="tips-item">1. 积分永久有效不会过期</text>
<text class="tips-item">2. 每日任务会在 00:00 重置</text>
<text class="tips-item">3. 作弊行为将被扣除积分并警告</text>
<text class="tips-item">4. 更多积分玩法即将上线敬请期待</text>
</view>
</view>
<!-- 其他说明 -->
<view class="section">
<view class="section-title">其他说明</view>
<view class="notes-list">
<text class="notes-item">1. 本平台保留对积分规则的最终解释权</text>
<text class="notes-item">2. 积分规则可能根据实际运营情况进行调整调整时会提前公告</text>
<text class="notes-item">3. 如有任何疑问请联系客服咨询</text>
</view>
</view>
<!-- 底部安全距离 -->
<view class="safe-bottom"></view>
</scroll-view>
</view>
</template>
<script>
export default {
data() {
return {
}
},
methods: {
}
}
</script>
<style lang="scss" scoped>
.points-rules-page {
min-height: 100vh;
background: #ffffff;
display: flex;
flex-direction: column;
}
/* 内容滚动区域 */
.content-scroll {
flex: 1;
padding: 0;
}
/* 通用区块样式 */
.section {
padding: 32rpx;
}
.section-title {
font-size: 40rpx;
color: #101828;
font-weight: 500;
margin-bottom: 32rpx;
line-height: 1.5;
}
/* 积分获取规则 */
.rule-item {
margin-bottom: 48rpx;
&:last-child {
margin-bottom: 0;
}
}
.rule-title {
font-size: 36rpx;
color: #101828;
font-weight: 500;
margin-bottom: 16rpx;
line-height: 1.5;
}
.rule-content {
display: flex;
flex-direction: column;
gap: 8rpx;
}
.rule-text {
font-size: 32rpx;
color: #4a5565;
line-height: 1.5;
}
/* 积分用途 */
.usage-list {
display: flex;
flex-direction: column;
gap: 8rpx;
}
.usage-item {
font-size: 32rpx;
color: #4a5565;
line-height: 1.5;
}
/* 温馨提示 */
.tips-list {
display: flex;
flex-direction: column;
gap: 8rpx;
}
.tips-item {
font-size: 32rpx;
color: #4a5565;
line-height: 1.5;
}
/* 其他说明 */
.notes-list {
display: flex;
flex-direction: column;
gap: 8rpx;
}
.notes-item {
font-size: 32rpx;
color: #4a5565;
line-height: 1.5;
}
/* 底部安全距离 */
.safe-bottom {
height: 40rpx;
}
</style>