zcdsj
/
factory_web
5
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

调整功能坞布局菜单位置

This commit is contained in:
sc 2021-10-18 15:31:38 +08:00
parent 34553fe598
commit 5e7315814c
3 changed files with 18 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
src/layout/index.vue
View File

@ -86,7 +86,7 @@
</section>
</template>
<!-- 经典布局 -->
<!-- 功能坞布局 -->
<template v-else-if="layout=='dock'">
<header class="adminui-header">
<div class="adminui-header-left">
@ -96,18 +96,17 @@
</div>
</div>
<div class="adminui-header-right">
<userbar></userbar>
</div>
</header>
<section class="aminui-wrapper">
<Side-m v-if="ismobile"></Side-m>
<div class="aminui-body el-container">
<div v-if="!ismobile" class="adminui-header-menu">
<el-menu :default-active="active" router mode="horizontal">
<el-menu mode="horizontal" :default-active="active" router>
<NavMenu :navMenus="menu"></NavMenu>
</el-menu>
</div>
<Side-m v-if="ismobile"></Side-m>
<userbar></userbar>
</div>
</header>
<section class="aminui-wrapper">
<div class="aminui-body el-container">
<div class="adminui-main" id="adminui-main">
<router-view v-slot="{ Component }">
<keep-alive :include="this.$store.state.keepAlive.keepLiveRoute">

11
src/style/app.scss
View File

@ -37,12 +37,11 @@ a,button,input,textarea{-webkit-tap-highlight-color:rgba(0,0,0,0);box-sizing: bo
.adminui-header .user-bar .panel-item:hover {background: rgba(255, 255, 255, 0.1)!important;}
.adminui-header .user-bar .user label{color: #fff;}
.adminui-header-menu {box-shadow: 0 1px 4px rgba(0,0,0,.1);z-index: 1;height:70px;}
.adminui-header-menu .el-submenu.is-opened .el-submenu__title {background: #ecf5ff;}
.adminui-header-menu .el-submenu__title {display: flex;flex-direction: column;align-items: center;justify-content: center;height: 70px !important;line-height: 70px !important;padding: 0 30px;}
.adminui-header-menu .el-submenu__title span {line-height: 21px;}
.adminui-header-menu .el-submenu__title i {margin-right: 0px;}
.adminui-header-menu .el-submenu__title .el-submenu__icon-arrow {margin: 0;display: none;}
.adminui-header-menu {}
.adminui-header-menu .el-menu {background: transparent;}
.adminui-header-menu .el-menu .el-sub-menu__title {color: #fff;}
.adminui-header-menu .el-menu .el-sub-menu__title:hover {color: #fff;background: var(--el-color-primary-light-2);}
.adminui-header-menu .el-menu .el-sub-menu.is-active .el-sub-menu__title {color: #fff;background: var(--el-color-primary-light-2);border-bottom-color:transparent;}
/* 左侧菜单 */
.aminui-side-split {width:65px;flex-shrink:0;background: #222b45;}

6
src/style/theme/dark.scss
View File

@ -108,7 +108,8 @@
}
/* 布局 */
.adminui-header {background: $--background;}
.adminui-header {background: $--card-background;border-bottom: 1px solid $--border-color;}
.adminui-header-menu .el-menu .el-sub-menu__title {height:59px;line-height: 59px;}
.aminui-side-split {background: $--background;}
.aminui-side-split li {color: $--text-color;}
.aminui-side-split li.active {color: #fff;}
@ -148,6 +149,9 @@
.el-menu-item {color: $--text-color;}
.el-menu-item:hover {background: $--background-translucent;}
.el-menu-item.is-active {background: $--background;color: $--color;}
.el-sub-menu__title:hover {background: $--background-translucent;}
.el-menu--horizontal .el-menu-item {background: none;}
.el-menu--horizontal .el-menu-item:not(.is-disabled):hover {background: $--background-translucent;}
.el-loading-mask {background-color: rgba(0,0,0,0.5);}