H5_QiCaiYao/pages/init.vue

<template>
	<div>
		<swiper class="swiper" :autoplay="true" :duration="800" @change="currentFun">
			<swiper-item v-for="(item, index) in dataList" :key="index" @tap.stop>
				<image :src="item.adv_image" mode="aspectFill" class="cover" @click="goPage(item)"></image>
			</swiper-item>
		</swiper>
		<view class="init-skip" @click="handleJump" v-if="showgg">跳过{{ time }}s</view>
	</div>
</template>
<script>
	export default {
		name: "init",
		data() {
			return {
				showgg:false,
				info: {},
				dataList: [],
				current: 0,
				time: 10,
				timer: null
			}
		},
		onLoad(e) {
			this.getComAdvertising()
			// this.handleJump()
			this.timer = setInterval(() => {
				if (this.time > 0) {
					this.time--
				} else {
					clearInterval(this.timer)
					this.handleJump()
				}
			}, 1000)
		},
		onUnload() {
			clearInterval(this.timer)
		},
		methods: {
			handleDetails() {},
			// 切换
			currentFun(e) {
				this.current = e.detail.current;
			},
			handleJump() {
				if (uni.getStorageSync('token')) {
					const userType = uni.getStorageSync('user_type');
					if (userType && Number(userType) === 1) {
						uni.redirectTo({
							url: '/page_salesman_index/index/index'
						});
						return
					}
				}
				uni.switchTab({
					url: '/pages/index/index'
				});
			},
			//开屏广告
			getComAdvertising() {
				this.$api.sendRequest({
					url: '/api/adv/appstartadvlist',
					data: {},
					success: res => {
						if (res.code==0&&res.data.data.length!=0) {
							console.log('-------------广告',res.data.data)
							this.showgg = true
							this.dataList = res.data.data
						} else {
							this.handleJump()
						}
					},
					error: res => {
						this.handleJump()
					}

				})
			},
			goPage(item) {
				let obj = JSON.parse(item.adv_url)
				this.$util.diyRedirectTo(obj);
			}
		}
	}
</script>

<style lang="less" scoped>
	.swiper {
		width: 100%;
		height: 100vh;
		background: #FFFFFF;

		.cover {
			width: 100%;
			height: 100vh;
		}
	}

	.init {
		position: relative;
		width: 100%;
		height: 100vh;
		background: #dd524d;

		&-skip {
			position: absolute;
			/*#ifdef APP-PLUS */
			top: 144rpx;
			/*#endif*/
			/*#ifdef MP-WEIXIN */
			top: 170rpx;
			/*#endif*/
			/*#ifdef H5 */
			top: 68rpx;
			/*#endif*/


			right: 42rpx;
			width: 142rpx;
			height: 52rpx;
			line-height: 52rpx;
			text-align: center;
			background: rgba(7, 7, 16, 0.4);
			// box-shadow: 0rpx 4rpx 8rpx 0rpx rgba(0, 0, 0, 0.3);
			border-radius: 128rpx;
			font-size: 28rpx;
			font-family: PingFangSC-Regular, PingFang SC;
			font-weight: 400;
			color: #FFFFFF;
		}

		&-details {
			position: absolute;
			bottom: 78rpx;
			left: 50%;
			transform: translateX(-50%);
			width: 290rpx;
			height: 92rpx;
			line-height: 92rpx;
			text-align: center;
			background: rgba(7, 7, 16, 0.63);
			box-shadow: 0rpx 4rpx 8rpx 0rpx rgba(0, 0, 0, 0.3);
			border-radius: 128rpx;
			border: 2rpx solid #979797;
			font-size: 28rpx;
			font-family: PingFangSC-Regular, PingFang SC;
			font-weight: 400;
			color: #FFFFFF;
			display: flex;
			align-items: center;
			justify-content: center;
		}
	}
</style>