1. 概述
适用场景:安装了「FineVis数据可视化」插件的用户,可参考本文了解 FVS 模板的相关功能。
1.1 版本
报表服务器版本 | 插件版本 |
---|---|
11.0.2 | V1.2.0 |
1.2 场景介绍
本文主要介绍在 FVS 模板中如何结合填报 cpt 模板实现对告警事件的处理。
完整模板资源下载地址:智慧风电监控大屏 。
1.3 实现效果
本文使用一个简单的示例模板,讲解如何实现填报修改数据,且数据及时更新的效果。如下图所示:
2. 示例
本文仅讲解各个关键步骤的实现方式,不详细讲解模板的制作思路,请先下载示例模板和数据:告警事件处理测试.zip
将下载的「智慧风电.db」数据文件放到工程 %FR_HOME%\webapps\webroot\help 文件夹下;
将「告警事件处理示例.fvs」和「告警事件详情.cpt」两个模板放到工程 %FR_HOME%\webapps\webroot\WEB-INF\reportlets 文件夹下。
2.1 定义数据连接
在设计器中 定义数据连接 ,可直接复制内置的 FRDemo 数据连接,将 URL 中的「FRDemo」改成「智慧风电」,双击数据连接名称将其也改为「智慧风电」。如下图所示:
2.2 填报cpt模板介绍
2.2.1 数据集
该模板获取的是「智慧风电」中「风机告警事件」数据表的数据。如下图所示:
2.2.2 表格内容
单元格内容及说明如下:
单元格 | 内容说明 |
---|---|
A1~C1 (C1和D1合并) | 标题行,输入对应标题即可 |
A2 | 直接拖入「事件编号」字段 |
B2 | 直接拖入「事件内容」字段 |
C2 | 空内容,设置条件属性,用不同图片表示「是否处理」的不同状态 |
D2 | 直接拖入「是否处理」字段 |
E2 | 插入公式:=IF(D2="待处理","转处理中",IF(D2="处理中","转已关闭","重新打开")) 如果 D2 为「待处理」,E2 显示为「转处理中」 如果 D2 为「处理中」,E2 显示为「转已关闭」 如果 D2 为「已关闭」,E2 显示为「重新打开」 |
C2 单元格条件属性如下图所示:
E2 单元格公式如下图所示:
2.2.3 填报设置
1)给 E2 单元格添加一个 按钮控件 ,为了美观,将按钮类型设置为「自定义」,所有背景颜色都改为「透明」,使用单元格背景即可。
2)给按钮控件添加点击事件,实现点击按钮即可「提交入库」。
提交类型:智能提交
表:「智慧风电」数据库中的「风机告警事件」表
点击「智能添加字段」后,勾选全部字段;勾选「事件编号」为「主键」;「事件编号」的值为单元格「A2」,「事件内容」的值为单元格「B2」,「是否处理」的值为公式 IF(D2="待处理","处理中",IF(D2="处理中","已关闭","待处理"))
如下图所示:
2.2.4 点击触发模板刷新事件
填报模板在填报后,不会自动刷新模板,因此需要给按钮控件再添加一个点击事件,触发模板刷新。如下图所示:
JavaScript 代码为:
setTimeout(function() {
_g().refreshAllSheets();
}, 500)
2.2.5 填报Web属性
在「模板>模板Web属性>填报页面设置」中,选择「为该模板单独设置」,将报表显示位置设置为「居中展示」。
添加一个「加载结束」事件,JavaScript 代码如下:
var width1 = FR.windowWidth;
$('#content-container').css("width",width1+18)
//重新定义模板宽度,用于去除模板的纵向滚动条
2.2.6 模板纸张背景
将「模板>纸张背景」设置为「自定义>颜色>透明」,则在其余模板引用时,该模板显示为透明背景,利于美观。
2.3 FVS模板介绍
2.3.1 数据集
该模板数据集同 2.2.1 节,获取的是「智慧风电」中「风机告警事件」数据表的数据。
2.3.2 标题组件使用公式获取数据
该模板使用 标题组件 写公式获取数据集数据,使用 富文本组件 写文本区分各项数据。如下图所示:
公式分别为:
告警事件总数:count(VALUE("风机告警事件",1))
待处理:count(VALUE("风机告警事件",1,3,"待处理"))
处理中:count(VALUE("风机告警事件",1,3,"处理中"))
已关闭:count(VALUE("风机告警事件",1,3,"已关闭"))
2.3.3 标题组件开启监控刷新
给标题组件开启监控刷新,每隔 2 秒,组件刷新一次,可实现数据即时变化的效果。如下图所示:
2.3.4 标题组件设置弹出框
「查看详情」使用标题组件制作,给其添加一个「交互>点击事件」,事件类型为 弹出框 。
1)内容事件:由于是填报模板,这里需设置内容链接为「网页链接」,使用相对路径并添加填报预览参数 &op=write 。
本例相对路径为: /webroot/decision/view/report?viewlet=告警事件详情.cpt&op=write 。如下图所示:
2)样式设置
为了模板的美观,可以自行设置弹出框的大小、边框背景、关联性以及内边距。如下图所示:
到这里本文示例讲解结束,实现效果请参考 1.3 节,模板下载请参考第 2 章开头。