| | |
| | | <img src="../assets/xiaohui4.png" alt="" /> |
| | | </div> |
| | | <div> |
| | | <img src="../assets/bg.png" alt=""> |
| | | <img src="../assets/bg.png" alt="" /> |
| | | </div> |
| | | </el-header> |
| | | <!-- 主页导航栏 --> |
| | | <el-row> |
| | | <el-menu |
| | | mode="horizontal" |
| | | background-color="rgb(64, 112, 186)" |
| | | text-color="white" |
| | | class="menu" |
| | | active-text-color="#000000" |
| | | :default-active="activeIndex" |
| | | @select="handleSelect" |
| | | > |
| | | <el-menu-item |
| | | :key="index" |
| | | v-for="(item, index) in menuList" |
| | | :index="(item.id).toString()" |
| | | > |
| | | {{ item.contypeName }} |
| | | <el-menu mode="horizontal" background-color="rgb(64, 112, 186)" text-color="white" class="menu" active-text-color="#000000" :default-active="activeIndex" @select="handleSelect"> |
| | | <el-menu-item :key="index" v-for="(item, index) in menuList" :index="item.id.toString()"> |
| | | {{ item.name }} |
| | | </el-menu-item> |
| | | </el-menu> |
| | | </el-row> |
| | |
| | | </template> |
| | | |
| | | <script> |
| | | import {getNavList} from '../api/api' |
| | | import { getNavList } from '../api/api' |
| | | import axios from 'axios' |
| | | export default { |
| | | name: '', |
| | | data() { |
| | | return { |
| | | activeIndex: '1', |
| | | menuList: [], |
| | | menuList: [ |
| | | { name: '首页', id: 1 }, |
| | | { name: '科协概况', id: 22 }, |
| | | { name: '政策法规', id: 23 }, |
| | | { name: '科协项目', id: 24 }, |
| | | { name: '学术交流', id: 25 }, |
| | | { name: '办事指南', id: 26 }, |
| | | { name: '科普风采', id: 27 }, |
| | | { name: '学校首页', id: 28 }, |
| | | { name: '联系我们', id: 29 } |
| | | ], |
| | | menuList2: [] |
| | | } |
| | | }, |
| | | created() { |
| | | this.getNavArr(); |
| | | // this.getNavArr(); |
| | | }, |
| | | mounted() {}, |
| | | mounted() { |
| | | let api3 = 'http://localhost:7070/news_type/all' |
| | | axios |
| | | .get(api3) |
| | | .then(res => { |
| | | // console.log(res); |
| | | this.menuList2 = res.data.data |
| | | }) |
| | | .catch(error => { |
| | | console.log(error) |
| | | }) |
| | | }, |
| | | watch: {}, |
| | | methods: { |
| | | //获取导航栏 |
| | | getNavArr(){ |
| | | const data ={}; |
| | | //.then() 主要用于一个函数用到另一个函数的返回值 |
| | | getNavList(data).then(res => { |
| | | console.log('res', res) |
| | | if(res.code == 200){ |
| | | this.menuList = res.data |
| | | } |
| | | }).catch(err => { |
| | | console.log('err', err) |
| | | }) |
| | | }, |
| | | formatterTitle(t){ |
| | | switch(t){ |
| | | // //获取导航栏 |
| | | // getNavArr(){ |
| | | // const data ={}; |
| | | // getNavList(data).then(res => { |
| | | // console.log('res', res) |
| | | // if(res.code == 200){ |
| | | // this.menuList2 = res.data.data |
| | | // } |
| | | // this.menuList2 = res.data.data |
| | | // }).catch(err => { |
| | | // console.log('err', err) |
| | | // }) |
| | | // }, |
| | | |
| | | formatterTitle(t) { |
| | | switch (t) { |
| | | case '1': |
| | | return 'index' |
| | | case '2': |
| | | case '22': |
| | | return 'introduce' |
| | | case '3': |
| | | case '23': |
| | | return 'zhengce' |
| | | case '4': |
| | | case '24': |
| | | return 'keXieXiangMu' |
| | | case '5': |
| | | case '25': |
| | | return 'xueShuJiaoLiu' |
| | | case '6': |
| | | case '26': |
| | | return 'banShiZhiNan' |
| | | case '7': |
| | | case '27': |
| | | return 'kePuFengCai' |
| | | case '8': |
| | | case '28': |
| | | return 'xueXiaoShouYe' |
| | | case '9': |
| | | case '29': |
| | | return 'telephone' |
| | | } |
| | | }, |
| | | handleSelect(key, keyPath) { |
| | | if (key == '8') { |
| | | if (key == '28') { |
| | | window.open('https://www.pdsu.edu.cn/#') |
| | | } else { |
| | | this.$router.push({ |
| | | path: '/home/' + this.formatterTitle(key), |
| | | query: { |
| | | title: this.formatterTitle(key), |
| | | id:key |
| | | id: key |
| | | } |
| | | }) |
| | | } |
| | |
| | | width: 1200px; |
| | | margin: 0 auto; |
| | | } |
| | | </style> |
| | | </style> |