1. init scrollbar 外壳交互优化处理

src/views/pages/main.vue

 <template>
+    <el-scrollbar class="container-scrollbar-main">
         <div class="manager-container d-flex flex-column">
             <div class="flex-none">
                 <CommonHeader></CommonHeader>
@@ -17,11 +18,14 @@
                             justify-content-center
                         "
                     >
-                    <router-view class="router-page flex-fill"></router-view>
+                        <router-view
+                            class="router-page flex-fill"
+                        ></router-view>
                     </div>
                 </el-scrollbar>
             </div>
         </div>
+    </el-scrollbar>
 </template>
 
 <script lang="ts">
@@ -37,10 +41,10 @@
     @import "~@/css/variables.less";
     .manager-container {
         height: 100%;
-        min-width: 1200px;
 
         .root-contaniner {
             height: calc(100vh - 64px);
+            min-width: 1200px;
         }
 
         .main-container {
@@ -62,18 +66,19 @@
         height: 100%;
     }
 
-    .container-scrollbar-left,
-    .container-scrollbar-right {
+    /deep/ .container-scrollbar-left,
+    /deep/ .container-scrollbar-main,
+    /deep/ .container-scrollbar-right {
         display: flex;
         flex-direction: column;
 
-        /deep/ .el-scrollbar__wrap {
+        > .el-scrollbar__wrap {
             display: flex;
             flex-direction: column;
             flex: 1 1 auto;
             height: 100%;
 
-            .el-scrollbar__view {
+            > .el-scrollbar__view {
                 height: 100%;
             }
         }