From 6bcd850bcad892723a6c7efc969a5a42beb5ee38 Mon Sep 17 00:00:00 2001
From: jmal <zhushilun084@gmail.com>
Date: Tue, 5 Aug 2025 17:08:10 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E4=BF=AE=E5=A4=8D=E6=96=87=E4=BB=B6?=
 =?UTF-8?q?=E5=88=97=E8=A1=A8=E7=9A=84=E6=BB=9A=E5=8A=A8=E7=A9=BF=E9=80=8F?=
 =?UTF-8?q?=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/ShowFile/ShowFile.vue | 14 +++++++++-----
 src/utils/scrollLockMixin.js         | 16 ++++++++++++++++
 2 files changed, 25 insertions(+), 5 deletions(-)
 create mode 100644 src/utils/scrollLockMixin.js

diff --git a/src/components/ShowFile/ShowFile.vue b/src/components/ShowFile/ShowFile.vue
index 9cce890..1258067 100644
--- a/src/components/ShowFile/ShowFile.vue
+++ b/src/components/ShowFile/ShowFile.vue
@@ -431,10 +431,10 @@
         <div
           v-show="grid"
           ref="gridDiv"
-          v-loading="tableLoading"
-          element-loading-text="文件加载中"
           element-loading-spinner="el-icon-loading"
           element-loading-background="#f6f7fa88"
+          @mouseenter="disableBodyScroll"
+          @mouseleave="enableBodyScroll"
         >
           <van-checkbox-group
             ref="checkboxGroup"
@@ -451,6 +451,8 @@
                   rowGap: '10px',
                   overflow: 'auto',
                   paddingBottom: '12px',
+                  overscrollBehavior: 'contain',
+                  transform: 'translateZ(0)',
                 }"
               >
                   <van-grid-item
@@ -774,11 +776,14 @@ import Clipboard from 'clipboard'
 
 import { isNotDragUploadAllowed } from '@/components/SimpleUploader/dragUploadUtils'
 
+import { scrollLockMixin } from '@/utils/scrollLockMixin'
+
 import _ from 'lodash'
 import path from 'path'
 import { mapGetters, mapState } from 'vuex'
 
 export default {
+  mixins: [scrollLockMixin],
   name: 'ShowFile',
   components: {
     SortDropdown,
@@ -3031,9 +3036,8 @@ export default {
     },
     tableBodyScroll(table, e) {
       this.fileListScrollTop = e.target.scrollTop
-      let scrollBottom =
-        e.target.scrollHeight - e.target.clientHeight - e.target.scrollTop
-      if (scrollBottom < 200) {
+      let scrollBottom = e.target.scrollHeight - e.target.clientHeight - e.target.scrollTop
+      if (scrollBottom < (e.target.scrollHeight * 0.2)) {
         if (!this.finished) {
           if (!this.pageLoadCompleteList[this.pagination.pageIndex]) {
             return
diff --git a/src/utils/scrollLockMixin.js b/src/utils/scrollLockMixin.js
new file mode 100644
index 0000000..0a9a37c
--- /dev/null
+++ b/src/utils/scrollLockMixin.js
@@ -0,0 +1,16 @@
+export const scrollLockMixin = {
+  methods: {
+    // 鼠标进入滚动区域时，禁止body滚动
+    disableBodyScroll() {
+      document.body.style.overflow = 'hidden';
+    },
+    // 鼠标离开时，恢复body滚动
+    enableBodyScroll() {
+      document.body.style.overflow = 'auto'; // 或者 'visible'
+    }
+  },
+  // 关键：在组件销毁前，确保恢复body滚动，防止页面卡死
+  beforeDestroy() {
+    this.enableBodyScroll();
+  }
+};