<template>
	<view class="content" :style="{ paddingTop: statusBarHeight + 'px' }">
		<swiper class="swiper" circular :indicator-dots="true"
		 indicator-color="#fff" indicator-active-color="#58b3df" 
		 :autoplay="false" :interval="2000" :duration="2000">
			<swiper-item v-for="img in imgList">
				<image :src="img" class="swiper-item"></image>
			</swiper-item>
		</swiper>
	</view>
</template>

<script setup>
import { ref, onMounted } from "vue";
import { onShow } from "@dcloudio/uni-app";
const imgList = ref([
	'http://gips3.baidu.com/it/u=764883555,2569275522&fm=3028&app=3028&f=JPEG&fmt=auto?w=960&h=1280',
	'http://gips3.baidu.com/it/u=764883555,2569275522&fm=3028&app=3028&f=JPEG&fmt=auto?w=960&h=1280',
	'http://gips3.baidu.com/it/u=764883555,2569275522&fm=3028&app=3028&f=JPEG&fmt=auto?w=960&h=1280',
	'https://img2.baidu.com/it/u=4214113141,2036563917&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=889',
	'https://img0.baidu.com/it/u=3803731919,348987985&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=996',
	
])
var statusBarHeight = uni.getStorageSync('statusBarHeight')
</script>

<style lang="scss" scoped>
	.uni-margin-wrap {
			width: 690rpx;
			width: 100%;
		}
		.swiper {
			height: 100vh;
		}
		.swiper-item {
			display: block;
			height: 100vh;
			width: 100%;
		}
		.swiper-list {
			margin-top: 40rpx;
			margin-bottom: 0;
		}
		.uni-common-mt {
			margin-top: 60rpx;
			position: relative;
		}
		.info {
			position: absolute;
			right: 20rpx;
		}
		.uni-padding-wrap {
			width: 550rpx;
			padding: 0 100rpx;
		}
</style>