Merge pull request #815 from furybean/table-scroll

Table: support header mousewheel scroll.

packages/table/src/table.vue

@@ -96,6 +96,7 @@
   import TableLayout from './table-layout';
   import TableBody from './table-body';
   import TableHeader from './table-header';
+  import { mousewheel } from './util';
 
   let tableIdSeed = 1;
 
@@ -185,6 +186,20 @@
           if (refs.rightFixedBodyWrapper) refs.rightFixedBodyWrapper.scrollTop = this.scrollTop;
         });
 
+        mousewheel(headerWrapper, function(event) {
+          event.preventDefault();
+        });
+
+        mousewheel(headerWrapper, throttle(16, function(event) {
+          const deltaX = event.deltaX;
+
+          if (deltaX > 0) {
+            bodyWrapper.scrollLeft = bodyWrapper.scrollLeft + 10;
+          } else {
+            bodyWrapper.scrollLeft = bodyWrapper.scrollLeft - 10;
+          }
+        }));
+
         if (this.fit) {
           this.windowResizeListener = throttle(50, () => {
             if (this.$ready) this.doLayout();

packages/table/src/util.js

@@ -98,3 +98,11 @@ export const getColumnByCell = function(table, cell) {
   }
   return null;
 };
+
+const isFirefox = navigator.userAgent.toLowerCase().indexOf('firefox') > -1;
+
+export const mousewheel = function(element, callback) {
+  if (element && element.addEventListener) {
+    element.addEventListener(isFirefox ? 'DOMMouseScroll' : 'mousewheel', callback);
+  }
+};