layuiツリーテーブルコンポーネント

1.フォームツリーツリーテーブル

注：HTTPS：//fly.layui.com/extend/treetable/

< テーブルクラス= "layuiテーブルlayui状のtreeTable" ID = "ツリーテーブル" > </ テーブル>

 

{ 
    ELEM： '＃ツリーテーブル'、// 必须 
    URL： 'データ/テーブルtree.json'、// （URLの和データ参数必须设置一个）
    のデータ：[{}、{}、{}、.. 。]、
    icon_key： 'タイトル'、// 必须 
    top_value：0 、
    PRIMARY_KEY： 'ID' 、
    PARENT_KEY： 'PID' 、
    hide_class： 'layui隠す' 、
    アイコン：{ 
        オープン：「layuiアイコンlayuiアイコン三角形-d」、
        近く： 'layuiアイコンlayuiアイコン三角形-R' 、
        左： 16 、
    }、
    襟：[{
        キー：'タイトル' 、
        タイトル： '名称' 、
        幅： '100ピクセル' 、
        テンプレート：機能（アイテム）{ リターン '显示内容' } 
    }、{}、...]、
    チェック：{ 
        キー： 'ID' 、
        データ。 [ 0,1,4,10,11,5,2,6,7,3,8,9 ] 
    }、
    is_click_icon：偽、
    is_checkbox：偽、
    is_cache：真、
    終了：機能（E）{} 
}

検索ハイライト

//搜索
            $('#btn_Search').click(function () {
                var keyword = $('#Name').val();
                var searchCount = 0;
                treeTable.openAll(re);
                setTimeout(function () {
                    $('#tree-table').find('tbody tr td').each(function () {
                        $(this).css('background-color', 'transparent');
                        var text = $(this).text();
                        if (keyword != '' && text.indexOf(keyword) >= 0) {
                            $(this).css('background-color', 'rgba(250,230,160,0.5)');
                            if (searchCount == 0) {
                                $('html,body').stop(true);
                                $('html,body').animate({ scrollTop: $(this).offset().top - 150 }, 500);
                            }
                            searchCount++;
                        }
                    });
                    if (keyword == '') {
                        layer.msg("请输入搜索内容", { icon: 5 });
                    } else if (searchCount == 0) {
                        layer.msg("没有匹配结果", { icon: 5 });
                    }
                }, 200)
            });

 

加入权限时若要求不同的人登入显示不同的组织，注意如果parentid不为0，则要转为0作为根节点