diff --git a/epmet-oper-web/src/assets/scss/common.scss b/epmet-oper-web/src/assets/scss/common.scss index 1509b2a..ba5139f 100644 --- a/epmet-oper-web/src/assets/scss/common.scss +++ b/epmet-oper-web/src/assets/scss/common.scss @@ -4,8 +4,8 @@ box-sizing: border-box; } body { - font-family: 'Helvetica Neue', Helvetica, 'PingFang SC', 'Hiragino Sans GB', - 'Microsoft YaHei', '微软雅黑', Arial, sans-serif; + font-family: "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "微软雅黑", Arial, + sans-serif; font-size: $--font-size-base; line-height: $base--line-height; color: $--color-text-primary; @@ -35,7 +35,7 @@ img { } .clearfix:before, .clearfix:after { - content: ' '; + content: " "; display: table; } .clearfix:after { @@ -144,8 +144,8 @@ img { background-color: transparent; } &-add { - > span > *[class*='el-icon-'], - > span > *[class*='icon'] { + > span > *[class*="el-icon-"], + > span > *[class*="icon"] { vertical-align: middle; font-size: 18px; margin-right: 5px; @@ -249,6 +249,20 @@ img { } } +.aui-sidebar--noside { + .aui-sidebar { + display: none !important; + } + .aui-content { + &__wrapper { + margin-left: 0 !important; + } + &--tabs > .el-tabs > .el-tabs__header { + left: 0 !important; + } + } +} + /* Navbar ------------------------------ */ .aui-navbar { @@ -357,6 +371,29 @@ img { a:hover { text-decoration: none; } + &.z-div { + .el-menu-item { + position: relative; + + &:last-child { + &::after { + display: none; + } + } + + &::after { + position: absolute; + content: ""; + right: 0; + top: 0; + bottom: 0; + margin: auto 0; + width: 1px; + height: 18px; + background-color: rgba(#ffffff, 0.6); + } + } + } .el-menu-item, .el-submenu > .el-submenu__title { height: $navbar--height; @@ -411,8 +448,8 @@ img { } } &__search { - > *[class*='el-icon-'], - > *[class*='icon'] { + > *[class*="el-icon-"], + > *[class*="icon"] { display: inline-block; vertical-align: middle; } @@ -535,9 +572,7 @@ img { min-height: calc(#{$content--fill-height} - 2px); } > .aui-card--fill > .el-card__header + .el-card__body { - min-height: calc( - #{$content--fill-height} - #{$content--card-header-height} - 2px - ); + min-height: calc(#{$content--fill-height} - #{$content--card-header-height} - 2px); } &--tabs { padding: $content--tabs-header-height 0 0; @@ -609,7 +644,7 @@ img { position: absolute; bottom: 0; left: 0; - content: ''; + content: ""; width: 100%; height: 2px; background-color: $--color-primary; @@ -642,15 +677,10 @@ img { min-height: calc(#{$content--fill-height-tabs} - 2px); } > .aui-card--fill > .el-card__header + .el-card__body { - min-height: calc( - #{$content--fill-height-tabs} - #{$content--card-header-height} - - 2px - ); + min-height: calc(#{$content--fill-height-tabs} - #{$content--card-header-height} - 2px); } &.is-iframe { - height: calc( - #{$content--fill-height-tabs} + #{$content--padding * 2} - ); + height: calc(#{$content--fill-height-tabs} + #{$content--padding * 2}); margin: -$content--padding; min-height: auto; > .aui-card--fill { @@ -669,10 +699,7 @@ img { background-color: #fff; } > .aui-card--fill > .el-card__header + .el-card__body { - height: calc( - #{$content--fill-height-tabs} - #{$content--card-header-height} - - 2px - ); + height: calc(#{$content--fill-height-tabs} - #{$content--card-header-height} - 2px); } } } @@ -702,7 +729,7 @@ img { /* Page ------------------------------ */ -*[class*='aui-page__'] { +*[class*="aui-page__"] { padding-top: 0; .aui-content { min-height: auto; @@ -714,9 +741,7 @@ img { min-height: calc(100vh - #{$content--padding * 2} - 2px); } > .aui-card--fill > .el-card__header + .el-card__body { - min-height: calc( - 100vh - #{$content--padding * 2} - #{$content--card-header-height} - 2px - ); + min-height: calc(100vh - #{$content--padding * 2} - #{$content--card-header-height} - 2px); } } } diff --git a/epmet-oper-web/src/js/store/index.js b/epmet-oper-web/src/js/store/index.js index c11512f..b9969fc 100644 --- a/epmet-oper-web/src/js/store/index.js +++ b/epmet-oper-web/src/js/store/index.js @@ -20,6 +20,7 @@ export default new Vuex.Store({ sidebarMenuList: [], sidebarMenuActiveName: '', LevelOneMenuActiveName: '', + sidebarActiveSubMenuList: [], // 内容, 是否需要刷新 contentIsNeedRefresh: false, // 内容, 标签页(默认添加首页) diff --git a/epmet-oper-web/src/views/main-navbar.vue b/epmet-oper-web/src/views/main-navbar.vue index 3c75160..996c5d4 100644 --- a/epmet-oper-web/src/views/main-navbar.vue +++ b/epmet-oper-web/src/views/main-navbar.vue @@ -28,23 +28,28 @@ + + + + {{ menu.name }} @@ -78,11 +83,7 @@ --> - - - + @@ -151,7 +152,7 @@ export default { }, methods: { // 通过menuId与动态(菜单)路由进行匹配跳转至指定路由 - gotoRouteHandle(menuId) { + gotoRouteHandle(menuId, idx) { var route = window.SITE_CONFIG['dynamicMenuRoutes'].filter( (item) => item.meta.menuId === menuId )[0] @@ -159,6 +160,8 @@ export default { this.$router.push({ name: route.name }) } this.$store.state.LevelOneMenuActiveName = menuId + this.$store.state.sidebarActiveSubMenuList = + this.$store.state.sidebarMenuList[idx].children || [] }, changeCustomerName(customerName) { this.customerName = localStorage.getItem('customerName') diff --git a/epmet-oper-web/src/views/main-sidebar.vue b/epmet-oper-web/src/views/main-sidebar.vue index 2483a99..e229b65 100644 --- a/epmet-oper-web/src/views/main-sidebar.vue +++ b/epmet-oper-web/src/views/main-sidebar.vue @@ -20,20 +20,16 @@ - + diff --git a/epmet-oper-web/src/views/main.vue b/epmet-oper-web/src/views/main.vue index 3331f01..d4d13fa 100644 --- a/epmet-oper-web/src/views/main.vue +++ b/epmet-oper-web/src/views/main.vue @@ -2,7 +2,13 @@