fix: 移动端logo和name从config获取
This commit is contained in:
parent
a24eece353
commit
7591e3c34c
|
|
@ -1,21 +1,24 @@
|
|||
<template>
|
||||
<div ref="" class="mobile-nav-button" @click="showMobileNav($event)" v-drag draggable="false"><el-icon><el-icon-menu /></el-icon></div>
|
||||
<div ref="" class="mobile-nav-button" @click="showMobileNav($event)" v-drag draggable="false">
|
||||
<el-icon><el-icon-menu /></el-icon>
|
||||
</div>
|
||||
|
||||
<el-drawer ref="mobileNavBox" title="移动端菜单" :size="240" v-model="nav" direction="ltr" :with-header="false" destroy-on-close>
|
||||
<el-drawer ref="mobileNavBox" title="移动端菜单" :size="240" v-model="nav" direction="ltr" :with-header="false"
|
||||
destroy-on-close>
|
||||
<el-container class="mobile-nav">
|
||||
<el-header>
|
||||
<div class="logo-bar"><img class="logo" src="img/logo.png"><span>{{ $CONFIG.APP_NAME }}</span></div>
|
||||
<div class="logo-bar"><img class="logo" :src="baseLogo"><span>{{ baseName }}</span>></div>
|
||||
</el-header>
|
||||
<el-main>
|
||||
<el-scrollbar>
|
||||
<el-menu :default-active="$route.meta.active || $route.fullPath" @select="select" router background-color="#212d3d" text-color="#fff" active-text-color="#409EFF">
|
||||
<el-menu :default-active="$route.meta.active || $route.fullPath" @select="select" router
|
||||
background-color="#212d3d" text-color="#fff" active-text-color="#409EFF">
|
||||
<NavMenu :navMenus="menu"></NavMenu>
|
||||
</el-menu>
|
||||
</el-scrollbar>
|
||||
</el-main>
|
||||
</el-container>
|
||||
</el-drawer>
|
||||
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
|
@ -32,7 +35,14 @@
|
|||
}
|
||||
},
|
||||
computed: {
|
||||
|
||||
baseLogo() {
|
||||
let baseLogo = this.$TOOL.data.get("BASE_INFO") !== null ? this.$TOOL.data.get("BASE_INFO").base.base_logo : 'img/logo.png';
|
||||
return baseLogo
|
||||
},
|
||||
baseName() {
|
||||
let baseName = this.$TOOL.data.get("BASE_INFO") !== null ? this.$TOOL.data.get("BASE_INFO").base.base_name : '智慧管理平台';
|
||||
return baseName;
|
||||
},
|
||||
},
|
||||
created() {
|
||||
var menu = this.$router.sc_getMenu()
|
||||
|
|
@ -124,13 +134,53 @@
|
|||
</script>
|
||||
|
||||
<style scoped>
|
||||
.mobile-nav-button {position: fixed;bottom:10px;left:10px;z-index: 10;width: 50px;height: 50px;background: #409EFF;box-shadow: 0 2px 12px 0 rgba(64, 158, 255, 1);border-radius: 50%;display: flex;align-items: center;justify-content: center;}
|
||||
.mobile-nav-button i {color: #fff;font-size: 20px;}
|
||||
.mobile-nav-button {
|
||||
position: fixed;
|
||||
bottom: 10px;
|
||||
left: 10px;
|
||||
z-index: 10;
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
background: #409EFF;
|
||||
box-shadow: 0 2px 12px 0 rgba(64, 158, 255, 1);
|
||||
border-radius: 50%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.mobile-nav {background: #212d3d;}
|
||||
.mobile-nav .el-header {background: transparent;border: 0;}
|
||||
.mobile-nav .el-main {padding:0;}
|
||||
.mobile-nav .logo-bar {display: flex;align-items: center;font-weight: bold;font-size: 20px;color: #fff;}
|
||||
.mobile-nav .logo-bar img {width: 30px;margin-right: 10px;}
|
||||
.mobile-nav .el-submenu__title:hover {background: #fff!important;}
|
||||
.mobile-nav-button i {
|
||||
color: #fff;
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
.mobile-nav {
|
||||
background: #212d3d;
|
||||
}
|
||||
|
||||
.mobile-nav .el-header {
|
||||
background: transparent;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
.mobile-nav .el-main {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.mobile-nav .logo-bar {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-weight: bold;
|
||||
font-size: 20px;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.mobile-nav .logo-bar img {
|
||||
width: 30px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.mobile-nav .el-submenu__title:hover {
|
||||
background: #fff !important;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
Loading…
Reference in New Issue