From c590aaeca3e0a066016d2ff2c7c4cf96a7ca446f Mon Sep 17 00:00:00 2001 From: wl <173@qq.com> Date: 星期三, 16 十一月 2022 09:35:29 +0800 Subject: [PATCH] first commit --- src/components/Home.vue | 132 +++++++++++++++++++++++++++---------------- 1 files changed, 82 insertions(+), 50 deletions(-) diff --git a/src/components/Home.vue b/src/components/Home.vue index ba617d7..d969782 100644 --- a/src/components/Home.vue +++ b/src/components/Home.vue @@ -5,24 +5,14 @@ <div> <img src="../assets/xiaohui4.png" alt="" /> </div> - <div class="bg"></div> + <div> + <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.index" - > + <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> @@ -38,37 +28,89 @@ </template> <script> +import { getNavList } from '../api/api' +import axios from 'axios' export default { name: '', data() { return { - activeIndex: 'index', + activeIndex: '1', 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: '鑱旂郴鎴戜滑' } - ] + { 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() {}, - mounted() {}, + created() { + // this.getNavArr(); + }, + 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 ={}; + // 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 '22': + return 'introduce' + case '23': + return 'zhengce' + case '24': + return 'keXieXiangMu' + case '25': + return 'xueShuJiaoLiu' + case '26': + return 'banShiZhiNan' + case '27': + return 'kePuFengCai' + case '28': + return 'xueXiaoShouYe' + case '29': + return 'telephone' + } + }, handleSelect(key, keyPath) { - console.log(key, keyPath) - if (key == 'xueXiaoShouYe') { - window.location.href = 'https://www.pdsu.edu.cn/#' + if (key == '28') { + 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 } }) } @@ -82,25 +124,15 @@ height: 100%; } .el-header { - background: -webkit-linear-gradient( - left, - rgb(5, 102, 141), - rgb(240, 243, 189) - ); - - background: -o-linear-gradient(right, rgb(5, 102, 141), rgb(240, 243, 189)); - - background: -moz-linear-gradient(right, rgb(5, 102, 141), rgb(240, 243, 189)); - - background: linear-gradient(to right, rgb(5, 102, 141), rgb(240, 243, 189)); + background-color: rgb(1, 72, 153); } .el-header { - height: 93px !important; + height: 120px !important; + padding: 0 80px 0 120px; overflow: hidden; - div { - display: flex; - justify-content: left; - } + display: flex; + justify-content: space-between; + align-items: center; } .el-menu { .el-menu-item { @@ -129,4 +161,4 @@ width: 1200px; margin: 0 auto; } -</style> \ No newline at end of file +</style> -- Gitblit v1.8.0