Ext.define("MODIFE.view.administration.Roles",{
    extend: "Ext.panel.Panel",
    xtype: "app-administration-roles",
    controller: "administration-roles",
    viewModel: {
        type: "administration-users"
    },

    title: "Roles",
    items:[
    {
        title: 'Búsqueda de Roles',
        frame: true,
        resizable: true,
        xtype: 'form',
        layout: 'column',

        defaults: {
            layout: 'form',
            xtype: 'container',
            defaultType: 'textfield',
            style: 'width: 50%'
        },

        items: [{
            items: [{
                fieldLabel: 'Rol',
                xtype: 'combobox',
                store: 'Roles',
                displayField: 'Description',
                valueField: 'RoleId',
            }]
        }, {
            items: [
                { fieldLabel: 'Estatus', xtype: 'combobox' },
            ]
        }],

        buttons: [
            { text: 'Nuevo' },
            { text: 'Buscar' }
        ]
    },
    {
        layout: 'fit',
        items: [{
            xtype: 'grid',
            id: 'rolesGrid',
            title: 'Listado de Roles',
            store: 'Roles',
            columns: [
                { text: 'Rol',  dataIndex: 'Description', flex: 2},
                { text: 'Estatus', dataIndex: 'Status', flex: 2},
            ]
        }]
    }]
});