fix: lucky page

This commit is contained in:
zzc
2026-02-28 20:31:45 +08:00
parent c62e12756b
commit b302103c15

View File

@@ -20,9 +20,19 @@
<text class="user-name" @tap="handleLogin">
{{ userInfo.nickName || "点击登录" }}
</text>
<view class="user-points" v-if="isLoggedIn">
<view
class="user-points"
v-if="isLoggedIn"
@tap.stop="showPointsRules"
>
<text class="points-label">积分</text>
<text class="points-value">{{ userPoints }}</text>
<uni-icons
type="help"
size="14"
color="#ff5722"
style="margin-left: 4rpx"
/>
</view>
</view>
</view>
@@ -238,6 +248,40 @@
<!-- 运势抽奖弹窗 -->
<LuckyPopup ref="luckyPopupRef" />
<RewardAd ref="rewardAdRef" @onReward="handleAdReward" />
<!-- 积分规则弹窗 -->
<uni-popup ref="rulesPopup" type="center">
<view class="rules-modal">
<view class="rules-header">
<text class="rules-title">积分获取规则</text>
<uni-icons
type="closeempty"
size="20"
color="#999"
@tap="closeRules"
/>
</view>
<view class="rules-content">
<view class="rule-item">
<uni-icons type="paperplane-filled" size="18" color="#ff9800" />
<text class="rule-text">分享好友+10积分 (每日限3次)</text>
</view>
<view class="rule-item">
<uni-icons type="person-filled" size="18" color="#ff9800" />
<text class="rule-text">每日登录+20积分</text>
</view>
<view class="rule-item">
<uni-icons type="calendar-filled" size="18" color="#ff9800" />
<text class="rule-text">每日签到+40积分</text>
</view>
<view class="rule-item">
<uni-icons type="videocam-filled" size="18" color="#ff9800" />
<text class="rule-text">观看广告+50积分</text>
</view>
</view>
<button class="rules-btn" @tap="closeRules">我知道了</button>
</view>
</uni-popup>
</view>
</template>
@@ -269,6 +313,7 @@ const statusBarHeight = ref(getStatusBarHeight());
const loginPopupRef = ref(null);
const luckyPopupRef = ref(null);
const rewardAdRef = ref(null);
const rulesPopup = ref(null);
const userInfo = computed(() => userStore?.userInfo || {});
const isLoggedIn = computed(() => !!userStore.userInfo.nickName);
const userPoints = computed(() => userStore.userInfo.points || 0);
@@ -548,6 +593,14 @@ onShareTimeline(() => {
title: "开启你的2026新春好运",
};
});
const showPointsRules = () => {
rulesPopup.value.open();
};
const closeRules = () => {
rulesPopup.value.close();
};
</script>
<style lang="scss" scoped>
@@ -1133,4 +1186,64 @@ onShareTimeline(() => {
font-size: 22rpx;
color: #999;
}
/* Rules Modal */
.rules-modal {
width: 600rpx;
background: #fff;
border-radius: 32rpx;
padding: 40rpx;
box-sizing: border-box;
.rules-header {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 32rpx;
.rules-title {
font-size: 32rpx;
font-weight: bold;
color: #333;
}
}
.rules-content {
margin-bottom: 40rpx;
.rule-item {
display: flex;
align-items: center;
margin-bottom: 24rpx;
background: #fff9f0;
padding: 20rpx;
border-radius: 16rpx;
&:last-child {
margin-bottom: 0;
}
.rule-text {
font-size: 26rpx;
color: #333;
margin-left: 16rpx;
}
}
}
.rules-btn {
background: linear-gradient(135deg, #ff9800 0%, #ff5722 100%);
color: #fff;
font-size: 28rpx;
font-weight: bold;
border-radius: 40rpx;
height: 80rpx;
line-height: 80rpx;
margin: 0;
&::after {
border: none;
}
}
}
</style>