代码如下:
Ext.namespace('app.ux')
app.ux.PrintBoard=Ext.extend(Ext.util.Observable,{
store:null,
title:null,
printBoard:null,
fields:null,
constructor:function(config){
Ext.apply(this,config);
// app.ux.PrintBoard.superclass.constructor.call(this);
},
init:function(container){
container.render=container.render.createSequence(function(){
},this);
},
initPrintBoard:function(){
var layer=new Ext.Layer({
dh:{
tag:'div',
id:'printBoard'
},
zindex:100000
});
this.printBoard=new Ext.Window({
viewConfig:{
forceFit:true
},
renderTo:'printBoard',
height:400,
width:500
// width:500,
// height:400
});
layer.setX(300);
layer.setY(200);
this.printBoard.show();
layer.show();
},
draw:function(drawer,append){
drawer.draw(this.printBoard,append);
this.printBoard.doLayout();
},
setXField:function(xField){
this.xField=xField;
},
setXDdisplayName:function(xDisplayName){
this.xDisplayName=xDisplayName;
},
setYDisplayName:function(yDisplayName){
this.yDisplayName=yDisplayName;
},
setYField:function(yField){
this.yField=yField;
}
});///////////////////drawer definition////////////////////////////
app.ux.Drawer=Ext.extend(Ext.util.Observable,{
initStore:function(){
},
constructor:function(config){
Ext.apply(this,config)
app.ux.Drawer.superclass.constructor.call(this);
},
draw:function(printBoard,append){
if(append==undefined||append==false){
// printBoard.removeAll();
}
},
setTitle:function(title){
}
});
解决方案 »
- jquery EasyUI有没有groupgrid控件
- 好心的大哥帮忙用js写个自适应高度div
- 高手请进:如何把VML矢量图保存为JPG(VML矢理图是否可以导入EXCEL;如何导?)
- JS验证闰年
- 如何强制输入框种输入的数值为一个数的倍数
- 请教关于Textarea的问题
- 酷六视频直播间是怎么实现的?
- 求一个不断重复提交同一表单的程序——在线等
- 如何实现在IFRAME里粘贴时,粘贴在当前光标所在位置?
- 一个页面两个frame:a1,a2.a1中有个iframe:if2。现要在if2中点击超链接,在a2中显示。怎么写javascript
- JScript 应用 疑问
- js中函数递归调用,提示processHover,processLeave未定义
//////////////////////implement of Drawer////////////////////////////////
app.ux.ChartDrawer=function(config){
Ext.apply(this,config);
app.ux.ChartDrawer.superclass.constructor.call(this);
}
Ext.extend(app.ux.ChartDrawer,app.ux.Drawer)
app.ux.ChartDrawer.prototype={
xField:null,
yField1:null,
yDisplayName:null,
store:null,
condition:'*:*',
searchField:'brand',
initStore:function(){
this.store= new app.ux.AggregateStore({
// autoLoad:true,
summaryField:this.yField,
sortInfo:{
field:this.xField,
direction:'ASC'
},
url:'RecordLoader',
groupField:this.xField,
reader:new Ext.data.JsonReader({
idProperty:'sequenceNumber',
root:'data',
fields:['sequenceNumber',
'brand',{
name:'quantity',
type:'int'
},{
name:'total',
type:'float'
},'code',{
name:'salePrice',
type:'float'
},{
name:'price',
type:'float'
},{
name:'profit',
type:'float'
}]
}),
baseParams:{
start:0,
limit:50,
data:Ext.encode({
condition:this.condition,
fields:this.searchField,
target:'detail',
relative:'detail_fields'
})
}
})
},
draw:function(printBoard,append){
this.initStore();
app.ux.ChartDrawer.superclass.draw.call(printBoard.append);
printBoard.add({
xtype: 'columnchart',
store:this.store,
url:'ExtPacket/images/chart/charts.swf',
xField: this.xField,
yAxis: new Ext.chart.NumericAxis({
title:this.yDisplayName,
labelRenderer : Ext.util.Format.numberRenderer('0,000.00')
}),
xAxis: new Ext.chart.CategoryAxis({
title: '产品代号'
}),
tipRenderer : function(chart, record, index, series){
if(series.yField == 'quantity'){
return record.data[this.xField]+' 销售总数为:'+Ext.util.Format.number(record.data.quantity, '0,0');
}else if(series.yField == 'total'){
return record.data[this.xField]+' 销售总额为:'+Ext.util.Format.number(record.data.total, '0,000.00');
}else if(series.yField=='profit'){
return record.data[this.xField]+' 利润为:'+Ext.util.Format.number(record.data.profit, '0,000.00');
}
},
chartStyle: {
padding: 10,
animationEnabled: true,
font: {
name: 'Tahoma',
color: 0x444444,
size: 11
},
dataTip: {
padding: 5,
border: {
color: 0x99bbe8,
size:1
},
background: {
color: 0xDAE7F6,
alpha: .9
},
font: {
name: 'Tahoma',
color: 0x15428B,
size: 10,
bold: true
}
},
xAxis: {
color: 0x69aBc8,
majorTicks: {
color: 0x69aBc8,
length: 4
},
minorTicks: {
color: 0x69aBc8,
length: 2
},
majorGridLines: {
size: 1,
color: 0xeeeeee
}
},
yAxis: {
color: 0x69aBc8,
majorTicks: {
color: 0x69aBc8,
length: 4
},
minorTicks: {
color: 0x69aBc8,
length: 2
},
majorGridLines: {
size: 1,
color: 0xdfe8f6
}
}
},
series: [{
type: 'column',
displayName: '销售数量',
yField: this.yField,
style: {
image:'ExtPacket/images/chart/bar.gif',
mode: 'stretch',
color:0x99BBE8
}
},{
type:'line',
displayName: '销售总金额',
yField: this.yField1,
style: {
color: 0x15cc8B
}
},,{
type:'line',
title: '销售总金额',
yField: 'profit',
style: {
color: 0xff0000
}
}]
});
this.store.load();
},
setTitle:function(title){
this.title=title;
},
grouper:function(){
this.localStore.load();
},
zip:function(store,rec){
rec.data.total=this.store.sum(this.yField);
rec.data.quantity=this.store.sum(this.yField1)
}
}
app.ux.AggregateStore=Ext.extend(Ext.data.GroupingStore,{
summaryField:null,
constructor:function(config){
Ext.apply(this,config);
app.ux.AggregateStore.superclass.constructor.call(this);
this.on('load',this.aggregate,this);
},
aggregate:function(){
var rec=null;
this.each(function(record){
if(rec==null||rec.data[this.groupField]!=record.data[this.groupField]){
if(record.data.salePrice==undefined||record.data.salePrice==0){
record.data.salePrice=record.data.price;
}
record.data.profit=(record.data.salePrice-record.data.price)*record.data.quantity;
rec=record;
return;
}
if(rec.data[this.groupField]==record.data[this.groupField]){
var currentTotal=record.data.total;
record.data[this.summaryField]+=rec.data[this.summaryField];
record.data.quantity+=rec.data.quantity;
record.data.profit=(record.data.salePrice-record.data.price)*record.data.quantity;
record.data.profit+=rec.data.profit;
this.remove(rec);
// alert('当前记录的总额:'+currentTotal+'上一条记录累加至:'+rec.data.total+' 当前记录累加至:'+record.data.total);
rec=record;
}
},this);
// this.commitChanges();
}
})
Ext.onReady(function(){
//////////////////////////
var board=new app.ux.PrintBoard();
board.initPrintBoard();
var drawer=new app.ux.ChartDrawer({
fields:['brand','total','quantity'],
group:'code',
xField:'code',
yField:'total',
yField1:'quantity',
yDisplayName:'数量',
yDisplayName1:'总额'
});
board.draw(drawer,true);
/////////////////////////////////////
})