Integrarea Filament cu Livewire pentru un admin panel modern

Sumar

1. De ce Filament + Livewire
2. Instalarea dependențelor
3. Crearea unui Resource Filament
4. Adăugarea unui component Livewire personalizat
5. Widget-uri Livewire în Filament
6. Bune practici
7. Concluzie

De ce Filament + Livewire

Filament este construit peste Livewire, ceea ce permite crearea rapidă de interfețe admin interactive fără JavaScript. Combinarea celor două oferă flexibilitate maximă pentru dashboard-uri și CRUD-uri complexe.

Instalarea dependențelor

composer require filament/filament
composer require livewire/livewire
php artisan filament:install

Crearea unui Resource Filament

php artisan make:filament-resource Order

Filament va genera formularele și tabelul pentru modelul Order.

Adăugarea unui component Livewire personalizat

php artisan make:livewire StatsWidget

StatsWidget.php

class StatsWidget extends Component
{
    public $ordersCount;

    public function mount()
    {
        $this->ordersCount = Order::count();
    }

    public function render()
    {
        return view('livewire.stats-widget');
    }
}

stats-widget.blade.php

<div class="p-4 bg-white shadow rounded">
    Total orders: {{ $ordersCount }}
</div>

Widget-uri Livewire în Filament

Poți include componenta într-o pagină Filament:

<livewire:stats-widget />

Sau ca widget Filament personalizat.

Bune practici

• Separă logica Livewire de Resource-urile Filament.
• Folosește widget-uri pentru statistici.
• Evită query-uri costisitoare în render().

Concluzie

Integrarea Filament cu Livewire permite construirea rapidă a unui admin panel modern, interactiv și extensibil în Laravel.