From d8c38207c08510d805a8dc66ffbba210e0cf4215 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=97=A0=E6=9C=A8?= <netfan@foxmail.com>
Date: Mon, 5 Jul 2021 00:34:23 +0800
Subject: [PATCH] fix(table): scrollbar style

---
 .../Table/src/hooks/useTableScroll.ts         | 17 +++++++
 src/design/ant/table.less                     | 48 ++++++++++++++++++-
 2 files changed, 63 insertions(+), 2 deletions(-)

diff --git a/src/components/Table/src/hooks/useTableScroll.ts b/src/components/Table/src/hooks/useTableScroll.ts
index 29116e38..75c7c619 100644
--- a/src/components/Table/src/hooks/useTableScroll.ts
+++ b/src/components/Table/src/hooks/useTableScroll.ts
@@ -68,6 +68,23 @@ export function useTableScroll(
       bodyEl = tableEl.querySelector('.ant-table-body');
     }
 
+    const hasScrollBarY = bodyEl.scrollHeight > bodyEl.clientHeight;
+    const hasScrollBarX = bodyEl.scrollWidth > bodyEl.clientWidth;
+
+    if (hasScrollBarY) {
+      tableEl.classList.contains('hide-scrollbar-y') &&
+        tableEl.classList.remove('hide-scrollbar-y');
+    } else {
+      !tableEl.classList.contains('hide-scrollbar-y') && tableEl.classList.add('hide-scrollbar-y');
+    }
+
+    if (hasScrollBarX) {
+      tableEl.classList.contains('hide-scrollbar-x') &&
+        tableEl.classList.remove('hide-scrollbar-x');
+    } else {
+      !tableEl.classList.contains('hide-scrollbar-x') && tableEl.classList.add('hide-scrollbar-x');
+    }
+
     bodyEl!.style.height = 'unset';
 
     if (!unref(getCanResize) || tableData.length === 0) return;
diff --git a/src/design/ant/table.less b/src/design/ant/table.less
index 48a8c490..ee62b998 100644
--- a/src/design/ant/table.less
+++ b/src/design/ant/table.less
@@ -2,7 +2,7 @@
 
 // fix table unnecessary scrollbar
 .@{prefix-cls} {
-  .ant-table-wrapper {
+  .hide-scrollbar-y {
     .ant-spin-nested-loading {
       .ant-spin-container {
         .ant-table {
@@ -13,7 +13,7 @@
               }
 
               .ant-table-body {
-                overflow: auto !important;
+                overflow-y: auto !important;
               }
             }
 
@@ -24,6 +24,50 @@
                 }
               }
             }
+
+            .ant-table-fixed-left {
+              .ant-table-body-outer {
+                .ant-table-body-inner {
+                  overflow-y: auto !important;
+                }
+              }
+            }
+          }
+        }
+      }
+    }
+  }
+
+  .hide-scrollbar-x {
+    .ant-spin-nested-loading {
+      .ant-spin-container {
+        .ant-table {
+          .ant-table-content {
+            .ant-table-scroll {
+              .ant-table-hide-scrollbar {
+                //overflow-x: auto !important;
+              }
+
+              .ant-table-body {
+                overflow: auto !important;
+              }
+            }
+
+            .ant-table-fixed-right {
+              .ant-table-body-outer {
+                .ant-table-body-inner {
+                  overflow-x: auto !important;
+                }
+              }
+            }
+
+            .ant-table-fixed-left {
+              .ant-table-body-outer {
+                .ant-table-body-inner {
+                  overflow-x: auto !important;
+                }
+              }
+            }
           }
         }
       }
-- 
GitLab