SigmaGrid为你制作web报表提供了一个新的选择。用SigmaGrid制作报表的优点:
1、可以在浏览器上进行分组聚合运算,充分利用客户端cpu的计算能力。
2、在浏览器上生成分页打印页面,根据程序定义或者用户选择的多种参数进行分页计算,使最终打印出来的报表充分匹配客户端的打印机和纸张类型,使报表更美观。
3、代码编写简单。
4、灵活的二次开发。充分利用js脚本语言的强大功能,让你自如定义分组合计行的内容。
实例为证:
从服务器获得的对象集合:
{period:"07年3月",goods:{id:4,code:"CL004",name:"丝绸面料",unit:"米"},storage:{id:1,name:"原料仓库"},initAmount:60,initMoney:3000,inAmount:150,inMoney:7500,outAmount:200,outMoney:10000,finalAmount:60,finalMoney:3000},
{period:"07年3月",goods:{id:5,code:"CL005",name:"涤纶面料",unit:"米"},storage:{id:1,name:"原料仓库"},initAmount:200,initMoney:2000,inAmount:300,inMoney:3000,outAmount:440,outMoney:4400,finalAmount:200,finalMoney:2000},
{period:"07年3月",goods:{id:6,code:"CL006",name:"丝棉混纺面料",unit:"米"},storage:{id:1,name:"原料仓库"},initAmount:300,initMoney:6000,inAmount:800,inMoney:16000,outAmount:900,outMoney:18000,finalAmount:300,finalMoney:6000},
...
列模型申明:
{name:"period",caption:"会计期",width:60,mode:"string"},
{name:"goods.code",caption:"商品编码",width:80,mode:"string",align:"center"},
{name:"goods.name",caption:"商品名称",width:80,mode:"string"},
{name:"goods.unit",caption:"单位",width:40,mode:"string",align:"center"},
{name:"storage.name",caption:"仓库",width:80,mode:"string"},
{name:"initiatory",caption:"期初",children:[
{name:"initAmount",caption:"数量",width:40,mode:"number",format:"#"},
{name:"initMoney",caption:"金额",width:80,mode:"number",format:"#.000"}
]},
{name:"currentIn",caption:"本期入库",children:[
{name:"inAmount",caption:"数量",width:60,mode:"number",format:"#"},
{name:"inMoney",caption:"金额",width:80,mode:"number",format:"#.000"}
]},
{name:"currentOut",caption:"本期出库",children:[
{name:"outAmount",caption:"数量",width:60,mode:"number",format:"#"},
{name:"outMoney",caption:"金额",width:80,mode:"number",format:"#.000"}
]},
{name:"final",caption:"期末",children:[
{name:"finalAmount",caption:"数量",width:60,mode:"number",format:"#"},
{name:"finalMoney",caption:"金额",width:80,mode:"number",format:"#.000"}
]}
按会计期分组聚合的报表生成代码:
function report1(){
var context = {
sequence:true,checkBox:false,readonly:true,locked:3,sortable:false,
groupBy:{keyName:"period",groupsOrder:{column:"period",order:"asc"},rowsOrder:{column:"goods.name",order:"asc"},aggregate:[{column:"inMoney",exp:"sum"},{column:"outMoney",exp:"sum"},{column:"finalMoney",exp:"sum"}],view:"oThis.rows[0].rowData.p$('period')+'入库金额:'+eval(oThis.values()['inMoney'])+'元,'+oThis.rows[0].rowData.p$('period')+'出库金额:'+eval(oThis.values()['outMoney'])+'元,'+oThis.rows[0].rowData.p$('period')+'余额:'+eval(oThis.values()['finalMoney'])+'元'"},
paintMode:"page"
};
grid = new SigmaGrid("gridbox",context,columns);
grid.bindData(data);
}
效果参见附件1
按仓库分组聚合的报表生成代码:
function report2(){
var context = {
sequence:true,checkBox:false,readonly:true,locked:3,sortable:false,
groupBy:{keyName:"storage.id",groupsOrder:{column:"storage.name",order:"asc"},rowsOrder:{column:"goods.name",order:"asc"},aggregate:[{column:"inMoney",exp:"sum"},{column:"outMoney",exp:"sum"},{column:"finalMoney",exp:"sum"}],view:"oThis.rows[0].rowData.p$('storage.name')+'入库金额:'+eval(oThis.values()['inMoney'])+'元,'+oThis.rows[0].rowData.p$('storage.name')+'出库金额:'+eval(oThis.values()['outMoney'])+'元'"},
paintMode:"page"
};
grid = new SigmaGrid("gridbox",context,columns);
grid.bindData(data);
}
效果参见附件2
从例子中可以看出来,你可以用一个ajax请求获得报表的基本数据,然后用户可以选择各种不同分组聚合模式在客户端生成报表。从而减少网络流量,提供更好的用户体验。
- 大小: 1.4 MB
- 大小: 1.5 MB
分享到:
相关推荐
Sigma grid 最终版本。。。 由纯javascript写成,是一个开源的AJAX数据网格,能滚动和排序显示和内嵌数据编辑功能,是非常强大且易于使用的表格,支持php...不会使用 gt-grid 的同学可以参考 Sigma grid 的源码。。。
sigma grid sigma grid sigma grid sigma gridsigma grid sigma grid sigma grid sigma grid
Sigma Grid ajax动态表格(支持分页、列宽拖动、数据排序).
sigma grid api sigma grid api sigma grid api sigma grid api sigma grid api sigma grid api
sigma_grid/gt_grid的最新使用手册/API/文档,其中包括示例/demos,可以参照学习。
Sigma Grid是一个采用纯javascript开发的Ajax数据表格。特性包括: 1.基于CSS控制外观,内置Classic、Vista、Mac、XP四种风格。(可以自己改变风格哦) 2.提供单元格直接编辑功能,可以自定义编辑器,为单元格设置...
sigma grid API,开发web端使用,表格列表控建api
NULL 博文链接:https://karlhell.iteye.com/blog/454411
通过GridServerHandler类可以直接往前台传送sigma grid需要的数据,只要把此数据放到一个List中,赋给GridServerHandler的data,就可以将数据传给sigma grid。此外此jar包还封装了导出excel,同样将数据放到List中,...
关于sigma grid/gt_grid的最新版使用手册/api文档 英文版 很实用
不错的Grid开发控件,sigma_grid2.4。
sigma_grid/gt_grid的最新使用手册/API/文档,其中包括示例/demos,可以参照学习。
maven构建的,jar包自己找 博文链接:https://matychen.iteye.com/blog/1150279
Sigma Grid实现ajax动态表格(支持分页、列宽拖动、数据排序).zip
内容索引:脚本资源,Ajax/JavaScript,表格,表格排序,分页 Sigma Grid 核心基于javascriptajax,显示样式全部有CSS控制,可自定义多种显示风格,官方提供UI编辑器,支持鼠标拖动列宽、数据行排序,动态分页等功能,可...
Sigma Grid,jquery插件使用及说明文档
sigma_grid_with_csharp 是asp.net开发的demo,展现了丰富的ajax表格样式,用来展现数据
很强大的,包括图表控件,时间控件等,也很漂亮的!
sigma滤波算法 效果不错 下载可以直接使用 使用MATLAB 运行即可