admin と professor で実際にログインできるように実装しよう.
resources/views/ 以下に admin と professor フォルダを作成し,それぞれの中に login.blade.php と home.blade.php のファイルを作成する.また,レイアウトのファイルも admin 用と professor 用を準備する.
[GakuinHana@rin06 laravelUser]$ ls resources/views/ ⏎ auth email home.blade.php layouts users welcome.blade.php [GakuinHana@rin06 laravelUser]$ mkdir resources/views/admin ⏎ [GakuinHana@rin06 laravelUser]$ mkdir resources/views/professor ⏎ [GakuinHana@rin06 laravelUser]$ ls resources/views/ ⏎ admin auth email home.blade.php layouts professor users welcome.blade.php [GakuinHana@rin06 laravelUser]$ touch resources/views/admin/login.blade.php ⏎ [GakuinHana@rin06 laravelUser]$ touch resources/views/admin/home.blade.php ⏎ [GakuinHana@rin06 laravelUser]$ touch resources/views/professor/login.blade.php ⏎ [GakuinHana@rin06 laravelUser]$ touch resources/views/professor/home.blade.php ⏎ [GakuinHana@rin06 laravelUser]$ cp resources/views/layouts/app.blade.php resources/views/layouts/admin.blade.php ⏎ [GakuinHana@rin06 laravelUser]$ cp resources/views/layouts/app.blade.php resources/views/layouts/professor.blade.php ⏎ [GakuinHana@rin06 laravelUser]$
resources/views/layouts/admin.blade.php を修正する.ここでは,route('xxx')
をすべて route('admin.xxx')
に変更する.また,新規登録をさせないように Register へのリンクを削除する.さらに,Profileを表示させる部分のリンクも削除しておく.
resources/views/layouts/admin.blade.php
<!DOCTYPE html>
<html lang="{{ app()->getLocale() }}">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- CSRF Token -->
<meta name="csrf-token" content="{{ csrf_token() }}">
<title>{{ config('app.name', 'Laravel') }}</title>
<!-- Styles -->
<link href="{{ asset('css/app.css') }}" rel="stylesheet">
</head>
<body>
<div id="app">
<nav class="navbar navbar-default navbar-static-top">
<div class="container">
<div class="navbar-header">
<!-- Collapsed Hamburger -->
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#app-navbar-collapse">
<span class="sr-only">Toggle Navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<!-- Branding Image -->
<a class="navbar-brand" href="{{ url('/') }}">
{{ config('app.name', 'Laravel') }}
</a>
</div>
<div class="collapse navbar-collapse" id="app-navbar-collapse">
<!-- Left Side Of Navbar -->
<ul class="nav navbar-nav">
</ul>
<!-- Right Side Of Navbar -->
<ul class="nav navbar-nav navbar-right">
<!-- Authentication Links -->
@if (Auth::guest())
<li><a href="{{ route('admin.login') }}">Login</a></li>
@else
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">
{{ Auth::user()->name }} <span class="caret"></span>
</a>
<ul class="dropdown-menu" role="menu">
<li>
<a href="{{ route('admin.logout') }}"
onclick="event.preventDefault();
document.getElementById('logout-form').submit();">
Logout
</a>
<form id="logout-form" action="{{ route('admin.logout') }}" method="POST" style="display: none;">
{{ csrf_field() }}
</form>
</li>
</ul>
</li>
@endif
</ul>
</div>
</div>
</nav>
@yield('content')
</div>
<!-- Scripts -->
<script src="{{ asset('js/app.js') }}"></script>
</body>
</html>
admin のログインフォームのビューをデザインする.なお,resources/views/auth/login.blade.php をコピーして一部修正するだけで良い.なお,パスワードを忘れたときのリセットを行わないので,その部分(68行目あたり)は削除しておく.
resources/views/admin/login.blade.php
@extends('layouts.admin')
@section('content')
<div class="container">
<div class="row">
<div class="col-md-8 col-md-offset-2">
<div class="panel panel-default">
<div class="panel-heading">Admin Login</div>
<div class="panel-body">
{{-- フラッシュメッセージの表示 --}}
@if (session('warning'))
<div class="alert alert-warning">
{{ session('warning') }}
</div>
@endif
@if (session('status'))
<div class="alert alert-info">
{{ session('status') }}
</div>
@endif
<form class="form-horizontal" method="POST" action="{{ route('admin.login') }}">
{{ csrf_field() }}
<div class="form-group{{ $errors->has('login_id') ? ' has-error' : '' }}">
<label for="login_id" class="col-md-4 control-label">Login ID</label>
<div class="col-md-6">
<input id="login_id" type="text" class="form-control" name="login_id" value="{{ old('login_id') }}" required autofocus>
@if ($errors->has('login_id'))
<span class="help-block">
<strong>{{ $errors->first('login_id') }}</strong>
</span>
@endif
</div>
</div>
<div class="form-group{{ $errors->has('password') ? ' has-error' : '' }}">
<label for="password" class="col-md-4 control-label">Password</label>
<div class="col-md-6">
<input id="password" type="password" class="form-control" name="password" required>
@if ($errors->has('password'))
<span class="help-block">
<strong>{{ $errors->first('password') }}</strong>
</span>
@endif
</div>
</div>
<div class="form-group">
<div class="col-md-6 col-md-offset-4">
<div class="checkbox">
<label>
<input type="checkbox" name="remember" {{ old('remember') ? 'checked' : '' }}> Remember Me
</label>
</div>
</div>
</div>
<div class="form-group">
<div class="col-md-8 col-md-offset-4">
<button type="submit" class="btn btn-primary">
Login
</button>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
@endsection
ホーム画面用のビューも整えておく.これも resources/views/home.blade.php をコピーして一部修正するだけで良い.
resources/views/admin/home.blade.php
@extends('layouts.admin')
@section('content')
<div class="container">
<div class="row">
<div class="col-md-8 col-md-offset-2">
<div class="panel panel-default">
<div class="panel-heading">Admin Dashboard</div>
<div class="panel-body">
{{-- フラッシュメッセージの表示 --}}
@if (session('warning'))
<div class="alert alert-warning">
{{ session('warning') }}
</div>
@endif
@if (session('status'))
<div class="alert alert-info">
{{ session('status') }}
</div>
@endif
@if (session('status'))
<div class="alert alert-success">
{{ session('status') }}
</div>
@endif
You are logged in as admin!
</div>
</div>
</div>
</div>
</div>
@endsection
コントローラを修正する.
app/Http/Controllers/Admin/HomeController.php
public function index()
{
return view('admin.home');
}
app/Http/Controllers/Admin/LoginController.php
public function showLoginForm()
{
return view('admin.login');
}
/admin/login にアクセスして,管理者の一人である「taro」でログインしてみる.
うまく動いたが,一般ユーザと管理者用の画面でデザインが全く同じだと混乱する可能性がある.よって,管理者用ページの背景色を変えてデザインを変更する.
resources/views/layouts/admin.blade.php でスタイルシートを読み込むように設定する.
resources/views/layouts/admin.blade.php (抜粋)
<!DOCTYPE html>
<html lang="{{ app()->getLocale() }}">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- CSRF Token -->
<meta name="csrf-token" content="{{ csrf_token() }}">
<title>{{ config('app.name', 'Laravel') }}</title>
<!-- Styles -->
<link href="{{ asset('css/app.css') }}" rel="stylesheet">
<link href="{{ asset('css/adminstyle.css') }}" rel="stylesheet">
</head>
<body>
スタイルシートは public/css フォルダに設置すれば良い.次のようなスタイルを設定する.
public/css/adminstyle.css
body {
background-color: deepskyblue;
}
これによって,管理者画面と一般ユーザ画面で背景色が異なるようになった.
ここでは,管理者ログインを実装したが,教員用のログインもほぼ同様に実装できます.