66 lines
1.7 KiB
Vue
66 lines
1.7 KiB
Vue
|
<template>
|
||
|
|
<div>
|
||
|
|
<!-- 主体内容 -->
|
||
|
|
<div class="attendance-box">
|
||
|
|
<div class="attendance-left">
|
||
|
|
<div @click="chooseNavEv(index)" class="introduction-item" :class="navIndex==index?'attendance-active':''" v-for="(item,index) in navArr" :key="index">
|
||
|
|
<div class="item-left">
|
||
|
|
<img src="">
|
||
|
|
<div>{{item.title}}</div>
|
||
|
|
</div>
|
||
|
|
<img src="../assets/kindergartenIntroduce/icon-choose.png" >
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="introduction-right">
|
||
|
|
<!-- 园区介绍 -->
|
||
|
|
<parkIntroduce v-if="navIndex==0"></parkIntroduce>
|
||
|
|
<!-- 教师风采 -->
|
||
|
|
<teacherStyle v-if="navIndex==1"></teacherStyle>
|
||
|
|
<!-- 新闻动态 -->
|
||
|
|
<newsInformation v-if="navIndex==2"></newsInformation>
|
||
|
|
<!-- 公告信息 -->
|
||
|
|
<noticeInfo v-if="navIndex==3"></noticeInfo>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
<script>
|
||
|
|
// 园区介绍
|
||
|
|
import parkIntroduce from '@/components/parkIntroduce.vue';
|
||
|
|
// 教师风采
|
||
|
|
import teacherStyle from '@/components/teacherStyle.vue';
|
||
|
|
// 新闻动态
|
||
|
|
import newsInformation from '@/components/newsInformation.vue';
|
||
|
|
// 公告信息
|
||
|
|
import noticeInfo from '@/components/noticeInfo.vue';
|
||
|
|
export default {
|
||
|
|
components:{
|
||
|
|
parkIntroduce,
|
||
|
|
teacherStyle,
|
||
|
|
newsInformation,
|
||
|
|
noticeInfo
|
||
|
|
},
|
||
|
|
name: 'babyActivity',
|
||
|
|
data() {
|
||
|
|
return {
|
||
|
|
navArr:[
|
||
|
|
{icon:'../assets/attendancedetail/icon-attendancedetail.png',title:'园区介绍'},
|
||
|
|
{icon:'../assets/attendancedetail/icon-lixiao.png',title:'教师风采'},
|
||
|
|
{icon:'../assets/attendancedetail/icon-qingj.png',title:'新闻动态'},
|
||
|
|
{icon:'../assets/attendancedetail/icon-weidao.png',title:'公告信息'},
|
||
|
|
],
|
||
|
|
navIndex:0,
|
||
|
|
}
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
chooseNavEv(e){
|
||
|
|
this.navIndex = e;
|
||
|
|
}
|
||
|
|
},
|
||
|
|
mounted() {
|
||
|
|
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</script>
|