锁定老帖子 主题:用SigmaGrid制作报表
精华帖 (0) :: 良好帖 (0) :: 新手帖 (0) :: 隐藏帖 (0)
|
|
---|---|
作者 | 正文 |
发表时间:2007-04-23
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请求获得报表的基本数据,然后用户可以选择各种不同分组聚合模式在客户端生成报表。从而减少网络流量,提供更好的用户体验。 声明:ITeye文章版权属于作者,受法律保护。没有作者书面许可不得转载。
推荐链接
|
|
返回顶楼 | |
发表时间:2007-04-25
看起来挺不错的。
它能够到入到excel或pdf中吗? |
|
返回顶楼 | |
发表时间:2007-04-25
完全是客户端js代码,恐怕没有可能导入到pdf,不过导入excel还是可以的
|
|
返回顶楼 | |
发表时间:2007-05-21
不错 看了一下 但没看明白怎么从一个给定的url取数 类似
var tree = new Tree.TreePanel('tree-div', { animate:true, loader: new Tree.TreeLoader({dataUrl:'get-nodes.php'}), enableDD:true, containerScroll: true }); 于 daraUrl 这样 有明白的吗? |
|
返回顶楼 | |
发表时间:2007-05-21
你这问题和本贴主题可谓十万八千里哦
不过,我可以大致上解释下你的问题. 在你所提到的控件中,TreeLoader能够用xmlhttprequest访问dataurl制订的url,获取其中的数据,并用这些数据填充Tree控件 |
|
返回顶楼 | |
发表时间:2007-05-21
我是想知道 SigmaGrid 是不是也有这个类似的功能 不要看例子 看问题
|
|
返回顶楼 | |
发表时间:2007-05-21
这个功能我有,当然也是根据xmlhttprequest实现的。但这个不属于控件本身的功能,我在SigmaRequest里面实现了类似功能。
在SigmaGrid里面,你可以这样填充数据: request.open("post",url,false); request.onresult = function(){ grid.bindData(request.getValue().data); } request.send(); 这个的实现,比你的例子稍微复杂一些,但对服务器端要求要少一些,你可以在服务器端传回任意命名的一个数组。而你的例子中,传会的对象的命名可能有要求。假如你要用你提到的这种方式命名的话,你提供一个约定的显示的数组的名称,我也是可以帮你实现的。 |
|
返回顶楼 | |
发表时间:2007-05-21
好的 非常感谢
|
|
返回顶楼 | |
发表时间:2007-05-21
不好意思 在顺便问一句 表格里的数据保存时如何提交到后台 action 里面怎么获取数据 谢谢
|
|
返回顶楼 | |
发表时间:2007-05-21
grid.getValue()可以获得表格中所有行对象的数组
也可以用grid.getValue(["col1","col2",...])获得经过属性裁减的所有行对象的数组。 获得值对象数组后,你可以通过xmlhttprequest把数组post到后台,在后台解析json数组,你可以用dwr或者json rpc来实现js对java bean 的远程调用。 |
|
返回顶楼 | |