menduner-uniapp/components/Advertisement/index.vue

<template>
  <view >
		<uni-popup ref="inputDialog"  class="pop" :mask-click="false" @close="closeAdd">
			<view class="popup-content" >
					<swiper class="swiper-box" @change="swiperChange">
						<swiper-item v-for="(item ,index) in swiperList" :key="index" class="f-straight">
							<image class="img-item" :src="item.url" @click="skipLink()" mode="widthFix"></image>
							<view @click="closeAdd" class="f-horizon-center">
								<uni-icons style="display: flex;justify-content: flex-end;" type="closeempty"	size="40"	color="#fff"/>
							</view>
						</swiper-item>
					</swiper>
			</view>
		</uni-popup>
	</view>
</template>

<script setup>
import { ref, onMounted } from 'vue'
const emit = defineEmits(['login'])

const current = ref(0)
const inputDialog = ref()
const swiperList = [{ url: 'https://minio.citupro.com/dev/menduner/advertisement.jpg', path: '' }]

const closeAdd = () => {
  inputDialog.value.close()
	uni.removeStorageSync('firstOpen')
}

const openDialog = () => {
  inputDialog.value.open()
}

const skipLink = () => {
	closeAdd()
	emit('login')
}

const swiperChange = (e) => {
  current.value = e.detail.current
}

onMounted(() => {
  if(uni.getStorageSync('firstOpen')) openDialog()
})
</script>

<style scoped lang="scss">
.popup-content {
	align-items: center;
	justify-content: center;
	width: 80vw;
	height: 100vh;
}
.img-item{
	width: 100%;
	height: 60vh;
	margin: 0;
	border-radius: 20px;
}
.swiper-box{
	height: 100vh;
}
.f-straight{
	display: flex;
	justify-content: center;
	flex-direction: column;
}
</style>