Vue Pages
Per-resource pages (default)
make:crud generates Index.vue and Form.vue inside a folder named after the resource:
resources/js/pages/Users/Index.vue
resources/js/pages/Users/Form.vue
<!-- Users/Index.vue -->
<script setup lang="ts">
import TableBuilder from '@table-builder/components/TableBuilder.vue'
import type {TableData} from '@table-builder/types/table-builder'
defineProps<{ table: TableData; title: string; createRoute: string }>()
</script>
<template>
<TableBuilder :table="table"/>
</template>
<!-- Users/Form.vue -->
<script setup lang="ts">
import Form from '@form-builder/components/Form.vue'
import type {FormSchema} from '@form-builder/types/form-builder'
defineProps<{ form: FormSchema; title: string }>()
</script>
<template>
<Form :schema="form"/>
</template>
Shared pages
Instead of generating per-resource pages, publish a single pair of Crud/Index.vue and Crud/Form.vue pages and reuse
them across all CRUD resources.
Publish the shared pages once:
php artisan vendor:publish --tag=crud-builder-pages
This copies:
resources/js/pages/Crud/Index.vue
resources/js/pages/Crud/Form.vue
Then set the config so make:crud uses them by default:
// config/vue-crud-builder.php
'pages' => 'shared',
Or pass --shared per command:
php artisan make:crud Product --shared
Choosing the page style
The pages config key controls the default behaviour:
| Value | Behaviour |
|---|---|
per-resource |
Always generate per-resource pages |
shared |
Always use the published shared pages |
ask |
Prompt during make:crud (default) |
Pass --pages or --shared to override the config for a single run.
Delete button on the edit form
Both the shared Crud/Form.vue and generated per-resource Form.vue pages support an optional delete button via the
destroyRoute prop. Pass it from the controller's edit() method:
return Inertia::render('Products/Form', [
'form' => $form,
'title' => 'Edit Product',
'destroyRoute' => route('products.destroy', $product),
]);
The button is only rendered when destroyRoute is present. Two additional optional props control the copy:
| Prop | Default |
|---|---|
destroyLabel |
Remove |
destroyConfirm |
Are you sure you want to delete this record? |
make:crud prompts whether to include this automatically, or pass --destroy to skip the prompt.
