Показать сообщение отдельно
  #1 (permalink)  
Старый 02.01.2016, 00:26
Аватар для GRAF-8269
Интересующийся
Отправить личное сообщение для GRAF-8269 Посмотреть профиль Найти все сообщения от GRAF-8269
 
Регистрация: 31.05.2011
Сообщений: 14

Корректный каркас окна
Всем привет, прошу помощи, так как новичок в работе с ExtJs.
Прошу подсказать как правильно создать каркас окна, так как практически все окна, которые будут - по типу создаваемого.

Ничего сложного, в принципе, однако возникло два вопроса.

app.js
Ext.application({
    name: 'HelloExt',
    launch: function() {
Ext.create('Ext.window.Window', {
    title: 'Сотрудники (version test)',
    height: 400,
    width: 800,
    closable: true,
    border: false,
    plain:true,
                layout: 'border',
			maximizable: true,
			resizable: true,
			maximized: true,
			contrain: true,
			constrainHeader: true,
    items: [{
                    region: 'center',
                    xtype: 'tabpanel',
		    border: false,
                    items: [
{title: 'Группы сотрудников'}, 
{title: 'Список сотрудников', layout: 'border', border: false, items: [{
                    region: 'west',
                    title: 'Navigation',
                    width: 200,
                    split: true,
                    collapsible: true,
                    floatable: false
                }, {
                    region: 'center',
                    //xtype: 'tabpanel',
                    items: [Ext.create('App.views.WorkersListGrid')]
                }]},
{title: 'Сегменты сотрудников'}]
                }]
}).show();
    }
});

var store = Ext.create('Ext.data.ArrayStore', {
    fields: [
       {name: 'user_id'},
       {name: 'user_status'},
       {name: 'user_SN'},
       {name: 'user_login'}], 
    data: [
    [1, 'Worked', 'Ivanov Ivan', 'ivanov'],
]    
});


WorkersListGrid.js
Ext.define('App.views.WorkersListGrid', {
  extend: 'Ext.grid.Panel',
  //defaults:{autoScroll:true},
  layout: 'fit',
  autoHeight: true,
  autoWidth: true,
  border: false,
  //constrainHeader: true,
  store: store,
  columns: [ 
				{text: 'ID', dataIndex: 'user_id', width: 65},
				{text: 'Статус', dataIndex: 'user_status', width: 100},
	  			
				{text: 'Фамилия, имя', dataIndex: 'user_SN', width: 175},
				
				{text: 'Логин', dataIndex: 'user_login', width: 100},
				], 
tbar: [{text: 'Добавить Сотрудника', iconCls: 'plus'}],
bbar: new Ext.PagingToolbar({
            //store: store,
				            defaults:{autoScroll:true},
				autoHeight: true,
			region: 'south',
            pageSize: 4,
            displayInfo: true,
            displayMsg: 'Показано {0} - {1} из {2}',
            emptyMsg: "Нет данных для отображения"
        })
});


Собственно, вопросы:

1) Правильно ли написан код? Почему, спросите Вы, я задаю такой вопрос? Потому что, при смене layout: на 'border' все ломается к чертям.
2) Как растянуть таблицу с данными во весь экран?

0022.png
Ответить с цитированием