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

ADD 布局增加Dock布局

This commit is contained in:
sakuya 2021-07-06 22:39:36 +08:00
parent d024f448b0
commit 6cbd9ad726
4 changed files with 40 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
src/config/index.js
View File

@ -11,7 +11,8 @@ const DEFAULT_CONFIG = {
//MOCK接口地址
MOCK_URL: "https://www.fastmock.site/mock/44c807475f7eeba73409792255781935/api",
//布局 默认：default | 通栏：header | 经典：menu
//布局 默认：default | 通栏：header | 经典：menu | 功能坞：dock
//dock将关闭标签和面包屑栏
LAYOUT: 'default',
//菜单是否折叠

1
src/layout/components/setting.vue
View File

@ -7,6 +7,7 @@
<el-option label="默认" value="default"></el-option>
<el-option label="通栏" value="header"></el-option>
<el-option label="经典" value="menu"></el-option>
<el-option label="功能坞" value="dock"></el-option>
</el-select>
</el-form-item>
<el-form-item label="折叠菜单">

30
src/layout/index.vue
View File

@ -78,6 +78,36 @@
</section>
</template>
<!-- 经典布局 -->
<template v-else-if="layout=='dock'">
<header class="adminui-header">
<div class="adminui-header-left">
<div class="logo-bar">
<img class="logo" src="img/logo.png">
<span>{{ $CONFIG.APP_NAME }}</span>
</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="$route.meta.active || $route.fullPath" router mode="horizontal">
<NavMenu :navMenus="menu"></NavMenu>
</el-menu>
</div>
<div class="adminui-main" id="adminui-main">
<router-view></router-view>
<iframe-view></iframe-view>
</div>
</div>
</section>
</template>
<!-- 默认布局 -->
<template v-else>
<section class="aminui-wrapper">

7
src/style/app.less
View File

@ -37,6 +37,13 @@ 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;}
/* 左侧菜单 */
.aminui-side-split {width:65px;flex-shrink:0;background: #222b45;}
.adminui-side-split-scroll {overflow: auto;overflow-x:hidden;height: 100%;}