历史版本16 :折叠树 返回文档
编辑时间:
内容长度:图片数:目录数:
修改原因:
1. 概述编辑
1.1 应用场景
展示树状层级数据时,希望可以如下图通过点击按钮的方式来展开或收起每层的数据,那么该如何实现呢?
1.2 实现思路
先将模板制作为 组织树报表,然后给每层数据添加树节点按钮,最后通过数据分析预览 (&op=view) 即可查看效果。
2. 示例编辑
2.1 准备数据
1)新建一个数据库查询数据集 ds1,SQL 语句为:SELECT * FROM 公司部门
2)再新建一个 树数据集 Tree1,其数据来源于 ds1,设置其原始标记字段为列序号 1,父标记字段为列序号 2,如下图所示:
2.2 制作组织树
1)将树数据集 Tree1 的 FR_GEN_0、FR_GEN_1、FR_GEN_2 这 3 个字段分别拖到 A1、A2、A3 单元格,并都设置为居左,如下图所示:
2)A2 单元格的左父格自定义为 A1,如下图所示:
注:设置父格的目的是,点击主格时,控制附属于该组的子项内容展开与折叠。
3)A3 单元格的左父格自定义为 A2,如下图所示:
4)A1、A2、A3单元格都将形态设置为数据查询 ds1,实际值为列序号1,显示值为列序号3,如下图所示:
注:这里设置显示值为列序号3,是让前端预览时可以显示部门名称,而不是ID。
5)给 A2、A3 单元格都加相同的条件属性,隐藏掉没有数据的行,如下图所示:
2.3 添加树节点按钮
给 A1、A2、A3 单元格都添加树节点按钮,这个按钮作用就是实现层级展开或收起,如下图所示:
2.4 效果预览
保存报表,点击数据分析预览,效果如 1.1应用场景 中所示。
3. 模板下载编辑
已完成模板请参见:%FR_HOME%\webapps\webroot\WEB-INF\reportlets\doc\SpecialSubject\TreeReport\折叠树.cpt
点击下载模板:折叠树.cpt