65 lines
1.6 KiB
Vue
65 lines
1.6 KiB
Vue
|
<template>
|
||
|
|
<view class="swipperWrapper" v-show="showSwiper && swiperItems.length">
|
||
|
|
<swiper class="swiper" circular :indicator-dots="true" :autoplay="false" :interval="interval" :duration="duration">
|
||
|
|
<swiper-item v-for="item in swiperItems" :key="item.img_url">
|
||
|
|
<view class="swiperItem">
|
||
|
|
<image :src="item.img_url" mode="aspectFill" class="swiperItemImage" @click="toTarget(item)"></image>
|
||
|
|
</view>
|
||
|
|
</swiper-item>
|
||
|
|
</swiper>
|
||
|
|
<image src="/static/close.png" mode="aspectFit" class="closeIcon" @click="closeSwiper"></image>
|
||
|
|
</view>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
import { getSwiperList } from '@/services/home/home';
|
||
|
|
export default {
|
||
|
|
name: 'HomeSwiper',
|
||
|
|
props: {
|
||
|
|
position: {
|
||
|
|
type: Number,
|
||
|
|
required: false,
|
||
|
|
default: 1 // 1 首页
|
||
|
|
}
|
||
|
|
},
|
||
|
|
data() {
|
||
|
|
return {
|
||
|
|
showSwiper: true,
|
||
|
|
autoplay: true,
|
||
|
|
interval: 2000,
|
||
|
|
duration: 500,
|
||
|
|
swiperItems: []
|
||
|
|
};
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
async getSwiperData() {
|
||
|
|
const res = await getSwiperList(this.position);
|
||
|
|
if (res && res.code === 0) {
|
||
|
|
this.swiperItems = res.data;
|
||
|
|
}
|
||
|
|
},
|
||
|
|
toTarget(item) {
|
||
|
|
if (item.act_type == 1 || item.act_type == 2) {
|
||
|
|
if (item.contentId) {
|
||
|
|
uni.navigateTo({ url: `/pages/activity/detail?contentId=${item.contentId}&contentType=${item.act_type}` });
|
||
|
|
}
|
||
|
|
} else if (item.act_type == 3) {
|
||
|
|
uni.navigateTo({ url: '/pages/activity/shop/index' });
|
||
|
|
}
|
||
|
|
},
|
||
|
|
closeSwiper() {
|
||
|
|
this.showSwiper = false;
|
||
|
|
uni.removeStorageSync('swiper');
|
||
|
|
}
|
||
|
|
},
|
||
|
|
created() {
|
||
|
|
this.getSwiperData();
|
||
|
|
this.showSwiper = uni.getStorageSync('swiper');
|
||
|
|
}
|
||
|
|
};
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style lang="scss" scoped>
|
||
|
|
@import './index.scss';
|
||
|
|
</style>
|