反馈已提交

网络繁忙

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

组件复用

  • 文档创建者:Leo.Tsai
  • 历史版本:11
  • 最近更新:Alicehyy 于 2022-03-04
  • 1. 概述

    1.1 版本说明

    报表服务器版本功能变动
    10.0.17版本更新后,组件复用功能已合并至设计器,以后无需安装组件复用插件且相关功能随设计器更新

    1.2 应用场景

    不知道如何美化模板?不想在样式配置上耗费太多时间?需要固定本公司常用的组件样式或功能,需要自带数据的组件来快速搭建demo。

    FineReport 组件复用功能轻松帮您解决上述问题,用户可以直接从在线商城下载官方提供的组件,直接将组件拖拽到自己的报表中,改下数据、大小、背景色就能直接用了。

    如果您想将自己制作的组件保存起来,方便下次直接拿来用,也可以通过该功能实现,只需要将组件生成后保存到本地库即可。

    下载并复用在线商城组件的步骤如下图所示:

    1625196300108875.gif

    预览效果如下图:

    1625196344422818.png

    1.3 环境要求

    • 10.0.17 之前版本的设计器,需要安装 组件复用插件 才能使用组件复用功能。

    • 10.0.17 及之后版本的设计器,无需安装插件即可使用该功能。

    1.4 组件上新日志

    帆软组件商城持续上新中,您可以通过 帆软市场组件更新日志 查询最新上架的组件哦。

    2. 功能入口

    现在打开组件库的入口有 2 个,分别是:

    2.1 组件库

    新建或打开决策报表,右侧工具栏有一个组件库按钮,这个是所有版本设计器都有的入口。

    1625204266165508.png

    点击按钮后,会打开组件库页面,如下图所示:

    1625204278726883.gif

    2.2 套用组件

    决策报表上方工具栏最右侧新增套用组件按钮,这个是 10.0.17 及之后版本才有的入口。

    1624870314369051.png

    点击按钮后,会跳转到组件库页面,如下图所示:

    1624870985814022.gif

    3. 组件库使用指南

    3.1 复用在线组件

    3.1.1 下载组件

    首先要把组件下载到本地,下载组件的渠道有 2 种。

    1)渠道一:直接在设计器在线组件页面下载。

    进入组件库在线组件页面后,组件组件包Tab 下,会有很多组件。

    浏览并选择自己想要的,然后鼠标悬浮在这个组件上方,会出现白色下载按钮,同时左边也会弹出组件效果预览图,点击下载按钮后,组件即下载到本地。

    1625204980657942.png

    切回到本地组件页面,下载好的组件会保存在这个页面,如下图所示:

    1625205753110859.png

    所有下载的组件都以 .reu 文件的形式保存在%FR_HOME%\webapps\webroot\WEB-INF\assets\component路径下。

    注:如果工程下有 %FR_HOME%\webroot\WEB-INF\assets\FineReport.reuse 文件夹,这个是17年老组件库用的文件夹,可以删除。

    1625205930660319.png

    2)渠道二:商城下载并安装到本地

    打开 组件在线商城 后,挑选自己想要的组件,然后点击这个组件的展示区域,即可进入下载页面。

    1625206151229053.png

    点击下方的下载组件按钮,即可将 .reu 文件下载到本地文件夹,此时还未结束,还需要将文件安装到设计器本地目录下。

    1625206269278795.png

    组件库打开本地组件页面,点击添加组件>安装组件,将 .reu 文件安装到设计器本地目录下即可,如下图所示:

    注:按住 Shift 键批量选中 .reu 文件可以批量安装组件。

    1625206570954794.gif

    3.1.2 使用组件

    使用方法很简单,只需要将组件拖到决策报表的 body 中即可,如果是绝对布局还能自由调整组件位置和大小。

    鼠标悬浮在组件上方时,其右上角就会出现帮助设置按钮,点击按钮会进入帮助设置页面。

    帮助设置页面可以看到组件使用说明和组件中所有条件属性、JS、超链接这些特殊设置项。(如果组件没有特殊设置项,则不显示)

    1625207173287442.gif

    在帮助设置的组件介绍处,会有推荐的组件 body 背景色,使用时建议您设置成该颜色,以保证最佳展示效果

    1625208078499718.gif

    3.2 创建可复用组件

    如果您想将自己制作的组件保存起来,方便下次直接使用,就可以通过「创建组件」功能实现。

    1)创建组件时,会将整个模板中所有的数据集一起封装为组件的内置数据集,所以创建组件时需保证模板中没有与组件无关的数据集存在。

    2)选中组件,支持多选,然后进入组件库的「本地组件」页面,点击「添加组件>创建组件」,弹出组件生成的配置页面。

    3)设置相关信息后,点击确定即可生成组件,生成的组件显示在本地组件页面,同样保存至 %FR_HOME%\webapps\webroot\WEB-INF\assets\component 路径下,也可将 .reu 文件直接复制给他人使用。

    步骤演示如下图所示:

    1625209002811069.gif

    3.3 管理本地组件

    3.3.1 分组管理

    有时候本地组件太多了,整个页面非常乱,找的时候也难找,可以将组件整理到不同分组下,这样以后可以直接打开对应分组来找,节省时间。

    • 点击本地组件页面下的添加分组按钮,可以新建分组。

    • 右键组件后点击移动分组,可以将组件移到某个分组下面去。

    完整操作见下图:

    1625209596658968.gif

    3.3.2 批量操作

    组件很多时,支持批量删除和移动分组,点击本地组件页面下的管理组件按钮即可进行相关操作。如下图所示:

    1625209892236798.gif

    4. 用户须知

    4.1 老用户须知

    如果您已经安装了 组件复用插件 ,由于插件功能已经合到设计器,版本更新后插件会被自动禁用,且不可启用,删除插件不会有任何影响。

    1624871725194982.png

    已安装的本地组件和本地分组仍然会保留,更新对组件没什么影响,如下图所示:

    Snag_113b5014.png

    4.2 新用户须知

    如果您是未使用过组件复用功能的新用户,那么第一次打开组件库页面时,会弹出新手提示框,且关闭后不再出现,如下图所示:

    1624931417552676.png

    4.3 其他须知

    在设计决策报表时,可能会同时包含组件面板的组件和组件库中的组件,那么怎么区分它们呢?

    其实很简单,看组件图标有无 logo 或者组件末尾的数字编号位数就行:

    • 组件面板中的组件:组件图标没有 logo、1 位数字编号

    • 组件库中的组件:组件图标右上角有蓝色 logo、2 位数字编号

    Snag_14d8c224.png

    5. 注意事项

    远程设计时,服务器 JAR 包版本、复用插件版本跟设计器都是一致的,但是打开组件库仍然会报错:

    1627981718866519.png

    可能是由于服务器组件目录下的组件使用特殊符号命名导致的。例如下图使用横线给组件命名:

    1627982222224249.png

    如果确实是组件命名的问题,在fanruan.log中还会有错误信息:文件名、目录名或卷标语法不正确。

    附件列表


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

    售前咨询电话

    400-811-8890转1

    在线技术支持

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

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

    总裁办24H投诉

    热线电话:173-1278-1526