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 | 124 +++++++++++++++++++++++++++++++++++++++++ 1 files changed, 124 insertions(+), 0 deletions(-) diff --git a/src/components/Home.vue b/src/components/Home.vue new file mode 100644 index 0000000..4038afd --- /dev/null +++ b/src/components/Home.vue @@ -0,0 +1,124 @@ +<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.index" + > + {{ 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> +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: '鑱旂郴鎴戜滑' } + ] + } + }, + created() {}, + mounted() {}, + watch: {}, + methods: { + handleSelect(key, keyPath) { + console.log(key, keyPath) + if (key == 'xueXiaoShouYe') { + window.location.href = 'https://www.pdsu.edu.cn/#' + } else { + this.$router.push({ + path: '/home/' + key, + query: { + title: 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 40px; + 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