双向折叠树

1.1 版本

1.2 预期效果

我们有时需要数据表可以根据横向和纵向的表头分别实现展开或折叠到任何数据详细信息，以方便动态查看，例如：显示不同地区下的食品类别的订单数量，效果如下图所示：

1.3 实现思路

双向折叠树就是行与列方向都有 折叠树，先制作为组织树报表，然后给每层数据添加树节点按钮，最后通过数据分析预览 (&op=view) 即可查看效果。

注：决策报表实现折叠树请参考：条件属性实现折叠树 。

2.1 准备数据

新建普通报表，新建数据库查询，SQL 查询语句为：

SELECT 货主地区,货主城市,客户ID,类别名称,订单.订单ID,产品名称 FROM 产品,类别,订单,订单明细

where 产品.类别ID=类别.类别ID and 订单.订单ID=订单明细.订单ID and 产品.产品ID=订单明细.产品ID and 货主地区 in ('华东','华北') and 类别名称 in ('谷类/麦片','肉/家禽','饮料') and 客户ID like '%a'

如下图所示：

2.2 设计表格

首先要设计一个双向折叠树，双向折叠树需要注意折叠树数据列不可位于同一行或者同一列。具体设置详见模板，主要注意单元格的扩展方向、父格设置以及过滤条件。表格样式如下图所示：

单元格设置如下：

2.3 设置树节点按钮

为了实现双向折叠树需要为树节点添加「按钮控件」。

2.3.1 纵向树节点按钮

1）选择 A4 单元格，右侧属性面板选择「控件设置」，选择「按钮控件」，按钮类型选择「树节点按钮」，如下图所示：

2）选择 B5 单元格，右侧属性面板选择「控件设置」，选择「按钮控件」，按钮类型选择「树节点按钮」，如下图所示：

2.3.2 横向树节点按钮

1）分别选择 D1、G1 单元格，右侧属性面板选择「控件设置」，选择「按钮控件」，按钮类型选择「树节点按钮」，如下图所示：

2）选择 E2 、H2 单元格，右侧属性面板选择「控件设置」，选择「按钮控件」，按钮类型选择「树节点按钮」，如下图所示：

2.4 设置过滤条件

1）双击 E2 单元格，选择「过滤」，类型为「普通」，过滤条件为：类别名称不等于饮料，用于显示除饮料外的其他食品类别，如下图所示：

2）双击 H2 单元格，选择「过滤」，类型为「普通」，过滤条件为：类别名称等于饮料，用于显示饮料类别等于饮料的类别名称，如下图所示：

3）双击 D4 、D5、D6 单元格，选择「过滤」，类型为「普通」，分别设置过滤条件如下：

 如下图所示：

4）双击 G4 、G5、G6 单元格，选择「过滤」，类型为「普通」，分别设置过滤条件如下：

 如下图所示：

2.5 设置数据

将 「订单 ID 」数据列拖入 D4~I6 单元格内，选择「单元格元素>基本」，数据设置为「汇总」，「个数」，使得每个地区/每个食品种类的订单数量汇总显示，如下图所示：

2.6 效果预览

2.6.1 PC 端

保存，选择「数据分析」预览，效果如 1.2 节所示。

注：折叠树仅支持「数据分析」预览。

2.6.2 移动端

移动端不支持数据分析预览，要想在移动端实现折叠展开效果，可以参见文档 ：移动端折叠展开树插件 。

已完成模板请参见：%FR_HOME%\webapps\webroot\WEB-INF\reportlets\doc\SpecialSubject\TreeReport\双向折叠树.cpt

点击下载模板：双向折叠树.cpt