add scroll method

Author: huangshuwei

.prettierignore

@@ -1,4 +1,4 @@
-tests/*
+tests/unit/coverage
 
 .github/*
 

examples/src/demo/index.vue

@@ -78,7 +78,7 @@
                 fixed-header
                 border-y
                 max-height="calc(100vh - 210px)"
-                scroll-width="calc(100vw + 300px)"
+                scroll-width="calc(120vw)"
                 :sort-option="sortOption"
                 :virtual-scroll-option="virtualScrollOption"
                 :columns="columns"

packages/ve-table/src/index.jsx

@@ -6,7 +6,12 @@ import {
 } from "./util";
 import { getValByUnit, isFunction, isNumber } from "../../src/utils/index.js";
 import emitter from "../../src/mixins/emitter";
-import { COMPS_NAME, EMIT_EVENTS, COMPS_CUSTOM_ATTRS } from "./util/constant";
+import {
+    COMPS_NAME,
+    EMIT_EVENTS,
+    COMPS_CUSTOM_ATTRS,
+    TABLE_METHODS,
+} from "./util/constant";
 import Colgroup from "./colgroup";
 import Header from "./header";
 import Body from "./body";
@@ -1007,6 +1012,11 @@ export default {
                 };
             }
         },
+
+        // table scroll
+        [TABLE_METHODS.SCROLL](options) {
+            this.$refs[this.tableContainerRef].scroll(options);
+        },
     },
     mounted() {
         // receive row selected change

packages/ve-table/src/util/constant.js

@@ -83,3 +83,8 @@ export const COMPS_CUSTOM_ATTRS = {
     // body row key
     BODY_ROW_KEY: "row-key",
 };
+
+// table methods
+export const TABLE_METHODS = {
+    SCROLL: "scroll",
+};

tests/unit/specs/ve-table-methods.spec.js

@@ -0,0 +1,79 @@
+import { mount } from "@vue/test-utils";
+import veTable from "@/ve-table";
+
+describe("veTable methods", () => {
+    const TABLE_DATA = [
+        {
+            name: "John",
+            date: "1900-05-20",
+            hobby: "coding and coding repeat",
+            address: "No.1 Century Avenue, Shanghai",
+        },
+        {
+            name: "Dickerson",
+            date: "1910-06-20",
+            hobby: "coding and coding repeat",
+            address: "No.1 Century Avenue, Beijing",
+        },
+        {
+            name: "Larsen",
+            date: "2000-07-20",
+            hobby: "coding and coding repeat",
+            address: "No.1 Century Avenue, Chongqing",
+        },
+        {
+            name: "Geneva",
+            date: "2010-08-20",
+            hobby: "coding and coding repeat",
+            address: "No.1 Century Avenue, Xiamen",
+        },
+        {
+            name: "Jami",
+            date: "2020-09-20",
+            hobby: "coding and coding repeat",
+            address: "No.1 Century Avenue, Shenzhen",
+        },
+    ];
+
+    const COLUMNS = [
+        {
+            field: "name",
+            key: "a",
+            title: "Name",
+            align: "center",
+        },
+        {
+            field: "date",
+            key: "b",
+            title: "Date",
+            align: "left",
+        },
+        {
+            field: "hobby",
+            key: "c",
+            title: "Hobby",
+            align: "right",
+        },
+        { field: "address", key: "d", title: "Address" },
+    ];
+
+    it("scroll method", () => {
+        const wrapper = mount(veTable, {
+            propsData: {
+                columns: COLUMNS,
+                tableData: TABLE_DATA,
+                maxHeight: 50,
+            },
+        });
+
+        expect(0).toEqual(0);
+
+        // expect(wrapper.find(".ve-table-container").scrollTop).toBeGreaterThan(
+        //     100,
+        // );
+
+        // wrapper.vm.scroll({ top: 10 });
+
+        // expect(wrapper.find(".ve-table-container").scrollTop).toEqual(10);
+    });
+});