zpj vor 2 Jahren
Ursprung
Commit
03441ed73c
1 geänderte Dateien mit 27 neuen und 18 gelöschten Zeilen
  1. 27 18
      pages/index/index.vue

+ 27 - 18
pages/index/index.vue

@@ -1,6 +1,6 @@
 <template>
 	<view class="index-box box-border-box flex-common-css" @click.stop="play()">
-		<view class="h-80 flex-justify-space box-border-box plr-32">
+		<view class="flex-justify-space box-border-box plr-32">
 			<image class="logo-img" src="@/static/img/c-logo.png" mode="scaleToFill"></image>
 			<image class="music-img" v-if="!isIos" :class="isPlay?'music-anumation':'music-anumation'"
 				src="@/static/img/c-music.png" mode="scaleToFill" @click.stop="musicPause()"></image>
@@ -9,8 +9,9 @@
 		</view>
 		<swiper class="swiper" :vertical='true' @change="swiperChange">
 			<!-- 邀请函 -->
-			<swiper-item>
-				<view class="swiper-item index-1" v-if="index == 0">
+			
+			<swiper-item class="swiper-item-f">
+				<scroll-view scroll-y="true" @scrolltolower="scrolltolower(1)" class="swiper-item index-1" v-if="index == 0">
 					<image class="img-text wow animate__animated animate__bounceInUp" src="@/static/img/yqh-text-1.png"
 						mode="scaleToFill"></image>
 
@@ -62,11 +63,11 @@
 
 					<image class="up-icon wow animate__animated animate__bounceInUp" src="@/static/img/c-up-icon.png"
 						mode="scaleToFill"></image>
-				</view>
+				</scroll-view>
 			</swiper-item>
 			<!-- 诚挚邀请 -->
 			<swiper-item>
-				<view class="swiper-item" v-if="index == 1">
+				<scroll-view scroll-y="true" @scrolltolower="scrolltolower(2)" class="swiper-item" v-if="index == 1">
 					<view class="index-2" >
 						<image class="text-img-3 wow animate__animated animate__bounceInUp"
 							src="@/static/img/hynr-text.png" mode="scaleToFill"></image>
@@ -95,12 +96,12 @@
 					</view>
 					<image class="up-icon wow animate__animated animate__bounceInUp" src="@/static/img/c-up-icon.png"
 						mode="scaleToFill"></image>
-				</view>
+				</scroll-view>
 			</swiper-item>
 
 			<!-- 参会名单 -->
 			<swiper-item>
-				<view class="swiper-item" v-if="index == 2">
+				<scroll-view scroll-y="true" @scrolltolower="scrolltolower(3)" class="swiper-item" v-if="index == 2">
 					<view class="index-2" >
 						<image class="text-img-1 wow animate__animated animate__bounceInUp"
 							src="@/static/img/chdb-text.png" mode="scaleToFill"></image>
@@ -155,12 +156,12 @@
 					</view>
 					<image class="up-icon wow animate__animated animate__bounceInUp" src="@/static/img/c-up-icon.png"
 						mode="scaleToFill"></image>
-				</view>
+				</scroll-view>
 			</swiper-item>
 
 			<!-- 活动地址 -->
 			<swiper-item>
-				<view class="swiper-item" v-if="index == 3">
+				<scroll-view scroll-y="true" @scrolltolower="scrolltolower(4)" class="swiper-item" v-if="index == 3">
 					<view class="index-2" >
 						<image class="text-img-1 wow animate__animated animate__bounceInUp"
 							src="@/static/img/hdtd-text.png" mode="scaleToFill"></image>
@@ -181,11 +182,11 @@
 					</view>
 					<image class="up-icon wow animate__animated animate__bounceInUp" src="@/static/img/c-up-icon.png"
 						mode="scaleToFill"></image>
-				</view>
+				</scroll-view>
 			</swiper-item>
 			<!-- 地址导航 -->
 			<swiper-item>
-				<view class="swiper-item" v-if="index == 4">
+				<scroll-view scroll-y="true" @scrolltolower="scrolltolower(5)" class="swiper-item" v-if="index == 4">
 					<view class="index-2">
 						<image class="text-img wow animate__animated animate__bounceInUp"
 							src="@/static/img/dzdh-text.png" mode="scaleToFill"></image>
@@ -230,11 +231,11 @@
 					</view>
 					<image class="up-icon wow animate__animated animate__bounceInUp" src="@/static/img/c-up-icon.png"
 						mode="scaleToFill"></image>
-				</view>
+				</scroll-view>
 			</swiper-item>
 			<!-- 参与预约 -->
 			<swiper-item v-if="isEnroll">
-				<view class="swiper-item" v-if="index == 5">
+				<scroll-view scroll-y="true" @scrolltolower="scrolltolower(isEnroll?6:5)" class="swiper-item" v-if="index == 5">
 					<view class="index-2">
 						<image class="text-img-2 wow animate__animated animate__bounceInUp"
 							src="@/static/img/cyyy-text-1.png" mode="scaleToFill"></image>
@@ -275,11 +276,11 @@
 					</view>
 					<image class="up-icon wow animate__animated animate__bounceInUp" src="@/static/img/c-up-icon.png"
 						mode="scaleToFill"></image>
-				</view>
+				</scroll-view>
 			</swiper-item>
 			<!-- 提示 -->
 			<swiper-item>
-				<view class="swiper-item" v-if="isEnroll?index == 6:index == 5">
+				<scroll-view scroll-y="true" class="swiper-item" v-if="isEnroll?index == 6:index == 5">
 					<view class="index-2">
 						<image class="text-img-3 wow animate__animated animate__bounceInUp"
 							src="@/static/img/wxts-text.png" mode="scaleToFill"></image>
@@ -311,7 +312,7 @@
 							<view class="fs-32 fc-3A2E1C">一键拨打</view>
 						</view>
 					</view>
-				</view>
+				</scroll-view>
 			</swiper-item>
 
 		</swiper>
@@ -379,6 +380,10 @@
 			}
 		},
 		methods: {
+			scrolltolower(num){
+				this.index = num
+			},
+			
 			musicPlay() {
 				// if (!this.audioServe) {
 				// 	this.audioServe = uni.createInnerAudioContext();
@@ -580,10 +585,14 @@
 	.swiper {
 		flex: 1;
 		width: 100%;
-		
+		overflow: auto;
+		.swiper-item-f{
+			width: 100%;
+			height: 100%;
+		}
 		.swiper-item {
 			width: 100%;
-			overflow: auto;
+			height: 100%;
 		}
 	}