Filament 3: Creare un Admin Panel Professionale in 30 Minuti

Cos'è Filament?

Filament è un framework per creare pannelli amministrativi in Laravel con un'interfaccia moderna e funzionalità avanzate out-of-the-box.

Installazione

Inizia installando Filament nel tuo progetto Laravel:

composer require filament/filament:"^3.0"

php artisan filament:install --panels

php artisan make:filament-user

Creare una Risorsa

Le risorse in Filament gestiscono il CRUD completo per i tuoi modelli:

php artisan make:filament-resource Post --generate

Questo genera automaticamente:

• Resource class
• Pages per List, Create, Edit
• Form e Table con tutti i campi del modello

Personalizzare il Form

Ecco come personalizzare il form di una risorsa:

<?php
namespace App\Filament\Resources\PostResource\Pages;

use Filament\Forms;
use Filament\Forms\Form;

public static function form(Form $form): Form
{
    return $form
        ->schema([
            Forms\Components\TextInput::make('title')
                ->required()
                ->maxLength(255)
                ->live(onBlur: true)
                ->afterStateUpdated(fn (Set $set, ?string $state) =>
                    $set('slug', Str::slug($state))
                ),

            Forms\Components\TextInput::make('slug')
                ->required()
                ->maxLength(255)
                ->unique(ignoreRecord: true),

            Forms\Components\RichEditor::make('content')
                ->required()
                ->columnSpanFull(),

            Forms\Components\FileUpload::make('featured_image')
                ->image()
                ->maxSize(2048)
                ->directory('posts'),

            Forms\Components\Select::make('category_id')
                ->relationship('category', 'name')
                ->searchable()
                ->preload()
                ->createOptionForm([
                    Forms\Components\TextInput::make('name')
                        ->required(),
                ]),

            Forms\Components\Toggle::make('published')
                ->default(false),

            Forms\Components\DateTimePicker::make('published_at')
                ->label('Publish Date'),
        ]);
}
?>

Personalizzare la Table

Configura quali colonne mostrare nella lista:

<?php
use Filament\Tables;
use Filament\Tables\Table;

public static function table(Table $table): Table
{
    return $table
        ->columns([
            Tables\Columns\ImageColumn::make('featured_image')
                ->label('Image'),

            Tables\Columns\TextColumn::make('title')
                ->searchable()
                ->sortable(),

            Tables\Columns\TextColumn::make('category.name')
                ->badge()
                ->searchable(),

            Tables\Columns\IconColumn::make('published')
                ->boolean(),

            Tables\Columns\TextColumn::make('published_at')
                ->dateTime()
                ->sortable(),

            Tables\Columns\TextColumn::make('views')
                ->sortable()
                ->badge()
                ->color('success'),
        ])
        ->filters([
            Tables\Filters\TrashedFilter::make(),
            Tables\Filters\SelectFilter::make('category')
                ->relationship('category', 'name'),
            Tables\Filters\Filter::make('published')
                ->query(fn (Builder $query): Builder => $query->where('published', true)),
        ])
        ->actions([
            Tables\Actions\EditAction::make(),
            Tables\Actions\DeleteAction::make(),
        ])
        ->bulkActions([
            Tables\Actions\BulkActionGroup::make([
                Tables\Actions\DeleteBulkAction::make(),
            ]),
        ]);
}
?>

Aggiungere Widget alla Dashboard

Crea widget per visualizzare statistiche:

php artisan make:filament-widget StatsOverview --stats-overview

<?php
namespace App\Filament\Widgets;

use Filament\Widgets\StatsOverviewWidget as BaseWidget;
use Filament\Widgets\StatsOverviewWidget\Stat;

class StatsOverview extends BaseWidget
{
    protected function getStats(): array
    {
        return [
            Stat::make('Total Posts', Post::count())
                ->description('All posts in database')
                ->descriptionIcon('heroicon-m-document-text')
                ->color('success'),

            Stat::make('Published Posts', Post::where('published', true)->count())
                ->description('Currently visible')
                ->descriptionIcon('heroicon-m-eye')
                ->color('primary'),

            Stat::make('Total Views', Post::sum('views'))
                ->description('Across all posts')
                ->descriptionIcon('heroicon-m-chart-bar')
                ->color('warning'),
        ];
    }
}
?>