@juzhenfe/page-model 3.18.2 → 3.18.3

package/dist/components/table/type.d.ts

@@ -186,6 +186,12 @@ declare global {
        * 显示索引列
        */
       showIndex?: boolean
+
+      /**
+       * 辅助横向滚动
+       */
+      assistScrollX?: boolean
+      
       /**
        * 显示多选条数提示
        */

package/dist/index.es.js

@@ -8959,14 +8959,36 @@ const useSelectionsTable = () => {
   };
 };
 function useListenScroll(tableManager) {
+  let scrollBarWrapEle;
   const handleScroll = throttle(function handleScroll2(e) {
     tableManager.updateScrollTop(e.target.scrollTop);
     tableManager.updateScrollLeft(e.target.scrollLeft);
-  }, 120);
-  let scrollBarWrapEle;
+  }, 10);
+  const getScrollable = () => {
+    const wrapRect = scrollBarWrapEle.getBoundingClientRect();
+    const contentRect = scrollBarWrapEle.querySelector(".el-scrollbar__view").getBoundingClientRect();
+    return {
+      scrollY: wrapRect.height < contentRect.height,
+      scrollX: wrapRect.width < contentRect.width
+    };
+  };
+  const setScrollX = (scrollLeft) => {
+    tableManager.tableRef.setScrollLeft(scrollLeft);
+  };
+  const handleWheel = (e) => {
+    const { scrollX, scrollY } = getScrollable();
+    if (!scrollY && scrollX) {
+      const wheelDelta = e.wheelDelta;
+      const currentScrollLeft = scrollBarWrapEle.scrollLeft;
+      setScrollX(currentScrollLeft + Number(wheelDelta * -1));
+    }
+  };
   function onMounted2() {
     scrollBarWrapEle = tableManager.tableRef.$el.querySelector(".el-scrollbar__wrap");
     scrollBarWrapEle.addEventListener("scroll", handleScroll);
+    if (tableManager.table.assistScrollX) {
+      scrollBarWrapEle.addEventListener("mousewheel", handleWheel);
+    }
   }
   function onActivated2() {
     tableManager.tableRef.scrollBarRef.setScrollTop(tableManager.scrollTop);
@@ -8974,6 +8996,9 @@ function useListenScroll(tableManager) {
   }
   function onUnmounted2() {
     scrollBarWrapEle.removeEventListener("scroll", handleScroll);
+    if (tableManager.table.assistScrollX) {
+      scrollBarWrapEle.removeEventListener("mousewheel", handleWheel);
+    }
     scrollBarWrapEle = null;
   }
   return {
@@ -14903,7 +14928,7 @@ const defineEditableTable = function(config) {
 };
 var iconfont = "";
 const name = "@juzhenfe/page-model";
-const version = "3.18.2";
+const version = "3.18.3";
 const types = "dist/main.d.ts";
 const main = "dist/index.umd.js";
 const keywords = [