74 lines
1.1 KiB
Vue
74 lines
1.1 KiB
Vue
<template>
|
|
<!-- 首页 -->
|
|
<div class="content">
|
|
<!-- 顶部轮播图 -->
|
|
<b-carousel
|
|
id="carousel-1"
|
|
:interval="4000"
|
|
controls
|
|
indicators
|
|
background="#ababab"
|
|
img-width="1024"
|
|
img-height="480"
|
|
>
|
|
<b-carousel-slide
|
|
v-for="item in bannerList"
|
|
:key="item.id"
|
|
:img-src="item.url"
|
|
@click.native="goPage(item)"
|
|
>
|
|
</b-carousel-slide>
|
|
</b-carousel>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
|
|
export default {
|
|
name: 'index',
|
|
data() {
|
|
return {
|
|
solutionList: [],
|
|
}
|
|
},
|
|
async asyncData({app}) {
|
|
const {data: bannerList} = await app.$axios.get('/index/bannerList')
|
|
|
|
return {
|
|
bannerList, // 轮播图
|
|
}
|
|
},
|
|
mounted() {
|
|
|
|
},
|
|
methods: {
|
|
goPage(item) {
|
|
if (item.link) {
|
|
window.open(item.link)
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.content {
|
|
width: 100%;
|
|
height: 100%;
|
|
.carousel:hover {
|
|
cursor: pointer;
|
|
}
|
|
.container {
|
|
overflow: hidden;
|
|
}
|
|
.fonts {
|
|
font-size: 1rem;
|
|
}
|
|
}
|
|
|
|
// 特殊样式小屏幕处理
|
|
@media screen and (max-width:400px) {
|
|
|
|
}
|
|
</style>
|