使用 Filament 和 Laravel 构建强大的管理面板：分步指南-php教程-PHP中文网

Building Robust Admin Panels with Filament and Laravel: A Step-by-Step Guide

Laravel 是一个强大的 PHP 框架，为开发 Web 应用程序提供了坚实的基础。 Filament 是一个开源、优雅的 Laravel 管理面板和表单构建器，可简化管理界面的创建。本指南将引导您使用最新版本的 Filament 和 Laravel 构建强大的管理面板。

Laravel SaaS Starter - 在一天而不是几周内启动您的下一个 Saas
只需一天而不是几周即可启动您的下一个 Laravel Saas 项目！已经构建了每个 SaaS 都需要的功能
www.laravelsaas.store

先决条件
在我们开始之前，请确保您的开发计算机上安装了以下软件：

PHP >= 8.0
作曲家
Node.js 和 NPM
MySQL 或 Laravel 支持的任何其他数据库

第 1 步：设置新的 Laravel 项目

首先，使用 Composer 创建一个新的 Laravel 项目：

composer create-project --prefer-dist laravel/laravel filament-admin
cd filament-admin

登录后复制

接下来，设置环境变量。将 .env.example 文件重命名为 .env 并使用您的凭据更新数据库配置：

DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=filament_db
DB_USERNAME=root
DB_PASSWORD=your_password

登录后复制

运行以下命令生成应用程序密钥并迁移默认的 Laravel 表：

php artisan key:generate
php artisan migrate

登录后复制

第 2 步：安装灯丝

要安装 Filament，请使用 Composer：

composer require filament/filament

登录后复制

接下来，发布 Filament 资产和配置：

php artisan filament:install

登录后复制

第 3 步：设置身份验证

Filament 需要身份验证才能管理对管理面板的访问。 Laravel 提供内置的身份验证脚手架。为了简单起见，让我们使用 Laravel Breeze：

composer require laravel/breeze --dev
php artisan breeze:install

登录后复制

按照提示选择您喜欢的前端选项（Blade、Vue、React）。在这个例子中，我们将使用 Blade:

php artisan migrate
npm install
npm run dev

登录后复制

确保您有一个用户可以登录。您可以使用 Laravel Tinker 创建一个：

php artisan tinker

>>> \App\Models\User::factory()->create(['email' => 'admin@example.com']);

登录后复制

第 4 步：配置灯丝

如果您使用角色或权限，请更新用户模型以实现 Filament HasFilamentRoles 合约。目前，我们将确保任何经过身份验证的用户都可以访问 Filament。

In app/Providers/FilamentServiceProvider.php, define the authorization logic:

use Filament\Facades\Filament;

public function boot()
{
    Filament::serving(function () {
        Filament::registerUserMenuItems([
            'account' => MenuItem::make()
                ->label('My Account')
                ->url(route('filament.resources.users.edit', ['record' => auth()->user()]))
                ->icon('heroicon-o-user'),
        ]);
    });

    Filament::registerPages([
        // Register your custom pages here
    ]);

    Filament::registerResources([
        // Register your custom resources here
    ]);
}

protected function gate()
{
    Gate::define('viewFilament', function ($user) {
        return in_array($user->email, [
            'admin@example.com',
        ]);
    });
}

登录后复制

第 5 步：创建资源

Filament 资源是具有 CRUD 接口的 Eloquent 模型。让我们创建一个用于管理 Post 模型的资源。

生成模型、迁移和工厂：

php artisan make:model Post -mf

登录后复制

定义迁移文件中的字段：

public function up()
{
    Schema::create('posts', function (Blueprint $table) {
        $table->id();
        $table->string('title');
        $table->text('content');
        $table->timestamps();
    });
}

登录后复制

运行迁移：

php artisan migrate

登录后复制

接下来，生成Filament资源：

php artisan make:filament-resource Post

登录后复制

此命令为资源创建必要的文件。打开 app/Filament/Resources/PostResource.php 并定义资源字段：

use Filament\Resources\Pages\Page;
use Filament\Resources\Pages\CreateRecord;
use Filament\Resources\Pages\EditRecord;
use Filament\Resources\Pages\ListRecords;
use Filament\Resources\Forms;
use Filament\Resources\Tables;
use Filament\Resources\Forms\Components\TextInput;
use Filament\Resources\Forms\Components\Textarea;
use Filament\Resources\Tables\Columns\TextColumn;

class PostResource extends Resource
{
    protected static ?string $model = Post::class;

    protected static ?string $navigationIcon = 'heroicon-o-collection';

    public static function form(Form $form): Form
    {
        return $form
            ->schema([
                TextInput::make('title')
                    ->required()
                    ->maxLength(255),
                Textarea::make('content')
                    ->required(),
            ]);
    }

    public static function table(Table $table): Table
    {
        return $table
            ->columns([
                TextColumn::make('title'),
                TextColumn::make('content')
                    ->limit(50),
                TextColumn::make('created_at')
                    ->dateTime(),
            ]);
    }

    public static function getPages(): array
    {
        return [
            'index' => Pages\ListRecords::route('/'),
            'create' => Pages\CreateRecord::route('/create'),
            'edit' => Pages\EditRecord::route('/{record}/edit'),
        ];
    }
}

登录后复制

第 6 步：添加导航

将资源添加到 Filament 侧边栏。打开 app/Providers/FilamentServiceProvider.php 并注册资源：

use App\Filament\Resources\PostResource;

public function register()
{
    Filament::registerResources([
        PostResource::class,
    ]);
}

登录后复制

第 7 步：定制灯丝

灯丝是高度可定制的。您可以更改主题、组件等。例如，要自定义原色，请更新 config/filament.php 文件：

'brand' => [
    'primary' => '#1d4ed8',
],

登录后复制

您还可以按照文档创建自定义页面、小部件和表单组件：Filament 文档。

结论

在本指南中，我们逐步介绍了设置新的 Laravel 项目、安装 Filament、设置身份验证、创建资源以及自定义 Filament 管理面板。这将为您使用 Filament 和 Laravel 构建强大的管理面板奠定坚实的基础。如需更多高级功能和定制，请参阅官方文档并探索 Filament 的功能。

编码愉快！

以上是使用 Filament 和 Laravel 构建强大的管理面板：分步指南的详细内容。更多信息请关注PHP中文网其他相关文章！