no message

Former-commit-id: 13af02b4d4c4033582b2762f14fbe8802ec5fc02 [formerly 13af02b4d4c4033582b2762f14fbe8802ec5fc02 [formerly 13af02b4d4c4033582b2762f14fbe8802ec5fc02 [formerly 13af02b4d4c4033582b2762f14fbe8802ec5fc02 [formerly b9712ed794d1db939f9b2bdbb67c8a69d71f89a8 [formerly b6115665f5243c3103684226e0bde661d55597f7]]]]]
Former-commit-id: e3cc9b0aad9cacee0133f5f4c85d43cde717cc9c
Former-commit-id: 63d819826ff2aeb0ca7a811f8b7ddfbe2df048d1
Former-commit-id: 7ebe1bb886125ee3de1c15cd5cbf14c392480af8 [formerly 8df52d9a84afa8e50895c9611ab439b58bfa1d90]
Former-commit-id: ccf6ecbd64a1a2fd5283effabd054bcebc799b6d
Former-commit-id: afde6581b46898bbb98e299ebd7194dc0577f934
Former-commit-id: 8278de89c188805da05d81e10c7aba77bb64c336
Former-commit-id: 89a57f2fae80b360ab76a9d3f2bc99540adaf519
Former-commit-id: 03bf8adadfa169fee5cb039818e415ceb92fd787

design/d2-layout-main-group.xmind.REMOVED.git-id

@@ -0,0 +1 @@
+f6ee530a7841eb687cae7821453739533292ddd6

src/assets/style/theme/theme-base.scss

@@ -1,3 +1,82 @@
+// 整体框架结构
+.d2-layout-main-group {
+  height: 100%;
+  width: 100%;
+  background-size: cover;
+  background-position: center;
+  overflow: hidden;
+  position: relative;
+  // 背景上面的半透明遮罩
+  .d2-layout-main-mask {
+    position: absolute;
+    top: 0px;
+    right: 0px;
+    bottom: 0px;
+    left: 0px;
+  }
+  // 内容层
+  .d2-layout-main-content {
+    position: absolute;
+    top: 0px;
+    right: 0px;
+    bottom: 0px;
+    left: 0px;
+    $d2-theme-header-height: 60px;
+    .d2-theme-header {
+      position: absolute;
+      top: 0px;
+      left: 0px;
+      right: 0px;
+      height: $d2-theme-header-height;
+    }
+    .d2-theme-container {
+      position: absolute;
+      top: $d2-theme-header-height;
+      bottom: 0px;
+      left: 0px;
+      right: 0px;
+      display: flex;
+      flex-direction: row;
+      .d2-theme-container-aside {
+        transition: width .3s;
+        flex-grow: 0;
+        position: relative;
+        .d2-layout-main-menu-side {
+          position: absolute;
+          top: 0px;
+          bottom: 0px;
+          left: 0px;
+          right: 0px;
+          overflow: hidden;
+        }
+      }
+      .d2-theme-container-main {
+        flex-grow: 1;
+        padding: 0px;
+        position: relative;
+        overflow: hidden;
+        display: flex;
+        flex-direction: column;
+        .d2-theme-container-main-header {
+          flex-grow: 0;
+        }
+        .d2-theme-container-main-body {
+          flex-grow: 1;
+          margin-top: 1px;
+          position: relative;
+        }
+      }
+    }
+  }
+}
+
+
+
+
+
+
+
+
 // 主题公用
 .d2-layout-main-group {
   &.grayMode {
@@ -8,30 +87,10 @@
     filter: grayscale(100%);
     filter: gray;
   }
-  height: 100%;
-  width: 100%;
-  background-size: cover;
-  background-position: center;
-  overflow: hidden;
-  position: relative;
-  // 背景上面的半透明遮罩
-  .layout-main-mask {
-    position: absolute;
-    top: 0px;
-    right: 0px;
-    bottom: 0px;
-    left: 0px;
-  }
   // 主体
-  .el-container.d2-layout-main-content {
+  .d2-layout-main-content {
-    position: absolute;
-    top: 0px;
-    right: 0px;
-    bottom: 0px;
-    left: 0px;
     // [布局] 顶栏
-    .el-header.d2-theme-header {
+    .d2-theme-header {
-      padding: 0px;
       // logo区域
       .logo-group {
         transition: width .3s;
@@ -96,11 +155,9 @@
       }
     }
     // [布局] 顶栏下面
-    .el-container.d2-theme-container {
+    .d2-theme-container {
       // 侧边栏
-      .el-aside.d2-theme-container-aside {
+      .d2-theme-container-aside {
-        transition: width .3s;
-        overflow: auto;
         // [菜单] 正常状态
         .el-menu {
           @extend %unable-select;
@@ -155,15 +212,9 @@
         }
       }
       // 右下 主体
-      .el-main.d2-theme-container-main {
+      .d2-theme-container-main {
-        padding: 0px;
-        position: relative;
-        overflow: hidden;
-        display: flex;
-        flex-direction: column;
         // 主体部分分为多页面控制器 和主体
         .d2-theme-container-main-header {
-          flex-grow: 0;
           // 多页面控制器
           .d2-multiple-page-control-group {
             display: flex;
@@ -203,9 +254,6 @@
         }
         // 主体
         .d2-theme-container-main-body {
-          flex-grow: 1;
-          margin-top: 1px;
-          position: relative;
           // 布局组件
           .container-component {
             // 卡片布局组件

src/assets/style/theme/theme.scss

@@ -115,9 +115,9 @@
     }
   }
   // [布局] 顶栏下面
-  .el-container.d2-theme-container {
+  .d2-theme-container {
     // 侧边栏
-    .el-aside.d2-theme-container-aside {
+    .d2-theme-container-aside {
       // 菜单为空的时候显示的信息
       .menu-empty {
         background: $theme-aside-menu-empty-background-color;
@@ -191,7 +191,7 @@
         }
       }
     }
-    .el-main.d2-theme-container-main {
+    .d2-theme-container-main {
       // 主体部分分为多页面控制器 和主体
       .d2-theme-container-main-header {
         // 多页面控制器

src/components/core/d2-layout-main/components/-menu-side/index.vue

@@ -78,12 +78,3 @@ export default {
   }
 }
 </script>
-
-<style lang="scss">
-// TODO: 兼容火狐浏览器需要改这里
-.d2-layout-main-menu-side {
-  position: relative;
-  height: 100%;
-  overflow: hidden;
-}
-</style>

src/components/core/d2-layout-main/index.vue

@@ -6,9 +6,9 @@
     <!-- 半透明遮罩 -->
     <div class="d2-layout-main-mask"></div>
     <!-- 主体内容 -->
-    <el-container class="d2-layout-main-content">
+    <div class="d2-layout-main-content">
       <!-- 顶栏 -->
-      <el-header class="d2-theme-header">
+      <div class="d2-theme-header">
         <div class="logo-group" :style="{width: collapse ? asideWidthCollapse : asideWidth}">
           <img v-if="collapse" :src="`${$assetsPublicPath}static/image/theme/${themeActiveSetting.name}/logo/icon-only.png`">
           <img v-else :src="`${$assetsPublicPath}static/image/theme/${themeActiveSetting.name}/logo/all.png`">
@@ -25,15 +25,15 @@
           <d2-layout-main-header-theme/>
           <d2-layout-main-header-user/>
         </div>
-      </el-header>
+      </div>
       <!-- 下面 主体 -->
-      <el-container class="d2-theme-container">
+      <div class="d2-theme-container">
         <!-- 主体 侧边栏 -->
-        <el-aside ref="aside" class="d2-theme-container-aside" :style="{width: collapse ? asideWidthCollapse : asideWidth}">
+        <div ref="aside" class="d2-theme-container-aside" :style="{width: collapse ? asideWidthCollapse : asideWidth}">
           <d2-layout-main-menu-side :collapse="collapse"/>
-        </el-aside>
+        </div>
         <!-- 主体 -->
-        <el-main class="d2-theme-container-main">
+        <div class="d2-theme-container-main">
           <div class="d2-theme-container-main-header">
             <d2-multiple-page-control/>
           </div>
@@ -47,9 +47,9 @@
               <router-view v-if="!alive"/>
             </transition>
           </div>
-        </el-main>
+        </div>
-      </el-container>
+      </div>
-    </el-container>
+    </div>
   </div>
 </template>