делаю шаг-за-шагом как в документации. Вроде работает.
Теперь хочу сделать свой View на основе Panel-и, куда я
вставил "Menu" (работает) и хотелось бы вот такое "Вью"
(на картинке ) . Что мне надо добавит в код что бы было приблизительно как на картинке? Какои "layout" надо?
Т.е. слева "FieldSet" куда я буду добавлять кнопки и проч , а справа
Grid . Я понимаю, что для "paging"-a мне надо вниз ещё "тулбар" добавить
Ext.define('MyApp.view.ui.mainWindow', {
extend: 'Ext.form.Panel',
height: 773,
width: 727,
layout: {
type: 'absolute'
},
bodyPadding: 10,
preventHeader: true,
initComponent: function() {
var me = this;
Ext.applyIf(me, {
dockedItems: [
{
xtype: 'toolbar',
dock: 'top',
items: [
{
xtype: 'button',
id: 'top_menu_New_Quote',
text: 'New Quote',
menu: {
xtype: 'menu',
items: [
{
xtype: 'menuitem',
id: 'add_prospect_menu',
text: 'Add PR'
},
{
xtype: 'menuitem',
id: 'add_defend_menu',
text: 'Add DE'
},
{
xtype: 'menuitem',
text: 'Add GR'
}
]
}
},
{
xtype: 'button',
id: 'top_menu_Quote_List',
text: 'Quote List',
menu: {
xtype: 'menu',
width: 120,
items: [
{
xtype: 'menuitem',
id: 'print_menu',
text: 'Print'
},
{
xtype: 'menuitem',
id: 'export_to_excel_menu',
text: 'Export to Excel'
}
]
}
}
]
}
],
items: [
{
xtype: 'fieldset',
height: 670,
width: 253,
title: 'My Fields',
items: [
{
xtype: 'textfield',
fieldLabel: 'Label',
anchor: '100%'
}
]
},
{
xtype: 'gridpanel',
height: 650,
width: 410,
title: 'My Grid Panel',
x: 290,
y: 20,
columns: [
{
xtype: 'gridcolumn',
dataIndex: 'string',
text: 'String'
},
{
xtype: 'numbercolumn',
dataIndex: 'number',
text: 'Number'
},
{
xtype: 'datecolumn',
dataIndex: 'date',
text: 'Date'
},
{
xtype: 'booleancolumn',
dataIndex: 'bool',
text: 'Boolean'
}
],
viewConfig: {
}
}
]
});
me.callParent(arguments);
}
});