JS改写工具栏实现sql分页
本文方案由社区用户提供
1. 概述
1.1 应用场景
内置的分页预览页码参数无法应用于sql中，多数据集实现层式报表 中定义上下页需要在单元格中取数，并且工具栏太简单，缺少了首页、末页、导出等功能（导出仅能导出当前页）。
1.2 实现效果
对整个工具栏重新定义，提供给sql两个参数，当前页码：pageno，每页显示行数：pagesize。点击导出时可以导出所有数据。
2. 示例
2.1创建数据集
新建数据集查询ds1，sql语句如下：
select * from 销量
${if(len(pageno)=0,"","limit "+((pageno-1)*pagesize)+","+pagesize)}
新建数据集查询pagetool，sql语句如下：
select count(1) as totalcnt,
ceiling(count(1)*1.0/${pagesize}) as totalpage
from 销量
注：pagetool这个数据集名称还有totalcnt和totalpage这两个别名不要修改，后面js中需要调用。
2.2 单元格设计
B3单元格中的公式为 ($pageno - 1) * $pagesize + seq()，条件属性为隔行变色。
2.3 模板参数设置
添加两个模板参数
模板参数名称
默认值
pageno
1
pagesize
10
2.4 引入js文件
js代码如下：
var reload=function(param){
FR.ajax({
url:'/webroot/decision/view/report?op=fr_dialog&cmd=parameters_dynamic',
type:'POST',
data:param,
headers: {sessionID:FR.SessionMgr.getSessionID()},
complete:function(res, status){
if(window.FR && FR.Chart && FR.Chart.WebUtils){
FR.Chart.WebUtils.clearCharts(); }
if(window.FR && FR.destroyDialog) {
FR.destroyDialog(); }
_g().loadContentPane();
}
})
}
将其保存为reload.js，并在模板>模板web属性>引用JavaScript处将其导入，如下所示：
2.5 自定义工具栏
打开模板>模板web属性>填报页面设置，选择为该模板单独设置，将默认的工具栏按钮全部清除掉，然后依次添加两个自定义按钮，一个邮件按钮，四个自定义按钮，一个PDF按钮。如下所示：
2.6 设置自定义按钮的属性
第一个自定义按钮重命名为首页，自定义事件如下：
reload({"pageno":1})
第二个自定义按钮重命名为上一页，自定义事件如下：
var pageno = FR.remoteEvaluate("=$pageno");reload({"pageno":pageno-1});
第三个自定义按钮重命名为下一页，自定义事件如下：
var pageno = FR.remoteEvaluate("=$pageno");reload({"pageno":pageno*1+1})
第四个自定义按钮重命名为末页，自定义事件如下：
var totalpage = FR.remoteEvaluate("=value('pagetool',2,1)");reload({"pageno":totalpage});
第五个自定义按钮重命名为导出Excel，自定义事件如下：
var url = "${servletURL}?viewlet=${reportName}&format=excel&pageno=";window.location=encodeURI(encodeURI(url));
第六个自定义按钮重命名为数据总量，无自定义事件。
2.7 添加加载结束事件
代码如下：
setTimeout(function(){
var totalcnt = FR.remoteEvaluate("=value('pagetool',1,1)");
var totalpage = FR.remoteEvaluate("=value('pagetool',2,1)");
var pageno = FR.remoteEvaluate("=$pageno");
var pagesize = FR.remoteEvaluate("=$pagesize");
var currentpageStr = "";
var pagesizeStr = "每页显示条数：";
$("div").replaceWith(currentpageStr);
$("div").replaceWith(pagesizeStr);
$("#currentpage").val(pageno);
$("#currentpage").attr("max",totalpage);
$("#totalpage").text(" / "+totalpage);
$("#pagesize").val(pagesize);
_g().toolbar.options.items.setValue("数据总量："+totalcnt);
$("#currentpage").change(function(){
var val = $(this).val();
if(val <1 || val>totalpage){
$(this).val(pageno);
}else{
reload({"pageno":val})
}
})
$("#pagesize").change(function(){
var val = $(this).val();
if(val <10 || val>100){
$(this).val(pagesize);
}else{
reload({"pagesize":val})
}
})
if(pageno == 1){
_g().toolbar.options.items.setEnable(false);
_g().toolbar.options.items.setEnable(false);
}
if(pageno == totalpage){
_g().toolbar.options.items.setEnable(false);
_g().toolbar.options.items.setEnable(false);
}
},10)
2.8 效果预览
保存报表，选择填报预览，效果如下图所示：
3. 模板下载
注：模板下载后需根据2.4小节引入JS文件
改写工具栏实现sql分页模板.zip (3.46 K)
