feat:滚动条宽度计算逻辑调整；滚动条样式只加在Table上

build/Table.css

@@ -337,7 +337,7 @@
     cursor: pointer; }
     .u-table-filter-column-pop-cont-item .u-checkbox {
       margin: 0px; }
-  .u-table-filter-column-pop-cont-item > span {
+  .u-table-filter-column-pop-cont-item span.drop-menu-title {
     margin-left: -3px;
     max-width: 132px;
     width: auto !important;
@@ -367,6 +367,22 @@
     padding-left: 12px; }
   .u-table.has-fixed-left .u-table-scroll tr td:first-child, .u-table.has-fixed-left .u-table-scroll tr th:first-child {
     padding-left: 8px; }
+  .u-table ::-webkit-scrollbar {
+    width: 8px;
+    height: 8px; }
+  .u-table ::-webkit-scrollbar-button {
+    display: none; }
+  .u-table ::-webkit-scrollbar-thumb {
+    background: #d5d5d5 !important;
+    border-radius: 5px; }
+  .u-table ::-webkit-scrollbar-thumb {
+    border-radius: 4px;
+    background-color: #d5d5d5;
+    position: absolute; }
+  .u-table ::-webkit-scrollbar-track {
+    display: none; }
+  .u-table ::-webkit-scrollbar-track-piece {
+    display: none; }
 
 .u-table:focus {
   outline: none;
@@ -579,28 +595,6 @@
   position: absolute;
   left: 100; }
 
-::-webkit-scrollbar {
-  width: 8px;
-  height: 8px; }
-
-::-webkit-scrollbar-button {
-  display: none; }
-
-::-webkit-scrollbar-thumb {
-  background: #d5d5d5 !important;
-  border-radius: 5px; }
-
-::-webkit-scrollbar-thumb {
-  border-radius: 4px;
-  background-color: #d5d5d5;
-  position: absolute; }
-
-::-webkit-scrollbar-track {
-  display: none; }
-
-::-webkit-scrollbar-track-piece {
-  display: none; }
-
 .header-dispaly-in-row.u-table table {
   table-layout: fixed; }
 

build/utils.js

@@ -44,9 +44,13 @@ var scrollbarMeasure = {
 function measureScrollbar() {
   var direction = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'vertical';
 
+
   if (typeof document === 'undefined' || typeof window === 'undefined') {
     return 0;
   }
+  var tableDom = document.querySelector('.u-table');
+  var currentDom = tableDom ? tableDom : document.body;
+
   if (scrollbarSize) {
     return scrollbarSize;
   }
@@ -54,7 +58,7 @@ function measureScrollbar() {
   Object.keys(scrollbarMeasure).forEach(function (scrollProp) {
     scrollDiv.style[scrollProp] = scrollbarMeasure[scrollProp];
   });
-  document.body.appendChild(scrollDiv);
+  currentDom.appendChild(scrollDiv);
   var size = 0;
   if (direction === 'vertical') {
     size = scrollDiv.offsetWidth - scrollDiv.clientWidth;
@@ -62,7 +66,7 @@ function measureScrollbar() {
     size = scrollDiv.offsetHeight - scrollDiv.clientHeight;
   }
 
-  document.body.removeChild(scrollDiv);
+  currentDom.removeChild(scrollDiv);
   scrollbarSize = size;
   return scrollbarSize;
 }

demo/TableDemo.scss

@@ -8,14 +8,13 @@
 // @import "../node_modules/bee-pagination/src/Pagination.scss";
 // @import "../node_modules/bee-checkbox/src/Checkbox.scss";
 // @import "../node_modules/bee-select/src/Select.scss";
-// @import "../node_modules/bee-form/src/Form.scss";
 // @import "../node_modules/bee-popover/src/Popover.scss";
 // @import "../node_modules/bee-tooltip/src/Tooltip.scss";
 // @import "../node_modules/bee-message/build/Message.css";
 // @import "../node_modules/bee-dropdown/build/Dropdown.css";
 // @import "../node_modules/bee-input-number/build/InputNumber.css";
 // @import "../node_modules/bee-modal/build/Modal.css";
-@import "../src/Table.scss";
+// @import "../src/Table.scss";
 
 
 //引入日期控件样式文件

dist/demo.css

@@ -8627,6 +8627,22 @@ ul {
     padding-left: 12px; }
   .u-table.has-fixed-left .u-table-scroll tr td:first-child, .u-table.has-fixed-left .u-table-scroll tr th:first-child {
     padding-left: 8px; }
+  .u-table ::-webkit-scrollbar {
+    width: 8px;
+    height: 8px; }
+  .u-table ::-webkit-scrollbar-button {
+    display: none; }
+  .u-table ::-webkit-scrollbar-thumb {
+    background: #d5d5d5 !important;
+    border-radius: 5px; }
+  .u-table ::-webkit-scrollbar-thumb {
+    border-radius: 4px;
+    background-color: #d5d5d5;
+    position: absolute; }
+  .u-table ::-webkit-scrollbar-track {
+    display: none; }
+  .u-table ::-webkit-scrollbar-track-piece {
+    display: none; }
 
 .u-table:focus {
   outline: none;
@@ -8841,28 +8857,6 @@ ul {
   position: absolute;
   left: 100; }
 
-::-webkit-scrollbar {
-  width: 8px;
-  height: 8px; }
-
-::-webkit-scrollbar-button {
-  display: none; }
-
-::-webkit-scrollbar-thumb {
-  background: #d5d5d5 !important;
-  border-radius: 5px; }
-
-::-webkit-scrollbar-thumb {
-  border-radius: 4px;
-  background-color: #d5d5d5;
-  position: absolute; }
-
-::-webkit-scrollbar-track {
-  display: none; }
-
-::-webkit-scrollbar-track-piece {
-  display: none; }
-
 .header-dispaly-in-row.u-table table {
   table-layout: fixed; }
 

src/Table.scss

@@ -621,6 +621,31 @@ $icon-color:#505F79;
       }
     }
   }
+  // 滚动条样式复写
+  ::-webkit-scrollbar {
+    width: 8px;
+    height: 8px;
+  }
+  ::-webkit-scrollbar-button {
+    display: none;
+  }
+  ::-webkit-scrollbar-thumb {
+    background: #d5d5d5 !important;
+    border-radius: 5px;
+  }
+  ::-webkit-scrollbar-thumb {
+    border-radius: 4px;
+    background-color: #d5d5d5;
+    position: absolute;
+  }
+
+  ::-webkit-scrollbar-track {
+    display: none;
+  }
+
+  ::-webkit-scrollbar-track-piece {
+    display: none;
+  }
 }
 .u-table:focus{
   outline: none;
@@ -901,31 +926,7 @@ $icon-color:#505F79;
   left: 100;
 }
 
-// 滚动条样式复写
-::-webkit-scrollbar {
-  width: 8px;
-  height: 8px;
-}
-::-webkit-scrollbar-button {
-  display: none;
-}
-::-webkit-scrollbar-thumb {
-  background: #d5d5d5 !important;
-  border-radius: 5px;
-}
-::-webkit-scrollbar-thumb {
-  border-radius: 4px;
-  background-color: #d5d5d5;
-  position: absolute;
-}
 
-::-webkit-scrollbar-track {
-  display: none;
-}
-
-::-webkit-scrollbar-track-piece {
-  display: none;
-}
 
 // 表格显示里面的内容显示在一行
 .header-dispaly-in-row{

src/utils.js

@@ -14,9 +14,13 @@ const scrollbarMeasure = {
 };
 
 export function measureScrollbar(direction = 'vertical') {
+  
   if (typeof document === 'undefined' || typeof window === 'undefined') {
     return 0;
   }
+  const tableDom =document.querySelector('.u-table');
+  let currentDom = tableDom?tableDom:document.body;
+
   if (scrollbarSize) {
     return scrollbarSize;
   }
@@ -24,7 +28,7 @@ export function measureScrollbar(direction = 'vertical') {
   Object.keys(scrollbarMeasure).forEach(scrollProp => {
     scrollDiv.style[scrollProp] = scrollbarMeasure[scrollProp];
   });
-  document.body.appendChild(scrollDiv);
+  currentDom.appendChild(scrollDiv);
   let size = 0;
   if (direction === 'vertical') {
     size = scrollDiv.offsetWidth - scrollDiv.clientWidth;
@@ -32,7 +36,7 @@ export function measureScrollbar(direction = 'vertical') {
     size = scrollDiv.offsetHeight - scrollDiv.clientHeight;
   }
 
-  document.body.removeChild(scrollDiv);
+  currentDom.removeChild(scrollDiv);
   scrollbarSize = size;
   return scrollbarSize;
 }