fix category tree view scrolling

phcreery · Jun 18, 2023 · 305dcd2 · 305dcd2
1 parent d015073
commit 305dcd2
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 7 deletions.
diff --git a/src/components/ProTree/index.scss b/src/components/ProTree/index.scss
@@ -1,5 +1,7 @@
 .filter {
   box-sizing: border-box;
+  display: flex;
+  flex-flow: column;
   width: 280px;
   height: 100%;
   padding: 18px;
@@ -18,17 +20,17 @@
     .header-button-ri {
       float: right;
     }
-    .el-button {
+    :deep(.el-button) {
       margin-bottom: 15px;
     }
   }
   .el-input {
     margin: 0 0 15px;
   }
   .el-scrollbar {
+    flex: 1 1 auto;
+    overflow: auto;
     :deep(.el-tree) {
-      height: 80%;
-      overflow: auto;
       .el-tree-node__content {
         height: 30px;
       }

diff --git a/src/components/ProTree/index.vue b/src/components/ProTree/index.vue
@@ -8,14 +8,12 @@
         <slot name="treeHeader" :row="selectedItem"></slot>
       </div>
       <div class="header-button-ri" v-if="toolButton">
-        <el-button-group>
-          <el-button :icon="Refresh" @click="refresh"> </el-button>
-        </el-button-group>
+        <el-button :icon="Refresh" @click="refresh"> </el-button>
       </div>
     </div>
     <el-input v-model="filterText" placeholder="Filter keyword" />
     <!-- Tree -->
-    <el-scrollbar :style="{ height: title ? `calc(100% - 115px)` : `calc(100% - 110px)` }">
+    <el-scrollbar>
       <el-tree
         ref="treeRef"
         :data="treeData"