feat: 删除多余的布局元素

src/layouts/DefaultLayout/index.vue

@@ -2,7 +2,7 @@
  * @Author: WangJiaCheng
  * @Date: 2021-05-06 17:24:30
  * @LastEditors: wjc
- * @LastEditTime: 2021-09-24 11:00:05
+ * @LastEditTime: 2021-09-24 15:12:20
  * @Description:
 -->
 <template>
@@ -44,10 +44,9 @@ export default {
   }
   .layout-main {
     width: 100%;
+    height: 100%;
     display: flex;
     justify-content: space-between;
-    height: calc(100% - 60px);
-    overflow: scroll;
     padding: 0;
     background: #fff;
   }

src/views/app/components/AttributePanel/AttributePanel.vue

@@ -2,7 +2,7 @@
  * @Author: WangJiaCheng
  * @Date: 2021-09-14 16:24:04
  * @LastEditors: wjc
- * @LastEditTime: 2021-09-18 10:04:28
+ * @LastEditTime: 2021-09-24 16:43:31
  * @Description: 属性面板
 -->
 <template>
@@ -52,3 +52,13 @@ export default {
   }
 }
 </script>
+
+<style lang="less">
+ .attribute-panel {
+   width: 20%;
+   .field-box {
+    height: calc(100% - 100px);
+    overflow: scroll;
+   }
+ }
+</style>

src/views/app/components/ElementUiPanel/ElementUiPanel.vue

@@ -2,7 +2,7 @@
  * @Author: wjc
  * @Date: 2021-09-15 16:03:17
  * @LastEditors: wjc
- * @LastEditTime: 2021-09-17 15:12:04
+ * @LastEditTime: 2021-09-24 15:21:49
  * @Description:
 -->
 <template>
@@ -107,8 +107,6 @@ export default {
 
 <style lang="less">
   .element-ui-panel {
-    height: calc(100vh - 60px);
-    overflow: hidden;
     .components-list {
       padding: 8px;
       box-sizing: border-box;

src/views/app/editor/EditorArea/EditorArea.vue

@@ -2,7 +2,7 @@
  * @Author: wjc
  * @Date: 2021-09-16 10:55:40
  * @LastEditors: wjc
- * @LastEditTime: 2021-09-24 14:20:14
+ * @LastEditTime: 2021-09-24 16:31:22
  * @Description:
 -->
 <template>
@@ -92,11 +92,16 @@ export default {
 
 <style lang='less'>
   .editor-area {
-    background: #fff;
-    width: 100%;
-    height: 100%;
+    background: #f5f5f5;
+    width: 60%;
+    // height: 100%;
+    height: calc(100vh - 60px);
+    overflow: auto;
+          // padding: 20px;
     .drag-board {
-      height: 500px;
+      min-height: 500px;
+      background: #fff;
+      margin: 20px;
       .w-table {
         padding: 0 20px 20px;
       }

src/views/app/editor/index.vue

@@ -2,7 +2,7 @@
  * @Author: WangJiaCheng
  * @Date: 2021-08-20 09:10:36
  * @LastEditors: wjc
- * @LastEditTime: 2021-09-23 15:19:06
+ * @LastEditTime: 2021-09-24 16:40:57
  * @Description: 编辑器
 -->
 <template>
@@ -34,19 +34,15 @@
         </el-tab-pane>
       </el-tabs>
     </div>
-    <div class="editor-main">
-      <editor-area
-        ref="editorArea"
-        :active-id="activeId"
-        @active-item="handleActiveItem"
-      />
-    </div>
-    <div class="props-panel">
-      <attribute-panel
-        :drag-list="dragList"
-        :active-data="activeData"
-      />
-    </div>
+    <editor-area
+      ref="editorArea"
+      :active-id="activeId"
+      @active-item="handleActiveItem"
+    />
+    <attribute-panel
+      :drag-list="dragList"
+      :active-data="activeData"
+    />
   </div>
 </template>
 
@@ -100,19 +96,15 @@ export default {
     .editor-menu {
       width: 20%;
       height: 100%;
+      .el-tabs__content {
+        height: calc(100% - 60px);
+        overflow: scroll;
+      }
       .el-tabs__nav {
         .el-tabs__item {
           text-align: center;
         }
       }
     }
-    .editor-main {
-      padding: 20px;
-      background: #f5f5f5;
-      width: 60%;
-    }
-    .props-panel {
-      width: 20%;
-    }
   }
 </style>