我现在要做一个页面,如图
可是中间的那一排按钮.我添加不上去了. 第一次使用EXT.. 麻烦各位大神帮忙看看.
// 流程配置管理信息添加
Ext.define('App.WorkFlowConfigurationWindow', {
extend : 'Ext.window.Window',
constructor : function(config) {
config = config || {};
Ext.apply(config, {
title : '流程配置管理信息',
width : 350,
height : 250,
bodyPadding : '10 5',
layout : 'fit',
modal : true,
items : [ {
xtype : 'form',
fieldDefaults : {
labelAlign : 'left',
labelWidth : 90,
anchor : '100%'
},
items : [ {
xtype : 'textfield',
name : 'orderNumber',
fieldLabel : '序号'
}, {
xtype : 'textfield',
name : 'workFlowName',
fieldLabel : '流程名称'
}, {
xtype : 'textfield',
name : 'sourceApplicationSystem',
fieldLabel : '源应用系统'
}, {
xtype : 'textfield',
name : 'sourceDataSource',
fieldLabel : '源数据源'
}, {
xtype : 'textfield',
fieldLabel : '目标系统',
name : 'targetSystem'
} ,{
xtype : 'textfield',
fieldLabel : '目标数据源',
name : 'targetDateSource'
},{
xtype : 'textfield',
fieldLabel : '状态',
name : 'status'
}],
buttons : [ '->', {
text : '确定',
iconCls : 'icon-accept',
width : 80,
handler : function() {
this.up('window').close();
}
}, '->' ]
} ]
});
App.WorkFlowConfigurationWindow.superclass.constructor.call(this, config);
}
});
Ext.define('Forestry.app.forestryMonitor.ForestryAlarm', {
extend : 'Ext.grid.Panel',
plain : true,
border : true,
region : 'center',
split : true,
initComponent : function() {
var me = this;
var forestryTypeNameStore = Ext.create('Ext.data.JsonStore', {
proxy : {
type : 'ajax',
url : appBaseUri + '',
reader : {
type : 'json',
root : 'list',
idProperty : 'ItemValue'
}
},
fields : [ 'ItemText', 'ItemValue' ]
});
Ext.define('ModelList', {
extend : 'Ext.data.Model',
idProperty : 'id',
fields : ['orderNumber', 'workFlowName','sourceApplicationSystem','sourceDataSource','targetSystem','targetDateSource','status' ]
});
var workFlowQueryStore = Ext.create('Ext.data.Store', {
model : 'ModelList',
// autoDestroy: true,
autoLoad : true,
remoteSort : true,
pageSize : globalPageSize,
proxy : {
type : 'ajax',
url : appBaseUri + '/changeservice/workFlowConfiguration/searchWorkFlowConfiguration',
extraParams : me.extraParams || null,
reader : {
type : 'json',
root : 'data',
totalProperty : 'totalRecord',
successProperty : "success"
}
},
sorters : [ {
property : 'orderNumber',
direction : 'DESC'
} ]
});
var columns = [ {
text : "序号",
dataIndex : 'orderNumber',
width : '5%'
}, {
text : "流程名称1",
dataIndex : 'workFlowName',
width : '10%'
}, {
text : "源应用系统",
dataIndex : 'sourceApplicationSystem',
width : '17%'
}, {
text : "源数据源",
dataIndex : 'sourceDataSource',
width : '17%'
}, {
text : "目标系统",
dataIndex : 'targetSystem',
width : '10%',
}, {
text : "目标数据源",
dataIndex : 'targetDateSource',
width : '17%',
}, {
text : "状态",
dataIndex : 'status',
width : '5%',
} ];
var ttoolbar = Ext.create('Ext.toolbar.Toolbar', {
items : [ {
xtype : 'textfield',
id : 'workFlowConfiguration-workFlowName',
name : 'workFlowName',
fieldLabel : '流程名称',
labelWidth : 30,
width : '15%'
}, {
xtype : 'textfield',
id : 'workFlowConfiguration-sourceApplicationSystem',
name : 'sourceApplicationSystem',
fieldLabel : '源应用系统',
labelWidth : 30,
width : '15%'
}, {
xtype : 'textfield',
id : 'workFlowConfiguration-sourceDataSource',
name : 'sourceDataSource',
fieldLabel : '源数据源',
labelWidth : 30,
width : '15%'
}, {
xtype : 'textfield',
id : 'workFlowConfiguration-targetSystem',
name : 'targetSystem',
fieldLabel : '目标系统',
labelWidth : 30,
width : '15%'
}, {
xtype : 'textfield',
id : 'workFlowConfiguration-targetDateSource',
name : 'targetDateSource',
fieldLabel : '目标数据源',
labelWidth : 30,
width : '15%'
}, {
xtype : 'combobox',
fieldLabel : '状态',
id : 'workFlowConfiguration-status',
name : 'status',
store : status,
valueField : 'ItemValue',
displayField : 'ItemText',
typeAhead : true,
queryMode : 'remote',
emptyText : '请选择...',
editable : false,
labelWidth : 30,
width : '15%',
maxWidth : 320
}, {
xtype : 'button',
text : '查询',
iconCls : 'icon-search',
width : '10%',
maxWidth : 60,
handler : function(btn, eventObj) {
var searchParams = {
workFlowName : Ext.getCmp('workFlowConfiguration-workFlowName').getValue(),
sourceApplicationSystem : Ext.getCmp('workFlowConfiguration-sourceApplicationSystem').getValue(),
sourceDataSource : Ext.getCmp('workFlowConfiguration-sourceDataSource').getValue(),
targetSystem : Ext.getCmp('workFlowConfiguration-targetSystem').getValue(),
targetDateSource : Ext.getCmp('workFlowConfiguration-targetDateSource').getValue(),
status : Ext.getCmp('workFlowConfiguration-status').getValue()
};
Ext.apply(workFlowQueryStore.proxy.extraParams, searchParams);
workFlowQueryStore.reload();
}
}, {
xtype : 'button',
text : '重置',
iconCls : 'icon-reset',
width : '10%',
maxWidth : 60,
handler : function(btn, eventObj) {
Ext.getCmp('workFlowConfiguration-workFlowName').setValue(null);
Ext.getCmp('workFlowConfiguration-sourceApplicationSystem').setValue(null);
Ext.getCmp('workFlowConfiguration-sourceDataSource').setValue(null);
Ext.getCmp('workFlowConfiguration-targetSystem').setValue(null);
Ext.getCmp('workFlowConfiguration-targetDateSource').setValue(null);
Ext.getCmp('workFlowConfiguration-status').setValue(null);
}
}]
});
Ext.apply(this, {
store : workFlowQueryStore,
columns : columns,
selModel : Ext.create('Ext.selection.CheckboxModel'),
tbar : ttoolbar,
bbar : Ext.create('Ext.PagingToolbar', {
store : workFlowQueryStore,
displayInfo : true
}),
listeners : {
itemdblclick : function(dataview, record, item, index, e) {
var grid = this;
var id = grid.getSelectionModel().getSelection()[0].get('id');
var gridRecord = grid.getStore().findRecord('id', id);
var win = new App.WorkFlowConfigurationWindow({
hidden : true
});
var form = win.down('form').getForm();
form.loadRecord(gridRecord);
form.findField('workFlowName').setReadOnly(true);
form.findField('sourceApplicationSystem').setReadOnly(true);
form.findField('sourceDataSource').setReadOnly(true);
form.findField('targetSystem').setReadOnly(true);
form.findField('targetDateSource').setReadOnly(true);
form.findField('status').setReadOnly(true);
win.show();
}
}
});
forestryTypeNameStore.loadPage(1);
this.callParent(arguments);
}
});
麻烦各位了大神, 很着急.....
