From 3fbb5e3166522734fd5407bcdf76c384d40e9dfa Mon Sep 17 00:00:00 2001 From: 明梦爽 <2972214568@qq.com> Date: 星期一, 10 一月 2022 16:03:25 +0800 Subject: [PATCH] 1.0 --- src/components/Home.vue | 86 ++++++++++++++++++++++++++----------------- 1 files changed, 52 insertions(+), 34 deletions(-) diff --git a/src/components/Home.vue b/src/components/Home.vue index 4038afd..b2af2cb 100644 --- a/src/components/Home.vue +++ b/src/components/Home.vue @@ -11,21 +11,9 @@ </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.index" - > - {{ item.name }} + <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-item> </el-menu> </el-row> @@ -40,37 +28,67 @@ </template> <script> +import {getNavList} from '../api/api' export default { name: '', data() { return { - activeIndex: 'index', - menuList: [ - { index: 'index', name: '棣栭〉' }, - { index: 'introduce', name: '绉戝崗姒傚喌' }, - { index: 'zhengce', name: '鏀跨瓥娉曡' }, - { index: 'keXieXiangMu', name: '绉戝崗椤圭洰' }, - { index: 'xueShuJiaoLiu', name: '瀛︽湳浜ゆ祦' }, - { index: 'banShiZhiNan', name: '鍔炰簨鎸囧崡' }, - { index: 'kePu', name: '绉戞櫘椋庨噰' }, - { index: 'xueXiaoShouYe', name: '瀛︽牎棣栭〉' }, - { index: 'telephone', name: '鑱旂郴鎴戜滑' } - ] + activeIndex: '1', + menuList: [{contypeName: '棣栭〉',id: 1},{contypeName: '绉戝崗姒傚喌',id: 2},{contypeName: '鏀跨瓥娉曡',id: 3},{contypeName: '绉戝崗椤圭洰',id: 4}, + {contypeName: '瀛︽湳浜ゆ祦',id: 5},{contypeName: '鍔炰簨鎸囧崡',id: 6},{contypeName: '绉戞櫘椋庨噰',id: 7},{contypeName: '瀛︽牎棣栭〉',id: 8}, + {contypeName: '鑱旂郴鎴戜滑',id: 9}], } }, - created() {}, + created() { + // this.getNavArr(); + }, mounted() {}, watch: {}, methods: { + // //鑾峰彇瀵艰埅鏍� + // getNavArr(){ + // const data ={}; + // 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){ + case '1': + return 'index' + case '2': + return 'introduce' + case '3': + return 'zhengce' + case '4': + return 'keXieXiangMu' + case '5': + return 'xueShuJiaoLiu' + case '6': + return 'banShiZhiNan' + case '7': + return 'kePuFengCai' + case '8': + return 'xueXiaoShouYe' + case '9': + return 'telephone' + } + }, handleSelect(key, keyPath) { - console.log(key, keyPath) - if (key == 'xueXiaoShouYe') { - window.location.href = 'https://www.pdsu.edu.cn/#' + if (key == '8') { + window.open('https://www.pdsu.edu.cn/#') } else { this.$router.push({ - path: '/home/' + key, + path: '/home/' + this.formatterTitle(key), query: { - title: key + title: this.formatterTitle(key), + id:key } }) } @@ -88,7 +106,7 @@ } .el-header { height: 120px !important; - padding: 0 40px; + padding: 0 80px 0 120px; overflow: hidden; display: flex; justify-content: space-between; -- Gitblit v1.8.0