使用 Filament 和 Laravel 构建强大的管理面板：分步指南

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

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

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

php >= 8.0
作曲家
node.js 和 npmmysql 或 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 saas starter - 在一天而不是几周内启动您的下一个 saas
只需一天而不是几周即可启动您的下一个 laravel saas 项目！已经构建了每个 saas 都需要的功能
www.laravelsaas.store

结论

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

编码愉快！

以上就是使用 Filament 和 Laravel 构建强大的管理面板：分步指南的详细内容，更多请关注至强加速其它相关文章！