规范全局主体容器宽高 规范滚动条出现容器位置

dsk-operate-ui/src/assets/styles/index.scss

@@ -121,12 +121,6 @@ aside {
   }
 }
 
-//main-container全局样式
-.app-container {
-  //padding: 16px;
-  //margin-top: 56px;
-}
-
 .components-container {
   margin: 30px 50px;
   position: relative;
@@ -226,18 +220,13 @@ li {
   margin: 0;
 }
 
-.app-main {
-  position: relative;
-  background-color: #f5f5f5;
-  >div{
-    width: calc(100% - 48px);
-  }
-}
 .app-container {
-  margin: 16px 24px;
+  width: 100%;
+  height: 100%;
   background-color: #f5f5f5;
+  padding: 16px 24px;
   box-sizing: border-box;
-  //width: 100%;
+  overflow: auto;
   .el-input__inner {
     border-color: #d9d9d9;
     color: #232323;

dsk-operate-ui/src/assets/styles/sidebar.scss

@@ -215,7 +215,7 @@
 
   .hideSidebar {
     .sidebar-container {
-      width: 48px !important;
+      width: $hideSideBarWidth !important;
 
       .sidebar-logo-container {
         padding: 0px;
@@ -235,8 +235,8 @@
     }
 
     .main-container {
-      margin-left: 48px;
-      width: calc(100% - 48px);
+      margin-left: $hideSideBarWidth;
+      width: calc(100% - #{$hideSideBarWidth});
     }
 
     .submenu-title-noDropdown {

dsk-operate-ui/src/assets/styles/variables.scss

@@ -52,6 +52,7 @@ $subMenuHover:#001528;
 
 $base-sidebar-width: 220px;
 $sideBarWidth: 220px;
+$hideSideBarWidth : 48px;
 
 //系统默认颜色
 $systemColor:#0081FF;

dsk-operate-ui/src/layout/components/AppMain.vue

@@ -10,16 +10,16 @@
 </template>
 
 <script>
-import iframeToggle from "./IframeToggle/index"
+import iframeToggle from "./IframeToggle/index";
 export default {
   name: 'AppMain',
   components: { iframeToggle },
   computed: {
     cachedViews() {
-      return this.$store.state.tagsView.cachedViews
+      return this.$store.state.tagsView.cachedViews;
     },
     key() {
-      return this.$route.fullPath
+      return this.$route.fullPath;
     }
   }
 }
@@ -27,12 +27,11 @@ export default {
 
 <style lang="scss" scoped>
 .app-main {
-  /* 50= navbar  50  */
-  min-height: calc(100vh - 50px);
-  width: 100%;
   position: relative;
+  height: calc(100% - 56px);
+  width: 100%;
+  background: #f5f5f5;
   overflow: hidden;
-  display: flex;
 }
 
 .fixed-header + .app-main {
@@ -41,20 +40,17 @@ export default {
 
 .hasTagsView {
   .app-main {
-    /* 84 = navbar + tags-view = 50 + 34 */
-    min-height: calc(100vh - 56px);
-	min-width:1240px;
-    background: #F5F5F5;
-    overflow: initial;
+    height: calc(100% - 56px);
+    min-width: 1240px;
   }
 
   .fixed-header + .app-main {
     padding-top: 84px;
   }
 }
-.EnterpriseData{
+.EnterpriseData {
   .app-main {
-    overflow: initial;
+    overflow: hidden;
   }
 }
 </style>

dsk-operate-ui/src/layout/index.vue

@@ -96,6 +96,7 @@ export default {
     position: relative;
     height: 100%;
     width: 100%;
+    overflow: hidden;
 
     &.mobile.openSidebar {
       position: fixed;