From 209aa60b03f187c53741af33da428bd33e157784 Mon Sep 17 00:00:00 2001
From: zhujiyan <17812234322@163.com>
Date: Mon, 2 Sep 2024 18:54:03 +0800
Subject: [PATCH] =?UTF-8?q?table=E6=BB=9A=E5=8A=A8=E6=9D=A1=E6=A0=B7?=
 =?UTF-8?q?=E5=BC=8F=E4=BF=AE=E6=94=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 frontend/src/styles/common.scss  |  2 +-
 frontend/src/styles/element.scss | 41 ++++++++++++++++++++++++++++++++
 2 files changed, 42 insertions(+), 1 deletion(-)

diff --git a/frontend/src/styles/common.scss b/frontend/src/styles/common.scss
index 08f8fd3..960e156 100644
--- a/frontend/src/styles/common.scss
+++ b/frontend/src/styles/common.scss
@@ -72,7 +72,7 @@
 
 /* scroll bar */
 ::-webkit-scrollbar {
-  width: 8px;
+  width: 6px;
   height: 200px;
   // background-color: var(--el-color-primary);
 }
diff --git a/frontend/src/styles/element.scss b/frontend/src/styles/element.scss
index 2c09edc..572dcac 100644
--- a/frontend/src/styles/element.scss
+++ b/frontend/src/styles/element.scss
@@ -339,3 +339,44 @@
   background-color: var(--el-color-primary) !important;
   color: #fff;
 }
+.el-table__body-wrapper,.el-scrollbar{
+  /* scroll bar */
+  z-index: 2001;
+  &::-webkit-scrollbar {
+    width: 8px !important;
+    height: 200px !important;
+    // background-color: var(--el-color-primary);
+  z-index: 3001;
+  }
+  /* 滚动条实际可拖动部分的颜色 */
+  ::-webkit-scrollbar-thumb {
+    width: 8px;
+    height: 100px;
+    background-color: var(--el-border-color-darker) !important;
+    // background-color: var(--el-color-primary);
+    border-radius: 20px;
+    background-color: var(--el-color-primary) !important;
+    cursor: pointer;
+    z-index: 3001;
+  }
+}
+
+/* ---el-table滚动条公共样式--- */
+.el-scrollbar {
+  // 横向滚动条
+  .el-scrollbar__bar.is-horizontal .el-scrollbar__thumb {
+    opacity: 1; // 默认滚动条自带透明度
+    height: 20px; // 横向滑块的宽度
+    border-radius: 4px; // 圆角度数
+    background-color: var(--el-color-primary); // 滑块背景色
+    box-shadow: 0 0 6px rgba(0, 0, 0, 0.15); // 滑块阴影
+  }
+  // 纵向滚动条
+  .el-scrollbar__bar.is-vertical .el-scrollbar__thumb {
+    opacity: 1;
+    width: 6px; // 纵向滑块的宽度
+    border-radius: 4px;
+    background-color: var(--el-color-primary);
+    box-shadow: 0 0 6px rgba(0, 0, 0, 0.15);
+  }
+}
\ No newline at end of file