MyGridView = Ext.extend(Ext.grid.GridView, {
renderHeaders : function() {
var cm = this.cm, ts = this.templates;
var ct = ts.hcell, ct2 = ts.mhcell,ctm=ts.mhcellm;
var cb = [], sb = [], p = {}, mcb = [],mcbm=[];
for (var i = 0, len = cm.getColumnCount(); i < len; i++) {
p.id = cm.getColumnId(i);
p.value = cm.getColumnHeader(i) || "";
p.style = this.getColumnStyle(i, true);
if (cm.config[i].align == 'right') {
p.istyle = 'padding-right:16px';
}
cb[cb.length] = ct.apply(p);
if (cm.config[i].mtext)
mcb[mcb.length] = ct2.apply({
value : cm.config[i].mtext,
mcols : cm.config[i].mcol,
mwidth : cm.config[i].mwidth
});
if (cm.config[i].mtext)
mcbm[mcbm.length] = ctm.apply({
valuem : cm.config[i].mtextm,
mcolsm : cm.config[i].mcolm,
mwidthm : cm.config[i].mwidthm
});
}
var s = ts.header.apply({
cells : cb.join(""),//顯示字段
tstyle : 'width:' + this.getTotalWidth() + ';',
mergecells : mcb.join("")//,
// mergecellsm : mcbm.join("")
});
var ss = ts.headerm.apply({
// cells : cb.join(""),//顯示字段
tstyle : 'width:' + this.getTotalWidth() + ';',
// mergecells : mcb.join(""),
mergecellsm : mcbm.join("")
});
return ss+s;
}
});
viewConfig = {
templates : {
headerm : new Ext.Template(
' <table border="0" cellspacing="0" cellpadding="0" style="{tstyle}">',
' <thead> <tr class="x-grid3-hd-row">{mergecellsm} </tr>'
+ ' </thead>',
" </table>"),
header : new Ext.Template(
' <table border="0" cellspacing="0" cellpadding="0" style="{tstyle}">',
' <thead> <tr class="x-grid3-hd-row">{mergecells} </tr>'
+ ' <tr class="x-grid3-hd-row">{cells} </tr> </thead>',
" </table>"),
mhcellm : new Ext.Template(
' <td class="x-grid3-header" colspan="{mcolsm}" style="width:{mwidthm}px;"> <div align="center">{valuem}</div>',
" </td>"),
mhcell : new Ext.Template(
' <td class="x-grid3-header" colspan="{mcols}" style="width:{mwidth}px;"> <div align="center">{value}</div>',
" </td>")
}
};
Ext.onReady(function(){
var record=new Ext.data.Record.create([
{name:'deptcoding'},//部門編號
{name:'plantime'},//計劃時間
{name:'motorcyclename'},//車型名
{name:'motorcycleid'},//車型id
{name:'vehiclecode'},//車輛編號
{name:'daxiu'},//車輛大修
{name:'zhongxiu'},//車輛中修
{name:'fadongji'},//發動機
{name:'qita'},
{name:'xiaoxiu'},//車輛小修
{name:'daxiua'},//車輛大修
{name:'zhongxiua'},//車輛中修
{name:'fadongjia'},//發動機
{name:'qitaa'},
{name:'xiaoxiua'}//車輛小修
]);
var myPageSize=10;
var store = new Ext.data.Store({
proxy : new Ext.data.HttpProxy({
url : "carservice/!.action"//路徑
}),
reader : new Ext.data.JsonReader({
totalProperty : 'totalProperty',//一共有totalPrpperty條數據
root : 'root'//存儲後臺數據
}, record),
baseParams : {
start : 0,
limit : myPageSize
},
listeners:{
beforeload: function(store,options ) {
Ext.apply(store.baseParams,{
});
}
}
});
var cm=new Ext.grid.ColumnModel([
{
mtextm :" ",
mtext : " ",
mcolm : 1,
mcol : 1,
mwidthm : 50,
mwidth : 50,
width : 50,
header : "<div align='center'>車型名</div>",
dataIndex : "motorcyclename"
},{
mtextm :"年度修理任務（輛）" ,
mtext : " ",
mcolm : 5,
mcol : 1,
mwidthm : 250,
mwidth : 50,
width : 50,
header : "<div align='center'>車輛大修</div>",
dataIndex : "daxiu"
},{
mtext : " ",
mcol : 1,
mwidth : 50,
width : 50,
header : "<div align='center'>車輛中修</div>",
dataIndex : "zhongxiu"
},{
mtext : "總成",
mcol : 2,
mwidth : 100,
width : 50,
header : "<div align='center'>發動機</div>",
dataIndex : "fadongji"
},{
width : 50,
header : "<div align='center'>其它</div>",
dataIndex : "qita"
},{
mtext : " ",
mcol : 1,
mwidth : 50,
width : 50,
header : "<div align='center'>車輛小修</div>",
dataIndex : "xiaoxiu"
},{
mtextm : " ",
mtext : " ",
mcolm : 1,
mcol : 1,
mwidthm : 150,
mwidth : 150,
width : 150,
header : "<div align='center'>車輛總行駛里程<br />sa1（公里）</div>",
dataIndex : "sa1"
},{
mtextm : " ",
mtext : " ",
mcolm : 1,
mcol : 1,
mwidthm : 100,
mwidth : 100,
width : 100,
header : "<div align='center'>下年度車公里<br />保障預算L</div>",
dataIndex : "l"
},{
mtextm : " ",
mtext : " ",
mcolm : 1,
mcol : 1,
mwidthm : 130,
mwidth : 130,
width : 130,
header : "<div align='center'>下年度車輛總行駛里程<br />預算SA2（公里）</div>",
dataIndex : "sa2"
},{
mtextm : "下年度車輛修理需求預算（臺次）",
mtext : " ",
mcolm : 12,
mcol : 1,
mwidthm : 960,
mwidth : 80,
width : 80,
header : "<div align='center'>車輛大修</div>",
dataIndex : "daxiu"
},{
mtext : " ",
mcol : 1,
mwidth : 80,
width : 80,
header : "<div align='center'>車輛中修</div>",
dataIndex : "zhongxiu"
}, {
mtext : "總成",
mcol : 9,
mwidth : 720,
width : 80,
header : "<div align='center'>發動機</div>",
dataIndex : "fadongji"
},{
width : 80,
header : "<div align='center'>變速器</div>",
dataIndex : "biansuqi"
},{
width : 80,
header : "<div align='center'>前橋</div>",
dataIndex : "qianqiao"
},{
width : 80,
header : "<div align='center'>後橋</div>",
dataIndex : "houqiao"
},{
width : 80,
header : "<div align='center'>車架</div>",
dataIndex : "chejia"
},{
width : 80,
header : "<div align='center'>車身</div>",
dataIndex : "chesheng"
},{
width : 80,
header : "<div align='center'>轉向系統</div>",
dataIndex : "zxxt"
},{
width : 80,
header : "<div align='center'>制動系統</div>",
dataIndex : "zdxt"
},{
width : 80,
header : "<div align='center'>電氣系統</div>",
dataIndex : "dqxt"
},{
mtext : " ",
mcol : 1,
mwidth : 80,
width : 80,
header : "<div align='center'>車輛小修</div>",
dataIndex : "xiaoxiu"
}
]);
var grid = new Ext.grid.GridPanel({
region:'center',
frame:true,
title:"車輛維修年度任務",
loadMask:true,
autoWidth:true,
viewConfig:{
forceFit:true
},
height:500,
cm:cm,
store:store,
view:new MyGridView(viewConfig),
bbar:new Ext.PagingToolbar({
pageSize:myPageSize,
store:store,
displayInfo:true,
displayMsg:'顯示第{0}條到{1}條記錄，一共{2}條',
emptyMsg:"沒有記錄"
}),
buttonAlign:'left',
buttons:[{text:'上報',handler:onReport}]
});
function onReport()
{
var record=grid.getStore().getAt(0);
var jsonArray = [];
if(record==null)
{
Ext.Msg.alert('提示','無信息上報！');
return;
}
jsonArray.push(record.data);
data=Ext.encode(jsonArray);
Ext.Ajax.request({
url:'carservice/!.action',
params:'json='+data,
customer:'字定義屬性',
method:'post',
callback:function(options,success,response)
{
var bo=response.responseText;
if(success)
{
Ext.Msg.alert('提示',bo);
}else
{
Ext.Msg.alert('錯誤',"請聯繫管理員!");
}
}
});
};
//查詢
var ptstore = new Ext.data.Store({
proxy: new Ext.data.HttpProxy({url: "carservice/Plan!Yeararray.action"}),
reader: new Ext.data.JsonReader({
root: 'root'
},[
{name: 'timedisplay'},
{name: 'timevalue'}
])
});
// ptstore.load();
var plantime=new Ext.form.ComboBox({//下拉框
fieldLabel:'計劃時間',
triggerAction:'all', // 單擊觸發按鈕顯示全部數據
store:ptstore, //設置數據源
displayField:'timedisplay', //定義要顯示的字段
valueField:'timevalue', //定義值字段
mode:'local', //本地模式
width:100,
allowBlank:false,
blankText:'計劃時間必選！',
forceSelection:true, //要求輸入值必須在列表中存在
resizable:false, //允許改變下拉列表的大小
typeAhead:true,// 允許自動選擇匹配的剩餘部分文本
emptyText:'請選擇',
handleHeight:10//下拉列表中拖動手柄的高度
});
var cxstore = new Ext.data.Store({
proxy: new Ext.data.HttpProxy({url: "carservice/Motorcycle!MotorcycleAll.action"}),
reader: new Ext.data.JsonReader({
root: 'root'
},[
{name: 'motorcyclename',type:'string'},
{name: 'motorcycleid',type:'string'}
])
});
// cxstore.load();
var cxing=new Ext.form.ComboBox({//下拉框
fieldLabel:'車型',
triggerAction:'all', // 單擊觸發按鈕顯示全部數據
store:cxstore, //設置數據源
displayField:'motorcyclename', //定義要顯示的字段
valueField:'motorcycleid', //定義值字段
mode:'local', //本地模式
width:100,
forceSelection:true, //要求輸入值必須在列表中存在
resizable:false, //允許改變下拉列表的大小
typeAhead:true,// 允許自動選擇匹配的剩餘部分文本
emptyText:'請選擇',
handleHeight:10//下拉列表中拖動手柄的高度
});
var form=new Ext.form.FormPanel({
region:'north',
height:145,
labelAlign:'right',
frame:true,
items:[{
xtype: 'fieldset',
layout:'column',
title: '選擇條件',
items:[
{
layout:'column',
items:[{
layout: 'form',
columnWidth: .50,
labelWidth: 80,
items: [plantime]
},{
layout: 'form',
columnWidth: .50,
labelWidth: 50,
items: [cxing]
}]
}]
}],
buttonAlign:'left',
buttons:[{text:'查 詢',width:70,handler:onSelectClick},{text:'重 置',width:70,handler:function(){form.getForm().reset();}}]
});
var plantime_s,motorcycleid_s;
function onSelectClick()
{
if(!form.getForm().isValid())
{
return;
}
plantime_s=''+plantime.getValue();
motorcycleid_s=''+cxing.getValue();
store.load();
}
var viewport=new Ext.Viewport({
layout:'border',
items:[form,grid]
});
});
