历史版本9 :动态参数实现多级折叠树 返回文档
编辑时间: 内容长度:图片数:目录数: 修改原因:

目录:

1. 概述编辑

1.1 应用场景

在报表开发中,我们会遇到报表需要对行标题实现展开收起的折叠菜单的效果。这种效果一般在分析预览或者填报中应用下拉树控件来实现,但是在分页预览或者决策报表如何实现呢?这里我们使用动态参数的方式。

预期效果:

1)在分页预览和决策报表中能适用

2)随着数据增长改变,折叠菜单自动改变(可复用),不用写死

3)下拉收起功能和当前常用的下拉树按钮功能一致

1576662471212046.gif

1.2 实现思路

1)通过父格扩展来实现全部菜单展开的效果

2)通过动态参数来标记哪些行是展开或者折叠的

3)通过条件属性控制行隐藏显示

2. 示例编辑

2.1 准备数据

新建一个内置数据集,如下图所示:

1576658895177342.png

2.2 设计表格

1)设计表格,如下图所示:

1605509920470181.png

2)设置各单元格的扩展方向和左父格,如下表所示:

单元格扩展方向左父格
A3不扩展C2
B2

纵向扩展

C2
C2纵向扩展默认
C3纵向扩展C2
D3纵向扩展默认

2.3 添加动态参数和条件属性

1)在 B2 单元格添加两个动态参数,步骤如下图所示:

1605577813552941.png

pre:if(find(C2, concatenate($pre, $cur)) > 0, replace(concatenate($pre, $cur), C2, ""), concatenate($pre, $cur))

以上 pre 参数函数内容是为了获取上次点击的获取的值。(但是如果上次已经点击过一次,则去除点击过的状态)

cur:if(find(C2, concatenate($pre, $cur)) > 0, 1, if(C2 = $cur, 1, C2))

以上 cur 参数函数内容是为了获取本次点击的获取的值。

2)在 A3 单元格添加两个条件属性,步骤如下图所示:

1605577998190433.png

条件属性 1:行高为 0:公式为 reverse(or($$$ = $cur, find($$$, $pre) > 0))  此公式是为了判断当前值如果不是本次或者上次点击的则隐藏起来。

条件属性 2:列宽为 0。

2.4 添加折叠和展开的箭头图标

找两个小图标:

1576660223355050.png  

1576660223811020.png

给 B2 单元格添加两个条件属性:

条件属性 1:背景选择向下的图片,公式为:reverse(or(C2 = $cur, find(C2, $pre) > 0))

展开收起.png

条件属性2:背景为向上的图片,公式为:or(C2 = $cur, find(C2, $pre) > 0)

2.5 效果预览

1)PC端

保存报表,点击分页预览,效果如下图所示:

1576662471212046.gif

2)移动端

保存报表,点击移动端预览,同时支持 APP 端和 H5 端,效果如下图所示:

1605579317753480.gif

3. 模板下载编辑

已完成模板可参见:%FR_HOME%\webapps\webroot\WEB-INF\reportlets\doc\Parameter\DynamicCol\动态参数实现二级下拉折叠菜单.cpt

点击下载模板:动态参数实现二级下拉折叠菜单.cpt

另外附上三级下拉模板,原理同二级下拉一样,只是父格扩展可能稍微比刚刚的复杂一些。

已完成模板可参见:%FR_HOME%\webapps\webroot\WEB-INF\reportlets\doc\Parameter\DynamicCol\动态参数实现三级下拉折叠菜单.cpt

点击下载模板:动态参数实现三级下拉折叠菜单.cpt

4. 注意事项编辑

1)以上为内置数据集的方式实现的,如果是使用 Oracle 数据集,可以用select distinct 大类别,小类别 from 表名 然后左联接同一个表,获取里面需要的值数据,然后放置到需要的位置,可能需要配置下过滤等,整体的表就可以做出来了。

2)如果需要点击下拉折叠不是在小三角按钮上实现,在文字上直接实现,也是可以的,只要更改公式中的 C2 为当前值 $$$,然后再将本文 B2 动态参数设置在 C2 上即可。

3)其他样式问题,比如左对齐,框线,字体,自行设置即可。