text/web/lay/modules/tree.js

/** layui-v2.5.6 MIT License By https://www.layui.com */
layui.define("form", function(e) {
    "use strict";
    var i = layui.$, // 获取layui的$对象
        a = layui.form, // 获取layui的form模块
        n = layui.layer, // 获取layui的layer模块
        t = "tree", // 树形结构的模块名称
        r = {
            config: {},
            index: layui[t] ? layui[t].index + 1e4 : 0, // 设置唯一的树形组件索引
            set: function(e) {
                var a = this;
                return a.config = i.extend({}, a.config, e), a; // 合并配置项
            },
            on: function(e, i) {
                return layui.onevent.call(this, t, e, i); // 绑定事件
            }
        },
        l = function() {
            var e = this, i = e.config, a = i.id || e.index;
            return l.that[a] = e, l.config[a] = i, {
                config: i,
                reload: function(i) {
                    e.reload.call(e, i);
                },
                getChecked: function() {
                    return e.getChecked.call(e);
                },
                setChecked: function(i) {
                    return e.setChecked.call(e, i);
                }
            };
        },
        c = "layui-hide", // 隐藏样式
        d = "layui-disabled", // 禁用样式
        s = "layui-tree-set", // 树节点容器
        o = "layui-tree-iconClick", // 树节点点击图标
        h = "layui-icon-addition", // 加号图标
        u = "layui-icon-subtraction", // 减号图标
        p = "layui-tree-entry", // 树节点条目
        f = "layui-tree-main", // 树节点主容器
        y = "layui-tree-txt", // 树节点文本
        v = "layui-tree-pack", // 树节点包裹容器
        C = "layui-tree-spread", // 树节点展开样式
        k = "layui-tree-setLineShort", // 树节点短线样式
        m = "layui-tree-showLine", // 显示树节点连接线
        x = "layui-tree-lineExtend", // 树节点连接线延伸样式

        // 构造函数
        b = function(e) {
            var a = this;
            a.index = ++r.index;
            a.config = i.extend({}, a.config, r.config, e);
            a.render(); // 渲染树形组件
        };

    b.prototype.config = {
        data: [], // 树节点数据
        showCheckbox: !1, // 是否显示复选框
        showLine: !0, // 是否显示连线
        accordion: !1, // 是否开启手风琴模式
        onlyIconControl: !1, // 是否仅通过点击图标控制展开收缩
        isJump: !1, // 是否跳转链接
        edit: !1, // 是否允许编辑操作
        text: {
            defaultNodeName: "未命名", // 默认节点名称
            none: "无数据" // 无数据时显示的文本
        }
    };

    // 重新加载树形组件
    b.prototype.reload = function(e) {
        var a = this;
        layui.each(e, function(e, i) {
            i.constructor === Array && delete a.config[e]; // 清除旧的配置项
        });
        a.config = i.extend(!0, {}, a.config, e); // 更新配置项
        a.render(); // 重新渲染
    };

    // 渲染树形组件
    b.prototype.render = function() {
        var e = this, a = e.config;
        e.checkids = [];
        var n = i('<div class="layui-tree' + (a.showCheckbox ? " layui-form" : "") + (a.showLine ? " layui-tree-line" : "") + '" lay-filter="LAY-tree-' + e.index + '"></div>');
        e.tree(n); // 构建树形结构
        var t = a.elem = i(a.elem);
        if (t[0]) {
            if (e.key = a.id || e.index, e.elem = n, e.elemNone = i('<div class="layui-tree-emptyText">' + a.text.none + "</div>"), t.html(e.elem), 0 == e.elem.find(".layui-tree-set").length) {
                return e.elem.append(e.elemNone); // 如果没有节点数据，显示空文本
            }
            a.showCheckbox && e.renderForm("checkbox"); // 渲染复选框
            e.elem.find(".layui-tree-set").each(function() {
                var e = i(this);
                e.parent(".layui-tree-pack")[0] || e.addClass("layui-tree-setHide"); // 隐藏无子节点的树节点
                !e.next()[0] && e.parents(".layui-tree-pack").eq(1).hasClass("layui-tree-lineExtend") && e.addClass(k); // 为无下一个兄弟节点的节点添加短线样式
                e.next()[0] || e.parents(".layui-tree-set").eq(0).next()[0] || e.addClass(k); // 为没有下一级子节点的父节点添加短线样式
            });
            e.events(); // 绑定事件
        }
    };

    // 渲染复选框
    b.prototype.renderForm = function(e) {
        a.render(e, "LAY-tree-" + this.index);
    };

    // 构建树形结构
    b.prototype.tree = function(e, a) {
        var n = this, t = n.config, r = a || t.data;
        layui.each(r, function(a, r) {
            var l = r.children && r.children.length > 0, // 判断是否有子节点
                o = i('<div class="layui-tree-pack" ' + (r.spread ? 'style="display: block;"' : "") + "></div>"),
                h = i([
                    '<div data-id="' + r.id + '" class="layui-tree-set' + (r.spread ? " layui-tree-spread" : "") + (r.checked ? " layui-tree-checkedFirst" : "") + '">',
                    '<div class="layui-tree-entry">',
                    '<div class="layui-tree-main">',
                    function() {
                        return t.showLine ? l ? '<span class="layui-tree-iconClick layui-tree-icon"><i class="layui-icon ' + (r.spread ? "layui-icon-subtraction" : "layui-icon-addition") + '"></i></span>' : '<span class="layui-tree-iconClick"><i class="layui-icon layui-icon-file"></i></span>' : '<span class="layui-tree-iconClick"><i class="layui-tree-iconArrow ' + (l ? "" : c) + '"></i></span>';
                    }(),
                    function() {
                        return t.showCheckbox ? '<input type="checkbox" name="' + (r.field || "layuiTreeCheck_" + r.id) + '" same="layuiTreeCheck" lay-skin="primary" ' + (r.disabled ? "disabled" : "") + ' value="' + r.id + '">' : "";
                    }(),
                    function() {
                        return t.isJump && r.href ? '<a href="' + r.href + '" target="_blank" class="' + y + '">' + (r.title || r.label || t.text.defaultNodeName) + "</a>" : '<span class="' + y + (r.disabled ? " " + d : "") + '">' + (r.title || r.label || t.text.defaultNodeName) + "</span>";
                    }(),
                    "</div>",
                    function() {
                        if (!t.edit) return "";
                        var e = { add: '<i class="layui-icon layui-icon-add-1"  data-type="add"></i>', update: '<i class="layui-icon layui-icon-edit" data-type="update"></i>', del: '<i class="layui-icon layui-icon-delete" data-type="del"></i>' },
                            i = ['<div class="layui-btn-group layui-tree-btnGroup">'];
                        return t.edit === !0 && (t.edit = ["update", "del"]), "object" == typeof t.edit ? (layui.each(t.edit, function(a, n) { i.push(e[n] || "") }), i.join("") + "</div>") : void 0;
                    }(),
                    "</div></div>"
                ].join(""));
            l && (h.append(o), n.tree(o, r.children)); // 如果有子节点，递归调用
            e.append(h);
            h.prev("." + s)[0] && h.prev().children(".layui-tree-pack").addClass("layui-tree-showLine");
            l || h.parent(".layui-tree-pack").addClass("layui-tree-lineExtend");
            n.spread(h, r);
            t.showCheckbox && (r.checked && n.checkids.push(r.id), n.checkClick(h, r));
            t.edit && n.operate(h, r);
        });
    };

    // 展开和收缩节点
    b.prototype.spread = function(e, a) {
        var n = this, t = n.config, r = e.children("." + p), l = r.children("." + f), c = r.find("." +