反馈已提交

网络繁忙

当前为10.0版本文档,只有最新版本的文档支持在线编辑修改,如果想创建/编辑文档,请移步至 最新版帮助文档

数据库表字段控制Tab块隐藏

  • 文档创建者:L大大
  • 历史版本:9
  • 最近更新:Alicehyy 于 2024-06-04
  • 1. 概述

    1.1 预期效果

    通过数据库表中设置的字段值,控制决策报表的每个 Tab 块是否显示,如下图所示:

    数据库表字段:SITUATION 字段的值控制 Tab 是否显示。

    1717472242151954.png

    效果展示:一共有 4 个 Tab 块:春、夏、秋、冬,前端展现时只显示其中 2 个。

    E9CF8C4D-1DBD-4367-9BC6-93A8BA64CF71.GIF

    1.2 实现思路

    数据库表中添加控制 Tab 块是否显示的权限值,给决策报表的 body 组件添加 JS 事件来实现。

    2. 示例

    2.1 数据准备

    数据库新建一个表 SEASON,如下图设计表的字段:

    1717472242151954.png

    2.2 模板设计

    将 Tab 组件和报表块组件拖入到 body 组件中,新增 4 个 Tab 块,如下图所示:

    Snag_586711b.png

    2.3 添加JS事件

    选中 body 组件,添加一个初始化事件,如下图所示:

    Snag_58b3e89.png

    注:使用时,公式的 FRDemo 和 SQL 语句要修改为用户自己的数据连接和使用的 SQL 语句。

    事件中,添加一个参数 a  ,通过 SQL 查询和 split 公式分割将需要隐藏的 Tab 块标题存成一个数组。参数 a 的值为:split(SQL("FRDemo","SELECT TYPE FROM SEASON WHERE SITUATION='隐藏'",1),",")

    JavaScript 代码如下:

    //通过循环,获取数组a中的各Tab块标题,通过Tab块标题将Tab隐藏
    for(var i = 0; i < a.length; i++) { 
        this.options.form.getWidgetByName("tabpane0").setTabVisible(a[i], false);
    }

    2.4 效果预览

    1)PC 端

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

    E9CF8C4D-1DBD-4367-9BC6-93A8BA64CF71.GIF

    2)移动端

    同时支持 App 和 H5 端预览。

    1589511793864763.gif

     3. 模板下载 

    已完成模板可参见:%FR_HOME%\webapps\webroot\WEB-INF\reportlets\doc\JS\表单JS实例\数据库表字段控制是否显示Tab.frm

    点击下载模板:数据库表字段控制是否显示Tab.frm

    注:用户使用该模板时需要先新建数据库表。

    附件列表


    主题: 决策报表应用
    已经是第一篇
    已经是最后一篇
    • 有帮助
    • 没帮助
    • 只是浏览

    售前咨询电话

    400-811-8890转1

    在线技术支持

    请前往「服务平台」,选择「在线支持」

    热线电话:400-811-8890转2

    总裁办24H投诉

    热线电话:173-1278-1526