Files
dvcp_v2_wechat_app/src/project/lianhua/AppHome/openPage.vue

122 lines
2.7 KiB
Vue

<template>
<div class="openPage">
<!-- <img class="images" :src="picUrl" alt=""> -->
<div class="uni-swiper-dot-box">
<swiper class="swiper-box" @change="change" :current="current">
<swiper-item v-for="(item, index) in imgList" :key="index">
<img :src="item" alt="" class="banner-img">
</swiper-item>
</swiper>
<div class="dot-list">
<span v-for="(item, index) in dotList" :key="index" :class="current == index ? 'active' : ''"></span>
</div>
</div>
</div>
</template>
<script>
export default {
name: "openPage",
customNavigation: true,
data() {
return {
picUrl: '',
status: '',
imgList: [
'https://cdn.cunwuyun.cn/wechat/wuxi/wuxi-page1.png',
'https://cdn.cunwuyun.cn/wechat/wuxi/wuxi-page2.png',
'https://cdn.cunwuyun.cn/wechat/wuxi/wuxi-page3.png',
],
current: 0,
dotList: [0, 1, 2]
}
},
methods: {
change(e) {
this.current = e.detail.current;
if(this.current == 2) {
setTimeout(() => {
uni.switchTab({
url: '/pages/AppHome/AppHome'
})
}, 2000)
}
},
getStatus() {
this.$instance.post('/app/appwechatguidepage/enableStatus',null, { withoutToken: true }).then(res=> {
if(res?.data) {
this.status = res.data
if(this.status==0) {
uni.switchTab({
url: '/pages/AppHome/AppHome'
})
} else {
// this.getList()
// setTimeout(() => {
// uni.switchTab({
// url: '/pages/AppHome/AppHome'
// })
// }, 3000)
}
}
})
},
getList() {
this.$instance.post('/app/appwechatguidepage/listForXCX',null, {
withoutToken: true,
params: {
current: 1,
size: 100,
}
}).then(res=> {
if(res?.data) {
let nums = res.data.records
let index = Math.floor(Math.random() * nums.length)
this.picUrl = nums[index].picUrl
}
})
}
},
onShow() {
this.getStatus()
},
}
</script>
<style scoped lang="scss">
.openPage {
width: 100%;
height: 100vh;
box-sizing: border-box;
::v-deep .uni-swiper-dot-box {
width: 100%!important;
height: 100%!important;
}
::v-deep .swiper-box {
height: 100%!important;
}
.banner-img {
width: 100%;
height: 100%;
}
.dot-list {
position: fixed;
bottom: 118px;
width: 100%;
text-align: center;
span {
display: inline-block;
width: 12px;
height: 12px;
opacity: 0.3;
background: #026AF2;
border-radius: 6px;
margin-right: 8px;
}
.active {
width: 22px;
opacity: 1;
}
}
}
</style>