orderSystemJp/raising-vue-uniapp-wx/components/landing-page/index.vue

<template>
	<view class="landing-page-section flex justify-center align-center "
	      :class="animateClass"
	 @touchmove.stop.prevent="clear" v-show="showPopup">
		<view class="popup_content flex justify-center align-center">
			<image style="width: 180rpx;height: 700rpx;" :src="pageLogoSrc" />
		</view>
	</view>
</template>

<script>
	
	import __config from '@/config/env';// 配置文件
	const util = require("utils/util.js");
	
	export default {
		name: "landing-page",
		props: {
		},
		data() {
			return {
				showPopup: false,
				animateClass: '',
				timeoutIns: undefined,
				timeoutNum: 1800,
				pageLogoSrc: require('@/static/public/img/landing-page-logo.png'),
			};
		},
		created: function() {
			var that = this;
			this.initAnimate()
		},
		methods: {
			/**
			 * 初始化动画css
			 */
			initAnimate(){
				let that = this;
				let rsLandingPageFlag = uni.getStorageSync('rs_landing_page_flag')
				if(rsLandingPageFlag && rsLandingPageFlag == '1'){
					return
				}
				that.showPopup = true
				that.$nextTick(()=> {
					if(that.timeoutIns) clearTimeout(that.timeoutIns)
					that.timeoutIns = setTimeout(()=> {
						that.animateClass = ' animated landing-page fadeOutUp '
						setTimeout(()=> {
							that.showPopup = false
							uni.setStorageSync('rs_landing_page_flag', '1')
						}, 2400)
					}, that.timeoutNum)
				})
			},
			// 禁止滚动
			clear() {
				return;
			},
			back() {
				
			},
			// 关闭弹框
			confirm() {
				this.showPopup = false;
				this.$emit('popupState', true);
				uni.setStorage({ 
					key: this.policyStorageKey,
					data: true
				});
			}
		}
	};
</script>

<style lang="scss" scoped>
	.landing-page-section{
		position: fixed;
		bottom: 0;
		top: 0;
		left: 0;
		right: 0;
		background-color: #3B3838;
		transition-property: opacity;
		transition-duration: 0.3s;
		z-index: 99999999999999;
	}
	
	.animated.landing-page {
	  -webkit-animation-duration: 2.3s;
	          animation-duration: 2.3s;
	}
	
</style>