树型(Tree)

1.1 三层 Grid


    <div id="weightTree"></div> <!--定义容器-->


    new Tree({
        tree: $('#weightTree'),     // 容器id
        data: startData.theme3,     // 切换 startData.theme1, startData.theme2 试试
        main: tree.main,        //  需要缩进的列
        width: tree.width,      //  列宽度
        alias: tree.alias,      //  列类名
        header: tree.header,        //  头部
        headersub: tree.headersub,      //  副头部
        collapse: tree.collapse,        //  列表树
        callback: function(self) {      // 渲染后回调
            toggleLevel(self);
            changePrecent(self);
            changeWeight(self);
        }
    });

    // 语法与 jquery-ui的 tree-grid 有点类似,但是功能没那么强大
    // 列内容格式说明
    // title 匹配 json 字段的 key 名
    // formatter 可带 html 格式内容

    {
        title: 'value',
        formatter: function(val) {
            return ' ';
        }
    }

    
    // Data 格式

        var startData = {
            zid: '0001',
            value: '都城的饭好难吃',
            themeStyle: 2,
            theme1: [{
                zid: '00031',
                value: '一级指标1111111111',
                defined: 1,
                grade1: 1,
                grade2: 1,
                grade3: 1,
                children: []
            }],
            theme2: [{
                zid: '00031',
                value: '一级指标99999999',
                defined: 1,
                grade1: 1,
                grade2: 1,
                grade3: 1,
                children: [{
                    zid: '00031',
                    value: '二级指标222222222',
                    defined: 1,
                    grade1: 1,
                    grade2: 1,
                    grade3: 1,
                    children: []
                }]
            }],
            theme3: [{
                zid: '00031',
                value: '一级指标1',
                defined: 1,
                grade1: 1,
                grade2: 1,
                grade3: 1,
                children: [{
                    zid: '000211',
                    value: '二级指标',
                    defined: 1,
                    grade1: 1,
                    grade2: 1,
                    grade3: 1,
                    children: [{
                        zid: '000211',
                        value: '三级指标',
                        defined: 1,
                        grade1: 999,
                        grade2: 999,
                        grade3: 999,
                        children: []
                    }]
                }, {
                    zid: '000211',
                    value: '二级指标',
                    defined: 1,
                    grade1: 1,
                    grade2: 1,
                    grade3: 1,
                    children: [{
                        zid: '000211',
                        value: '三级指标',
                        defined: 1,
                        grade1: 1,
                        grade2: 1,
                        grade3: 1,
                        children: []
                    }, {
                        zid: '000211',
                        value: '三级指标',
                        defined: 1,
                        grade1: 1,
                        grade2: 1,
                        grade3: 1,
                        children: []
                    }, {
                        zid: '000211',
                        value: '三级指标',
                        defined: 1,
                        grade1: 1,
                        grade2: 1,
                        grade3: 1,
                        children: []
                    }]
                }]
            }, {
                zid: '00031',
                value: '一级指标2',
                defined: 1,
                grade1: 1,
                grade2: 1,
                grade3: 1,
                children: [{
                    zid: '000211',
                    value: '二级指标',
                    defined: 1,
                    grade1: 1,
                    grade2: 1,
                    grade3: 1,
                    children: []
                }, {
                    zid: '000211',
                    value: '二级指标',
                    defined: 1,
                    grade1: 1,
                    grade2: 1,
                    grade3: 1,
                    children: [{
                        zid: '000211',
                        value: '三级指标',
                        defined: 1,
                        grade1: 1,
                        grade2: 1,
                        grade3: 1,
                        children: []
                    }]
                }]
            }]
        }



1.2 树结构


    <div id="weightLoop"></div> <!--定义容器(支持无限级)-->


    new Tree({
        tree: $('#weightLoop'),
        data: JSON.parse(loopdata),
        dw: 20,
        main: [true],
        width: ['100%'],
        alias: ['name'],
        header: [],     // 不显示头部
        headersub: [],  // 不显示副头部
        collapse: [
            {
                title: 'title',
                formatter: function (v) {
                    return '<em class="icon icon-folder"></em><a class="ellipsis block c-gray2 pdr10" href="javascript:void(0)" title="' + v.Name + '">' + v.Name + '</a><input type="hidden" orgid="' + v.OrgStructureDepartmentId + '" />'
                }
            }
        ],
        callback: function (self) {}
    });