TableBuilder

# Основы

Поля и декорации в MoonShine используются внутри таблиц в режиме preview.
За таблицы отвечает TableBuilder.
Благодаря TableBuilder таблицы отображаются и наполняются данными.
Вы также можете использовать TableBuilder на собственных страницах или даже вне MoonShine.

TableBuilder::make(
Fields|array $fields = [],
array|Paginator|iterable $items = [],
?Paginator $paginator = null
)
  • $fields - поля,
  • $items - значения полей,
  • $paginator - объект пагинатора.
TableBuilder::make(
[Text::make('Text')],
[['text' => 'Value']]
)

Можно использовать методы:

TableBuilder::make()
->fields([Text::make('Text')])
->items([['text' => 'Value']])

Также доступен helper table():

{!!
table()
->fields([Text::make('Text')])
->items([['text' => 'Value']])
!!}
Text
Value

# Поля

Метод fields() позволяет задать перечень полей для построения таблицы:

TableBuilder::make()
->fields([
Text::make('Text'),
])

# Данные

Метод items() служит для наполнения таблицы данными:

TableBuilder::make()
->fields([Text::make('Text')])
->items([['text' => 'Value']])

Соответствие данных с полями осуществляется через значение column поля!

# Пагинация

Метод paginator для того чтобы таблица работала с пагинацией:

$paginator = Article::paginate();
 
TableBuilder::make()
->fields([Text::make('Text')])
->items($paginator->items())
->paginator($paginator)
Или сразу передать пагинатор:
TableBuilder::make(
items: Article::paginate()
)
->fields([Text::make('Text')])

# Приведение к типу

Метод cast() служит для приведения значений таблицы к определенному типу.
Так как по умолчанию поля работают с примитивными типами:

use MoonShine\TypeCasts\ModelCast;
 
TableBuilder::make(items: User::paginate())
->fields([Text::make('Email')])
->cast(ModelCast::make(User::class))

В этом примере мы привели данные к формату модели User с использованием ModelCast.

За более подробной информацией обратитесь к разделу TypeCasts

# Кнопки

Для добавления новых кнопок на основе ActionButton, воспользуйтесь методом buttons().
Кнопки будут добавляться для каждого row, а при включении режима bulk() отображаться в футере для массовых действий:

TableBuilder::make(items: Article::paginate())
->fields([ID::make(), Switcher::make('Active')])
->cast(ModelCast::make(Article::class))
->buttons([
ActionButton::make('Delete', route('name.delete')),
ActionButton::make('Edit', route('name.edit'))->showInDropdown(),
ActionButton::make('Go to home', route('home'))->blank()->canSee(fn($data) => $data->active),
ActionButton::make('Mass Delete', route('name.mass_delete'))->bulk()
])

# Асинхронный режим

Если необходимо получать данные из таблицы асинхронно (при пагинации, сортировке), то воспользуйтесь методом async():

async(
?string $asyncUrl = null,
string|array|null $asyncEvents = null,
?string $asyncCallback = null
)
  • asyncUrl - url запроса,
  • asyncEvents - вызываемые события после успешного запроса,
  • asyncCallback - js callback функция после получения ответа.
TableBuilder::make()
->async('/async_url')

После успешного запроса, можно вызвать события, добавив параметр asyncEvents.

TableBuilder::make()
->name('crud')
->async(asyncEvents: ['table-updated-crud', 'form-reset-main-form'])

В MoonShine уже есть набор готовых событий:

  • table-updated-{name} - обновление асинхронной таблицы по ее имени,
  • form-reset-{name} - сброс значений формы по ее имени,
  • fragment-updated-{name} - обновление blade fragment по его имени.

Метод async() должен быть после метода name()!

# Атрибуты

Вы можете задать любые html атрибуты для таблицы через метод customAttributes():

TableBuilder::make()
->customAttributes(['class' => 'custom-table'])

Вы можете задать любые html атрибуты для строк и ячеек таблицы:

TableBuilder::make()
->trAttributes(
function(
mixed $data,
int $row,
ComponentAttributeBag $attributes
): ComponentAttributeBag {
return $attributes->merge(['class' => 'bgc-green']);
}
)
Text
Value
TableBuilder::make()
->tdAttributes(
function(
mixed $data,
int $row,
int $cell,
ComponentAttributeBag $attributes
): ComponentAttributeBag {
return $attributes->merge(['class' => 'bgc-red']);
}
)
Text
Value

# Отсутствие элементов

По умолчанию, если у таблицы нет данных, то она будет пустой, но можно вывести сообщение "Пока записей нет".
Для этого воспользуйтесь методом withNotFound():

TableBuilder::make()
->withNotFound()

Пока записей нет

# Упрощённый стиль

По умолчанию таблица стилизована под MoonShine, но с помощью метода simple() можно отобразить таблицу в упрощённом стиле:

TableBuilder::make()
->simple()
Text
Value

# Preview

Метод preview() отключает отображение кнопок и сортировок для таблицы:

TableBuilder::make()
->preview()

# Вертикальный режим

С помощью метода vertical() можно отобразить таблицу в вертикальном режиме:

TableBuilder::make()
->vertical()
Value 1
Value 2

# Добавление записей

С помощью метода creatable() можно создать кнопку "Добавить" для генерации новых записей в таблице:

creatable(
bool $reindex = true,
?int $limit = null,
?string $label = null,
?string $icon = null,
array $attributes = [],
?ActionButton $button = null
)
  • $reindex - режим редактирования с динамическим name,
  • $limit - количество записей которые можно добавить,
  • $label - название кнопки,
  • $icon - иконка у кнопки,
  • $attributes - дополнительные атрибуты,
  • $button - кастомная кнопка добавления.
TableBuilder::make()
->creatable(
icon: 'heroicons.outline.pencil',
attributes: ['class' => 'my-class']
)
->fields([
Text::make('Title'),
Text::make('Text')
])->items([
['title' => 'Value 1', 'text' => 'Value 2'],
['title' => '', 'text' => '']
])
Title Text
Value 1 Value 2

Добавить

В режиме добавления необходимо, чтобы последний элемент был пустым (скелет новой записи)!

reindex

Если в таблице находятся поля в режиме редактирования с динамическим name, то нужно добавить метод или параметр reindex:

TableBuilder::make()
->creatable(reindex: true)

или

TableBuilder::make()
->creatable()
->reindex()
limit

Если требуется ограничить количество записей которые можно добавить, то необходимо указать параметр limit:

TableBuilder::make()
->creatable(limit: 6)
Кастомная кнопка добавления
TableBuilder::make()
->creatable(
button: ActionButton::make('Foo', '#')
)

# Редактируемые записи

По умолчанию поля в таблице отображаются в режиме preview,
но если требуется отобразить их как элементы формы с возможностью редактирования,
то необходимо воспользоваться методом editable():

TableBuilder::make()
->editable()

# Сортируемые записи

Для сортировки строк в таблице воспользуйтесь методом sortable():

sortable(
?string $url = null,
string $key = 'id',
?string $group = null
)
  • $url - url-обработчика,
  • $key - ключ элемента,
  • $group - группировка.
TableBuilder::make()
->sortable(
url: '/update_indexes_endpoint',
key: 'id',
group: 'nested'
)
Title Text
Value 1 Value 2
Value 3 Value 4