v1.0

poly/pages/led/index - 副本.uvue

@@ -1,248 +0,0 @@
-<template>
-	<view class="body">
-		<view class="content bg-led02">
-			<view class="pic-container">
-				<!-- <image class="pic" mode="aspectFill" :src="imageSrc"></image> -->
-				<swiper class="swiper" autoplay circular :current="picCurIndex" :interval="picInterval" :duration="picDuration" @change="swiperChange">
-					<swiper-item v-for="(image, index) in picList" :key="index">
-						<image class="pic" mode="aspectFit" :src="image"></image>
-					</swiper-item>
-				</swiper>
-			</view>
-			<view class="distance-container">
-				<view class="total-time">总用时:　{{durationStr}}</view>
-				<view class="total-distance">{{distanceKm}}KM</view>
-			</view>
-			<image class="mascot" mode="aspectFit" src="/static/led/mascot.png"></image>
-			<image class="lpzg" mode="aspectFit" src="/static/lpzg.png"></image>
-		</view>
-	</view>
-</template>
-
-<script>
-	import tools from '../../common/tools';
-	import { apiGetStatistics, apiGetUploadPic } from '../../common/api';
-
-	export default {
-		data() {
-			return {
-				actIdArrStr: "175,176,177,178",
-				SumDuration: 0,
-				SumDistance: 0,
-				picCount: 0,
-				picList: [''],
-				picInterval: 3000,	// 自动切换时间间隔
-				picDuration: 500,	// 滑动动画时长
-				picCurIndex: 0,		// swiper当前所在滑块的 index
-				intervalSta: 0,
-				// imageSrc: '',
-			}
-		},
-		computed: {
-			durationStr() {
-				return tools.convertSecondsToHMS(this.SumDuration);
-			},
-			distanceKm() {
-				if (this.SumDistance < 1000000)
-					return Math.round(this.SumDistance * 10 / 1000) / 10;
-				else
-					return Math.round(this.SumDistance / 1000);
-			}
-		},
-		onLoad(event) { // 类型非必填，可自动推导
-			// this.SumDuration = 1622;
-			// this.SumDistance = 999050;
-			// this.SumDistance = 999949;
-			// this.SumDistance = 2066869;
-			// this.imageSrc = "/static/led/pic2.jpg";
-
-			this.getStatistics();
-			this.getUploadPic();
-			
-			this.intervalSta = setInterval(this.getStatistics, 1000);
-		},
-		onUnload() {
-			console.log("onUnload");
-			clearInterval(this.intervalSta);
-		},
-		methods: {
-			getStatistics() {
-				uni.request({
-					url: apiGetStatistics,
-					header: {
-						"Content-Type": "application/x-www-form-urlencoded",
-					},
-					method: "POST",
-					data: {
-						actIdArrStr: this.actIdArrStr
-					},
-					success: (res) => {
-						// console.log("getStatistics", res)
-						const data = res.data.data;
-						this.SumDuration = data.SumDuration;
-						this.SumDistance = data.SumDistance;
-					},
-					fail: (err) => {
-						console.log("getStatistics err", err)
-					},
-				});
-			},
-			getUploadPic() {
-				uni.request({
-					url: apiGetUploadPic,
-					header: {
-						"Content-Type": "application/x-www-form-urlencoded",
-					},
-					method: "POST",
-					data: {
-						actIdArrStr: this.actIdArrStr
-					},
-					success: (res) => {
-						// console.log("getUploadPic", res);
-						const data = res.data.data;
-						const newCount = data.List.length;
-						console.log("newCount", newCount);
-						if (newCount > 0) {
-							this.picList.length = 0;	// 清空数组
-							for	(let i=0; i<newCount; i++) {
-								let picUrl = data.Domain + data.List[i];
-								// console.log("picUrl: " + picUrl);
-								this.picList.push(picUrl);
-							}
-							this.picCurIndex = this.picCount - 1;
-							console.log("重定位 index", this.picCurIndex);
-						}
-						this.picCount = newCount;
-						if (this.picCount == 0) {
-							setTimeout(this.getUploadPic, 1000);
-						} else if (this.picCount == 1) {
-							// swiper在只有1张图片的情况下不会触发 @change事件，需要在这里再次获取图片数据
-							setTimeout(this.getUploadPic, this.picInterval);
-						} 
-						// console.log("picList", this.picList);
-					},
-					fail: (err) => {
-						console.log("getUploadPic err", err);
-						setTimeout(this.getUploadPic, 3000);
-					},
-				});
-			},
-			//当前轮播索引
-			swiperChange(e) {
-				console.log("pic index: " +  e.detail.current);
-				const curIndex = e.detail.current;
-				// 播放完最后一张图片后重新获取图片数据
-				if (curIndex == this.picCount - 1) {
-					console.log("播放完毕，重新获取图片数据...");
-					// this.picCurIndex = curIndex;
-					this.getUploadPic();
-				}
-			},
-			//点击轮播
-			swiperClick(e) {
-				console.log('点击轮播', e);
-			},
-			animationfinish() {
-				console.log('animationfinish');
-			}
-		}
-	}
-</script>
-
-<style>
-	.body {
-		/* width: 100%; */
-		/* height: 100vh; */
-		width: 1920px;
-		height: 1440px;
-		display: flex;
-		flex-direction: column;
-		align-items: center;
-		justify-content: center;
-	}
-
-	.content {
-		width: 100%;
-		height: 100%;
-		flex-direction: row;
-		align-items: flex-start;
-		/* justify-content: flex-start; */
-	}
-
-	.bg-led01 {
-		background-image: url("/static/led/led01.webp");
-		background-repeat: no-repeat;
-		background-size: contain;
-	}
-
-	.bg-led02 {
-		background-image: url("/static/led/led02.webp");
-		background-repeat: no-repeat;
-		background-size: contain;
-	}
-
-	.pic-container {
-		width: 1300px;
-		height: 850px;
-		margin-left: 76px;
-		margin-top: 303px;
-		background: url("/static/led/pic_border.png");
-		background-repeat: no-repeat;
-		background-size: contain;
-	}
-
-	.swiper {
-		height: 850px;
-		mask-image: url('/static/led/pic_mask.png');
-		mask-size: 1298px;
-		mask-repeat: no-repeat;
-	}
-	
-	.pic {
-		margin: 3px;
-		width: 1300px;
-		height: 840px;
-		/* mask-image: url('/static/led/pic_mask.png');
-		mask-size: 1293px;
-		mask-repeat: no-repeat; */
-	}
-
-	.distance-container {
-		align-items: center;
-		justify-content: space-around;
-		width: 695px;
-		height: 296px;
-		margin-left: -253px;
-		margin-top: 946px;
-		background: url("/static/led/distance_bg.png") no-repeat;
-		background-size: cover;
-	}
-
-	.total-time {
-		font-family: 'Arial Black';
-		font-size: 36px;
-		color: #ffffff;
-		margin-left: 250px;
-		line-height: 50px;
-	}
-
-	.total-distance {
-		font-family: 'Arial';
-		font-size: 200px;
-		transform: scaleX(0.8);
-		color: #ffffff;
-		line-height: 180px;
-	}
-
-	.mascot {
-		height: 468px;
-		margin-left: -495px;
-		margin-top: 486px;
-	}
-
-	.lpzg {
-		width: 468px;
-		margin-left: -1540px;
-		margin-top: 1072px;
-	}
-</style>