CrudBuilder
The CrudBuilder (tranquil-tools/laravel-vue-crud-builder)
scaffolds complete create, read, update and delete screens on top of this package and the
FormBuilder. This page describes what it does with tables.
The index page it generates is an ordinary table class and TableBuilder component, so everything in these docs
applies to it.
What it adds on top of TableBuilder
TableBuilder turns a table class into a sortable, searchable, paginated list. You still decide which columns to show, write the controller action that builds the table and create the page that renders it. The CrudBuilder does that for you, based on the model's database table:
php artisan make:crud Product --model=App\\Models\\Product
For the list side of a resource, it generates:
- A table class with columns from your database schema.
app/Tables/ProductTable.phpgets a column for every database column exceptpasswordandremember_token, labelled with the headline of the column name. String, numeric, boolean and date columns are sortable; text, JSON and other columns are not. - Global search on the obvious columns. When the table has a
name,title,email,usernameorslugcolumn, the table enables global search on exactly those columns. - Pagination. The query is paginated at 25 rows per page.
- An index action with row links.
index()builds the table and adds a row link to the detail page of each record, plus acreateRoutefor the create button. - An index page.
Products/Index.vuerenders theTableBuildercomponent with a title and a create button. The detail pageProducts/Show.vueshows the record's attributes, and the create/edit form comes from the FormBuilder.
Example
A products table with id, name, description, price and the timestamps results in a table class like this:
class ProductTable extends AbstractTable
{
public function for(): Builder
{
return Product::query();
}
public function configure(TableBuilder $table): void
{
$table
->withGlobalSearch(columns: ['name'])
->column('id', 'ID', sortable: true)
->column('name', 'Name', sortable: true)
->column('description', 'Description')
->column('price', 'Price', sortable: true)
->column('created_at', 'Created At', sortable: true)
->column('updated_at', 'Updated At', sortable: true)
->paginate(25);
}
}
The generated controller passes it to the index page:
public function index(): Response
{
return Inertia::render('Products/Index', [
'table' => ProductTable::build()->rowLink(fn ($row) => route('products.show', $row)),
'title' => 'Products',
'createRoute' => route('products.create'),
]);
}
Without a model, or when the schema cannot be read, the command generates a table with only an id column on an empty
array, which you point at your own data source.
From there you extend the table like any other: add filters, row actions,
bulk actions, totals or a CSV export, and add an authorize() method to
restrict who may see it (see Security).
When to use it
Use the CrudBuilder when a model needs the usual admin screens: a list, a detail page and a form to create and edit records. It saves writing the same table, controller and pages for every resource, and the generated code is yours to change.
Stay with TableBuilder alone for tables that are not a model's CRUD index: a report over an aggregate query, a table
fed by an array or an external API, or a table embedded in another page. make:table gives you
an empty table class for those.
Installation
composer require tranquil-tools/laravel-vue-crud-builder
php artisan crud-builder:install
The CrudBuilder requires this package and the FormBuilder, so Composer installs both. When this package is already in your project, nothing changes for your existing tables.
Read the CrudBuilder documentation for every option of
make:crud, the full schema mapping and the shared Vue pages, or browse the source on
GitHub.
