From 546c0df2c7d278cb2a3e6fa6fc2ff730d410fdbd Mon Sep 17 00:00:00 2001
From: 明梦爽 <2972214568@qq.com>
Date: 星期二, 25 一月 2022 16:54:48 +0800
Subject: [PATCH] more
---
src/components/Home.vue | 153 +++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 153 insertions(+), 0 deletions(-)
diff --git a/src/components/Home.vue b/src/components/Home.vue
new file mode 100644
index 0000000..7bafe07
--- /dev/null
+++ b/src/components/Home.vue
@@ -0,0 +1,153 @@
+<template>
+ <el-container class="home-container">
+ <!-- 涓婚〉澶撮儴 -->
+ <el-header>
+ <div>
+ <img src="../assets/xiaohui4.png" alt="" />
+ </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.id).toString()">
+ {{ item.name }}
+ </el-menu-item>
+ </el-menu>
+ </el-row>
+ <el-container>
+ <!-- 鏇村彉鐨勫唴瀹瑰尯鍩� -->
+ <el-main class="main">
+ <router-view class="box"></router-view>
+ </el-main>
+ </el-container>
+ <el-footer>@骞抽《灞卞闄㈢瀛︽妧鏈崗浼�</el-footer>
+ </el-container>
+</template>
+
+<script>
+import {getNavList} from '../api/api'
+import axios from 'axios'
+export default {
+ name: '',
+ data() {
+ return {
+ activeIndex: '1',
+ 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();
+ },
+ mounted() {
+ let api3 = 'http://localhost:8080/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) {
+ 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
+ }
+ })
+ }
+ }
+ }
+}
+</script>
+
+<style lang="less" scoped>
+.home-container {
+ height: 100%;
+}
+.el-header {
+ background-color: rgb(1, 72, 153);
+}
+.el-header {
+ height: 120px !important;
+ padding: 0 80px 0 120px;
+ overflow: hidden;
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+}
+.el-menu {
+ .el-menu-item {
+ width: 150px;
+ font-size: 15px;
+ text-align: center;
+ }
+}
+.menu {
+ display: flex;
+ justify-content: space-between;
+}
+.el-footer {
+ background-color: rgb(85, 81, 82);
+}
+.main {
+ padding: 20px 5px;
+}
+.el-footer {
+ font-size: 15px;
+ color: white;
+ text-align: center;
+ line-height: 60px;
+}
+.box {
+ width: 1200px;
+ margin: 0 auto;
+}
+</style>
\ No newline at end of file
--
Gitblit v1.8.0