Weibw's World
weibw
2022-02-21

FineReport常用JS方法

# 帆软自带的JS方法和对象

# 1、获取控件

A.分页/数据分析

(1)获取参数面板控件

_g().parameterEl.getWidgetByName("name")//获取参数面板控件
 //例：
 _g().parameterEl.getWidgetByName("lamar1") //获取下方示例1.cpt
 _g().parameterEl.getWidgetByName("lamar1").getValue() //获取lamar1文本控件的值“你好
 _g().parameterEl.getWidgetByName("lamar1").setValue("说再见") //给文本控件lamar1赋值再见
 _g().parameterEl.getWidgetByName("lamar2").fireEvent("click")  //调用lamar2按钮里面定义的点击事件
1
2
3
4
5
6

(2)获取工具栏

contentPane.toolbar.options.items[index] //获取工具栏控件，index参数从0开始，按工具栏控件顺序
 //例：
 contentPane.toolbar.options.items[0].getValue() //获取第一个工具栏控件的值，赋值同上
1
2
3

B.填报预览

(1)获取表格主体控件方法

contentPane.getWidgetByName("name")  //根据控件名获取
contentPane.getWidgetByCell("cell")  //根据单元格获取
contentPane.getWidgetByCell("cell").setVisible(boolean)  //设置控件是否可见，参数为 true 可见，false 不可见
contentPane.getWidgetByCell("cell").setEnable(boolean)  //设置控件是否可用，参数为 true 可用，false 不可用
1
2
3
4

更多用法戳下方链接

填报预览JS实例https://help.finereport.com/doc-view-1193.html (opens new window)

( 2）获取参数面板控件，获取工具栏控件

同上A.分页预览方法不赘述了

C.决策报表

(1)获取组件方法

_g().getWidgetByName("name");  //按名字获取决策报表的组件
//验证方式
_g().getWidgetByName("name").fireEvent("click")
1
2
3
4

(2)获取参数面板控件，获取工具栏控件

同上A.分页预览方法不赘述了

# 2、获取单元格

A.分页/数据分析

$("td[id^=单元格号-")
$("td[id^=A1-").text()//获取A1单元格的值
1
2

B.填报预览

$("td[id^=单元格号-")   //（1）A.方法同样适用


contentPane.getCellValue(sheet,col,row) 
contentPane.curLGP.getCellValue(cell)    

contentPane.setCellValue(sheet,col,row,value)      //（2）根据sheet页，列，行获取并赋值
contentPane.curLGP.setCellValue(cell,null,value)   //（3）根据单元格赋值
1
2
3
4
5
6
7
8

C.决策报表

$(“#报表块名字").find("td[id^='单元格号-']")  //类似A.
$(“#REPORT0").find("td[id^='单元格号-']").text()  //获取report0中A1单元格的值
1
2

# 3、对话框

A.打开对话框

FR.showDialog(title,width,height,innerContent)
//示例，innerContent参数除文本值外，也可以是html形式
var url = "http://localhost:8075/webroot/decision/view/report?viewlet=GettingStarted.cpt"    //跳转地址
var iframe = $("<iframe width='100%' height='100%' scrolling='yes' frameborder='0'>");
iframe.attr("src", url);
FR.showDialog("test", 555, 555, iframe);    //弹出对话框
1
2
3
4
5
6

B.关闭对话框

# 4、网页跳转

FR. doHyperlinkByGet(url,config,target,feature)  //get传参
FR. doHyperlinkByPost(url,config,target,feature)  //参数用法同get，安全性较好
//示例
var url="http://localhost:8075/webroot/decision/view/report?viewlet=GettingStarted.cpt"; // 跳转地址
var config={地区:"华北"}; //参数
var target="_dialog";  //超链属性:_blank（相当于window.open）,_self(window.location),_dialog(对话框形式)
var feature={width:800,height:450};  //对话框大小
FR.doHyperlinkByGet(url,config,target,feature);
1
2
3
4
5
6
7
8

# 5、公式调用

FR.remoteEvaluate('=公式’)//方法1
"${=公式}"//方法2
var a=FR.remoteEvaluate("format(today(),'yyyy-MM-dd')");
var b=FR.remoteEvaluate("sum(1,2)");
var c=FR.remoteEvaluate("sql('FRDemo','select 产品名称 from S产品 where 产品ID=1',1,1)");
alert("a的值为:"+a+" | b的值为:"+b+" | c的值为:"+c);
1
2
3
4
5
6

更多详情请戳下方链接：

在JS代码中使用FineReport内置的公式https://help.finereport.com/doc-view-1785.html (opens new window)

# 6、MSG

https://help.finereport.com/doc-view-603.htm (opens new window)

# 7、FS

FS决策系统-https://help.finereport.com/doc-view-606.html (opens new window)

# 8、图表接口

A.刷新接口//图表块

FR.Chart.WebUtils.getChart("chart0").dataRefresh()  
//单元格
FR.Chart.WebUtils.getChart("A1").dataRefresh()
FR.Chart.WebUtils.getChart("A1","report0").dataRefresh()  //决策
//多图表
FR.Chart.WebUtils.getChart("A18").dataRefresh([0,1]
1
2
3
4
5
6

B.排序

//图表块FR.Chart.WebUtils.getChart ("chart0").vanCharts.charts[0].sortChart()  //排序方法sortChart()参数，1从低到高，-1从高到低，不写执行相反操作
//单元格
FR.Chart.WebUtils.getChart("A1").vanCharts.charts[0].sortChart()
FR.Chart.WebUtils.getChart("A1","report0").vanCharts.charts[0].sortChart() //决策
//多图表
FR.Chart.WebUtils.getChart("A18").vanCharts.charts[1].sortChart()
1
2
3
4
5
6

C.切换接口//图表块

FR.Chart.WebUtils.getChart("chart0").showIndexChart(1)
//单元格
FR.Chart.WebUtils.getChart("A18").showIndexChart(1)
FR.Chart.WebUtils.getChart("A18","report0").showIndexChart(1)
1
2
3
4

D.轮播切换接口

VanCharts.unifiedSwitchCarouselChart();
1

E.显示部分系列接口

//图表块
FR.Chart.WebUtils.getChart("chart0").vanCharts.charts[0].setSeriesVisible([0,1])  //顺序控制系列，0代表系列1
//单元格
FR.Chart.WebUtils.getChart("A1").vanCharts.charts[0].setSeriesVisible([0,1])
FR.Chart.WebUtils.getChart("A1","report0").vanCharts.charts[0].setSeriesVisible([0,1])
//多图表
FR.Chart.WebUtils.getChart("A18").vanCharts.charts[1].setSeriesVisible([0,1])
1
2
3
4
5
6
7

F.地图缩放

//图表块
FR.Chart.WebUtils.getChart("chart1").getChartWithIndex(0).setMapZoom({zoomLevel:7, viewCenter: [120, 33]})    //zoomLevel:缩放等级, viewCenter: [120, 33]（中心点）
//单元格
FR.Chart.WebUtils.getChart("A1").getChartWithIndex(0).setMapZoom({zoomLevel:7, viewCenter: [120, 33]})
FR.Chart.WebUtils.getChart("A1","report0").getChartWithIndex(0).setMapZoom({zoomLevel:7, viewCenter: [120, 33]})
//多图表
FR.Chart.WebUtils.getChart("A18").getChartWithIndex(1).setMapZoom({zoomLevel:7, viewCenter: [120, 33]})
1
2
3
4
5
6
7

更多详情请戳如何获取图表对象-https://help.finereport.com/doc-view-2114.html (opens new window)

# 常用方法

# 1、改变超链弹框颜色

var $iframe = $("<iframe id='inp' name='inp' width='100%' height='100%' scrolling='no' frameborder='0'>");
$iframe.attr("src", "${servletURL}?reportlet=js.cpt&op=write");
var o = {
title : "请选择记录项",
width : 460,
height: 350
};
FR.showDialog(o.title, o.width, o.height, $iframe,o);
$('.fr-core-window').css("background","rgb(248,240,203)");
$('.fr-core-window .fr-core-window-header ').css("background","rgb(248,240,203)");
$('.ui-resizable-e').css("background","rgb(248,240,203)");
1
2
3
4
5
6
7
8
9
10
11

# 2、一个控件控制其他控件功能

var a = this.options.form.getWidgetByName("a").getValue();
var b = this.options.form.getWidgetByName("b");
var c = this.options.form.getWidgetByName("c");
if(a!=''){
b.setEnable(false);
c.setEnable(false);
}
else{
b.setEnable(true);
c.setEnable(true);
}
1
2
3
4
5
6
7
8
9
10
11

# 3、移动鼠标变色

需求
在设置了行背景色的模板上，需要实现鼠标悬浮也能变色，移开变回原色的功能。
注:新填报不支持


思路
首先在元素选择上需要排除掉标题行，其次只针对表格里的tr生效。记住原色的功能可以用全局变量来实现。最开始想用css做的，因为css的hover是伪元素，可以省去记住原色的实现步骤，但是css的选择器琢磨了半天不知道怎么排除掉标题行，只能用jquery来做了。

$(".x-table tr[tridx!='0']").mouseover(function(){
//.x-table限制表格部分，tridx!='0'可以排除掉标题行
    window.color=$(this).find("td").css("background");
//将当前颜色赋值给全局变量color
    $(this).find("td").css("background","yellow");
//将当前行下的所有td的背景色变为黄色
    })
$(".x-table tr[tridx!='0']").mouseout(function(){
    $(this).find("td").css("background",color);
//将当前行下的所有td的背景色变为原色
    })
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19

# 4、自动翻页

var flag=0;//设置标记值参数 flag 初始值为 0
$(".content-container").click(function()//当鼠标点击页面时，
设置标记值为 1，即停止页面自动切换分页效果。
content-container也是一个容器
flag=1;
})
if(_g().currentPageIndex==_g().reportTotalPage){
setTimeout(function()//在指定的毫秒数后调用函数或计算表达式
{
if (flag==0)
{
_g().parameterCommit();  //当当前页等于报表总页数且标记值为0时，
执行重新刷新当前报表；
}},1000);}
else{
setTimeout(function(){
if(flag==0){
contentPane.gotoNextPage();//当标记值为0时执行跳转到下一页
}},1000);}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19

# 5、获取当前浏览器类型

//  加载结束后事件写JS 360兼容模式会被识别为ie

function validate360(option, value) {
    let mimeTypes = window.navigator.mimeTypes;
    for (let mt in mimeTypes) {
        if (mimeTypes[mt][option] == value) {
            return true;
        }
    }
    return false;
}
 
function getBrowerInfo() {
    let userAgent = window.navigator.userAgent.toLowerCase();
    let browserType = '';
    let isIE = userAgent.match(/msie/) != null || userAgent.match(/trident/) != null
    // 浏览器类型-IE
    if (userAgent.match(/msie/) != null || userAgent.match(/trident/) != null) {
        browserType = 'IE';
    }
    // 欧朋
    else if (window.opera || (userAgent.indexOf("opr") > 0)) {
        browserType = '欧朋';
    }
    // UC
    else if (userAgent.indexOf("ubrowser") > 0) {
        browserType = 'UC';
    }
    // 百度
    else if (userAgent.indexOf("bidubrowser") > 0) {
        browserType = '百度';
    }
    // 搜狗
    else if (userAgent.indexOf("metasr") > 0 || userAgent.indexOf("se 2.x") > 0) {
        browserType = '搜狗';
    }
    // QQ
    else if (userAgent.indexOf("tencenttraveler") > 0) {
        browserType = 'QQ';
    }
    // QQ
    else if (userAgent.indexOf("qqbrowser") > 0) {
        browserType = 'QQ';
    }
    // 遨游
    else if (userAgent.indexOf("maxthon") > 0) {
        browserType = '遨游';
    }
    // 火狐
    else if (userAgent.indexOf("firefox") > 0) {
        browserType = '火狐';
    }
    // edge
    else if (userAgent.indexOf("edge") > 0) {
        browserType = 'Edge';
    }
    // 谷歌/360
    else if (userAgent.indexOf("chrome") > 0) {
        if (validate360('type', 'application/vnd.chromium.remoting-viewer')) {
            browserType = '360';
        } else {
            browserType = '谷歌';
        }
    }
    // 苹果
    else if (userAgent.indexOf("Safari") > -1) {
        browserType = 'Safari';
    }
    return browserType;
}
 
contentPane.setCellValue("B7", null, getBrowerInfo());//将结果赋值给B7单元格
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72

# 6、跑马灯

setTimeout(function() {
    //隐藏报表块report0的滚动条（此报表块名为report0，根据具体情况修改）
    $("div[widgetname=REPORT4]").find(".frozen-north")[0].style.overflow = "hidden";
    $("div[widgetname=REPORT4]").find(".frozen-center")[0].style.overflow = "hidden";
}, 1000);

window.flag1 = true;
var self1 = this;
//鼠标悬停，滚动停止
setTimeout(function() {
    $("div[widgetname=REPORT4]").find(".frozen-center").mouseover(function() {
        window.flag1 = false;
    });

    //鼠标离开，继续滚动
    $("div[widgetname=REPORT4]").find(".frozen-center").mouseleave(function() {
        window.flag1 = true;
    });

    var old = -1;
    var interval = setInterval(function() {
    	if(!self1.isVisible()){
    		return;
    	}
        if(window.flag1) {
            currentpos1 = $("div[widgetname=REPORT4]").find(".frozen-center")[0].scrollTop;
            if(currentpos1 == old) {
                $("div[widgetname=REPORT4]").find(".frozen-center")[0].scrollTop = 0;
            } else {
                old = currentpos1;
                //以25ms的速度每次滚动1.5PX
                $("div[widgetname=REPORT4]").find(".frozen-center")[0].scrollTop = currentpos1 + 1.5;
            }
        }
    }, 25);
}, 1000);
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
编辑 (opens new window)
上次更新: 2023/10/13, 17:39:25
正则表达式应用案例与语法规则
Kettle概述

← Kettle概述→

最近更新
01
牛客网非技术快速入门SQL练习题
 03-08
02
其他日常SQL题
 03-07
03
用户与权限管理
 03-05
更多文章>
Theme by Vdoing | Copyright © 2021-2023 | Weibw | 辽ICP备18015889号