游戏第二版

common/styles/global/components.scss

@@ -239,4 +239,14 @@ $titleBar-tabBar-page: calc(100vh - var(--status-bar-height));
 		background-image: url("@/static/images/common/tip-big-bj.png");
 	}
 	.tip-content{min-height: 240rpx;text-align: justify;}
-}
+}
+
+/*积分框*/
+.ezy-jf-box{
+	width: 142rpx;height: 46rpx;display: flex;align-items: center;line-height: 1.2;font-size: 26rpx;
+	@include ezy-no-repeat-cover;background-image: url("@/static/images/common/jf-bj.png");margin-top: 20rpx;
+	.jf-icon{width: 35rpx;height: 35rpx;margin:0 4rpx 0 10rpx;flex-shrink: 0;
+	@include ezy-no-repeat-cover;background-image: url("@/static/images/my/jf-qb.png");}
+	.jf-text{min-width: 60rpx;text-align: center;color: #fff;}
+}
+		

common/styles/global/pages.scss

@@ -119,7 +119,7 @@
 	.agree-title{font-size: 42rpx;text-align: center;margin-bottom: 42rpx;flex-shrink: 0;}
 	.agree-close-btn{width: 62rpx;height: 62rpx;@include ezy-no-repeat-cover;
 	position: absolute;top: 64rpx;right: 44rpx;
-	background-image: url("@/static/images/login/agree-sections-close.png");}
+	background-image: url("@/static/images/common/close-icon.png");}
 	.agree-section-box{font-size: 30rpx;line-height: 1.8;overflow: auto;flex: 1;padding: 0 46rpx;}
 	@media (max-height: 800px) {
 		.agree-content-box{margin-top: 18%;}
@@ -139,7 +139,7 @@
 		background-image: url("@/static/images/login/slider-dialog-bj.png");@include ezy-no-repeat-cover;position: relative;
 	}
 	.slider-close{width: 50rpx;height: 50rpx;@include ezy-no-repeat-cover;position: absolute;right: 30rpx;top: 30rpx;
-	background-image: url("@/static/images/login/agree-sections-close.png");}
+	background-image: url("@/static/images/common/close-icon.png");}
 	.slider-check-tip{color:#777;font-size: 32rpx;margin-top: 30rpx;font-weight: 800;}
 	.slider-check-btn{width: 208rpx;height: 85rpx;@include ezy-no-repeat-cover;margin: 32rpx auto 0;
 	background-image: url("@/static/images/login/slider-confirm.png");display: block;}
@@ -739,14 +739,6 @@
 		width: 100%;padding: 80rpx 24rpx 42rpx;box-sizing: border-box;display: flex;align-items: center;color: #fff;
 		.head-img-box{width: 154rpx;height: 154rpx;margin: 0 24rpx 0 12rpx;@include ezy-no-repeat-cover;}
 		.head-content-box{font-size: 30rpx;}
-		.jf-box{
-			width: 142rpx;height: 46rpx;display: flex;align-items: center;line-height: 1.2;font-size: 26rpx;
-			@include ezy-no-repeat-cover;background-image: url("@/static/images/common/jf-bj.png");margin-top: 20rpx;
-		}
-		.jf-icon{width: 35rpx;height: 35rpx;margin:0 4rpx 0 10rpx;flex-shrink: 0;
-		@include ezy-no-repeat-cover;background-image: url("@/static/images/my/jf-qb.png");}
-		.jf-text{min-width: 60rpx;
-		text-align: center;}
 	}
 	
 	// hyqy
@@ -908,7 +900,7 @@
 	position: fixed;display: flex;flex-direction: column;top: 0;left: 0;bottom:0;right: 0;
 	justify-content: center;align-items: center;
 	.tel-close{width: 50rpx;height: 50rpx;@include ezy-no-repeat-cover;position: absolute;right: 30rpx;top: 30rpx;
-	background-image: url("@/static/images/login/agree-sections-close.png");}
+	background-image: url("@/static/images/common/close-icon.png");}
 	.my-tel-content{
 		width: 625rpx;height: 740rpx;box-sizing: border-box;padding: 56rpx 62rpx;
 		background-image: url("@/static/images/my/my-tel-bj.png");@include ezy-no-repeat-cover;position: relative;
@@ -1051,20 +1043,12 @@
 	width: 100%;height: 100vh;background-color: #23befb;position: relative;
 	padding-top:var(--status-bar-height);display: flex;flex-direction: column;
 	@include ezy-no-repeat-cover(bottom);background-image: url("@/static/images/game/game-bj.png");
-	.game-jf-box{
-		width: 142rpx;height: 46rpx;display: flex;align-items: center;line-height: 1.2;
-		position: absolute;right: 24rpx;top: var(--status-bar-height);color: #fff;font-size: 26rpx;
-		background-image: url("@/static/images/common/jf-bj.png");@include ezy-no-repeat-cover;
-	}
-	.game-jf-box::before{
-		content: '';width: 35rpx;height: 35rpx;display: block;margin:0 4rpx 0 10rpx;flex-shrink: 0;
-		@include ezy-no-repeat-cover;background-image: url("@/static/images/my/jf-qb.png");}
-	
+	.game-jf-box{position: absolute;right: 24rpx;top: var(--status-bar-height);}
 	// goose
 	.game-goose-box{
 		position: absolute;bottom: 300rpx;right: 80rpx;
 		.game-progress-box{
-			width: 138rpx;height: 25rpx;position: absolute;bottom: 300rpx;left: 48rpx;
+			width: 138rpx;height: 25rpx;position: absolute;left: 48rpx;
 			.u-line-progress__background{
 				width: 138rpx;height: 25rpx!important;
 				@include ezy-no-repeat-cover;background-image: url("@/static/images/game/jf-bj.png");
@@ -1072,17 +1056,57 @@
 		}
 		.goose-img-box{width: 231rpx;height: 442rpx;@include ezy-no-repeat-cover;}
 	}
-	.food-btn-box{
-		width: 106rpx;height: 121rpx;position: absolute;bottom: 50rpx;left: 50rpx;
-		@include ezy-no-repeat-cover;background-image: url("@/static/images/game/food-common-img.png");
-	}
+	.game-goose-box0 .game-progress-box{bottom: 300rpx;}
+	.game-goose-box1 .game-progress-box{bottom: 330rpx;}
+	.game-goose-box2 .game-progress-box{bottom: 400rpx;}
+	.game-goose-box3 .game-progress-box{bottom: 460rpx;}
+	
+	// food
 	.food-img-box{width: 80rpx;height: 75rpx;position: absolute;}
 	.food-img25{bottom: 368rpx;left: 274rpx;}
 	.food-img50{bottom: 360rpx;left: 270rpx;}
 	.food-img100{bottom: 360rpx;left: 272rpx;}
+	
+	//btn
+	.food-btn-box{
+		width: 106rpx;height: 121rpx;position: absolute;bottom: 50rpx;left: 50rpx;
+		@include ezy-no-repeat-cover;background-image: url("@/static/images/game/food-common-img.png");
+	}
 	.yxsm-btn{
 		width: 125rpx;height: 125rpx;position: absolute;bottom: 50rpx;right: 50rpx;
 		@include ezy-no-repeat-cover;background-image: url("@/static/images/game/yxsm-btn-img.png");
 	}
 	
+	
+	// game-popup-box
+	.game-popup-box{
+		width: 100%;height: 514rpx;@include ezy-no-repeat-cover;
+		background-image: url("@/static/images/game/food-box-bj.png");
+		box-sizing: border-box;padding: 64rpx 36rpx 0;
+		.game-popup-head,.jf-btn-box{display: flex;justify-content: space-between;align-items: center;}
+		.game-popup-title{
+			width: 285rpx;height: 90rpx;@include ezy-no-repeat-cover;
+		background-image: url("@/static/images/game/food-title.png");
+		}
+		.game-popup-jf{margin: 0 20rpx 0 0;}
+		.popup-close-btn{
+			width: 46rpx;height: 46rpx;@include ezy-no-repeat-cover;
+			background-image: url("@/static/images/common/close-icon.png");
+		}
+		.food-list-box{display: flex;justify-content: space-between;margin-top: 24rpx;}
+		.food-item-box{
+			width: 204rpx;height: 250rpx;@include ezy-no-repeat-cover;
+			display: flex;flex-direction: column;align-items: center;justify-content: center;
+			background-image: url("@/static/images/game/food-bj.png");
+			img{width: 144rpx;height:135rpx;}
+			.food-item-jf{
+				width: 123rpx;height: 46rpx;
+				display: flex;align-items: center;line-height: 1.2;font-size: 26rpx;
+				@include ezy-no-repeat-cover;background-image: url("@/static/images/game/food-jf-bj.png");margin-top: 20rpx;
+				.jf-icon{width: 35rpx;height: 35rpx;margin:0 4rpx 0 10rpx;flex-shrink: 0;
+				@include ezy-no-repeat-cover;background-image: url("@/static/images/my/jf-qb.png");}
+				.jf-text{min-width: 60rpx;text-align: center;color: #fff;}
+			}
+		}
+	}
 }

pages/game/components/food.vue

@@ -1,5 +1,5 @@
 <template>
-	<image v-if="imgUrl" :src="imgUrl" class="food-img-box" :class="'food-img'+shiwuId"></image>
+	<image v-if="imgUrl" :src="imgUrl"></image>
 </template>
 
 <script setup>

pages/game/components/foodSelect.vue

@@ -1,12 +1,30 @@
 <template>
 	<!-- 食物图标按钮 -->
 	<view @click="handleOpen" class="food-btn-box"></view>
-	<uni-popup ref="popupRef" type="bottom" border-radius="10px 10px 0 0" background-color="#fff">
-		<view style="height: 300px;display: flex;justify-content: space-between;">
-			<view v-for="item in foodSpeciesList" :key="item.id" @click="handleSelectFood(item)">
-				<img style="width: 50px;height: auto;" :src="item.imgUrl">
-				<text>{{item.credit}}</text>
+	<uni-popup ref="popupRef" type="bottom">
+		<view class="game-popup-box">
+			<view class="game-popup-head">
+				<view class="game-popup-title"></view>
+				<view class="jf-btn-box">
+					<!-- 积分 -->
+					<view class="ezy-jf-box game-popup-jf">
+						<icon class="jf-icon"></icon>
+						<text class="jf-text" >积分</text>
+					</view>
+					<!-- 关闭按钮 -->
+					<icon class="popup-close-btn"></icon>
+				</view>
 			</view>
+			<view class="food-list-box">
+				<view v-for="item in foodSpeciesList" :key="item.id" @click="handleSelectFood(item)" class="food-item-box">
+					<img :src="item.imgUrl">
+					<view class="food-item-jf">
+						<icon class="jf-icon"></icon>
+						<text class="jf-text" >{{item.credit}}</text>
+					</view>
+				</view>
+			</view>
+			
 		</view>
 	</uni-popup>
 </template>

pages/game/components/goose.vue

@@ -1,5 +1,5 @@
 <template>
-	<view class="game-goose-box">
+	<view>
 		<up-line-progress :percentage="progress" activeColor="#54e1fe" class="game-progress-box"></up-line-progress>
 		<image :src="imgUrl" class="goose-img-box"></image>
 	</view>

pages/game/index.vue

@@ -4,11 +4,15 @@
 		<!-- 返回按钮 -->
 		<view class="ezy-nav-bar-icon"></view>
 		<!-- 积分 -->
-		<view class="game-jf-box">{{credit}}</view>
+		<view class="ezy-jf-box game-jf-box">
+			<icon class="jf-icon"></icon>
+			<text class="jf-text" >{{credit}}</text>
+		</view>
 		<!-- 桌面食物 -->
-		<foodVue :shiwuId="shiwuId"></foodVue>
+		<foodVue :shiwuId="shiwuId" class="food-img-box" :class="'food-img'+shiwuId"></foodVue>
 		<!-- 大鹅 4阶段 -->
-		<gooseVue :growth="growth" :growthType="growthType" :progress="progress"></gooseVue>
+		<gooseVue :growth="growth" :growthType="growthType" :progress="progress"
+		class="game-goose-box" :class="'game-goose-box'+ growthType"></gooseVue>
 		<!-- 食物选择 -->
 		<foodSelectVue ref="foodSelectRef" :shiwuId="shiwuId" @weishi="onWeiShi"></foodSelectVue>
 		<!-- 游戏说明 -->

pages/my/index.vue

@@ -4,7 +4,7 @@
 			<icon class="head-img-box" :style="{backgroundImage: 'url(' + myInfoData.userImg + ')'}"></icon>
 			<view class="head-content-box">
 				<text>{{myInfoData.userName}}</text>
-				<view class="jf-box" v-if="loginFlag">
+				<view class="ezy-jf-box" v-if="loginFlag">
 					<icon class="jf-icon"></icon>
 					<text class="jf-text" >{{myInfoData.credit}}</text>
 				</view>