# 树型列表

下面我们学习如何实现树型分组。

未配置过报表设计器的请先参考报表设计器

效果如下: rpt

# 设计报表

我们可以按照常规报表介绍新建报表,设计数据源,设计报表。

也可以直接打开示例

本地报表设计器http://localhost:5555/designer/?report=treeview (opens new window)

在线报表设计器http://www.satrda.com/designer/?report=treeview (opens new window)

其它格式设计参考常规报表设计。

# 设置报表Tree

点击设计器中间报表的空白部份,设置报表属性。在右面的属性面板中,类型选中树型

Treeview类型的报表,数据字段必须包含parentIdid字段,我们设置报表属性

  • parentId 属性设置为parentId
  • id 属性设置为deptId
rpt

示例报表数据如下:

[
    {"deptId":100,"parentId":0,"dept_name":"SatRDA组件","order_num":0,"leader":"","phone":"15888888888","email":"satrda@qq.com","status":"0"},
    {"deptId":101,"parentId":100,"dept_name":"深圳总公司","order_num":1,"leader":"","phone":"15888888888","email":"satrda@qq.com","status":"0"},
    {"deptId":102,"parentId":100,"dept_name":"北京分公司","order_num":2,"leader":"","phone":"15888888888","email":"satrda@qq.com","status":"0"},
    {"deptId":103,"parentId":101,"dept_name":"研发部门","order_num":1,"leader":"","phone":"15888888888","email":"satrda@qq.com","status":"0"},
    {"deptId":104,"parentId":101,"dept_name":"市场部门","order_num":2,"leader":"","phone":"15888888888","email":"satrda@qq.com","status":"0"},
    {"deptId":105,"parentId":101,"dept_name":"测试部门","order_num":3,"leader":"","phone":"15888888888","email":"satrda@qq.com","status":"0"},
    {"deptId":106,"parentId":101,"dept_name":"财务部门","order_num":4,"leader":"","phone":"15888888888","email":"satrda@qq.com","status":"0"},
    {"deptId":107,"parentId":101,"dept_name":"运维部门","order_num":5,"leader":"","phone":"15888888888","email":"satrda@qq.com","status":"0"},
    {"deptId":108,"parentId":102,"dept_name":"市场部门","order_num":1,"leader":"","phone":"15888888888","email":"satrda@qq.com","status":"0"},
    {"deptId":109,"parentId":102,"dept_name":"财务部门","order_num":2,"leader":"","phone":"15888888888","email":"satrda@qq.com","status":"0"}
]

# 设置Tree属性

  • 选中单元格A2,设置类型属性为Tree

最终效果: rpt