🦔

Laravel Filamentで請求システム作る No4 ユーザー管理画面を作る

2023/11/19に公開

前回引き続きFilamentで請求システムを作っていきます。

やっぱりユーザー管理機能が欲しいので付くっていきます。
ユーザーは論理削除できるようにして、CRUDできるようにします。

マイグレーションファイルを編集する

database\migrations\2014_10_12_000000_create_users_table.php
//省略
use Illuminate\Support\Facades\Schema;
+ use Illuminate\Database\Eloquent\SoftDeletes;

return new class extends Migration
{
    public function up(): void
    {
        Schema::create('users', function (Blueprint $table) {
            $table->id();
	    //省略
            $table->rememberToken();
+            $table->softDeletes();
            $table->timestamps();
        });
    }
//省略

マイグレーションを全部やり直します。

./vendor/bin/sail artisan migrate:fresh

これでusersテーブルは論理削除になりました。
Userモデルで論理削除できるようにします。
そして、全テーブルのデータも消しちゃったので
ついでにseedも作りましょう。

Userモデルを論理削除に対応させる

app\Models\User.php
use Laravel\Sanctum\HasApiTokens;
+ use Illuminate\Database\Eloquent\SoftDeletes;

class User extends Authenticatable
{
    use HasApiTokens, HasFactory, Notifiable;
+    use SoftDeletes;

seederを作る

ユーザーと顧客の両方のseederファイルを作る

./vendor/bin/sail artisan make:seeder UsersTableSeeder
./vendor/bin/sail artisan make:seeder CustomersTableSeeder

これで、
database/seeders/UserSeeder.php
database/seeders/CustomerSeeder.php
の2つのファイルができました。

UsersTableSeederを編集する

database\seeders\UsersTableSeeder.php
use Illuminate\Database\Seeder;
+ use \App\Models\User;

class UserSeeder extends Seeder
{
    /**
     * Run the database seeds.
     */
    public function run(): void
    {
+        User::create([
+            'name' => 'admin',
+            'email' => 'admin@admin.com',
+            'password' => 'pass',
+        ]);
    }
}

CustomersTableSeederを編集する

database\seeders\CustomersTableSeeder.php
namespace Database\Seeders;

use Illuminate\Database\Console\Seeds\WithoutModelEvents;
use Illuminate\Database\Seeder;
+ use \App\Models\Customer;

class CustomerSeeder extends Seeder
{
    /**
     * Run the database seeds.
     */
    public function run(): void
    {
+        Customer::create([
+            'name' => 'テスト顧客',
+            'title' => '御中'
+        ]);
    }
}

DatabaseSeeder.phpに2つのseederファイルを登録する

database\seeders\DatabaseSeeder.php
namespace Database\Seeders;

use Illuminate\Database\Console\Seeds\WithoutModelEvents;
use Illuminate\Database\Seeder;

class DatabaseSeeder extends Seeder
{
    /**
     * Seed the application's database.
     */
    public function run(): void
    {
        $this->call([
+           UserSeeder::class,
+           CustomerSeeder::class,
        ]);
    }
}

seederを実行する

ついでにマイグレーションも一緒に実行しています。

./vendor/bin/sail artisan migrate:fresh --seed

上手くいきました!

念のために確認

ログインできるか確認

ログインもできました。

顧客情報がはいってるか確認

入ってます!

ユーザーのCRUDを作る

やっとユーザーのCRUDを作る下準備が完成したので、CRUDを作ります。

vendor/bin/sail artisan filament:resource User

でリソースを作ります。

リソースの編集をする

Userを日本語化してユーザーに変える

app\Filament\Resources\UserResource.php

class UserResource extends Resource
{
+    protected static ?string $modelLabel = 'ユーザー';

詳細画面を作る

app\Filament\Resources\UserResource.php
+ use Filament\Forms\Components;
+ use Illuminate\Support\Facades\Hash;

public static function form(Form $form): Form
    {
        return $form
            ->schema([
+                Components\TextInput::make('name')->label('名前')->required(),
+                Components\TextInput::make('email')->label('メールアドレス')
+                ->required()
+                ->email()
+                //オートコンプリートを無効にする
+                ->autocomplete(false),
+                Components\TextInput::make('password')->label('パスワード')
+                //オートコンプリートを無効にする
+                ->autocomplete(false)
+                //パスワードの入力だとわかるようにする
+                ->password()
+                //保存時にハッシュ加されたパスワードを送る
+                ->dehydrateStateUsing(fn (string $state): string => Hash::make($state))
+                //パスワードの入力が無い時は何もしない
+                ->dehydrated(fn (?string $state): bool => filled($state))
+                //新規作成時だけ必須
+                ->required(fn (string $operation): bool => $operation === 'create'),
            ]);
    }

ユーザー作成画面ができました。

保存もできました

作成したユーザーでログインもできました。

ちなみに論理削除もできてます。

一覧画面を作る

ユーザー一覧の検索は自由検索でメールアドレスと名前の両方を同時に検索するフィールドをつくります。

app\Filament\Resources\UserResource.php
+ use Filament\Tables\Columns;
return $table
            ->columns([
+                Columns\TextColumn::make('name')->label('名前')
+                    //検索対象にする
+                    ->searchable()
+                    //sort可能にする
+                    ->sortable(),
+                Columns\TextColumn::make('email')->label('メールアドレス')
+                    ->searchable()
            ])

次回

次は、「ユーザー権限機能」を作ります。

LaravelとFilamentで請求システム作る No5 権限機能を追加

Discussion