BI-32529 fineui树控件去掉多余的线

6 years ago · e6677f779c
12 changed files with 211 additions and 38 deletions
--- a/demo/js/widget/tree/demo.multilayer_single_level_tree.js
+++ b/demo/js/widget/tree/demo.multilayer_single_level_tree.js
@ -44,7 +44,28 @@ Demo.MultiLayerSingleLevelTree = BI.inherit(BI.Widget, {
    },

    mounted: function () {
-        this.tree.populate(BI.deepClone(Demo.CONSTANTS.TREE));
+        var tree = [
+            // {id: -2, pId: 0, value: "根目录1", text: "根目录1"},
+            {id: -1, pId: 0, value: "根目录", text: "根目录"},
+            {id: 1, pId: -1, value: "第一级目录1", text: "第一级目录1"},
+            {id: 11, pId: 1, value: "第二级文件1", text: "第二级文件1"},
+            {id: 12, pId: 1, value: "第二级目录2", text: "第二级目录2"},
+            {id: 121, pId: 12, value: "第三级目录1", text: "第三级目录1"},
+            {id: 122, pId: 12, value: "第三级文件1", text: "第三级文件1"},
+            {id: 1211, pId: 121, value: "第四级目录1", text: "第四级目录1"},
+            {id: 2, pId: -1, value: "第一级目录2", text: "第一级目录2"},
+            {id: 21, pId: 2, value: "第二级目录3", text: "第二级目录3"},
+            {id: 22, pId: 2, value: "第二级文件2", text: "第二级文件2"},
+            {id: 211, pId: 21, value: "第三级目录2", text: "第三级目录2"},
+            {id: 212, pId: 21, value: "第三级文件2", text: "第三级文件2"},
+            {id: 2111, pId: 211, value: "第四级文件1", text: "第四级文件1"},
+            {id: 3, pId: -1, value: "第一级目录3", text: "第一级目录3"},
+            {id: 31, pId: 3, value: "第二级文件2", text: "第二级文件2"},
+            {id: 33, pId: 3, value: "第二级目录3", text: "第二级目录1"},
+            {id: 32, pId: 3, value: "第二级文件3", text: "第二级文件3"},
+            {id: 331, pId: 33, value: "第三级文件1", text: "第三级文件1"}
+        ];
+        this.tree.populate(tree);
    }
 });

--- a/src/case/button/treeitem/item.first.treeleaf.js
+++ b/src/case/button/treeitem/item.first.treeleaf.js
@ -53,7 +53,7 @@ BI.FirstTreeLeafItem = BI.inherit(BI.BasicButton, {
            width: 24,
            el: {
                type: "bi.layout",
-                cls: "mid-line-conn-background",
+                cls: "first-line-conn-background",
                width: 24,
                height: o.height
            }
--- a/src/case/button/treeitem/item.last.treeleaf.js
+++ b/src/case/button/treeitem/item.last.treeleaf.js
@ -53,7 +53,7 @@ BI.LastTreeLeafItem = BI.inherit(BI.BasicButton, {
            width: 24,
            el: {
                type: "bi.layout",
-                cls: "mid-line-conn-background",
+                cls: "last-line-conn-background",
                width: 24,
                height: o.height
            }
--- a/src/case/checkbox/check.last.treenode.js
+++ b/src/case/checkbox/check.last.treenode.js
@ -5,7 +5,7 @@
 */
 BI.LastTreeNodeCheckbox = BI.inherit(BI.IconButton, {
    _defaultConfig: function () {
-        return BI.extend( BI.LastTreeNodeCheckbox.superclass._defaultConfig.apply(this, arguments), {
+        return BI.extend(BI.LastTreeNodeCheckbox.superclass._defaultConfig.apply(this, arguments), {
            extraCls: "tree-collapse-icon-type4",
            iconWidth: 24,
            iconHeight: 24
@ -17,10 +17,10 @@ BI.LastTreeNodeCheckbox = BI.inherit(BI.IconButton, {
    },
    setSelected: function (v) {
        BI.LastTreeNodeCheckbox.superclass.setSelected.apply(this, arguments);
-        if(v === true) {
-            this.element.addClass("tree-expand-icon-type3");
+        if (v === true) {
+            this.element.addClass("tree-expand-icon-type4");
        } else {
-            this.element.removeClass("tree-expand-icon-type3");
+            this.element.removeClass("tree-expand-icon-type4");
        }
    }
 });
--- a/src/widget/multilayersingletree/multilayersingletree.leveltree.js
+++ b/src/widget/multilayersingletree/multilayersingletree.leveltree.js
@ -21,7 +21,7 @@ BI.MultiLayerSingleLevelTree = BI.inherit(BI.Widget, {
        this.initTree(this.options.items);
    },

-    _formatItems: function (nodes, layer) {
+    _formatItems: function (nodes, layer, pNode) {
        var self = this;
        BI.each(nodes, function (i, node) {
            var extend = {};
@ -29,28 +29,28 @@ BI.MultiLayerSingleLevelTree = BI.inherit(BI.Widget, {
            if (!BI.isKey(node.id)) {
                node.id = BI.UUID();
            }
+            extend.pNode = pNode;
            if (node.isParent === true || BI.isNotEmptyArray(node.children)) {
-                switch (i) {
-                    case 0 :
-                        extend.type = "bi.multilayer_single_tree_first_plus_group_node";
-                        break;
-                    case nodes.length - 1 :
-                        extend.type = "bi.multilayer_single_tree_last_plus_group_node";
-                        break;
-                    default :
-                        extend.type = "bi.multilayer_single_tree_mid_plus_group_node";
-                        break;
+                extend.type = "bi.multilayer_single_tree_mid_plus_group_node";
+                if (i === 0 && !pNode) {
+                    extend.type = "bi.multilayer_single_tree_first_plus_group_node"
+                }
+                if (i === nodes.length - 1) {
+                    extend.type = "bi.multilayer_single_tree_last_plus_group_node";
+                    extend.isLastNode = true;
+                }
+                if (i === 0 && i === nodes.length - 1) {  // 根
+                    extend.type = "bi.multilayer_single_tree_plus_group_node";
                }
                BI.defaults(node, extend);
-
-                self._formatItems(node.children, layer + 1);
+                self._formatItems(node.children, layer + 1, node);
            } else {
-                switch (i) {
-                    case nodes.length - 1:
-                        extend.type = "bi.multilayer_single_tree_last_tree_leaf_item";
-                        break;
-                    default :
-                        extend.type = "bi.multilayer_single_tree_mid_tree_leaf_item";
+                extend.type = "bi.multilayer_single_tree_mid_tree_leaf_item";
+                if (i === 0 && !pNode) {
+                    extend.type = "bi.multilayer_single_tree_first_tree_leaf_item"
+                }
+                if (i === nodes.length - 1) {
+                    extend.type = "bi.multilayer_single_tree_last_tree_leaf_item";
                }
                BI.defaults(node, extend);
            }
--- a/src/widget/multilayersingletree/node/node.first.plus.js
+++ b/src/widget/multilayersingletree/node/node.first.plus.js
@ -29,6 +29,7 @@ BI.MultiLayerSingleTreeFirstPlusGroupNode = BI.inherit(BI.NodeButton, {
            id: o.id,
            pId: o.pId,
            open: o.open,
+            isLastNode: o.isLastNode,
            height: o.height,
            hgap: o.hgap,
            text: o.text,
@ -43,11 +44,20 @@ BI.MultiLayerSingleTreeFirstPlusGroupNode = BI.inherit(BI.NodeButton, {
            self.fireEvent(BI.Controller.EVENT_CHANGE, arguments);
        });

+        var needBlankLayers = [];
+        var pNode = o.pNode;
+        while (pNode) {
+            if (pNode.isLastNode) {
+                needBlankLayers.push(pNode.layer)
+            }
+            pNode = pNode.pNode;
+        }
+
        var items = [];
-        BI.count(0, o.layer, function () {
+        BI.count(0, o.layer, function (index) {
            items.push({
                type: "bi.layout",
-                cls: "base-line-conn-background",
+                cls: BI.contains(needBlankLayers, index) ? "" : "base-line-conn-background",
                width: 12,
                height: o.height
            });
--- a/src/widget/multilayersingletree/node/node.last.plus.js
+++ b/src/widget/multilayersingletree/node/node.last.plus.js
@ -43,11 +43,20 @@ BI.MultiLayerSingleTreeLastPlusGroupNode = BI.inherit(BI.NodeButton, {
            self.fireEvent(BI.Controller.EVENT_CHANGE, arguments);
        });

+        var needBlankLayers = [];
+        var pNode = o.pNode;
+        while (pNode) {
+            if (pNode.isLastNode) {
+                needBlankLayers.push(pNode.layer)
+            }
+            pNode = pNode.pNode;
+        }
+
        var items = [];
-        BI.count(0, o.layer, function () {
+        BI.count(0, o.layer, function (index) {
            items.push({
                type: "bi.layout",
-                cls: "base-line-conn-background",
+                cls: BI.contains(needBlankLayers, index) ? "" : "base-line-conn-background",
                width: 12,
                height: o.height
            });
--- a/src/widget/multilayersingletree/node/node.mid.plus.js
+++ b/src/widget/multilayersingletree/node/node.mid.plus.js
@ -43,11 +43,20 @@ BI.MultiLayerSingleTreeMidPlusGroupNode = BI.inherit(BI.NodeButton, {
            self.fireEvent(BI.Controller.EVENT_CHANGE, arguments);
        });

+        var needBlankLayers = [];
+        var pNode = o.pNode;
+        while (pNode) {
+            if (pNode.isLastNode) {
+                needBlankLayers.push(pNode.layer)
+            }
+            pNode = pNode.pNode;
+        }
+
        var items = [];
-        BI.count(0, o.layer, function () {
+        BI.count(0, o.layer, function (index) {
            items.push({
                type: "bi.layout",
-                cls: "base-line-conn-background",
+                cls: BI.contains(needBlankLayers, index) ? "" : "base-line-conn-background",
                width: 12,
                height: o.height
            });
--- a/src/widget/multilayersingletree/node/node.plus.js
+++ b/src/widget/multilayersingletree/node/node.plus.js
@ -0,0 +1,96 @@
+/**
+ *@desc 根节点,既是第一个又是最后一个
+ *@author dailer
+ *@date 2018/09/16
+ */
+BI.MultiLayerSingleTreePlusGroupNode = BI.inherit(BI.NodeButton, {
+    _defaultConfig: function () {
+        var conf = BI.MultiLayerSingleTreePlusGroupNode.superclass._defaultConfig.apply(this, arguments);
+        return BI.extend(conf, {
+            extraCls: "bi-multilayer-single-tree-plus-group-node bi-list-item",
+            layer: 0, // 第几层级
+            id: "",
+            pId: "",
+            open: false,
+            height: 24
+        });
+    },
+    _init: function () {
+        BI.MultiLayerSingleTreePlusGroupNode.superclass._init.apply(this, arguments);
+        var self = this, o = this.options;
+        if (o.isLastNode && !o.pNode) {
+
+        }
+        this.node = BI.createWidget({
+            type: "bi.plus_group_node",
+            cls: "bi-list-item-none",
+            logic: {
+                dynamic: true
+            },
+            id: o.id,
+            pId: o.pId,
+            open: o.open,
+            isLastNode: o.isLastNode,
+            height: o.height,
+            hgap: o.hgap,
+            text: o.text,
+            value: o.value,
+            py: o.py,
+            keyword: o.keyword
+        });
+        this.node.on(BI.Controller.EVENT_CHANGE, function (type) {
+            if (type === BI.Events.CLICK) {// 本身实现click功能
+                return;
+            }
+            self.fireEvent(BI.Controller.EVENT_CHANGE, arguments);
+        });
+
+        var needBlankLayers = [];
+        var pNode = o.pNode;
+        while (pNode) {
+            if (pNode.isLastNode) {
+                needBlankLayers.push(pNode.layer)
+            }
+            pNode = pNode.pNode;
+        }
+
+        var items = [];
+        BI.count(0, o.layer, function (index) {
+            items.push({
+                type: "bi.layout",
+                cls: BI.contains(needBlankLayers, index) ? "" : "base-line-conn-background",
+                width: 12,
+                height: o.height
+            });
+        });
+        items.push(this.node);
+        BI.createWidget({
+            type: "bi.td",
+            element: this,
+            columnSize: BI.makeArray(o.layer, 12),
+            items: [items]
+        });
+    },
+
+    doRedMark: function () {
+        this.node.doRedMark.apply(this.node, arguments);
+    },
+
+    unRedMark: function () {
+        this.node.unRedMark.apply(this.node, arguments);
+    },
+
+    doClick: function () {
+        BI.MultiLayerSingleTreePlusGroupNode.superclass.doClick.apply(this, arguments);
+        this.node.setSelected(this.isSelected());
+    },
+
+    setOpened: function (v) {
+        BI.MultiLayerSingleTreePlusGroupNode.superclass.setOpened.apply(this, arguments);
+        if (BI.isNotNull(this.node)) {
+            this.node.setOpened(v);
+        }
+    }
+});
+
+BI.shortcut("bi.multilayer_single_tree_plus_group_node", BI.MultiLayerSingleTreePlusGroupNode);
--- a/src/widget/multilayersingletree/treeitem/item.first.treeleaf.js
+++ b/src/widget/multilayersingletree/treeitem/item.first.treeleaf.js
@ -42,11 +42,21 @@ BI.MultiLayerSingleTreeFirstTreeLeafItem = BI.inherit(BI.BasicButton, {
            self.fireEvent(BI.Controller.EVENT_CHANGE, arguments);
        });

+
+        var needBlankLayers = [];
+        var pNode = o.pNode;
+        while (pNode) {
+            if (pNode.isLastNode) {
+                needBlankLayers.push(pNode.layer)
+            }
+            pNode = pNode.pNode;
+        }
+
        var items = [];
-        BI.count(0, o.layer, function () {
+        BI.count(0, o.layer, function (index) {
            items.push({
                type: "bi.layout",
-                cls: "base-line-conn-background",
+                cls: BI.contains(needBlankLayers, index) ? "" : "base-line-conn-background",
                width: 12,
                height: o.height
            });
--- a/src/widget/multilayersingletree/treeitem/item.last.treeleaf.js
+++ b/src/widget/multilayersingletree/treeitem/item.last.treeleaf.js
@ -42,11 +42,20 @@ BI.MultiLayerSingleTreeLastTreeLeafItem = BI.inherit(BI.BasicButton, {
            self.fireEvent(BI.Controller.EVENT_CHANGE, arguments);
        });

+        var needBlankLayers = [];
+        var pNode = o.pNode;
+        while (pNode) {
+            if (pNode.isLastNode) {
+                needBlankLayers.push(pNode.layer)
+            }
+            pNode = pNode.pNode;
+        }
+
        var items = [];
-        BI.count(0, o.layer, function () {
+        BI.count(0, o.layer, function (index) {
            items.push({
                type: "bi.layout",
-                cls: "base-line-conn-background",
+                cls: BI.contains(needBlankLayers, index) ? "" : "base-line-conn-background",
                width: 12,
                height: o.height
            });
--- a/src/widget/multilayersingletree/treeitem/item.mid.treeleaf.js
+++ b/src/widget/multilayersingletree/treeitem/item.mid.treeleaf.js
@ -42,11 +42,20 @@ BI.MultiLayerSingleTreeMidTreeLeafItem = BI.inherit(BI.BasicButton, {
            self.fireEvent(BI.Controller.EVENT_CHANGE, arguments);
        });

+        var needBlankLayers = [];
+        var pNode = o.pNode;
+        while (pNode) {
+            if (pNode.isLastNode) {
+                needBlankLayers.push(pNode.layer)
+            }
+            pNode = pNode.pNode;
+        }
+
        var items = [];
-        BI.count(0, o.layer, function () {
+        BI.count(0, o.layer, function (index) {
            items.push({
                type: "bi.layout",
-                cls: "base-line-conn-background",
+                cls: BI.contains(needBlankLayers, index) ? "" : "base-line-conn-background",
                width: 12,
                height: o.height
            });