bri-components 1.0.0

package/src/components/list/easyTable/src/utils/deepClone.js

@@ -0,0 +1,256 @@
+/*
+*
+* source:https://github.com/pvorb/clone/blob/master/clone.js
+*
+*
+* */
+
+let clone = (function () {
+    "use strict";
+
+    function _instanceof (obj, type) {
+        return type != null && obj instanceof type;
+    }
+
+    let NativeMap;
+    try {
+        NativeMap = Map;
+    } catch (_) {
+        // maybe a reference error because no `Map`. Give it a dummy value that no
+        // value will ever be an instanceof.
+        NativeMap = function () {};
+    }
+
+    let NativeSet;
+    try {
+        NativeSet = Set;
+    } catch (_) {
+        NativeSet = function () {};
+    }
+
+    let NativePromise;
+    try {
+        NativePromise = Promise;
+    } catch (_) {
+        NativePromise = function () {};
+    }
+
+    /**
+     * Clones (copies) an Object using deep copying.
+     *
+     * This function supports circular references by default, but if you are certain
+     * there are no circular references in your object, you can save some CPU time
+     * by calling clone(obj, false).
+     *
+     * Caution: if `circular` is false and `parent` contains circular references,
+     * your program may enter an infinite loop and crash.
+     *
+     * @param `parent` - the object to be cloned
+     * @param `circular` - set to true if the object to be cloned may contain
+     *    circular references. (optional - true by default)
+     * @param `depth` - set to a number if the object is only to be cloned to
+     *    a particular depth. (optional - defaults to Infinity)
+     * @param `prototype` - sets the prototype to be used when cloning an object.
+     *    (optional - defaults to parent prototype).
+     * @param `includeNonEnumerable` - set to true if the non-enumerable properties
+     *    should be cloned as well. Non-enumerable properties on the prototype
+     *    chain will be ignored. (optional - false by default)
+     */
+    function clone (parent, circular, depth, prototype, includeNonEnumerable) {
+        if (typeof circular === "object") {
+            depth = circular.depth;
+            prototype = circular.prototype;
+            includeNonEnumerable = circular.includeNonEnumerable;
+            circular = circular.circular;
+        }
+        // maintain two arrays for circular references, where corresponding parents
+        // and children have the same index
+        let allParents = [];
+        let allChildren = [];
+
+        let useBuffer = typeof Buffer != "undefined";
+
+        if (typeof circular == "undefined")
+        { circular = true; }
+
+        if (typeof depth == "undefined")
+        { depth = Infinity; }
+
+        // recurse this function so we don't reset allParents and allChildren
+        function _clone (parent, depth) {
+            // cloning null always returns null
+            if (parent === null)
+            { return null; }
+
+            if (depth === 0)
+            { return parent; }
+
+            let child;
+            let proto;
+            if (typeof parent != "object") {
+                return parent;
+            }
+
+            if (_instanceof(parent, NativeMap)) {
+                child = new NativeMap();
+            } else if (_instanceof(parent, NativeSet)) {
+                child = new NativeSet();
+            } else if (_instanceof(parent, NativePromise)) {
+                child = new NativePromise(function (resolve, reject) {
+                    parent.then(function (value) {
+                        resolve(_clone(value, depth - 1));
+                    }, function (err) {
+                        reject(_clone(err, depth - 1));
+                    });
+                });
+            } else if (clone.__isArray(parent)) {
+                child = [];
+            } else if (clone.__isRegExp(parent)) {
+                child = new RegExp(parent.source, __getRegExpFlags(parent));
+                if (parent.lastIndex) child.lastIndex = parent.lastIndex;
+            } else if (clone.__isDate(parent)) {
+                child = new Date(parent.getTime());
+            } else if (useBuffer && Buffer.isBuffer(parent)) {
+                child = Buffer.alloc(parent.length);
+                parent.copy(child);
+                return child;
+            } else if (_instanceof(parent, Error)) {
+                child = Object.create(parent);
+            } else {
+                if (typeof prototype == "undefined") {
+                    proto = Object.getPrototypeOf(parent);
+                    child = Object.create(proto);
+                }
+                else {
+                    child = Object.create(prototype);
+                    proto = prototype;
+                }
+            }
+
+            if (circular) {
+                let index = allParents.indexOf(parent);
+
+                if (index != -1) {
+                    return allChildren[index];
+                }
+                allParents.push(parent);
+                allChildren.push(child);
+            }
+
+            if (_instanceof(parent, NativeMap)) {
+                parent.forEach(function (value, key) {
+                    let keyChild = _clone(key, depth - 1);
+                    let valueChild = _clone(value, depth - 1);
+                    child.set(keyChild, valueChild);
+                });
+            }
+            if (_instanceof(parent, NativeSet)) {
+                parent.forEach(function (value) {
+                    let entryChild = _clone(value, depth - 1);
+                    child.add(entryChild);
+                });
+            }
+
+            for (let i in parent) {
+                let attrs;
+                if (proto) {
+                    attrs = Object.getOwnPropertyDescriptor(proto, i);
+                }
+
+                if (attrs && attrs.set == null) {
+                    continue;
+                }
+                child[i] = _clone(parent[i], depth - 1);
+            }
+
+            if (Object.getOwnPropertySymbols) {
+                let symbols = Object.getOwnPropertySymbols(parent);
+                for (let i = 0; i < symbols.length; i++) {
+                    // Don't need to worry about cloning a symbol because it is a primitive,
+                    // like a number or string.
+                    let symbol = symbols[i];
+                    let descriptor = Object.getOwnPropertyDescriptor(parent, symbol);
+                    if (descriptor && !descriptor.enumerable && !includeNonEnumerable) {
+                        continue;
+                    }
+                    child[symbol] = _clone(parent[symbol], depth - 1);
+                    if (!descriptor.enumerable) {
+                        Object.defineProperty(child, symbol, {
+                            enumerable: false
+                        });
+                    }
+                }
+            }
+
+            if (includeNonEnumerable) {
+                let allPropertyNames = Object.getOwnPropertyNames(parent);
+                for (let i = 0; i < allPropertyNames.length; i++) {
+                    let propertyName = allPropertyNames[i];
+                    let descriptor = Object.getOwnPropertyDescriptor(parent, propertyName);
+                    if (descriptor && descriptor.enumerable) {
+                        continue;
+                    }
+                    child[propertyName] = _clone(parent[propertyName], depth - 1);
+                    Object.defineProperty(child, propertyName, {
+                        enumerable: false
+                    });
+                }
+            }
+
+            return child;
+        }
+
+        return _clone(parent, depth);
+    }
+
+    /**
+     * Simple flat clone using prototype, accepts only objects, usefull for property
+     * override on FLAT configuration object (no nested props).
+     *
+     * USE WITH CAUTION! This may not behave as you wish if you do not know how this
+     * works.
+     */
+    clone.clonePrototype = function clonePrototype (parent) {
+        if (parent === null)
+        { return null; }
+
+        let C = function () {};
+        C.prototype = parent;
+        return new C();
+    };
+
+    // private utility functions
+
+    function __objToStr (o) {
+        return Object.prototype.toString.call(o);
+    }
+    clone.__objToStr = __objToStr;
+
+    function __isDate (o) {
+        return typeof o === "object" && __objToStr(o) === "[object Date]";
+    }
+    clone.__isDate = __isDate;
+
+    function __isArray (o) {
+        return typeof o === "object" && __objToStr(o) === "[object Array]";
+    }
+    clone.__isArray = __isArray;
+
+    function __isRegExp (o) {
+        return typeof o === "object" && __objToStr(o) === "[object RegExp]";
+    }
+    clone.__isRegExp = __isRegExp;
+
+    function __getRegExpFlags (re) {
+        let flags = "";
+        if (re.global) flags += "g";
+        if (re.ignoreCase) flags += "i";
+        if (re.multiline) flags += "m";
+        return flags;
+    }
+    clone.__getRegExpFlags = __getRegExpFlags;
+
+    return clone;
+})();
+
+export default clone;

package/src/components/list/easyTable/src/utils/dom.js

@@ -0,0 +1,41 @@
+
+// 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;
+    }
+};
+
+// add class
+export function addClass (el, cls) {
+    if (!el || !cls) return;
+
+    if (el.classList) {
+        el.classList.add(cls);
+
+    } else {
+
+        let clsArr = el.className.split(" ");
+
+        if (clsArr.indexOf(cls) === -1) {
+            el.className += " " + cls;
+        }
+    }
+};
+
+// remove class
+export function removeClass (el, cls) {
+    if (!el || !cls) return;
+
+    if (el.classList) {
+        el.classList.remove(cls);
+    } else {
+
+        let reg = new RegExp("(\\s|^)" + cls + "(\\s|$)");
+        el.className = el.className.replace(reg, " "); // For IE9 and earlier
+    }
+};

package/src/components/list/easyTable/src/utils/utils.js

@@ -0,0 +1,190 @@
+import settings from "../settings/settings";
+
+export default {
+    /* 获取当前元素的left、top偏移
+    *   left：元素最左侧距离文档左侧的距离
+    *   top:元素最顶端距离文档顶端的距离
+    *   right:元素最右侧距离文档右侧的距离
+    *   bottom：元素最底端距离文档底端的距离
+    *   right2：元素最左侧距离文档右侧的距离
+    *   bottom2：元素最底端距离文档最底部的距离
+    * */
+    getViewportOffset (element) {
+
+        let doc = document.documentElement;
+        let box = typeof element.getBoundingClientRect !== "undefined" ? element.getBoundingClientRect() : 0;
+        let scrollLeft = (window.pageXOffset || doc.scrollLeft) - (doc.clientLeft || 0);
+        let scrollTop = (window.pageYOffset || doc.scrollTop) - (doc.clientTop || 0);
+        let offsetLeft = box.left + window.pageXOffset;
+        let offsetTop = box.top + window.pageYOffset;
+
+        let left = offsetLeft - scrollLeft;
+        let top = offsetTop - scrollTop;
+
+        return {
+            left: left,
+            top: 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
+        };
+    },
+
+    /*
+     * 事件绑定
+     *
+     * @method bind
+     * @param  {dom||window}   elem        需要绑定的dom节点或window对象
+     * @param  {String}        event       绑定的事件名称
+     * @param  {Function}      handler     事件处理方法
+     */
+    bind (elem, event, handler) {
+        if (elem && elem !== "undefined" && event && handler) {
+
+            event = event === "mousewheel" ? (document.onmousewheel !== undefined ? "mousewheel" : "DOMMouseScroll") : event;
+
+            if (document.attachEvent) { // if IE (and Opera depending on user setting)
+
+                elem.attachEvent("on" + event, handler);
+            }
+            else { // WC3 browsers
+
+                elem.addEventListener(event, handler, false);
+            }
+        }
+    },
+
+    /*
+     * 移除事件绑定
+     *
+     * @method unbind
+     * @param  {dom||window}   elem         需要移除绑定的dom节点或window对象
+     * @param  {String}        event        绑定的事件名称
+     * @param  {Function||Array<Function>}  handler    事件处理方法，可以为数组
+     */
+    unbind (elem, event, handler) {
+        if (elem && elem !== "undefined" && event && handler) {
+
+            event = event === "mousewheel" ? (document.onmousewheel !== undefined ? "mousewheel" : "DOMMouseScroll") : event;
+
+            let handlers = [];
+            if (Array.isArray(handler) && handler.length > 0) {
+                handlers = handler;
+            } else {
+                handlers.push(handler);
+            }
+
+            if (document.removeEventListener) {
+
+                handlers.forEach(e => {
+                    elem.removeEventListener(event, e, false);
+                });
+            }
+            else {
+
+                handlers.forEach(e => {
+                    elem.removeEventListener("on" + event, e);
+                });
+            }
+        }
+    },
+
+    // 判断当前是否包含html元素
+    isHtml (val) {
+        return /<[a-z][\s\S]*>/i.test(val);
+    },
+
+    // 获取当前dislpay值
+    getDisplayValue (ele) {
+
+        if (ele) {
+            return ele.currentStyle ? ele.currentStyle.display : getComputedStyle(ele, null).display;
+        }
+
+    },
+
+    // 是否包含横向滚动条
+    hasHorizontalScrollBar (ele) {
+
+        if (ele) {
+
+            return ele.scrollWidth > ele.clientWidth;
+        }
+    },
+
+    // 是否包含纵向滚动条
+    hasVerticalScrollBar (ele) {
+
+        if (ele) {
+
+            return ele.scrollHeight > ele.clientHeight;
+        }
+    },
+
+    // 获取滚动条的宽度
+    getScrollbarWidth () {
+
+        const outer = document.createElement("div");
+        outer.className = settings.scrollbarClass;
+        outer.style.visibility = "hidden";
+        outer.style.width = "100px";
+        outer.style.position = "absolute";
+        outer.style.top = "-9999px";
+        document.body.appendChild(outer);
+
+        const widthNoScroll = outer.offsetWidth;
+        outer.style.overflow = "scroll";
+
+        const inner = document.createElement("div");
+        inner.style.width = "100%";
+        outer.appendChild(inner);
+
+        const widthWithScroll = inner.offsetWidth;
+        outer.parentNode.removeChild(outer);
+
+        return widthNoScroll - widthWithScroll;
+
+    },
+
+    // 获取父组件信息
+    getParentCompByName (context, name) {
+
+        let parent = context.$parent;
+
+        while (parent) {
+            if (parent.$options.name !== name) {
+                parent = parent.$parent;
+            } else {
+                return parent;
+            }
+        }
+
+        return null;
+    },
+
+    // 获取多个符合条件的子组件信息
+    getChildCompsByName (context, name) {
+
+        let result = [];
+
+        let childrens = context.$children;
+
+        while (childrens && childrens.length > 0) {
+
+            childrens.forEach(child => {
+
+                childrens = child.$children ? child.$children : null;
+
+                if (child.$options.name === name) {
+
+                    result.push(child);
+                }
+
+            });
+        }
+
+        return result;
+    }
+
+};

package/src/components/list/easyTable/v-checkbox/index.js

@@ -0,0 +1,7 @@
+import VCheckbox from "./src/checkbox.vue";
+
+VCheckbox.install = function (Vue) {
+    Vue.component(VCheckbox.name, VCheckbox);
+};
+
+export default VCheckbox;

package/src/components/list/easyTable/v-checkbox/src/checkbox.vue

@@ -0,0 +1,127 @@
+<template>
+    <label class="v-checkbox-wrapper" :style="{'display':displayType}">
+        <span :class="checkboxClasses">
+            <input
+                class="v-checkbox-input"
+                type="checkbox"
+                :value="label"
+                v-model="model"
+                @change="change"
+            />
+
+            <span class="v-checkbox-inner"></span>
+        </span>
+        <span><slot v-if="showSlot">{{ label }}</slot></span>
+    </label>
+</template>
+
+<script>
+    import utils from "../../src/utils/utils.js";
+
+    export default{
+        name: "v-checkbox",
+        props: {
+            value: {
+                type: [String, Number, Boolean]
+            },
+            // use in checkbox-group
+            label: {
+                type: [String, Number],
+                require: true
+            },
+            disabled: Boolean,
+            // partial selection effect
+            indeterminate: Boolean,
+            showSlot: {
+                type: Boolean,
+                default: true
+            }
+
+        },
+        data () {
+            return {
+                model: this.value,
+                checkboxGroup2: {}
+            };
+        },
+
+        computed: {
+            checkboxClasses () {
+                return [
+                    "v-checkbox",
+                    {
+                        "v-checkbox-checked": this.model,
+                        "v-checkbox-disabled": this.disabled,
+                        "v-checkbox-indeterminate": this.indeterminate
+                    }
+                ];
+            },
+            // 是否横向显示还是纵向显示
+            displayType () {
+                let style = "inline-block";
+                if (this.checkboxGroup2) {
+                    style = this.checkboxGroup2.isVerticalShow ? "block" : "inline-block";
+                }
+                return style;
+            }
+        },
+        methods: {
+            isCheckBoxGroup () {
+                this.checkboxGroup2 = utils.getParentCompByName(this, "v-checkbox-group");
+                return !!this.checkboxGroup2;
+            },
+            change (event) {
+                if (this.disabled) {
+                    this.model = !this.model;
+                    return false;
+                }
+                const checked = event.target.checked;
+                this.$emit("input", checked);
+                this.$emit("change");
+                this.isCheckBoxGroup();
+                if (this.checkboxGroup2) {
+                    this.checkboxGroup2.updateModel(this.label, checked);
+                }
+            },
+            initModel () {
+                this.isCheckBoxGroup();
+                if (this.checkboxGroup2) {
+                    let checkboxGroup = this.checkboxGroup2;
+                    if (Array.isArray(checkboxGroup.value) && checkboxGroup.value.length > 0) {
+                        if (checkboxGroup.value.indexOf(this.label) > -1) {
+                            this.model = true;
+                        }
+                    }
+                } else {
+                    this.model = this.value;
+                }
+            },
+            // 通过单选更新 model
+            updateModelBySingle () {
+                if (!this.disabled) {
+                    this.model = this.value;
+                }
+            },
+            // 父组件调用更新 model
+            updateModelByGroup (checkBoxGroup) {
+                if (checkBoxGroup.indexOf(this.label) > -1) {
+                    if (!this.disabled) {
+                        this.model = true;
+                    }
+                } else {
+                    if (!this.disabled) {
+                        this.model = false;
+                    }
+                }
+            }
+        },
+        created () {
+            this.initModel();
+        },
+        watch: {
+            "value" (val) {
+                this.updateModelBySingle();
+            }
+        }
+    };
+</script>

package/src/components/list/easyTable/v-checkbox-group/index.js

@@ -0,0 +1,7 @@
+import VCheckboxGroup from "./src/checkbox-group.vue";
+
+VCheckboxGroup.install = function (Vue) {
+    Vue.component(VCheckboxGroup.name, VCheckboxGroup);
+};
+
+export default VCheckboxGroup;

package/src/components/list/easyTable/v-checkbox-group/src/checkbox-group.vue

@@ -0,0 +1,68 @@
+<template>
+    <div class="v-checkbox-group">
+        <slot></slot>
+    </div>
+</template>
+
+<script>
+    import utils from "../../src/utils/utils.js";
+
+    export default{
+        name: "v-checkbox-group",
+
+        props: {
+            value: {
+                type: Array,
+                default () {
+                    return [];
+                }
+            },
+            // 是否垂直排列显示（当时checkbox组时生效）
+            isVerticalShow: {
+                type: Boolean,
+                default: false
+            }
+        },
+
+        methods: {
+
+            updateModel (label, checkedVal) {
+
+                let index = this.value.indexOf(label);
+                if (index > -1) {
+
+                    if (!checkedVal) {
+
+                        this.value.splice(index, 1);
+                    }
+                } else {
+
+                    if (checkedVal) {
+
+                        this.value.push(label);
+                    }
+                }
+
+                this.$emit("input", this.value);
+                this.$emit("change");
+            }
+        },
+
+        watch: {
+            // 更新子组件选中状态
+            "value" (newVal) {
+
+                let children = utils.getChildCompsByName(this, "v-checkbox");
+
+                if (children.length > 0) {
+
+                    children.forEach(child => {
+
+                        child.updateModelByGroup(newVal);
+                    });
+                }
+
+            }
+        }
+    };
+</script>