Skip to main content

Описание

Определение​

Списки (Grids) — это динамический элемент системы позволяющий генерировать и выводить таблицы с данными в реальном времени. Что в свою очередь позволяет работать и управлять большим кол-вом данных и создавать места взаимодействия с данными на страницах модулей.

Принципы​

  • ...
  • ...

Правила​

  • ...
  • ...

Структура папок​

Путь до контроллера генерации таблицы

   - usr
      - modules
          - {module-name}
               - UI
                    - WEB
                        - Grids
                            - GridControllerName.php
                            - ...

Путь до шаблона действий с элементом таблицы

   - usr
      - modules
          - {module-name}
               - UI
                    - WEB
                        - Views
                            - manager
                                - grid
                                    - actions.blade.php

Основы использования​

use Boot\System\Grid\GridModern;

protected function init()
{

// Заголовок таблицы
$this->title = 'Заголовок таблицы';

// Опции таблицы (в данном случае сортировка)
$this->options = array(
    'sort_name' => 'numb',
    'sort_order' => 'DESC',
);

// Опции панели навигации
$this->nav = array(
    'excel' => true,
    'exceltext' => __('grid.export.excel'),
    'trash' => true,
    'trashtype' => 'null',
    'trashtext' => __('grid.trash.show'),
    'trashfield' => $this->namespace . '.deleted_at',
);

// Подключение к необходимой таблице
$this->db = DB::table('Имя необходимой таблицы в БД');

// Настройка столбцов
$this->cols = array(
    'Идентификатор столбца' => array(
        ...
    ),
    ...
);

}

Параметры массива default

Путь к файлу config: Папка проекта/config/grid.config.php
Массив default собрал в себе все значения заданные по умолчанию для работы с компонентом Grid.

Список параметров (col)​

Определяет работу со столбцами в таблице

Совет

Типы полей используется как фильтры для формирования значений по умолчанию.
Доступные типы input, select, date_range, actions

title​

Заголовок столбца таблицы

'Имя столбца' => array(
    'title' => 'Ваш заголовок для столбца',
    ...
),

# По умолчанию title => '';

type (WIP)​

Параметр type определяет тип столбца таблицы. Используется для формирования полей поиска и сортировки со всеми привязанными параметрами к данному типу поля.

'Имя столбца' => array(
    'type' => 'Тип вашего поля',
    ...
),

# По умолчанию type => 'input';

label (WIP)​

Параметр label используется для выбора текста placeholder по умолчанию и основан на типах поддерживаемых полей ввода и выбора.

Для того что бы задать текст label необходимо указать тип поля через параметр type используя значения input, select, date_range,actions или задать label в ручную.

Добавляя свои типы в файл grid.config.php можно добавлять или изменять значения текста для label.
Если type задан то по умолчанию для label будет использован тип поля указанного в type.
Если задан type и label будет использовано значение указанное в label игнорируя type.
Если type не задан то по умолчанию для label будет использован тип поля input. 

'Имя столбца' => array(
    'type' => 'Тип вашего поля',
    ...
    # или
    'label' => 'Тект вашего Label',
    ...
),

# По умолчанию по типам
'input' => 'Найти',
'select' => 'Выбрать',
'date_range' => 'Выбрать дату',
'actions' => 'Действия',

render (WIP)​

Параметр render определяет каким образом обернуть выводимые данные в полях таблицы. К примеру для очень длинного текста, что-бы избежать чрезмерного "растягивания" одного из столбцов таблицы можно использовать render = text что создает обертку для выводимого значения скрывающую часть текста который выходить за ширины самого столбца за "..."

simple - Выводимый текст внутри простого блока div.render без скрытия.
input - Выводимый текст будет помещен в тег input что в свою очередь скроет текст внутри себя.
text - Текст будет скрыт через text-truncate (bootstrap) внутри div.render блока.

Для render можно использовать tooltip что бы увидеть весь текст во всплывающей подсказке. Пока только для вывода текста.

'Имя столбца' => array(
    'render' => 'Тип render',
    ...
),

# По умолчанию по типам
# 'render' => 'default'

db​


db_agg​


unset​


replace​


formatter​


format_date​

Параметр format_date может быть использован для полей с type date_range в качестве шаблона формата даты.

'Имя столбца' => array(
    'format_date' => 'Формат даты в формате d.m.Y',
    ...
),

# По умолчанию по типам (Задается в config файле grid.config.php)
# 'date_range' => 'd.m.Y'

manual​


visible​

Параметр visible определяет видимость столбца.

'Имя столбца' => array(
    'visible' => bool, // true || false
    ...
),

# По умолчанию 
'visible' => true

sortable​


editable​



search_op​


other​


tooltip (WIP)​

Подсказки для полей с render.

Совет

Не используйте tooltip вместе с render если выводится теги html. Только для обычного текста!
Для html используйте popover.

'Имя столбца' => array(
    'render' => 'Тип render',
    'tooltip' => true,
    ...
),

# По умолчанию 
'tooltip' => null

popover (WIP)​

Всплывающие окна для полей с render. Является более универсальным способом вывода уведомлений.

Совет

Используйте popover вместе с render если выводится теги html.

'Имя столбца' => array(
    'render' => 'Тип render',
    'popover' => true,
    ...
),

# По умолчанию 
'popover' => null

width​

Ширина столбца. Указывается в процентах.

'Имя столбца' => array(
    'width' => '5%',
    ...
),

# По умолчанию 
'width' => true

classes​


className​

Дополнительные стили css применяемые к столбцу.

'Имя столбца' => array(
    'className' => 'css Классы как для атребута class', // text-center p-1 и тд.
    ...
),

По умолчанию 
'className' => false

icon​

Параметр icon задает иконку для типа поля по умолчанию. Иконки можно задать передав в icon значение иконки равное набору иконок feather или указать свой css класс наборов подключенных через css. 

'Имя столбца' => array(
    'type' => 'Тип вашего поля',
    # или
    'icon' => 'settings', // набор feather
    # или
    'icon' => 'fa-light fa-users', // набор Font Awesome
    ...
),

# По умолчанию по типам
# 'actions' => 'settings'

null​


encode​


excel_hidden​


excel_only​


Список параметров (nav)​

export​


export.detail​


Список параметров (options)​

...


Список параметров (reserved_col_names)​

...​


Примеры кода​

class GridControllerName extends GridModern
{
    
}