From 6a1866f5271dd59f1df1c70fdbfeba1591bfa7c3 Mon Sep 17 00:00:00 2001 From: 明梦爽 <2972214568@qq.com> Date: 星期四, 11 十一月 2021 15:49:00 +0800 Subject: [PATCH] 登录完成 --- src/components/Home.vue | 86 +++++++++++++++++++++++++++---------------- 1 files changed, 54 insertions(+), 32 deletions(-) diff --git a/src/components/Home.vue b/src/components/Home.vue index 6c99a06..4038afd 100644 --- a/src/components/Home.vue +++ b/src/components/Home.vue @@ -5,7 +5,9 @@ <div> <img src="../assets/xiaohui4.png" alt="" /> </div> - <div class="bg"></div> + <div> + <img src="../assets/bg.png" alt=""> + </div> </el-header> <!-- 涓婚〉瀵艰埅鏍� --> <el-row> @@ -14,27 +16,26 @@ background-color="rgb(64, 112, 186)" text-color="white" class="menu" + active-text-color="#000000" :default-active="activeIndex" @select="handleSelect" > - <el-menu-item index="index">棣栭〉</el-menu-item> - <el-menu-item index="introduce">绉戝崗姒傚喌</el-menu-item> - <el-menu-item index="zhengce">鏀跨瓥娉曡</el-menu-item> - <el-menu-item index="keXieXiangMu">绉戝崗椤圭洰</el-menu-item> - <el-menu-item index="xueShuJiaoLiu">瀛︽湳浜ゆ祦</el-menu-item> - <el-menu-item index="banShiZhiNan">鍔炰簨鎸囧崡</el-menu-item> - <el-menu-item index="kePu">绉戞櫘椋庨噰</el-menu-item> - <el-menu-item index="xueXiaoShouYe">瀛︽牎棣栭〉</el-menu-item> - <el-menu-item index="telephone">鑱旂郴鎴戜滑</el-menu-item> + <el-menu-item + :key="index" + v-for="(item, index) in menuList" + :index="item.index" + > + {{ item.name }} + </el-menu-item> </el-menu> </el-row> <el-container> <!-- 鏇村彉鐨勫唴瀹瑰尯鍩� --> <el-main class="main"> - <router-view></router-view> + <router-view class="box"></router-view> </el-main> </el-container> - <el-footer>Footer</el-footer> + <el-footer>@骞抽《灞卞闄㈢瀛︽妧鏈崗浼�</el-footer> </el-container> </template> @@ -43,15 +44,36 @@ name: '', data() { return { - activeIndex: 'index' + 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: '鑱旂郴鎴戜滑' } + ] } }, + created() {}, + mounted() {}, + watch: {}, methods: { handleSelect(key, keyPath) { console.log(key, keyPath) - this.$router.push({ - path: '/home/' + keyPath - }) + if (key == 'xueXiaoShouYe') { + window.location.href = 'https://www.pdsu.edu.cn/#' + } else { + this.$router.push({ + path: '/home/' + key, + query: { + title: key + } + }) + } } } } @@ -62,25 +84,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 40px; overflow: hidden; - div { - display: flex; - justify-content: left; - } + display: flex; + justify-content: space-between; + align-items: center; } .el-menu { .el-menu-item { @@ -99,4 +111,14 @@ .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