反馈已提交

网络繁忙

组织树传参

  • 文档创建者:我从山中来
  • 历史版本:20
  • 最近更新:Fay 于 2022-11-16
  • 1. 概述

    1.1 预期效果

    在实际使用过程中,经常会遇到一种架构:左侧显示树状图,右边显示树中某一节点的详细信息。当点击左侧组织树的时候,右边表格随之自动变换。如下图所示:

    222

    1.2 实现思路

    用户可通过两种方式实现组织树传参:

    1)左侧树使用「视图树控件」显示组织树,右侧使用「网页框控件」显示树节点的详细信息。

    2)左侧树使用单元格扩展方式实现组织树,右侧使用「网页框控件」显示树节点的详细信息。

    第一种方式请参见:视图树超链接,本文主要介绍第二种方式。

    2. 示例

    2.1 子模板

    新建普通报表,命名为「组织树传参_详细」,保存在%FR_HOME%\webroot\WEB-INF\reportlets\doc\Parameter目录下。

    2.1.1 新建数据集

    新建数据集 ds1,SQL 语句为: SELECT * FROM department WHERE did='${did}' ,如下图所示:

    1577346067235471.png

    2.1.2 报表设计

    报表主体样式,如下图所示:

    1577347795159416.png

    2.2 主模板

    新建普通报表,命名为「组织树传参_框架」,保存在%FR_HOME%\webroot\WEB-INF\reportlets\doc\Parameter目录下。

    2.2.1 新建数据集

    1)数据集 department

    新建数据集 department ,SQL 语句为: SELECT * FROM department,如下图所示:

    1577348223907785.png

    2)树数据集 Tree

    新建树数据集 Tree ,选择内置数据集 department ,并勾选「依赖所选数据集的父标记字段构建树」。

    原始标记字段为 did ,父标记字段为 fid ,如下图所示:

    1577348978715111.png

    2.2.2 设置组织树

    1)报表设计

    将树数据集 Tree 中的层次列分别拖入 B2、B3、B4 单元格中,如下图所示:

    image.png

    2)单元格缩进

    设置 B2、B3、B4 单元格左对齐,B3 单元格缩进 20 ,B4 单元格缩进 40 。如下图所示:

    1577352301247774.png

    3)设置父格

    设置 B3 单元格的左父格为 B2 ,B4 单元格的左父格为 B3 。如下图所示:

    4)过滤空行

    对 B3 单元格和 B4 单元格分别进行过滤,过滤条件:REVERSE(ISNULL($$$)),如下图所示:

    1577352643708268.png

    5)单元格形态

    设置 B2、B3、B4 单元格的形态为「数据查询」,数据集为「department 」 ,实际值为 「did」 ,显示值为「department 」 。如下图所示:

    1577353042595900.png

    2.2.3 设置网页框

    合并 D2、D3、D4 单元格,并设置为「网页框控件」,如下图所示:

    1577351068923262.png

    网页框属性如下表所示:

    内容
    控件名称report
    地址${servletURL}?viewlet=doc/Parameter/组织树传参_详细.cpt&op=view
    参数

    did=B2,默认将 B2 的值作为参数 did 传递给详细页面

    2.3 组织树传递参数

    该步骤实现左侧点击组织树的某一节点时,右侧详细页面显示该节点的详细信息。

    选中 B2、B3、B4 单元格,添加「超级链接>JavaScript 脚本」,设置参数「did=$$$」,如下图所示:

    1.png

    JavaScript 代码如下:

    var url = encodeURI(encodeURI("${servletURL}?viewlet=doc/Parameter/组织树传参_详细.cpt&op=view"));
    FR.doHyperlinkByPost(url, {
    did: did
    }, 'REPORT');

    2.4 效果预览

    保存模板,点击「数据分析」,查看报表,效果如 1.1 节所示。

    注:移动端不支持网页框控件。

    注:仅支持「数据分析」和「填报预览」。

    3. 已完成模板

    1)主模板

    已完成的模板,可参见:%FR_HOME%\webroot\WEB-INF\reportlets\doc\Parameter\组织树传参_框架.cpt

    点击下载模板:组织树传参_框架.cpt

    2)子模板

    已完成的模板,可参见:%FR_HOME%\webroot\WEB-INF\reportlets\doc\Parameter\组织树传参_详细.cpt

    点击下载模板:组织树传参_详细.cpt

    附件列表


    主题: 报表应用
    已经是第一篇
    已经是最后一篇
    • 有帮助
    • 没帮助
    • 只是浏览
    中文(简体)

    鼠标选中内容,快速反馈问题

    鼠标选中存在疑惑的内容,即可快速反馈问题,我们将会跟进处理。

    不再提示

    10s后关闭



    AI

    联系我们
    在线支持
    获取专业技术支持,快速帮助您解决问题
    工作日9:00-12:00,13:30-17:30在线
    页面反馈
    针对当前网页的建议、问题反馈
    售前咨询
    采购需求/获取报价/预约演示
    或拨打: 400-811-8890 转1
    qr
    热线电话
    咨询/故障救援热线:400-811-8890转2
    总裁办24H投诉:17312781526
    提交页面反馈
    仅适用于当前网页的意见收集,帆软产品问题请在 问答板块提问前往服务平台 获取技术支持