From 3fd8a13fa5cd843f6a116653711526d580f98330 Mon Sep 17 00:00:00 2001
From: peng <peng.com>
Date: 星期一, 08 九月 2025 15:32:45 +0800
Subject: [PATCH] Merge remote-tracking branch 'origin/dev_fix_sub' into dev_fix_sub

---
 pages/prize/PrizeDetail/PrizeDetail.vue |  365 +++++++++++++++++++++++++++++++++++++++++++++++----
 1 files changed, 333 insertions(+), 32 deletions(-)

diff --git a/pages/prize/PrizeDetail/PrizeDetail.vue b/pages/prize/PrizeDetail/PrizeDetail.vue
index 86f8534..6e2bba5 100644
--- a/pages/prize/PrizeDetail/PrizeDetail.vue
+++ b/pages/prize/PrizeDetail/PrizeDetail.vue
@@ -1,10 +1,15 @@
 <template>
-	<view class="layout" >
+	<view class="layout">
 		<!-- 绀肩洅闆ㄨ楗板厓绱� -->
 		<view class="giftboxes-container">
 			<view class="giftbox" v-for="n in 15" :key="n" :class="'giftbox-' + n">
 				<text class="giftbox-icon">馃巵</text>
 			</view>
+		</view>
+
+		<!-- 娲诲姩瑙勫垯鎸夐挳 - 鍙充笂瑙� -->
+		<view class="floating-rules-btn" @tap="showActivityRules" v-if="false">
+			<text class="rules-btn-text">娲诲姩瑙勫垯</text>
 		</view>
 
 		<!-- 鑾峰彇鏇村鏈轰細鎸夐挳 - 鍙充笂瑙掓偓娴� -->
@@ -93,7 +98,7 @@
 						<text class="chance-title">鍒嗕韩濂藉弸</text>
 						<text class="chance-subtitle">+1娆℃満浼�</text>
 					</button>
-<!-- 					<view class="chance-item" @tap="shareToTimeline">
+					<!-- 					<view class="chance-item" @tap="shareToTimeline">
 						<view class="chance-icon">馃寪</view>
 						<text class="chance-title">鍒嗕韩鏈嬪弸鍦�</text>
 						<text class="chance-subtitle">+1娆℃満浼�</text>
@@ -120,6 +125,24 @@
 				</view>
 			</view>
 		</view>
+
+		<!-- 娲诲姩瑙勫垯寮圭獥 -->
+		<view class="rules-modal" v-if="showRulesModal" @tap="closeRulesModal">
+			<view class="rules-modal-content" @tap.stop>
+				<view class="modal-close" @tap="closeRulesModal">脳</view>
+
+				<view class="modal-title">
+					<text class="title-text">娲诲姩瑙勫垯</text>
+				</view>
+
+				<scroll-view scroll-y="true" class="rules-content">
+					<view class="rule-item" v-for="(rule, index) in activityRules" :key="rule.id">
+						<view class="rule-title" v-if="rule.title">{{ rule.title }}</view>
+						<text class="rule-text">{{ rule.text }}</text>
+					</view>
+				</scroll-view>
+			</view>
+		</view>
 	</view>
 
 </template>
@@ -140,7 +163,42 @@
 				// 寮圭獥鎺у埗
 				showPrizeModal: false,
 				showMoreChancesModal: false,
+				showRulesModal: false,
 				currentPrize: {},
+				// 娲诲姩瑙勫垯鏁版嵁
+				activityRules: [{
+						id: 1,
+						title: '涓�銆� 鍙備笌鏂瑰紡涓庤鍒欙細',
+						text: `1. 鍏嶈垂鎶藉鏈轰細鑾峰彇锛�
+						姣忔棩鐧诲綍锛� 鐢ㄦ埛姣忔棩鐧诲綍灏忕▼搴忥紝 鍗冲彲鑷姩鑾峰緱2娆″厤璐规娊濂栨満浼氾紱
+						浠诲姟璧氬彇锛� 瀹屾垚鎸囧畾浠诲姟锛� 鍙幏鍙栭澶栨棤涓婇檺鐨勬娊濂栨満浼氾紱
+						娴忚浠诲姟锛� 鍗曟璁块棶娲诲姩瑙嗛椤靛苟鍋滅暀鈮� 10 鍒嗛挓锛� 鍙澶栬幏寰�1娆℃満浼氾紱 鍗曟璁块棶鍟嗗搧璇︽儏椤靛仠鐣欌墺 1 鍒嗛挓锛� 鍙澶栬幏寰�1娆℃満浼氾紱
+						鍒嗕韩浠诲姟锛� 棣栨鍒嗕韩娲诲姩鑷虫湅鍙嬪湀鍙澶栬幏寰�1娆℃満浼氾紱 姣忔垚鍔熼個璇�1浣嶆柊鐢ㄦ埛鐐瑰嚮鎮ㄧ殑鍒嗕韩閾炬帴锛� 鍙啀寰�1娆℃満浼氾紱 濂藉弸閫氳繃鎮ㄧ殑閾炬帴瀹屾垚棣栨鎶藉锛� 鎮ㄥ彲鍐嶈幏寰�2娆℃満浼氥�俙
+					},
+					{
+						id: 2,
+						title: '浜屻�� 鎶藉瑙勫垯',
+						text: `1.鐢ㄦ埛娑堣��1娆℃娊濂栨満浼氬嵆鍙弬涓庝竴娆℃娊濂栵紱
+								 2.鏈娲诲姩濂栧搧姣忔棩闄愰噺锛屽厛鍒板厛寰楋紝鎶藉畬鍗虫銆�
+								  鐢ㄦ埛娑堣��1娆℃娊濂栨満浼氬嵆鍙弬涓庝竴娆℃娊濂栥�傛湰娆℃椿鍔ㄥ鍝佹瘡鏃ラ檺閲忥紝鍏堝埌鍏堝緱锛屾娊瀹屽嵆姝€��
+								  3.娉ㄦ剰浜嬮」锛氭瘡鏃ュ熀纭�鍏嶈垂鏈轰細浠呴檺褰撴棩浣跨敤锛屼笉绱鑷虫鏃ャ�傞�氳繃浠诲姟鑾峰緱鐨勯澶栨満浼氭棤涓婇檺銆傝纭繚鍒嗕韩鏃剁敓鎴愮殑鏄偍鏈汉鐨勪笓灞炲甫鍙傞摼鎺�/浜岀淮鐮侊紝鍚﹀垯鏃犳硶缁熻鎮ㄧ殑閭�璇峰叧绯汇�俙
+					},
+					{
+						id: 4,
+						title: '涓夈�佸鍝佹槑缁�',
+						text: '銆�銆�鏈鎶藉娲诲姩濂栧搧姹犲叿浣撴瘡鏃ュ簱瀛樹互灏忕▼搴忛〉闈㈠疄鏃舵樉绀轰负鍑嗐��'
+					},
+					{
+						id: 5,
+						title: '鍥涖�佸鍝佸彂鏀句笌棰嗗彇',
+						text: '銆�銆�1.涓閫氱煡锛氫腑濂栧悗锛岀郴缁熷皢鑷姩寮瑰嚭涓鎻愮ず锛屽苟鐢熸垚涓娴锋姤銆傛偍涔熷彲浠ュ疄鏃堕鍙栦篃鍙啀娲诲姩涓煡鐪嬩腑濂栬褰曘�俓n銆�銆�2.濂栧搧棰嗗彇锛氳鍦ㄦ敹鍒颁腑濂栭�氱煡鍚庣殑24灏忔椂鍐咃紝鍙婃椂濉啓骞剁‘璁ゆ敹璐у湴鍧�锛岄�炬湡瑙嗕负鑷姩鏀惧純濂栧搧銆俓n銆�銆�3.濂栧搧閫�鎹細鎵�鏈夊鍝佸潎涓烘椿鍔ㄧ壒瀹氱ぜ鍝侊紝涓嶄簣鎶樼幇銆佷笉閫�涓嶆崲銆傚閬囦骇鍝佽川閲忛棶棰橈紝璇蜂簬鏀惰揣鍚�24灏忔椂鍐呰仈绯诲鏈嶅鐞嗐��'
+					},
+					{
+						id: 6,
+						title: '浜斻�佸叾浠栨儏鍐佃鏄�',
+						text: '銆�銆�1.鐢ㄦ埛琛屼负瑙勮寖锛氫弗绂佺敤鎴烽�氳繃浠讳綍涓嶆褰撴墜娈碉紙濡備娇鐢ㄥ鎸傘�佹満鍣ㄤ汉銆佹伓鎰忔敞鍐屽涓处鍙枫�佽櫄鍋囧垎浜瓑锛夊弬涓庢椿鍔ㄣ�備竴缁忓彂鐜帮紝銆愭偍鐨勫搧鐗屽悕绉般�戞湁鏉冨彇娑堝叾鍙備笌鍙婅幏濂栬祫鏍硷紝骞朵繚鐣欒拷绌舵硶寰嬭矗浠荤殑鏉冨埄銆俓n銆�銆�2.鍙嶄綔寮婃潯娆撅細娲诲姩閲囩敤鎶�鏈墜娈佃繘琛岄鎺х洃娴嬶紝鍖呮嫭浣嗕笉闄愪簬锛氳澶嘔D鍘婚噸銆佸垎浜涓洪獙璇併�佸湴鐞嗕綅缃牳楠岀瓑锛屼互纭繚娲诲姩鐨勫叕骞虫�с�俓n銆�銆�3.娲诲姩鍙樻洿锛氬閬囦笉鍙姉鍔涘洜绱犳垨鎶�鏈棶棰樺鑷存椿鍔ㄦ棤娉曟甯歌繘琛岋紝銆愭偍鐨勫搧鐗屽悕绉般�戞湁鏉冩殏鍋溿�佸欢闀挎垨缁堟娲诲姩锛屽苟瑙嗘儏鍐靛娲诲姩瑙勫垯杩涜鍙樻洿鎴栬皟鏁达紝鐩稿叧鍙樺姩灏嗘彁鍓嶄簣浠ュ叕鍛娿�俓n銆�銆�4.涓汉淇℃伅淇濇姢锛氭偍鐨勪釜浜轰俊鎭粎鐢ㄤ簬鏈娲诲姩濂栧搧鍙戞斁鍙婂悗缁湇鍔★紝鎴戜滑灏嗕弗鏍间繚瀵嗭紝涓嶄細娉勯湶缁欎换浣曠涓夋柟銆俓n銆�銆�5.鍏嶈矗澹版槑锛氬浜庡洜缃戠粶銆侀�氫俊绛夊師鍥犲鑷寸敤鎴锋湭鑳藉弬涓庢椿鍔ㄦ垨棰嗗彇濂栧搧鐨勬儏鍐碉紝銆愭偍鐨勫搧鐗屽悕绉般�戜笉鎵挎媴浠讳綍璐d换銆俓n銆�銆�6.娲诲姩瑙i噴鏉冿細鏈椿鍔ㄦ渶缁堣В閲婃潈褰掋�愭偍鐨勫搧鐗屽悕绉般�戞墍鏈夈��'
+					}
+				],
 				// 鑷姩婊氬姩鎺у埗
 				scrollTimer: null,
 				scrollTop: 0,
@@ -152,9 +210,9 @@
 				prizeDraws: [],
 				// 鍒嗕韩鏈嬪弸鍦堝皾璇曟爣璁�
 				shareTimelineAttempt: false,
-				activityCover:'',
-				activityName:'',
-				couponId:''
+				activityCover: '',
+				activityName: '',
+				couponId: ''
 			};
 		},
 		computed: {
@@ -164,8 +222,8 @@
 			}
 		},
 		async onLoad(option) {
-		const pages = 	getCurrentPages()
-		console.log('================pages ',pages)
+			const pages = getCurrentPages()
+			console.log('================pages ', pages)
 			this.activityId = option.id
 			const prize = await prizeInfo(this.activityId);
 			this.activityCover = prize.data.data.activityCover
@@ -208,14 +266,15 @@
 			// this.startAutoScroll()
 		},
 		onShareAppMessage() {
-			return{
+			return {
 				title: this.activityName,
 				path: '/pages/prize/PrizeDetail/PrizeDetail?id=' + this.activityId,
-				imageUrl:this.activityCover,
+				imageUrl: this.activityCover,
 				success(e) {
-					console.log("鍒嗕韩鎴愬姛",e)
-				},fail(e) {
-					console.log('鍒嗕韩澶辫触',e)
+					console.log("鍒嗕韩鎴愬姛", e)
+				},
+				fail(e) {
+					console.log('鍒嗕韩澶辫触', e)
 				}
 			}
 		},
@@ -225,19 +284,25 @@
 		methods: {
 			async getUnmber(id) {
 				const prizeNums = await prizeNum(id);
-				this.remainingTimes = prizeNums.data.data
+				if(prizeNums.statusCode === 400){
+					uni.showModal({
+						title:'',
+						content:prizeNums.data.message
+					})
+				}
+				this.remainingTimes = prizeNums.data.data ||0
 			},
 			/**
 			 * 绔嬪嵆浣跨敤浼樻儬鍒�
 			 */
 			useItNow() {
-			
-			  // uni.navigateTo({
-			  //   url: `/pages/navigation/search/searchPage?promotionsId=${item.couponId}&promotionType=COUPON`,
-			  // });
-			  uni.navigateTo({
-			  	url: `/pages/commodity-square/coups-goods-list?promotionsId=${this.couponId}&promotionType=COUPON`
-			  });
+
+				// uni.navigateTo({
+				//   url: `/pages/navigation/search/searchPage?promotionsId=${item.couponId}&promotionType=COUPON`,
+				// });
+				uni.navigateTo({
+					url: `/pages/commodity-square/coups-goods-list?promotionsId=${this.couponId}&promotionType=COUPON`
+				});
 			},
 			async getGrantRecord(id) {
 				const record = await grantRecord(id);
@@ -281,6 +346,14 @@
 			// 鍏抽棴鑾峰彇鏇村鏈轰細寮圭獥
 			closeMoreChancesModal() {
 				this.showMoreChancesModal = false
+			},
+			// 鏄剧ず娲诲姩瑙勫垯寮圭獥
+			showActivityRules() {
+				this.showRulesModal = true
+			},
+			// 鍏抽棴娲诲姩瑙勫垯寮圭獥
+			closeRulesModal() {
+				this.showRulesModal = false
 			},
 			// 鍒嗕韩鍒板井淇″ソ鍙�
 			shareToFriend() {
@@ -333,7 +406,7 @@
 							// 妯℃嫙瑙傜湅瑙嗛瀹屾垚锛屽鍔犳娊濂栨鏁�
 							// 杩欓噷鍙互娣诲姞璺宠浆鍒板叿浣撹棰戦〉闈㈢殑閫昏緫
 							uni.navigateTo({
-							    url: '/pages/tabbar/index/home'
+								url: '/pages/tabbar/index/home'
 							});
 						}
 					}
@@ -350,7 +423,7 @@
 						if (res.confirm) {
 							// 杩欓噷鍙互娣诲姞璺宠浆鍒板叿浣撳晢鍝侀〉闈㈢殑閫昏緫
 							uni.navigateTo({
-							    url: '/pages/commodity-square/commoditySquare'
+								url: '/pages/commodity-square/commoditySquare'
 							});
 						}
 					}
@@ -366,7 +439,7 @@
 						if (res.confirm) {
 							// 鎴栬�呰烦杞埌璐墿杞�
 							uni.navigateTo({
-							    url: '/pages/cusbar/cart/cartList'
+								url: '/pages/cusbar/cart/cartList'
 							});
 						}
 					}
@@ -383,7 +456,7 @@
 					return
 				}
 				const prizeDraw = await prize(this.activityId);
-				console.log('---------------->',prizeDraw)
+				console.log('---------------->', prizeDraw)
 				let winId = 'notWIn'
 				if (prizeDraw.data.code == 200) {
 					winId = prizeDraw.data.data.id
@@ -396,10 +469,10 @@
 
 				// 濂栧搧鐨勭储寮�
 				this.$refs.dialer.run(findInfo)
-				if(prizeDraw.data.data){
+				if (prizeDraw.data.data) {
 					this.couponId = prizeDraw.data.data.couponId
 				}
-			
+
 				await this.getGrantRecord(this.activityId)
 			}
 		}
@@ -407,6 +480,7 @@
 </script>
 <style scoped>
 	@import url(@/pages/prize/PrizeDetail/prizeBg.css);
+
 	.layout {
 		width: 750rpx;
 		min-height: 100vh;
@@ -445,7 +519,7 @@
 		left: 0;
 		width: 100%;
 		height: 100%;
-		background-image: 
+		background-image:
 			/* 绀肩洅1 */
 			radial-gradient(ellipse 12rpx 15rpx at 10% -50%, #4834d4 0%, #4834d4 40%, transparent 41%),
 			/* 绀肩洅2 */
@@ -486,6 +560,7 @@
 		0% {
 			transform: translate(-10%, -10%) rotate(0deg);
 		}
+
 		100% {
 			transform: translate(10%, 10%) rotate(180deg);
 		}
@@ -497,12 +572,15 @@
 			transform: translateY(-100vh) rotate(0deg);
 			opacity: 0;
 		}
+
 		10% {
 			opacity: 1;
 		}
+
 		90% {
 			opacity: 1;
 		}
+
 		100% {
 			transform: translateY(100vh) rotate(360deg);
 			opacity: 0;
@@ -517,7 +595,7 @@
 		width: 100%;
 		height: 100%;
 		pointer-events: none;
-		z-index: 999;
+		z-index: 998;
 		overflow: hidden;
 	}
 
@@ -630,20 +708,25 @@
 			transform: translateY(-250rpx) rotate(0deg);
 			opacity: 0;
 		}
+
 		20% {
 			transform: translateY(-100rpx) rotate(45deg);
 			opacity: 0;
 		}
+
 		30% {
 			transform: translateY(-20rpx) rotate(90deg);
 			opacity: 1;
 		}
+
 		50% {
 			transform: translateY(50vh) rotate(180deg) translateX(20rpx);
 		}
+
 		90% {
 			opacity: 1;
 		}
+
 		100% {
 			transform: translateY(120vh) rotate(360deg) translateX(-30rpx);
 			opacity: 0;
@@ -655,20 +738,25 @@
 			transform: translateY(-230rpx) rotate(45deg);
 			opacity: 0;
 		}
+
 		18% {
 			transform: translateY(-80rpx) rotate(90deg);
 			opacity: 0;
 		}
+
 		28% {
 			transform: translateY(-10rpx) rotate(135deg);
 			opacity: 1;
 		}
+
 		40% {
 			transform: translateY(40vh) rotate(225deg) translateX(-25rpx);
 		}
+
 		85% {
 			opacity: 1;
 		}
+
 		100% {
 			transform: translateY(110vh) rotate(405deg) translateX(15rpx);
 			opacity: 0;
@@ -680,20 +768,25 @@
 			transform: translateY(-270rpx) rotate(-30deg);
 			opacity: 0;
 		}
+
 		15% {
 			transform: translateY(-120rpx) rotate(30deg);
 			opacity: 0;
 		}
+
 		25% {
 			transform: translateY(-30rpx) rotate(80deg);
 			opacity: 1;
 		}
+
 		60% {
 			transform: translateY(60vh) rotate(150deg) translateX(35rpx);
 		}
+
 		88% {
 			opacity: 1;
 		}
+
 		100% {
 			transform: translateY(125vh) rotate(330deg) translateX(-20rpx);
 			opacity: 0;
@@ -705,20 +798,25 @@
 			transform: translateY(-240rpx) rotate(60deg);
 			opacity: 0;
 		}
+
 		12% {
 			transform: translateY(-90rpx) rotate(120deg);
 			opacity: 0;
 		}
+
 		22% {
 			transform: translateY(-15rpx) rotate(180deg);
 			opacity: 1;
 		}
+
 		45% {
 			transform: translateY(45vh) rotate(240deg) translateX(-40rpx);
 		}
+
 		92% {
 			opacity: 1;
 		}
+
 		100% {
 			transform: translateY(115vh) rotate(420deg) translateX(25rpx);
 			opacity: 0;
@@ -730,20 +828,25 @@
 			transform: translateY(-260rpx) rotate(-45deg);
 			opacity: 0;
 		}
+
 		10% {
 			transform: translateY(-110rpx) rotate(-10deg);
 			opacity: 0;
 		}
+
 		20% {
 			transform: translateY(-25rpx) rotate(45deg);
 			opacity: 1;
 		}
+
 		55% {
 			transform: translateY(55vh) rotate(135deg) translateX(30rpx);
 		}
+
 		95% {
 			opacity: 1;
 		}
+
 		100% {
 			transform: translateY(130vh) rotate(315deg) translateX(-35rpx);
 			opacity: 0;
@@ -755,20 +858,25 @@
 			transform: translateY(-220rpx) rotate(90deg);
 			opacity: 0;
 		}
+
 		25% {
 			transform: translateY(-70rpx) rotate(150deg);
 			opacity: 0;
 		}
+
 		35% {
 			transform: translateY(-5rpx) rotate(210deg);
 			opacity: 1;
 		}
+
 		45% {
 			transform: translateY(35vh) rotate(270deg) translateX(-15rpx);
 		}
+
 		80% {
 			opacity: 1;
 		}
+
 		100% {
 			transform: translateY(105vh) rotate(450deg) translateX(40rpx);
 			opacity: 0;
@@ -780,20 +888,25 @@
 			transform: translateY(-280rpx) rotate(-60deg);
 			opacity: 0;
 		}
+
 		8% {
 			transform: translateY(-130rpx) rotate(-20deg);
 			opacity: 0;
 		}
+
 		16% {
 			transform: translateY(-40rpx) rotate(20deg);
 			opacity: 1;
 		}
+
 		65% {
 			transform: translateY(65vh) rotate(120deg) translateX(45rpx);
 		}
+
 		94% {
 			opacity: 1;
 		}
+
 		100% {
 			transform: translateY(135vh) rotate(300deg) translateX(-25rpx);
 			opacity: 0;
@@ -805,20 +918,25 @@
 			transform: translateY(-235rpx) rotate(30deg);
 			opacity: 0;
 		}
+
 		16% {
 			transform: translateY(-85rpx) rotate(90deg);
 			opacity: 0;
 		}
+
 		26% {
 			transform: translateY(-8rpx) rotate(150deg);
 			opacity: 1;
 		}
+
 		42% {
 			transform: translateY(42vh) rotate(210deg) translateX(-30rpx);
 		}
+
 		82% {
 			opacity: 1;
 		}
+
 		100% {
 			transform: translateY(118vh) rotate(390deg) translateX(35rpx);
 			opacity: 0;
@@ -830,20 +948,25 @@
 			transform: translateY(-250rpx) rotate(-15deg);
 			opacity: 0;
 		}
+
 		18% {
 			transform: translateY(-95rpx) rotate(60deg);
 			opacity: 0;
 		}
+
 		28% {
 			transform: translateY(-15rpx) rotate(120deg);
 			opacity: 1;
 		}
+
 		55% {
 			transform: translateY(48vh) rotate(200deg) translateX(25rpx);
 		}
+
 		88% {
 			opacity: 1;
 		}
+
 		100% {
 			transform: translateY(122vh) rotate(380deg) translateX(-40rpx);
 			opacity: 0;
@@ -855,20 +978,25 @@
 			transform: translateY(-265rpx) rotate(75deg);
 			opacity: 0;
 		}
+
 		20% {
 			transform: translateY(-105rpx) rotate(135deg);
 			opacity: 0;
 		}
+
 		30% {
 			transform: translateY(-22rpx) rotate(195deg);
 			opacity: 1;
 		}
+
 		50% {
 			transform: translateY(52vh) rotate(270deg) translateX(-35rpx);
 		}
+
 		85% {
 			opacity: 1;
 		}
+
 		100% {
 			transform: translateY(115vh) rotate(450deg) translateX(30rpx);
 			opacity: 0;
@@ -880,20 +1008,25 @@
 			transform: translateY(-245rpx) rotate(-45deg);
 			opacity: 0;
 		}
+
 		15% {
 			transform: translateY(-88rpx) rotate(15deg);
 			opacity: 0;
 		}
+
 		25% {
 			transform: translateY(-12rpx) rotate(75deg);
 			opacity: 1;
 		}
+
 		45% {
 			transform: translateY(45vh) rotate(165deg) translateX(38rpx);
 		}
+
 		90% {
 			opacity: 1;
 		}
+
 		100% {
 			transform: translateY(128vh) rotate(345deg) translateX(-28rpx);
 			opacity: 0;
@@ -905,20 +1038,25 @@
 			transform: translateY(-275rpx) rotate(45deg);
 			opacity: 0;
 		}
+
 		22% {
 			transform: translateY(-112rpx) rotate(105deg);
 			opacity: 0;
 		}
+
 		32% {
 			transform: translateY(-28rpx) rotate(165deg);
 			opacity: 1;
 		}
+
 		48% {
 			transform: translateY(46vh) rotate(240deg) translateX(-42rpx);
 		}
+
 		86% {
 			opacity: 1;
 		}
+
 		100% {
 			transform: translateY(120vh) rotate(420deg) translateX(32rpx);
 			opacity: 0;
@@ -930,20 +1068,25 @@
 			transform: translateY(-255rpx) rotate(-30deg);
 			opacity: 0;
 		}
+
 		14% {
 			transform: translateY(-98rpx) rotate(30deg);
 			opacity: 0;
 		}
+
 		24% {
 			transform: translateY(-18rpx) rotate(90deg);
 			opacity: 1;
 		}
+
 		60% {
 			transform: translateY(58vh) rotate(180deg) translateX(45rpx);
 		}
+
 		92% {
 			opacity: 1;
 		}
+
 		100% {
 			transform: translateY(132vh) rotate(360deg) translateX(-22rpx);
 			opacity: 0;
@@ -955,20 +1098,25 @@
 			transform: translateY(-240rpx) rotate(60deg);
 			opacity: 0;
 		}
+
 		19% {
 			transform: translateY(-92rpx) rotate(120deg);
 			opacity: 0;
 		}
+
 		29% {
 			transform: translateY(-16rpx) rotate(180deg);
 			opacity: 1;
 		}
+
 		52% {
 			transform: translateY(50vh) rotate(255deg) translateX(-20rpx);
 		}
+
 		84% {
 			opacity: 1;
 		}
+
 		100% {
 			transform: translateY(125vh) rotate(435deg) translateX(38rpx);
 			opacity: 0;
@@ -980,20 +1128,25 @@
 			transform: translateY(-260rpx) rotate(-60deg);
 			opacity: 0;
 		}
+
 		17% {
 			transform: translateY(-102rpx) rotate(0deg);
 			opacity: 0;
 		}
+
 		27% {
 			transform: translateY(-20rpx) rotate(60deg);
 			opacity: 1;
 		}
+
 		58% {
 			transform: translateY(54vh) rotate(150deg) translateX(33rpx);
 		}
+
 		87% {
 			opacity: 1;
 		}
+
 		100% {
 			transform: translateY(119vh) rotate(330deg) translateX(-45rpx);
 			opacity: 0;
@@ -1001,7 +1154,7 @@
 	}
 
 	/* 纭繚鎵�鏈夊瓙鍏冪礌鍦ㄨ儗鏅楗颁箣涓� */
-	.layout > * {
+	.layout>* {
 		position: relative;
 		z-index: 1;
 	}
@@ -1039,6 +1192,66 @@
 		z-index: 10;
 	}
 
+	/* 鍙充笂瑙掓椿鍔ㄨ鍒欐寜閽� */
+	.floating-rules-btn {
+		position: fixed;
+		top: 140rpx;
+		right: 0;
+		width: auto;
+		height: 60rpx;
+		background: linear-gradient(45deg, #ff6b6b, #ff9ff3);
+		border-radius: 30rpx 0 0 30rpx;
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		padding: 0 20rpx;
+		box-shadow: 0 6rpx 20rpx rgba(255, 107, 107, 0.4);
+		z-index: 9999;
+		transition: all 0.3s ease;
+	}
+
+	.floating-rules-btn::before {
+		content: '';
+		position: absolute;
+		width: 100%;
+		height: 100%;
+		border-radius: 30rpx 0 0 30rpx;
+		background: linear-gradient(45deg, #ff6b6b, #ff9ff3);
+		opacity: 0.8;
+		animation: pulse-rules 2s infinite;
+	}
+
+	@keyframes pulse-rules {
+		0% {
+			transform: scale(1);
+			opacity: 0.8;
+		}
+
+		50% {
+			transform: scale(1.05);
+			opacity: 0.4;
+		}
+
+		100% {
+			transform: scale(1);
+			opacity: 0.8;
+		}
+	}
+
+	.floating-rules-btn:active {
+		transform: scale(0.95);
+		box-shadow: 0 4rpx 15rpx rgba(255, 107, 107, 0.5);
+	}
+
+	.rules-btn-text {
+		color: white;
+		font-size: 24rpx;
+		font-weight: bold;
+		z-index: 1;
+		position: relative;
+		text-shadow: 0 1rpx 3rpx rgba(0, 0, 0, 0.2);
+	}
+
 	/* 鍙充笂瑙掓偓娴幏鍙栨洿澶氭満浼氭寜閽� */
 	.floating-more-btn {
 		position: fixed;
@@ -1052,7 +1265,7 @@
 		align-items: center;
 		justify-content: center;
 		box-shadow: 0 6rpx 20rpx rgba(255, 107, 107, 0.4);
-		z-index: 999;
+		z-index: 9999;
 		transition: all 0.3s ease;
 	}
 
@@ -1123,6 +1336,7 @@
 		justify-content: space-between;
 		gap: 20rpx;
 	}
+
 	.prize-item {
 		width: 30%;
 		margin-bottom: 20rpx;
@@ -1374,15 +1588,18 @@
 		gap: 20rpx;
 		margin-bottom: 30rpx;
 	}
-	.chances-grid button{
+
+	.chances-grid button {
 		padding: 25rpx 15rpx;
 		margin: 0;
 		line-height: normal;
 		border: none;
 	}
-	.chances-grid button::after{
+
+	.chances-grid button::after {
 		border: none;
 	}
+
 	.chance-item {
 		width: 45%;
 		background: linear-gradient(45deg, #ff6b6b, #feca57);
@@ -1464,4 +1681,88 @@
 		font-size: 26rpx;
 		font-weight: 500;
 	}
+
+	/* 娲诲姩瑙勫垯寮圭獥鏍峰紡 */
+	.rules-modal {
+		position: fixed;
+		top: 0;
+		left: 0;
+		width: 100%;
+		height: 100%;
+		background: rgba(0, 0, 0, 0.6);
+		display: flex;
+		justify-content: center;
+		align-items: center;
+		z-index: 9999;
+	}
+
+	.rules-modal-content {
+		background: white;
+		border-radius: 30rpx;
+		width: 95%;
+		max-width: 700rpx;
+		max-height: 80vh;
+		padding: 40rpx;
+		position: relative;
+		box-shadow: 0 10rpx 40rpx rgba(0, 0, 0, 0.3);
+		display: flex;
+		flex-direction: column;
+	}
+
+	.rules-content {
+		max-height: 60vh;
+		overflow-y: auto;
+		-webkit-overflow-scrolling: touch;
+		flex: 1;
+	}
+
+	.rules-content::-webkit-scrollbar {
+		width: 4rpx;
+	}
+
+	.rules-content::-webkit-scrollbar-track {
+		background: #f1f1f1;
+		border-radius: 2rpx;
+	}
+
+	.rules-content::-webkit-scrollbar-thumb {
+		background: #667eea;
+		border-radius: 2rpx;
+	}
+
+	.rules-content::-webkit-scrollbar-thumb:hover {
+		background: #5a67d8;
+	}
+
+	.rule-item {
+		display: flex;
+		flex-direction: column;
+		margin-bottom: 25rpx;
+		padding-bottom: 20rpx;
+		border-bottom: 1px solid #f0f0f0;
+		line-height: 1.6;
+	}
+
+	.rule-item:last-child {
+		border-bottom: none;
+		margin-bottom: 0;
+	}
+
+	.rule-title {
+		color: #333;
+		font-size: 28rpx;
+		font-weight: bold;
+		margin-bottom: 10rpx;
+		color: #ff6b6b;
+	}
+
+	.rule-text {
+		color: #333;
+		font-size: 24rpx;
+		line-height: 1.8;
+		flex: 1;
+		text-align: left;
+		white-space: pre-line;
+		word-break: break-word;
+	}
 </style>
\ No newline at end of file

--
Gitblit v1.8.0