文件列表滚动条bug

src/views/department/MyFile.vue

@@ -151,10 +151,11 @@
                 <!-- </div> -->
                 <!-- 展示文件夹盒子 -->
                 <!-- 文件夹 -->
-                <div class="detailBox file-jia" @click="mouseClick">
+                <div class="showBox">
+                  <div class="detailBox file-jia" @click="mouseClick">
                     <el-collapse v-model="folder">
                         <el-collapse-item title="文件夹" name="1" class="custom-collapse-item">
-                            <el-table v-if="folderGrid" :data="folderList" style="width: 100%" :scrollbar-always-on="true"
+                            <el-table v-if="folderGrid" :data="folderList" height="37vh" style="width: 100%" :scrollbar-always-on="true"
                                 @selection-change="handleSelectionChange1" :single-select="true" @row-click="folderClick"
                                 @row-contextmenu="folderRClick" ref="taskTableRef">
                                 <el-table-column type="selection" width="55" />
@@ -167,7 +168,7 @@
                                             <img v-else @click.stop="delCollect(scope.row,true)" src="../../assets/images/yellowstar.png" alt="" class="juli">
                                             <img src="../../assets/images/fileBox.png" style="width: 20px;height: 24px;"
                                                 alt="" class="juli">
-                                                 <el-tooltip
+                                                <el-tooltip
                                                     class="box-item"
                                                     effect="dark"
                                                     placement="top"
@@ -175,7 +176,7 @@
                                                     v-if="scope.row.encryptLevel"
                                                 > 
                                                 <template #content> {{ scope.row.encryptLevel == 'L1'?'敏感':(scope.row.encryptLevel == 'L2'?'涉密':(scope.row.encryptLevel == 'L3'?'机密':'绝密')) }} </template>
-                                                   <span class="shouzhi"> {{ scope.row.dirName }}</span>
+                                                <span class="shouzhi"> {{ scope.row.dirName }}</span>
                                                 </el-tooltip>
                                                 <span class="shouzhi" v-else> {{ scope.row.dirName }}</span>
                                         </span>
@@ -222,7 +223,7 @@
                     <div class="fileTable">
                         <el-collapse v-model="files" >
                             <el-collapse-item title="文件" name="2" class="">
-                                <el-table v-if="fileGrid" :data="fileList" height="250" :scrollbar-always-on="true" style="width: 100%;position: relative;"
+                                <el-table v-if="fileGrid" height="38vh" :data="fileList" :scrollbar-always-on="true" style="width: 100%"
                                     @row-contextmenu="handleRowClick" @selection-change="handleSelectionChange"
                                     @row-click="mouseClick" :default-sort="{ prop: 'createTime', order: 'descending' }">
                                     <el-table-column type="selection" width="55" />
@@ -234,7 +235,7 @@
                                             </el-icon>
                                             <img v-else @click.stop="delCollect(scope.row,false)" src="../../assets/images/yellowstar.png" alt="" class="juli">
                                             <img :src="getImage(scope.row.fileType)" alt="" class="juli">
-                                                  <el-tooltip
+                                                <el-tooltip
                                                         class="box-item"
                                                         effect="dark"
                                                         placement="top"
@@ -283,6 +284,8 @@
                             </p>
                         </div>
                     </div>
+
+                </div>
                     </div>
                 <div v-else>
                     <div>
@@ -1895,6 +1898,8 @@ p {
     background-color: #F6F7F9;
 
     .topPath {
+        margin-left: 4px;
+        cursor: pointer;
         color: #6F85B5;
         font-size: 12px;
     }
@@ -1907,18 +1912,31 @@ p {
 
 .detailBox {
     width: 100%;
-    height: 270px;
+    height: 50%;
+    overflow-y: auto;
+}
+.showBox{
+    height: calc(100% - 48px - 24px);
 }
 
 :deep(.el-dialog__header) {
     background-color: #ECEFF7;
     margin-right: 0px;
 }
+:deep(.el-collapse-item__content) {
+    // height: 235px;
+    overflow-y: auto;
+    padding-bottom: 0;
+}
+:deep(.el-scrollbar__wrap) {
+    height: 100% !important; 
+    // overflow-y: auto;
+}
 
 .fileTable {
-    height: 100%;
-    overflow-y: hidden;
-    margin-top: 55px;
+    height: 50%;
+    overflow-y: auto;
+    // margin-top: 55px;
 }
 
 .setCli {
@@ -2048,7 +2066,7 @@ p {
 }
 
 :deep(.el-collapse-item__wrap) {
-    height: 300px;
+    // height: 300px;
 }
 
 // 隐藏全选按钮

src/views/myfile/MyFile.vue

@@ -186,9 +186,9 @@
                 <!-- 文件夹 -->
                 <div class="showBox">
                     <div class="detailBox file-jia" @click="mouseClick">
-                        <el-collapse v-model="folder" style="height: 100%;">
+                        <el-collapse v-model="folder" >
                             <el-collapse-item title="文件夹" name="1" class="custom-collapse-item">
-                                <el-table v-if="folderGrid" :data="folderList" style="width: 100%" :scrollbar-always-on="true"
+                                <el-table v-if="folderGrid" height="37vh" :data="folderList" style="width: 100%" :scrollbar-always-on="true"
                                     @selection-change="handleSelectionChange1" :single-select="true" @row-click="folderClick"
                                     @row-contextmenu="folderRClick" ref="taskTableRef">
                                     <el-table-column type="selection" width="55" />
@@ -255,9 +255,9 @@
                         </div>
                         <!-- 文件 -->
                         <div class="fileTable">
-                            <el-collapse v-model="files" style="height: 100%;" >
-                                <el-collapse-item title="文件" name="2" class="">
-                                    <el-table v-if="fileGrid" :data="fileList" :scrollbar-always-on="true" style="width: 100%;position: relative;"
+                            <el-collapse v-model="files"  >
+                                <el-collapse-item title="文件" name="2" class="custom-collapse-item">
+                                    <el-table v-if="fileGrid" height="38vh" :data="fileList" :scrollbar-always-on="true" style="width: 100%;"
                                         @row-contextmenu="handleRowClick" @selection-change="handleSelectionChange"
                                         @row-click="mouseClick" :default-sort="{ prop: 'createTime', order: 'descending' }">
                                         <el-table-column type="selection" width="55" />
@@ -1195,6 +1195,7 @@ export default {
                     })
                 } else {
                     myfile.getById(newDirId.value).then(res => {
+                        console.log('folerFile',res);
                         if (res.code === 200) {
                             fileList.value = JSON.parse(JSON.stringify(res.rows))
                             // console.log('fileList',toRaw(fileList.value));
@@ -2024,12 +2025,13 @@ p {
     background-color: #EBEFF6 !important;
 }
 .showBox{
-    height: 100%;
+    height: calc(100% - 48px - 24px);
 }
 
 .detailBox {
     width: 100%;
     height: 50%;
+    overflow-y: auto;
 }
 
 :deep(.el-dialog__header) {
@@ -2039,8 +2041,7 @@ p {
 
 .fileTable {
     height: 50%;
-    overflow-y: hidden;
-    margin-top: 55px;
+    overflow-y: auto;
 }
 
 .setCli {
@@ -2102,8 +2103,12 @@ p {
 :deep(.el-collapse-item__content) {
     // height: 235px;
     overflow-y: auto;
+    padding-bottom: 0;
+}
+:deep(.el-scrollbar__wrap) {
+    height: 100% !important; 
+    // overflow-y: auto;
 }
-
 .ellipsis-text {
     white-space: nowrap;
     overflow: hidden;

src/views/publicment/MyFile.vue

@@ -149,11 +149,12 @@
                     </div>
                 <!-- </div> -->
                 <!-- 展示文件夹盒子 -->
+            <div class="showBox">
                 <!-- 文件夹 -->
                 <div class="detailBox file-jia" @click="mouseClick">
                     <el-collapse v-model="folder">
                         <el-collapse-item title="文件夹" name="1" class="custom-collapse-item">
-                            <el-table v-if="folderGrid" :data="folderList" style="width: 100%" :scrollbar-always-on="true"
+                            <el-table v-if="folderGrid" height="37vh" :data="folderList" style="width: 100%" :scrollbar-always-on="true"
                                 @selection-change="handleSelectionChange1" :single-select="true" @row-click="folderClick"
                                 @row-contextmenu="folderRClick" ref="taskTableRef">
                                 <el-table-column type="selection" width="55" />
@@ -221,7 +222,7 @@
                     <div class="fileTable">
                         <el-collapse v-model="files" >
                             <el-collapse-item title="文件" name="2" class="">
-                                <el-table v-if="fileGrid" :data="fileList" height="250" :scrollbar-always-on="true" style="width: 100%;position: relative;"
+                                <el-table v-if="fileGrid" :data="fileList" height="38vh" :scrollbar-always-on="true" style="width: 100%"
                                     @row-contextmenu="handleRowClick" @selection-change="handleSelectionChange"
                                     @row-click="mouseClick" :default-sort="{ prop: 'createTime', order: 'descending' }">
                                     <el-table-column type="selection" width="55" />
@@ -281,6 +282,7 @@
                             </p>
                         </div>
                     </div>
+            </div>
                     </div>
                 <div v-else>
                     <div>
@@ -1905,6 +1907,8 @@ p {
     background-color: #F6F7F9;
 
     .topPath {
+         margin-left: 4px;
+        cursor: pointer;
         color: #6F85B5;
         font-size: 12px;
     }
@@ -1917,18 +1921,23 @@ p {
 
 .detailBox {
     width: 100%;
-    height: 30vh;
+    height: 50%;
+    overflow-y: auto;
+}
+.showBox{
+    height: calc(100% - 48px - 24px);
 }
 
+
 :deep(.el-dialog__header) {
     background-color: #ECEFF7;
     margin-right: 0px;
 }
 
 .fileTable {
-    height: 45vh;
+    height: 50%;
     overflow-y: hidden;
-    margin-top: 48px;
+    // margin-top: 48px;
 }
 
 .setCli {
@@ -1990,6 +1999,11 @@ p {
 :deep(.el-collapse-item__content) {
     // height: 235px;
     overflow-y: auto;
+    padding-bottom: 0;
+}
+:deep(.el-scrollbar__wrap) {
+    height: 100% !important; 
+    // overflow-y: auto;
 }
 
 .ellipsis-text {