最具影响力的数字化技术在线社区

168大数据

 找回密码
 立即注册

QQ登录

只需一步,快速开始

1 2 3 4 5
打印 上一主题 下一主题
开启左侧

用FineReport报表系统构建决策分析系统

[复制链接]
跳转到指定楼层
楼主
发表于 2016-2-15 15:40:59 | 只看该作者 回帖奖励 |倒序浏览 |阅读模式

马上注册,结交更多数据大咖,获取更多知识干货,轻松玩转大数据

您需要 登录 才可以下载或查看,没有帐号?立即注册

x

想必大家都已经通过帆软报表的帮助文档及其他方式,知道了很多关于帆软报表的配置、生成等内容。今天我们跳开这个话题从另一个角度来认识到,我们使用报表开发工具FineReport能给我们带来什么。

闲话不多说,我们直接来看一下最终效果。

(图一)

这个是首页效果,其中的每个模块数据图表均是使用帆软的报表系统生成,整体效果浑然一体。

同时还有一个更复杂的报表数据统计模块,如图二

(图二)

下面就来说道下该系统构建的几个关键技术要点。

系统整体架构说明:

Asp.Net系统+IIS+帆软报表系统+Tomcat

整个数据的传递过程是,在自身的业务系统中将相关的报表统计参数通过页面POST到帆软报表的服务页面,获取返回的结果,再进行结果的过滤整理,显示到页面中。

一 服务器整合

如我上面说过的,我们的业务系统使用的是asp.net,众所周知帆软报表系统是基于java的,所以我们需要进行服务器端的整合工作。

网络上关于IIS与Tomact的整合教程非常之多,我就不做过多的说明,只是将我写给我们实施人员的操作文档提供给大家,大家可以下载下面的压缩包进行查看。本人有一个在2003系统下的整合视频,因为附件限制无法上传,大家可以通过留言索取,相信大家看过后能够搞定的。

Tomcat6与IIS6、IIS7整合.rar

二 数据传递

我们统计分析的数据肯定是会有很多相关的查询条件的,大家都知道帆软报表包含了查询条件的相关功能,可是这个很多时候并不能满足我们的需要(ps:我们的需求总是无穷尽的)。如图二上面所显示的,我们很多查询条件是根据我们的业务系统紧密相关的,当然查询界面也要和谐同样不是吗,第三我们的查询条件主要是相同的,如每张报表都需要去单独配置条件,想必是很累的(ps:我们有近百张的报表)。

上面啰嗦了一堆,结论就是我们需要自己的查询条件功能,帆软报表只需要识别我们传递过去的查询条件极其值内容即可。

帆软报表的帮助文档中有过相关的描述,可以通过get、post等方式传递参数内容,这里我们用到了POST传递数据。我们来说一下具体的实现过程,相信看这篇文章的都是技术人员,那就不拐弯抹角了。

首先,在你需要显示报表的页面嵌入一个iframe,src填帆软报表的服务器地址,如:xxxx/ReportServer?reportlet=cpt报表文件存储路径&&op=form。这个iframe就是我们要post的对象,再建立一个from表单,在里面添加相关的查询条件文本框,如<input id=”paras” name=”paras” value=”gaby”>。将这个表单提交给iframe,传递给帆软报表的ReportServer,其内部会获取到并进行相关的操作,最终跟报表模版内的配置相互匹配,生成查询统计条件。

<iframe id=”reportIframe” name=”reportIframe” width=”100%” scrolling=”auto” style=”margin: 0;
padding: 0;” frameborder=”0″></iframe>
我们这里src内容是通过js来动态构建的。


    code view

帆软报表的模版中需要进行如下设置:

首先在模版编辑器中,选择报表菜单,选择报表参数,点击添加参数,新建一个名称为“paras”的报表参数。这个参数名称必须与上述表单中控件的名称相同,也就是要跟post过来的键值数据的键名称相同。

(图三)

建立好该参数后,你在报表模版的单元格计算和过滤中就能使用这个参数了,注意一下类型哦~。在数据集中可以直接输入“${paras}”来使用,帆软报表内在的函数很多,相信您肯定能变换的使用的很好。

三 获取你想要的数据

通过上面的操作,相信在你的iframe中就能获取到帆软报表提供给我们的统计结果了。可是这时你会发现……

(图四)

这根本不是我们想要的,这个界面跟我们的系统简直格格不入嘛。所以,我们要做的是,去掉上面那一栏,调整下面的主体内容格式。

仔细研究帆软报表返回的数据页面我们会知道,他们使用是JQuery作为js操作库的,数据内容是通过ajax来返回的。所以直接查看源代码是看不到具体页面内容的,我们可以通过debug bar来查看。我进过分析,最后是通过帆软报表中能够给结果也添加自定义js和css文件的功能来实现的。

(图四)

这里的css和js文件需要存放在Tomact下帆软的服务器目录中,它们会在页面生成的时候嵌入到页面中。下面我们来解释一下我是如何去掉那个工具条的。这里我们分析页面找到了工具条的html代码内容,所以只需要一条css就解决了问题。

/*设置工具栏隐藏*/

.FR-ToolBar-disabled?{?display:?none;?}

那我们在回头看看图一,我们这如此小的窗口中显示了图表,还有表格,并且都是塞满了这个模块窗口,如果直接嵌入帆软报表工具的返回数据,那肯定是会很难看的,所以我们需要过滤它给我们的返回数据。我们已经知道帆软报表中加入了JQuery,所以我们使用了JQuery。代码如下


    code view

这段代码我们时候针对数据表格的,这里我们巧妙的利用了异常来解决异步数据的延时问题。

下面这段是解决静态统计图的,这里就是一张图片,很好理解。动态统计图是一个js的报表,稍微复杂一点,大家可以自己去尝试一下。


    view code

通过上面的讲解和事例,相信大家都知道,最主要的关键点了。

四、还原我们想要的工具条功能

在图二中大家可以看到报表页面的左上角有两个按钮,分别是打印和导输出。这两个按钮是我们自行添加到我们页面的,所以风格效果可以跟系统保持统一。因为我们之前去掉了原有的工具条,所以打印和导出按钮都没有了,这里我们要从新实现它。

通过js的对象调试,我们跟踪到了原始工具条中打印和导出按钮的核心代码,我把代码在自己的页面中做了实现。


    view code

其中contentPane是帆软报表客户端页面的js中的核心对象内容,通过调用它其中的方法能够完美的还原之前工具条中按钮的功能。

结束语

这次讲解都到这里吧,虽然说不是系统的解析帆软报表,但是相信大家通过这篇文章也能够有一个新的视角,以便能更好的使用帆软报表,让其能很好的跟自身的业务系统兼容起来,让宝刀以最美的方式来展示它的锋利。


楼主热帖
分享到:  QQ好友和群QQ好友和群 QQ空间QQ空间 腾讯微博腾讯微博 腾讯朋友腾讯朋友
收藏收藏 转播转播 分享分享 分享淘帖 赞 踩

168大数据 - 论坛版权1.本主题所有言论和图片纯属网友个人见解,与本站立场无关
2.本站所有主题由网友自行投稿发布。若为首发或独家,该帖子作者与168大数据享有帖子相关版权。
3.其他单位或个人使用、转载或引用本文时必须同时征得该帖子作者和168大数据的同意,并添加本文出处。
4.本站所收集的部分公开资料来源于网络,转载目的在于传递价值及用于交流学习,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。
5.任何通过此网页连接而得到的资讯、产品及服务,本站概不负责,亦不负任何法律责任。
6.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源,若标注有误或遗漏而侵犯到任何版权问题,请尽快告知,本站将及时删除。
7.168大数据管理员和版主有权不事先通知发贴者而删除本文。

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

关闭

站长推荐上一条 /1 下一条

关于我们|小黑屋|Archiver|168大数据 ( 京ICP备14035423号|申请友情链接

GMT+8, 2024-4-25 15:16

Powered by BI168大数据社区

© 2012-2014 168大数据

快速回复 返回顶部 返回列表