転職活動管理アプリを作ろう⑥（laravel-admin 役割ごとのメニュー切り替え）

前回の記事は コチラ

やりたいこと

• なんでも見れるし触れる Administrator、一般利用者を想定した users の 2 つのアカウント種別を作成したい
  • これこそ JetStream を使った一般権限を作成 しろとか言わないでください
  • UI イチから作るのめんどくさいので

やったこと概略

1. 権限の作成
   • laravel-admin では URI の部分一致で設定する
2. 役割の作成
   • laravel-admin ではホワイトリスト方式
3. アカウントの作成
4. ログイン後 HOME 画面の作成、リダイレクト設定
5. 各メニューのサイドバー表示設定

1. 権限の作成

• 転職活動のメインコンテンツ部分を触れる権限を作成する

• http://localhost/admin/auth/permissions

• 以下画像のように作成する

  

2. 役割の作成

• 一般利用者を想定しているので、以下のような内容を想定

  • 閲覧不可
    • ダッシュボード
    • 管理者による設定系メニュー
  • 閲覧可能
    • 転職活動メインコンテンツ部分
    • アカウント設定
    • （新規作成）ホーム画面

• http://localhost/admin/auth/roles

• 以下画像のように作成する

  

3. アカウントの作成

• http://localhost/admin/auth/users
• 役割の値を [2.] で作成した users にしておく

4. ログイン後 HOME 画面の作成、リダイレクト設定

1. $ php artisan make:controller UserHomeController

2. ひとまず HomeController からパクって以下のようにする

   namespace App\Admin\Controllers;
   
   use App\Http\Controllers\Controller;
   use Encore\Admin\Controllers\Dashboard;
   use Encore\Admin\Layout\Column;
   use Encore\Admin\Layout\Content;
   use Encore\Admin\Layout\Row;
   
   class UserHomeController extends Controller
   {
       public function index(Content $content)
       {
           return $content
               ->title('User Home')
               ->description('ここはホーム画面です')
               ->row(
                   view('admin::dashboard.title')
               )
               ->row(function (Row $row) {
   
                   $row->column(12, function (Column $column) {
                       $column->append(Dashboard::environment());
                   });
   
               });
       }
   }
   

3. Admin/routes.php を以下のように修正

   Route::group([
       'prefix'        => config('admin.route.prefix'),
       'namespace'     => config('admin.route.namespace'),
       'middleware'    => config('admin.route.middleware'),
       'as'            => config('admin.route.prefix') . '.',
   ], function (Router $router) {
   
       $router->get('/', 'HomeController@index')->name('home');
       $router->resource('agents', AgentController::class);
   
       // 以下を追記
       Route::group(['prefix' => 'jobhunting', 'as' => 'jobhunting.'], function() {
           Route::get('/home', 'UserHomeController@index')->name('home');
       });
   
   });
   

4. 作成したページへのメニューを laravel-admin にて以下のように追加

   • http://localhost/admin/auth/menu

   

5. 役割によってログイン後のトップ画面を制御するため、Admin/Controllers/AuthController に以下メソッドを追加

   /**
    * Get the post login redirect path.
    *
    * @return string
    */
   protected function redirectTo()
   {
       if( Admin::user()->isRole('users') ) { // ここで制御
           return config('admin.route.prefix') . '/jobhunting/home';
       }
       // 以下は Encore\Admin\Controllers\AuthController の redirectPath() からコピペ
       return property_exists($this, 'redirectTo') ? $this->redirectTo : config('admin.route.prefix');
   }
   

6. 各役割のアカウントでログインして、動作確認

5. 各メニューのサイドバー表示設定

• laravel-admin では、サイドバーのメニューごとに「どの役割に対して表示するか？」を設定できる

• めんどくさいが、各メニューの編集画面を開いて以下赤四角部分に表示 したい 役割を追加していく

  

おまけ

• このアプリでは laravel-admin の画面しか稼働しないため、URI の /admin/ 部分を消す
  1. .env ファイルに ADMIN_ROUTE_PREFIX= を追記
     • プレフィックスに何も設定しない意思表示
  2. routes/web.php の Route::get('/', function () {〜 の部分をコメントアウト
     • laravel デフォルトのトップ画面への遷移を削除

所感

• laravel-admin ではメニューの制御を UI で出来るためとても楽でした
  • Controller を作ってルーティングまではコーディングが必要
• laravel-admin のドキュメンテーションが中文しか見当たらなかったため少し苦労した
• ついでにドキュメンテーションをかいつまんで読んでみたけど、やりたいことが直感的にできそうでこのライブラリの素晴らしさを認識しました