填报居中

  • 文档创建者:文档助手1
  • 编辑次数:19次
  • 最近更新:Carly 于 2019-12-02
  • 1. 概述

    1.1 预期效果

    模板在填报预览时,默认在浏览器中左对齐显示,视觉显示时不舒服。

    用户希望能居中显示报表,如下图所示:

    1575276810942261.png

    1.2 实现思路

    FineReport 7.0.6 版本新增了填报居中显示的功能,可在模板 Web 属性中选择居中显示即可。

    FineReport 7.0.6 版本之前,用户可通过给填报模板增加加载结束事件,在事件中设置左边距。

    2. 示例一:填报居中显示

    打开一张填报模板,点击模板>模板web属性>填报页面设置,选择为该模板单独设置,在报表显示位置处选择居中显示,如下图所示:

    1575277321474619.png

    点击填报预览,可以看到在浏览器端,模板数据居中显示了,如1.1 预期效果所示。

    3. 示例二:添加加载结束事件

    打开一张填报模板,点击模板>模板 Web 属性>填报页面设置,选择为该模板单独设置,在事件设置中增加加载结束事件,如下图所示:

    1575277468821414.png

    JS 代码如下:

    /*(浏览器的宽度-实际报表的宽度)/2*/
    var slmargin = ($('.content-container').width()-$($("div",'.sheet-container')[0]).width())/2;
    /*左边距设置,实现报表居中显示的效果*/
    $('.sheet-container').css('margin-left',slmargin);

    点击填报预览,可以看到在浏览器端,模板数据居中显示了,如1.1 预期效果所示。

    附件列表


    主题: 填报应用
    • 有帮助
    • 没帮助
    • 只是浏览