yy-vue-easytable 2.27.2

package/packages/src/utils/auto-resize.js

@@ -0,0 +1,179 @@
+/**
+ * autoResize - resizes a DOM element to the width and height of another DOM element
+ *
+ * Copyright 2014, Marcin Warpechowski
+ * Licensed under the MIT license
+ * refer to https://github.com/handsontable/handsontable/blob/HEAD/handsontable/src/3rdparty/autoResize/index.js
+ */
+
+export function autoResize() {
+    var defaults = {
+            minHeight: 200,
+            maxHeight: 300,
+            minWidth: 100,
+            maxWidth: 300,
+            // text padding
+            paddingWidth: 16,
+        },
+        el,
+        body = document.body,
+        text = document.createTextNode(""),
+        span = document.createElement("SPAN"),
+        observe = function (element, event, handler) {
+            element.addEventListener(event, handler, false);
+        },
+        unObserve = function (element, event, handler) {
+            element.removeEventListener(event, handler, false);
+        },
+        resize = function (newChar) {
+            var width, scrollHeight;
+
+            if (!newChar) {
+                newChar = "";
+            } else if (!/^[a-zA-Z \.,\\\/\|0-9]$/.test(newChar)) {
+                newChar = ".";
+            }
+
+            if (text.textContent !== void 0) {
+                text.textContent = el.value + newChar;
+            } else {
+                text.data = el.value + newChar; //IE8
+            }
+            span.style.fontSize = getComputedStyle(el).fontSize;
+            span.style.fontFamily = getComputedStyle(el).fontFamily;
+            span.style.whiteSpace = "pre";
+
+            body.appendChild(span);
+            width = span.clientWidth + defaults.paddingWidth;
+            body.removeChild(span);
+
+            el.style.height = defaults.minHeight + "px";
+
+            if (defaults.minWidth > width) {
+                el.style.width = defaults.minWidth + "px";
+            } else if (width > defaults.maxWidth) {
+                el.style.width = defaults.maxWidth + "px";
+            } else {
+                el.style.width = width + "px";
+            }
+            scrollHeight = el.scrollHeight ? el.scrollHeight - 1 : 0;
+
+            if (defaults.minHeight > scrollHeight) {
+                el.style.height = defaults.minHeight + "px";
+            } else if (defaults.maxHeight < scrollHeight) {
+                el.style.height = defaults.maxHeight + "px";
+                el.style.overflowY = "visible";
+            } else {
+                el.style.height = scrollHeight + "px";
+            }
+        },
+        delayedResize = function () {
+            window.setTimeout(resize, 0);
+        },
+        extendDefaults = function (config) {
+            if (config && config.minHeight) {
+                if (config.minHeight == "inherit") {
+                    defaults.minHeight = el.clientHeight;
+                } else {
+                    var minHeight = parseInt(config.minHeight);
+                    if (!isNaN(minHeight)) {
+                        defaults.minHeight = minHeight;
+                    }
+                }
+            }
+
+            if (config && config.maxHeight) {
+                if (config.maxHeight == "inherit") {
+                    defaults.maxHeight = el.clientHeight;
+                } else {
+                    var maxHeight = parseInt(config.maxHeight);
+                    if (!isNaN(maxHeight)) {
+                        defaults.maxHeight = maxHeight;
+                    }
+                }
+            }
+
+            if (config && config.minWidth) {
+                if (config.minWidth == "inherit") {
+                    defaults.minWidth = el.clientWidth;
+                } else {
+                    var minWidth = parseInt(config.minWidth);
+                    if (!isNaN(minWidth)) {
+                        defaults.minWidth = minWidth;
+                    }
+                }
+            }
+
+            if (config && config.maxWidth) {
+                if (config.maxWidth == "inherit") {
+                    defaults.maxWidth = el.clientWidth;
+                } else {
+                    var maxWidth = parseInt(config.maxWidth);
+                    if (!isNaN(maxWidth)) {
+                        defaults.maxWidth = maxWidth;
+                    }
+                }
+            }
+
+            if (!span.firstChild) {
+                span.className = "autoResize";
+                span.style.display = "inline-block";
+                span.appendChild(text);
+            }
+        },
+        init = function (el_, config, doObserve) {
+            el = el_;
+            extendDefaults(config);
+
+            if (el.nodeName == "TEXTAREA") {
+                el.style.resize = "none";
+                el.style.overflowY = "";
+                el.style.height = defaults.minHeight + "px";
+                el.style.minWidth = defaults.minWidth + "px";
+                el.style.maxWidth = defaults.maxWidth + "px";
+                el.style.overflowY = "hidden";
+            }
+
+            if (doObserve) {
+                observe(el, "change", resize);
+                observe(el, "cut", delayedResize);
+                observe(el, "paste", delayedResize);
+                observe(el, "drop", delayedResize);
+                observe(el, "keydown", delayedResize);
+                observe(el, "focus", resize);
+                observe(el, "compositionstart", delayedResize);
+                observe(el, "compositionupdate", delayedResize);
+                observe(el, "compositionend", delayedResize);
+            }
+
+            resize();
+        };
+
+    function getComputedStyle(element) {
+        return (
+            element.currentStyle ||
+            document.defaultView.getComputedStyle(element)
+        );
+    }
+
+    return {
+        init: function (el_, config, doObserve) {
+            init(el_, config, doObserve);
+        },
+        unObserve: function () {
+            if (!el) {
+                return false;
+            }
+            unObserve(el, "change", resize);
+            unObserve(el, "cut", delayedResize);
+            unObserve(el, "paste", delayedResize);
+            unObserve(el, "drop", delayedResize);
+            unObserve(el, "keydown", delayedResize);
+            unObserve(el, "focus", resize);
+            unObserve(el, "compositionstart", delayedResize);
+            unObserve(el, "compositionupdate", delayedResize);
+            unObserve(el, "compositionend", delayedResize);
+        },
+        resize: resize,
+    };
+}

package/packages/src/utils/constant.js

@@ -0,0 +1,42 @@
+// key codes
+export const KEY_CODES = {
+    BACK_SPACE: 8,
+    TAB: 9,
+    ENTER: 13,
+    SHIFT: 16,
+    SPACE: 32,
+
+    ARROW_LEFT: 37,
+    ARROW_UP: 38,
+    ARROW_RIGHT: 39,
+    ARROW_DOWN: 40,
+
+    DELETE: 46,
+
+    F2: 113,
+};
+
+// icon name
+export const ICON_NAMES = {
+    FILTER: "filter",
+
+    DOUBLE_RIGHT_ARROW: "double-right-arrow",
+    DOUBLE_LEFT_ARROW: "double-left-arrow",
+
+    TOP_ARROW: "top-arrow",
+    RIGHT_ARROW: "right-arrow",
+    BOTTOM_ARROW: "bottom-arrow",
+    LEFT_ARROW: "left-arrow",
+
+    SORT_TOP_ARROW: "sort-top-arrow",
+    SORT_BOTTOM_ARROW: "sort-bottom-arrow",
+
+    SEARCH: "search",
+};
+
+// mouse event key type
+export const MOUSE_EVENT_CLICK_TYPE = {
+    LEFT_MOUSE: 1,
+    MIDDLE_MOUSE: 2,
+    RIGHT_MOUSE: 2,
+};

package/packages/src/utils/dom.js

@@ -0,0 +1,239 @@
+/*
+fork from:
+https://github.com/ElemeFE/element
+*/
+
+const trim = function (string) {
+    return (string || "").replace(/^[\s\uFEFF]+|[\s\uFEFF]+$/g, "");
+};
+
+// add class
+export function addClass(el, cls) {
+    if (!el) return;
+    var curClass = el.className;
+    var classes = (cls || "").split(" ");
+
+    for (var i = 0, j = classes.length; i < j; i++) {
+        var clsName = classes[i];
+        if (!clsName) continue;
+
+        if (el.classList) {
+            el.classList.add(clsName);
+        } else if (!hasClass(el, clsName)) {
+            curClass += " " + clsName;
+        }
+    }
+    if (!el.classList) {
+        el.className = curClass;
+    }
+}
+
+// remove class
+export function removeClass(el, cls) {
+    if (!el || !cls) return;
+    var classes = cls.split(" ");
+    var curClass = " " + el.className + " ";
+
+    for (var i = 0, j = classes.length; i < j; i++) {
+        var clsName = classes[i];
+        if (!clsName) continue;
+
+        if (el.classList) {
+            el.classList.remove(clsName);
+        } else if (hasClass(el, clsName)) {
+            curClass = curClass.replace(" " + clsName + " ", " ");
+        }
+    }
+    if (!el.classList) {
+        el.className = trim(curClass);
+    }
+}
+
+// has class
+export function hasClass(el, cls) {
+    if (!el || !cls) return false;
+    if (cls.indexOf(" ") !== -1)
+        throw new Error("className should not contain space.");
+    if (el.classList) {
+        return el.classList.contains(cls);
+    } else {
+        return (" " + el.className + " ").indexOf(" " + cls + " ") > -1;
+    }
+}
+
+/*获取当前元素的偏移（相对于整个document）
+ *   offsetTop：元素最顶端距离文档顶端的距离，包含滚动条
+ *   offsetleft：元素最左侧距离文档左侧的距离，包含滚动条
+ *   left：元素最左侧距离文档左侧的距离，不包含滚动条
+ *   top:元素最顶端距离文档顶端的距离，不包含滚动条
+ *   right:元素最右侧距离文档右侧的距离，不包含滚动条
+ *   bottom：元素最底端距离文档底端的距离，不包含滚动条
+ *   right2：元素最左侧距离文档右侧的距离，不包含滚动条
+ *   bottom2：元素最底端距离文档最底部的距离，不包含滚动条
+ * */
+export function getViewportOffset(triggerEl) {
+    var doc = document.documentElement,
+        box =
+            typeof triggerEl.getBoundingClientRect !== "undefined"
+                ? triggerEl.getBoundingClientRect()
+                : 0,
+        scrollLeft =
+            (window.pageXOffset || doc.scrollLeft) - (doc.clientLeft || 0),
+        scrollTop =
+            (window.pageYOffset || doc.scrollTop) - (doc.clientTop || 0),
+        offsetLeft = box.left + window.pageXOffset,
+        offsetTop = box.top + window.pageYOffset;
+
+    var left = offsetLeft - scrollLeft,
+        top = offsetTop - scrollTop;
+
+    return {
+        offsetTop,
+        offsetLeft,
+        left,
+        top,
+        right: window.document.documentElement.clientWidth - box.width - left,
+        bottom: window.document.documentElement.clientHeight - box.height - top,
+        right2: window.document.documentElement.clientWidth - left,
+        bottom2: window.document.documentElement.clientHeight - top,
+    };
+}
+
+/*获取当前元素的偏移(相对于外层容器)
+ *   offsetTop：元素最顶端距离文档顶端的距离，包含滚动条
+ *   offsetleft：元素最左侧距离文档左侧的距离，包含滚动条
+ *   left：元素最左侧距离文档左侧的距离，不包含滚动条
+ *   top:元素最顶端距离文档顶端的距离，不包含滚动条
+ *   right:元素最右侧距离文档右侧的距离，不包含滚动条
+ *   bottom：元素最底端距离文档底端的距离，不包含滚动条
+ *   right2：元素最左侧距离文档右侧的距离，不包含滚动条
+ *   bottom2：元素最底端距离文档最底部的距离，不包含滚动条
+ * */
+export function getViewportOffsetWithinContainer(triggerEl, containerEl) {
+    const {
+        offsetTop: tElOffsetTop,
+        offsetLeft: tElOffsetLeft,
+        left: tElLef,
+        top: tElTop,
+        right: tElRight,
+        bottom: tElBottom,
+        right2: tElRight2,
+        bottom2: tElBottom2,
+    } = getViewportOffset(triggerEl);
+
+    const {
+        offsetTop: cElOffsetTop,
+        offsetLeft: cElOffsetLeft,
+        left: cElLef,
+        top: cElTop,
+        right: cElRight,
+        bottom: cElBottom,
+        right2: cElRight2,
+        bottom2: cElBottom2,
+    } = getViewportOffset(containerEl);
+
+    return {
+        offsetTop: tElOffsetTop - cElOffsetTop,
+        offsetLeft: tElOffsetLeft - cElOffsetLeft,
+        left: tElLef - cElLef,
+        top: tElTop - cElTop,
+        right: tElRight - cElRight,
+        bottom: tElBottom - cElBottom,
+        right2: tElRight2 - cElRight2,
+        bottom2: tElBottom2 - cElBottom2,
+    };
+}
+
+/*获取鼠标相对于文档的坐标
+ *   left：鼠标点击位置距离文档左侧的距离，包含滚动条
+ *   top: 鼠标点击位置距离文档顶端的距离，包含滚动条
+ *   right:鼠标点击位置距离文档右侧的距离，不包含滚动条
+ *   bottom：鼠标点击位置距离文档底端的距离，不包含滚动条
+ * */
+export function getMousePosition(event) {
+    var x = 0,
+        y = 0,
+        doc = document.documentElement,
+        body = document.body;
+    if (!event) event = window.event;
+    if (window.pageYoffset) {
+        //pageYoffset是Netscape特有
+        x = window.pageXOffset;
+        y = window.pageYOffset;
+    } else {
+        x =
+            ((doc && doc.scrollLeft) || (body && body.scrollLeft) || 0) -
+            ((doc && doc.clientLeft) || (body && body.clientLeft) || 0);
+        y =
+            ((doc && doc.scrollTop) || (body && body.scrollTop) || 0) -
+            ((doc && doc.clientTop) || (body && body.clientTop) || 0);
+    }
+    x += event.clientX;
+    y += event.clientY;
+
+    let right = doc.clientWidth - event.clientX;
+    let bottom = doc.clientHeight - event.clientY;
+
+    return { left: x, top: y, right, bottom };
+}
+
+/**
+ * Returns caret position in text input.
+ *
+ * @author https://stackoverflow.com/questions/263743/how-to-get-caret-position-in-textarea
+ * @param {HTMLElement} el An element to check.
+ * @returns {number}
+ */
+export function getCaretPosition(el) {
+    const rootDocument = document;
+
+    if (el.selectionStart) {
+        return el.selectionStart;
+    } else if (rootDocument.selection) {
+        // IE8
+        el.focus();
+
+        const r = rootDocument.selection.createRange();
+
+        if (r === null) {
+            return 0;
+        }
+        const re = el.createTextRange();
+        const rc = re.duplicate();
+
+        re.moveToBookmark(r.getBookmark());
+        rc.setEndPoint("EndToStart", re);
+
+        return rc.text.length;
+    }
+
+    return 0;
+}
+
+/**
+ * Sets caret position in text input.
+ *
+ * @author http://blog.vishalon.net/index.php/javascript-getting-and-setting-caret-position-in-textarea/
+ * @param {Element} element An element to process.
+ * @param {number} pos The selection start position.
+ * @param {number} endPos The selection end position.
+ */
+export function setCaretPosition(element, pos, endPos) {
+    if (endPos === void 0) {
+        endPos = pos;
+    }
+    if (element.setSelectionRange) {
+        element.focus();
+
+        try {
+            element.setSelectionRange(pos, endPos);
+        } catch (err) {
+            const elementParent = element.parentNode;
+            const parentDisplayValue = elementParent.style.display;
+
+            elementParent.style.display = "block";
+            element.setSelectionRange(pos, endPos);
+            elementParent.style.display = parentDisplayValue;
+        }
+    }
+}

package/packages/src/utils/event-key-codes.js

@@ -0,0 +1,53 @@
+// is input key code
+export function isInputKeyCode(event) {
+    let result = false;
+
+    const { keyCode, altKey, ctrlKey, shiftKey, metaKey } = event;
+
+    // exclude keys
+    if (altKey || ctrlKey || shiftKey || metaKey) {
+        return result;
+    }
+
+    // Digit0 to Digit9
+    if ((keyCode >= 48 && keyCode <= 57) || (keyCode >= 96 && keyCode <= 105)) {
+        result = true;
+    }
+    // A to Z
+    else if (keyCode >= 65 && keyCode <= 90) {
+        result = true;
+    } else if (
+        [186, 187, 188, 189, 190, 191, 192, 219, 220, 221, 222].indexOf(
+            keyCode,
+        ) > -1
+    ) {
+        /*
+    Semicolon:186
+    Equal("="):187
+    Comma (","):188
+    Minus("-"):189
+    Period("."):190
+    Slash("/"):191
+    Backquote("`"):192
+    Open square bracket ("["):219
+    Backslash("\"):220
+    Close square bracket ("]"):221
+    Quote("'"):222
+    */
+        result = true;
+    }
+    // Support non-English languages. Chinese, Japanese, French, etc.
+    else if (keyCode == 229) {
+        result = true;
+    }
+
+    return result;
+}
+
+// is direction key code
+export function isDirectionKeyCode(keyCode) {
+    return [37, 38, 39, 40].indexOf(keyCode) > -1;
+}
+
+// is single key
+// export function isSingleKey() {}

package/packages/src/utils/hooks-manager.js

@@ -0,0 +1,76 @@
+/* 
+hook system
+
+*/
+export default class Hooks {
+    constructor() {
+        // ...
+
+        this.hooks = {
+            /* 
+            table-scroll1:[
+                function(){},
+                function(){}
+            ],
+            table-scroll2:[
+                function(){},
+                function(){}
+            ]
+            
+            */
+        };
+    }
+
+    /**
+     * Add listener to plugin hooks system.
+     *
+     * @param {string} hookName The hook name.
+     * @param {Function} callback The listener function to add.
+     */
+    addHook(hookName, callback) {
+        let hooks;
+
+        if (!this.hooks[hookName]) {
+            this.hooks[hookName] = [];
+        }
+
+        hooks = this.hooks[hookName];
+
+        // exclude repeat hook
+        let isRepeat = false;
+        for (let i = 0; i < hooks.length; i++) {
+            if (hooks[i] === callback) {
+                isRepeat = true;
+                break;
+            }
+        }
+
+        if (isRepeat) {
+            console.warn(`Repeat hook name:${hookName}`);
+        } else {
+            hooks.push(callback);
+        }
+    }
+
+    /**
+     * Trigger hook.
+     *
+     * @param {string} hookName The hook name.
+     * @param {Argument} args
+     */
+    triggerHook(hookName) {
+        const hooks = this.hooks[hookName];
+
+        if (hooks && hooks.length) {
+            const args = Array.prototype.slice.call(arguments);
+
+            hooks.forEach((hook) => {
+                // exclude hookName param
+                hook.apply(null, args.slice(1));
+            });
+        }
+        // else {
+        //     console.warn(`Can't find hook name:${hookName}`);
+        // }
+    }
+}