zTree文件树状图

Django+zTree构建组织架构树

js代码

 var setting = {
            async: {
                enable: true,
                url: {% url 'workspace:generate_tree' %},
                type: "get"},
            data : {
                simpleData: {
                    enable: true,
                    rootPId: 0
                }},
            callback:{
                onClick: zTreeOnClick,
            }
        };
        function zTreeOnClick(event, treeId, treeNode){
            var url = /workspace_list/;
            url = url + treeNode.name;
            asset_table.ajax.url(url);
            asset_table.ajax.reload();
        }

        $(document).ready(function () {
            $.fn.zTree.init($("#tree"), setting);

        });

后端view视图代码

def generate_tree(request):
    user = Users.objects.filter(user_name=request.session._session.get('user_id')).first()
    if user.role == 2:
        workspace = WorkSpace.objects.all()
    else:
        workspace = WorkSpace.objects.filter(user_id=user)
    _data = [{
        'id': x.id,
        'name': x.file_name,
        'pId': x.p_wk.id if x.p_wk else 0,
        'open': 1
    }for x in workspace]
    return JsonResponse(_data, safe=False)

呈现效果图:

image.png