提交 9b7ddf33 authored 作者: matian's avatar matian

feat:加州浸会大学新增校园一览

上级 f39ef228
...@@ -78,6 +78,18 @@ export default { ...@@ -78,6 +78,18 @@ export default {
// { name: this.$t('menu.courseChild.teachers'), path: '/about/teacher' } // { name: this.$t('menu.courseChild.teachers'), path: '/about/teacher' }
] ]
}, },
// 校园一览
{
name: this.$t('menu.campusList'),
path: '/campusList/campusList'
// childern: [
// { name: this.$t('menu.projectChild.bg'), path: '/project-intro/introduce' },
// { name: this.$t('menu.newsChild.hot'), path: '/news/hot' }
// // { name: this.$t('menu.projectChild.feature'), path: '/project-intro/charac' },
// // { name: this.$t('menu.projectChild.cert'), path: '/project-intro/certificate' }
// ]
},
// 学历认证 // 学历认证
{ {
name: this.$t('menu.academic'), name: this.$t('menu.academic'),
......
...@@ -15,6 +15,7 @@ export default { ...@@ -15,6 +15,7 @@ export default {
returnPolicy: '归国政策', returnPolicy: '归国政策',
question: '常见问题', question: '常见问题',
apply: '报名申请', apply: '报名申请',
campusList: '校园一览',
projectChild: { projectChild: {
bg: '项目介绍', bg: '项目介绍',
feature: '项目特色', feature: '项目特色',
......
<template>
<div class="main_content">
<TabContent @tabChange="tabChange" />
<div class="main_content_list">
<div class="list_con" v-for="(item, index) in swiperList" :key="index">
<img :src="item.img_small" class="con_imgSmall" @click="handleShowPic(index)" />
</div>
</div>
<div class="swiper-content" v-show="isShowSwiper === true">
<div v-swiper:mySwiper="swiperOption" ref="mySwiper">
<div class="swiper-wrapper">
<div class="swiper-slide" v-for="(item, indexItem) in swiperList" :key="indexItem">
<img :src="item.img_big" class="img_big" />
<img
src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/swiper_next.png"
alt=""
class="swiper_next"
@click="handleNext(indexItem)"
/>
<img
src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/swiper_prev.png"
alt=""
class="swiper_prev"
@click="handlePrev(indexItem)"
/>
</div>
</div>
</div>
</div>
<div class="overlay" @click="handleClose" v-if="isShowSwiper === true"></div>
</div>
</template>
<script>
import TabContent from './components/TabContent.vue'
import 'swiper/css/swiper.css'
export default {
layout: 'normal',
components: {
TabContent
},
data() {
const _this = this
return {
campusList: [
{
list: [
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/library1_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/library1_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/library2_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/library2_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/library3_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/library3_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/library4_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/library4_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/library5_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/library5_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/library6_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/library6_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/library7_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/library7_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/library8_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/library8_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/library9_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/library9_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/library10_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/library10_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/library11_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/library11_2.png'
}
]
},
{
list: [
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/laboratory1_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/laboratory1_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/laboratory2_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/laboratory2_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/laboratory3_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/laboratory3_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/laboratory4_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/laboratory4_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/laboratory5_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/laboratory5_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/laboratory6_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/laboratory6_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/laboratory7_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/laboratory7_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/laboratory8_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/laboratory8_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/laboratory9_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/laboratory9_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/laboratory10_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/laboratory10_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/laboratory11_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/laboratory11_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/laboratory12_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/laboratory12_2.png'
}
]
},
{
list: [
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/restaurant1_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/restaurant1_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/restaurant2_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/restaurant2_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/restaurant3_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/restaurant3_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/restaurant4_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/restaurant4_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/restaurant5_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/restaurant5_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/restaurant6_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/restaurant6_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/restaurant7_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/restaurant7_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/restaurant8_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/restaurant8_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/restaurant9_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/restaurant9_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/restaurant10_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/restaurant10_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/restaurant11_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/restaurant11_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/restaurant12_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/restaurant12_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/restaurant13_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/restaurant13_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/restaurant14_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/restaurant14_2.png'
}
]
},
{
list: [
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/playField1_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/playField1_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/playField2_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/playField2_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/playField3_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/playField3_1.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/playField4_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/playField4_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/playField5_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/playField5_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/playField6_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/playField6_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/playField7_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/playField7_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/playField8_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/playField8_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/playField9_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/playField9_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/playField10_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/playField10_2.png'
}
]
},
{
list: [
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/schoolSenery1_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/schoolSenery1_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/schoolSenery2_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/schoolSenery2_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/schoolSenery3_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/schoolSenery3_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/schoolSenery4_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/schoolSenery4_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/schoolSenery5_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/schoolSenery5_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/schoolSenery6_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/schoolSenery6_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/schoolSenery7_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/schoolSenery7_1.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/schoolSenery8_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/schoolSenery8_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/schoolSenery9_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/schoolSenery9_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/schoolSenery10_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/schoolSenery10_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/schoolSenery11_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/schoolSenery11_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/schoolSenery12_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/schoolSenery12_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/schoolSenery14_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/schoolSenery13_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/schoolSenery13_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/schoolSenery14_2.png'
}
]
},
{
list: [
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/activity1_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/activity1_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/activity2_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/activity2_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/activity3_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/activity3_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/activity4_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/activity4_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/activity5_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/activity5_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/activity6_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/activity6_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/activity7_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/activity7_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/activity8_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/activity8_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/activity9_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/activity9_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/activity10_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/activity10_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/activity11_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/activity11_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/activity12_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/activity12_2.png'
}
]
},
{
list: [
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/graduation1_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/graduation1_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/graduation2_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/graduation2_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/graduation3_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/graduation3_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/graduation4_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/graduation4_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/graduation5_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/graduation5_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/graduation6_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/graduation6_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/graduation7_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/graduation7_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/graduation8_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/graduation8_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/graduation9_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/graduation9_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/graduation10_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/graduation10_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/graduation11_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/graduation11_2.png'
},
{
img_small: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/graduation12_1.png',
img_big: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online_pc/edd/graduation12_2.png'
}
]
}
],
showIndex: 0,
isShowSwiper: false,
swiperOption: {
observer: true,
observeParents: true,
speed: 300,
slidesPerView: 'auto',
centeredSlides: true,
spaceBetween: 20
}
}
},
methods: {
// tab切换
tabChange(n) {
this.showIndex = n
},
// 展示大图
handleShowPic(index) {
this.isShowSwiper = true
this.swiper.slideTo(index)
},
// 关闭遮罩层
handleClose() {
this.isShowSwiper = false
},
// 轮播下一张图
handleNext() {
this.swiper.slideNext()
},
// 轮播上一张图
handlePrev() {
this.swiper.slidePrev()
}
},
computed: {
isMobile() {
return this.$store.state.isMobile
},
swiper() {
return this.$refs.mySwiper.swiper
},
swiperList() {
return this.campusList[this.showIndex].list
}
}
}
</script>
<style lang="scss" scoped>
.main_content {
width: 1200px;
margin: 30px auto;
.main_content_list {
display: flex;
flex-wrap: wrap;
.con_imgSmall {
width: 380px;
flex: 0 0 33%;
border-radius: 10px 10px 10px 10px;
margin: 9px;
&:hover {
box-shadow: 0px 3px 25px 1px rgba(0, 0, 0, 0.2627450980392157);
}
}
.swiper-wrapper {
z-index: 3000;
position: absolute;
}
}
.swiper {
position: fixed;
z-index: 9999;
}
.overlay {
position: fixed;
left: 0;
top: 0;
right: 0;
bottom: 0;
z-index: 1000;
background: rgba(0, 0, 0, 0.5);
}
}
.swiper-content {
width: 1200px;
margin: 30px auto;
position: fixed;
z-index: 2000;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
.swiper-wrapper {
display: flex;
.swiper-slide {
.img_big {
width: 100%;
height: 675px;
}
.swiper_next {
position: absolute;
right: 30px;
top: 50%;
}
.swiper_prev {
position: absolute;
left: 30px;
top: 50%;
}
}
}
}
</style>
<template>
<ul class="tab-content">
<li
v-for="(item, index) in items"
:key="index"
:class="activeIndex === index && 'active'"
@click="tabChange(index)"
>
{{ item }}
</li>
</ul>
</template>
<script>
export default {
data() {
return {
items: ['图书馆', '实验室', '餐厅&住宿', '运动场', '校园风光', '校园活动', '毕业典礼'],
activeIndex: 0
}
},
methods: {
tabChange(n) {
this.activeIndex = n
this.$emit('tabChange', n)
}
}
}
</script>
<style lang="scss" scoped>
.tab-content {
// padding-top: 0.2rem;
display: flex;
justify-content: center;
li {
min-width: 106px;
height: 38px;
text-align: center;
line-height: 38px;
font-size: 20px;
font-weight: bold;
color: #333333;
position: relative;
margin-left: 16px;
&.active {
background: #aa1941;
color: #ffffff;
}
}
}
</style>
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论