Список

Для генерации списка требуется создавать разметку аналогичную в примере (см. Ниже).

• extend: string — наследник. Указывается панель IServ.UI.Classic.ListViewPanel
• xtype: string — наименование компонента. Указывать в нижнем регистре
• extraParams: any — дополнительные параметры при передаче данных на сервер
• toolbarConfig: any — настройки панели. Подробнее ниже
• search: boolean — если указать true, то в панели будет выведено поле для полнотекстового поиска (см. ниже).
• items: any — указывается разметка для списка
• title: string — заголовок списка
• description: string — описание списка
• domainType: string — Не обязательный параметр. Предназначен для указания базового имени объекта для текущего view. Например текущее view имеет имя cs_adapter_listview, а базовое имя будет cs_adapter

Настройки панели

• editable: boolean — разрешен режим редактирования. По умолчанию false
• deletable: boolean — разрешено удаление. По умолчанию false
• creatable: boolean — разрешено создание объекта. По умолчанию false
• paging: boolean — вывести постраничный просмотр. По умолчанию false
• refresh: boolean — вывести кнопку с обновлениями. По умолчанию false
• fullcontroll: boolean — полный доступ. Является не обязательным

Формирование колонок

Колонки формируются стандартным образом, но для применения фильтрации требуется указать дополнительный параметр filter: {type: [имя типа]}, где имя типа может быть:

• string
• int
• bool
• date

Редактирование списка

Список поддерживает три возможности редактирования:

• viewmodel — редактирование при помощи карточки. Используется по умолчанию
• rowmodel — редактирования в строке grid’a
• cellmodel — редактирование в ячейке

Если в параметре editMode будет указано rowmodel или cellmodel, то:

• для колонки требуется указывать дополнительное свойство editor
• в разметке listeners нужно itemdblclick убрать

Пример:

{
    xtype: 'booleancolumn',
    dataIndex: 'allow',
    text: 'Разрешить',
    editor: {
        xtype: 'checkbox'
    },
    filter: {
        type: 'bool'
    }
}

Если колонка является связанным ключом:

{
    xtype: 'fcolumn', // тип колонки
    dataIndex: 'user_id',
    text: 'Пользователь',
    editor: {
        xtype: 'combobox',
        plugins: [{ // выводится кнопка очистить
            ptype: 'clearable'
        }],
        defaultListConfig: {
            minWidth: 400
        },
        store: { // идентификатор хранилища (storeId)
            type: 'users'
        },
        displayField: 'name',
        valueField: 'id',
        queryMode: 'remote',
        pageSize: 25
    },
    filter: {
        type: 'string'
    },
    displayField: 'name',
    valueField: 'id'
}

Пример вывода списка:

Ext.define('ARM.view.CS_Adapter.CS_Adapter-ListView', {
    extend: 'IServ.UI.Classic.ListViewPanel',
    xtype: 'cs_adapter-listview', 
    title: 'CS_Adapter',

    toolbarConfig: {
        refresh: true,
        creatable: true,
        paging: true
    },
    domainType: 'cs_adapter', // можно не указывать
    /**
     * включает компонент для поиска
     */
    search: true,
    extraParams: {}, // тут можно передать параметры и они обратно вернуться при запросе

    items: [{
        xtype: 'listviewgrid',
        store: {
            type: 'cs_adapter', // указывается наименование файла хранилища в нижнем регистре
            autoLoad: false // данный параметр разрешает автозагрузку данных или нет. см. ниже
        },
        editMode: 'viewmodel', // режим редактирования
        detailViewName: 'CS_Adapter-DetailView', // наименование карточки для редактирования
        createDetailViewName: 'CS_Adapter-CreateDetailView', // наименование карточки для создания записи. Если не указывать, то будет применяться detailViewName

        columns: [
            { dataIndex: 'LINK', text: 'Идентификатор', width: 200 },
            {      
                xtype: 'datecolumn',
                dataIndex: 'created', 
                text: 'Дата создания',
                editor: {
                    xtype: 'datefield',
                    format: 'd.m.Y H:i:s'
                },
                filter: {
                    type: 'date'
                },
                format: 'd.m.Y H:i:s'
            },
            {
                dataIndex: 'C_Name', text: 'Наименование',
                filter: {
                    type: 'string'
                },
                width: 300
            },
            {
                dataIndex: 'C_FileName', text: 'Наименование файла без расширения',
                filter: {
                    type: 'string'
                },
                width: 120
            },
            {
                dataIndex: 'C_Note', text: 'Комментарий',
                flex: 1,
                filter: {
                    type: 'string'
                }
            },
            {
                dataIndex: 'C_Const', text: 'Константа',
                filter: {
                    type: 'string'
                },
                width: 120
            }
        ],

        listeners: {
            itemdblclick: 'onItemDbClick' // предназначен для привязки события двойного нажатия на строку. Нужен для перехода в режим редактирования
        }
    }]
});

При настройке хранилища есть возможность подгруздки данных сразу или по требованию. Для этого есть свойство autoLoad:true|false

{
    ...
    store: {
        type: 'storeId',
        autoLoad: true
    }
    ...
}

Полнотекстовый поиск

Поиск осуществляется при вводе данные в строку поиска. Формат передачи данных на сервер:

[{
    property: 'fulltext',
    operator: 'fulltext',
    value: 'value'
}]