Kaynağa Gözat

【Add】积分抽奖功能

liuxiangxin 6 ay önce
ebeveyn
işleme
99ffe6b47f

+ 44 - 40
pages/score/clockin.vue

@@ -4,27 +4,24 @@
 			<view class="status_bar" :style="status_bar_style"><!-- 这里是状态栏 --></view>
 			<view class="info_box">
 				<view class="left_box">
-					<view class="finish_box">
-						<view class="finish_title">连续签到天数</view>
-						<view class="finish_day">{{isMark.finish_day}}</view>
+					<view class="score_info">
+						<view class="score_title">当前积分</view>
+						<view class="score_current">{{scoreInfo.score}} </view>
 					</view>
-					<view class="score_box">
-						<view class="score_title">
-							<text class="title_item">当前积分</text>
-							<text class="title_item">待入账积分</text>
-						</view>
-						<view class="score">
-							<text class="score_item">{{scoreInfo.score}}</text>
-							<text class="score_item">{{scoreInfo.wait_score}}</text>
-						</view>
+					<view class="wait_info">
+						<view class="wait_title">待入账积分</view>
+						<view class="wait_score">{{scoreInfo.wait_score?scoreInfo.wait_score:0}}</view>
 					</view>
 				</view>
 				<view class="right_box">
-					<image class="score_icon" src="../../static/icon/score.png" mode=""></image>
+					<navigator url="/pages/score/lottery" class="lottery_enter">
+						<image class="lottery_img" src="https://mall.findit.ltd/uploads/images/default/lottery_record.png" mode=""></image>
+						<view class="lottery_text">点我抽奖</view>
+					</navigator>
 				</view>
 			</view>
 			<view class="clockin_box">
-				<view class="box_title">连续签到奖励更丰厚</view>
+				<view class="box_title">{{isMark.finish_day?'已连续签到 '+isMark.finish_day+' 天':'连续签到奖励更丰厚'}}</view>
 				<view class="clockin_list">
 					<view class="clockin_item" :class="item.is_finish?'acitve':''" v-for="(item,index) in clockinList" :key="index" >
 						<view class="what_day">第{{item.what_day}}天</view>
@@ -170,18 +167,18 @@
 			.left_box{
 				float: left;
 				width: 450rpx;
-				.finish_box{
+				.score_info{
 					color: #FFFFFF;
 					overflow: hidden;
 					padding: 0rpx 35rpx;
-					.finish_title{
+					.score_title{
 						width: 240rpx;
 						height: 60rpx;
 						display: block;
 						font-size: 26rpx;
 						line-height: 60rpx;
 					}
-					.finish_day{
+					.score_current{
 						width: 240rpx;
 						height: 80rpx;
 						display: block;
@@ -189,41 +186,49 @@
 						line-height: 80rpx;
 					}
 				}
-				.score_box{
+				.wait_info{
 					color: #FFFFFF;
-					margin-top: 40rpx;
-					padding: 0rpx 35rpx;
+					display: block;
 					overflow: hidden;
-					.score_title{
+					padding: 0rpx 35rpx;
+					margin-top: 20rpx;
+					.wait_title{
+						width: 240rpx;
 						height: 40rpx;
 						display: block;
-						font-size: 26rpx;
+						font-size: 24rpx;
 						line-height: 40rpx;
-						overflow: hidden;
-						.title_item{
-							float: left;
-							width: 190rpx;
-						}
 					}
-					.score{
-						height: 80rpx;
+					.wait_score{
+						width: 240rpx;
+						height: 60rpx;
 						display: block;
-						font-size: 26rpx;
+						font-size: 36rpx;
 						line-height: 60rpx;
-						.score_item{
-							float: left;
-							width: 190rpx;
-						}
 					}
 				}
 			}
 			.right_box{
 				float: right;
-				width: 300rpx;
-				margin-top: 100rpx;
-				.score_icon{
-					width: 300rpx;
-					height: 300rpx;
+				overflow: hidden;
+				margin-top: 60rpx;
+				margin-right: 35rpx;
+				.lottery_enter{
+					display: block;
+					overflow: hidden;
+					text-align: center;
+					.lottery_img{
+						width: 150rpx;
+						height: 150rpx;
+						display: block;
+						margin: 0 auto;
+					}
+					.lottery_text{
+						color: #FFFFFF;
+						height: 60rpx;
+						font-size: 28rpx;
+						line-height: 60rpx;
+					}
 				}
 			}
 		}
@@ -234,7 +239,6 @@
 			height: 800rpx;
 			margin: 0rpx auto;
 			position: relative;
-			margin-top: -80rpx;
 			border-radius: 40rpx;
 			background-color: #FFFFFF;
 			box-shadow: 5rpx 5rpx 2rpx 0rpx #DDDDDD;

+ 18 - 6
pages/score/lottery.vue

@@ -1,7 +1,7 @@
 <template>
 	<view>
 		<view class="lottery_box" :style="height">
-			<!-- <view class="lottery_time">活动时间:{{lotteryInfo.start_date}} ~ {{lotteryInfo.end_date}}</view> -->
+			<view class="lottery_time" v-if="lotteryInfo.id">活动时间:{{lotteryInfo.start_date}} ~ {{lotteryInfo.end_date}}</view>
 			<view class="lottery_info">
 				<image class="lottery_logo" v-if="lotteryInfo.logo" :src="lotteryInfo.logo" mode="widthFix"></image>
 				<button class="lottery_rule_btn" @click="showRule">活动规则</button>
@@ -10,9 +10,10 @@
 			<view class="record_box">
 				<view class="score_info">
 					<view class="custom_score">当前积分:{{scoreInfo.score}}</view>
-					<view class="need_score">每次抽奖消耗{{lotteryInfo.need_score}}积分</view>
+					<view class="need_score" v-if="lotteryInfo.id" >每次抽奖消耗{{lotteryInfo.need_score}}积分</view>
+					<view class="need_score" v-if="!lotteryInfo.id" >暂无可参与的活动</view>
 				</view>
-				<button class="lottery_record" @click="showRecord">
+				<button class="lottery_record" @click="showRecord" v-if="lotteryInfo.id">
 					<image class="lottery_record_img" src="https://mall.findit.ltd/uploads/images/default/lottery_record.png" mode=""></image>
 					<text class="lottery_record_text">中奖记录</text>
 				</button>
@@ -87,7 +88,7 @@
 					id:0,
 					name:"",
 					logo:"",
-					need_score:"--",
+					need_score:"",
 					start_date:"",
 					end_date:"",
 					start_time:"",
@@ -205,13 +206,15 @@
 					return;
 				}
 				// 活动是否结束
-				if( this.scoreInfo.score < this.lotteryInfo.need_score ){
+				if( this.scoreInfo.score - this.lotteryInfo.need_score < this.lotteryInfo.need_score ){
 					uni.showToast({
 						title:"积分不足",
 						icon:"none",
 					})
 					return;
 				}
+				// 积分操作
+				this.scoreInfo.score    = this.scoreInfo.score - this.lotteryInfo.need_score;
 				// 请求列表
 				this.$http.request('/api/lottery_score/get_reward',{lottery_id:this.lotteryInfo.id}).then((re)=>{
 					// 设置非请求中
@@ -222,12 +225,14 @@
 						this.prizeList	= re.data.reward_list;
 						this.newScore	= re.data.custom_score;
 						// 奖品的索引
-						return this.$refs.dialer.run(re.data.reward_index);
+						return 			this.$refs.dialer.run(re.data.reward_index);
 					}else{
 						uni.showToast({
 							title:re.msg,
 							icon:"none",
 						})
+						// 积分操作
+						this.scoreInfo.score    = this.scoreInfo.score + this.lotteryInfo.need_score;
 						return ;
 					}
 				});
@@ -310,12 +315,19 @@
 		position: relative;
 		background: linear-gradient(to bottom, #FC335F 0%, #FB7224 80%, #FFFFFF 100%);
 		.lottery_time{
+			top: 0rpx;
+			left: 35rpx;
+			z-index: 1;
+			width: 700rpx;
 			color: #FFFFFF;
 			display: block;
 			height: 40rpx;
 			font-size: 24rpx;
 			line-height: 40rpx;
 			text-align: center;
+			position: absolute;
+			border-radius: 10rpx;
+			background-color: rgba(0, 0, 0,0.3);
 		}
 		.lottery_info{
 			width: 750rpx;

BIN
uni_modules/lime-dialer/static/lottery-bg-.png