前回まで状況はこちら。

最新ソースコードはこちら。

https://github.com/takishita2nd/hotel-mng

今回は予約を入れたスケジュールに重複がないかを確認し、重複していたらエラー表示を行います。

まず、重複チェックを行う処理をリポジトリに作成します。

    /**
     * スケジュールの重複を確認する
     * 
     * @return boolean
     */
    public function checkSchedule($date, $num)
    {
        if(ReserveDayList::where(['day' => $date])->count() != 0)
        {
            return false;
        }
        for($i = 1; $i < $num; $i++)
        {
            if(ReserveDayList::where(['day' => date('Y-m-d', strtotime($date.'+'.$i.' day'))])->count() != 0)
            {
                return false;
            }
        }

        return true;
    }

予約を入れる日にち全てに対して、データがあるかを確認します。

データの有無は、おそらく、count()でレコード数を見るのが一番スマートなやりかたでしょう。

これを、コントローラーから呼びます。

    /**
     * 登録処理
     */
    public function store(ManagementRequest $request)
    {
        if($this->registerManagement->checkSchedule($request->start_day, $request->days) == false)
        {
            return redirect('management/create')
                        ->with(['error' => 'スケジュールが重複します'])
                        ->withInput();
        }
        $param = $this->registerManagement->getParam();
        $this->registerManagement->add([
            $param[0] => $request->name,
            $param[1] => $request->address,
            $param[2] => $request->phone,
            $param[3] => $request->num,
            $param[4] => $request->days,
            $param[5] => $request->start_day
        ]);
        return redirect('management');
    }

重複していたら、元の画面にリダイレクトします。

このとき、セッションにエラーメッセージも一緒に入れます。

withInput()を入れると、入力したデータもそのまま残るようになります。

次はbladeにエラーを表示するエリアを作成します。

                @if (session('error'))
                    <div class="alert alert-danger">
                        {{ session('error') }}
                    </div>
                @endif

うまくできました。

もう少しでこの課題は完成ですね。

バナークリックで応援よろしくお願いします。

前回までの状況はこちら。

最新ソースはこちら。

https://github.com/takishita2nd/hotel-mng

バリデーション処理とは、フォームで入力した値が、正しいかどうかを確認する処理です。

現在は入力された値がそのままデータベースに入るようになってしまっているので、パラメータチェック処理を入れて、エラーを返せるようにします。

今回は実装量が少ない方法で行きます。

以下のコマンドを入力。

$ php artisan make:request ManagementRequest

そうすると、App/Http/Request/ManagementRequest.phpが作成されます。

その内容を修正します。

class ManagementRequest extends FormRequest
{
    /**
     * Determine if the user is authorized to make this request.
     *
     * @return bool
     */
    public function authorize()
    {
        return true;
    }

    /**
     * Get the validation rules that apply to the request.
     *
     * @return array
     */
    public function rules()
    {
        return [
            'name' => 'required|string',
            'address' => 'required|string',
            'phone' => 'required|digits:11',
            'num' => 'required|numeric|digits_between:1,2',
            'days' => 'required|numeric|digits_between:1,4',
            'start_day' => 'required|date',
        ];
    }
}

authorize()の戻り値はtrueに変えます。

falseのままだとすべて認証エラーとなります。

rules()に各パラメータの確認内容を記入します。

こちらのサイトが参考になります。

https://qiita.com/fagai/items/9904409d3703ef6f79a2

あとは、コントローラーを変更します。

use App\Http\Requests\ManagementRequest;

    /**
     * 登録処理
     */
    public function store(ManagementRequest $request)


    /**
     * 更新処理
     */
    public function update(ManagementRequest $request)

確認を行うフォームのリスエスト処理の引数の型をManagementRequestに変更します。

これで、App/Http/Request/ManagementRequest.phpの内容が適用されます。

あとは、bladeにエラーを表示する領域を追加すればOK。

                @if ($errors->any())
                    <div class="alert alert-danger">
                        <ul>
                            @foreach ($errors->all() as $error)
                                <li>{{ $error }}</li>
                            @endforeach
                        </ul>
                    </div>
                @endif

クリックで応援よろしくお願いします。

前回までの様子はこちら。

最新ソースはこちら。

https://github.com/takishita2nd/hotel-mng

まあ、ここまで見ていただいた方々は、ほぼ100％思っていることがあると思います。

見づらい。

せめて、罫線ぐらい引けよ。

ということで、やります。

Laravelでは、public/css/app.cssを読み込んで、スタイルを設定しています。

じゃあ、ここにスタイルを書き足せばいいのか？と思うかもしれませんが、Laravelでは、もっと便利な方法があるんです。

sass/scssというんですけどね。

こちらにスタイルを書き込み、node.jsのプログラムを実行して、app.cssを作成することができるんです。

sass/scssは普通にCSSを書くよりも、少ないコードでスタイルをかけるので便利でした。

まずは、node.jsの準備。

$ sudo apt install nodejs
$ sudo apt install npm
$ npm install
$ npm run dev

もし、npm installに失敗した場合は、imagemin-pngquantのバージョンが一致していないので、package.jsonのdevDependenciesに以下を書き足します。

        "imagemin-pngquant": "5.0.1"

npm installが完了すれば、準備完了。

npm run devを実行すると、sass/scssのコンパイルが実行されます。

スタイルは何度も書き換えることが多いので、コンパイルが面倒くさい人は、

$ npm run watch

を入力すると、sass/scssを保存するたびに、それを検出してコンパイルしてくれます。

では、sass/scssを作成します。

resource/assets/sassの下に、_Management.scssを作成し、app.scssに以下を追加します。

@import "Management";

そして、_Management.scssに記述を追加。

table.management {
    width: 100%;
    tbody tr{
        th {
            border: solid;
            border-width: thin;
        }
        .name{
            width: 15%;
        }
        .address{
            width: 20%;
        }
        .phone{
            width: 15%;
        }
        .num{
            width: 10%;
        }
        .date{
            width: 10%;
        }
        .command{
            width: 5%;
        }
        td {
            border: solid;
            border-width: thin;
        }
        .name{
            width: 15%;
        }
        .address{
            width: 20%;
        }
        .phone{
            width: 15%;
        }
        .num{
            width: 10%;
        }
        .date{
            width: 10%;
        }
        .command{
            width: 5%;
        }
    }
}

bladeにスタイルを適用します。

                    <table class="management">
                        <tr>
                            <th class="name">名前</th>
                            <th class="address">住所</th>
                            <th class="phone">電話番号</th>
                            <th class="num">人数</th>
                            <th class="date">宿泊日</th>
                            <th class="num">宿泊日数</th>
                            <th class="command">編集</th>
                            <th class="command">削除</th>
                        </tr>
                    @foreach ($registerLists as $list)
                        <tr>
                            <td class="name">{{ $list->name }}</td>
                            <td class="address">{{ $list->address }}</td>
                            <td class="phone">{{ $list->phone }}</td>
                            <td class="num">{{ $list->num }}</td>
                            <td class="date">{{ $list->start_day }}</td>
                            <td class="num">{{ $list->days }}</td>
                            <td class="command">{{ Html::link('/management/'.$list->id.'/edit', '編集') }}</td>
                            <td class="command">{{ Html::link('/management/'.$list->id.'/conform', '削除') }}</td>
                        </tr>
                    @endforeach
                    </table>

これで見た目がだいぶ良くなりました。

バナークリックで応援よろしくお願いします。

前回までの様子はこちら。

最新ソースコードはこちら。

https://github.com/takishita2nd/hotel-mng

まずは、テーブルの連携が正しくできるように、マイグレーションを修正しました。

実際に修正を行う際には、事前にロールバックを行うか、テーブルを書き換えるマイグレーションファイルを追加してください。

        Schema::create('reserve_day_list_reserve_management', function (Blueprint $table) {
            $table->increments('id');
            $table->integer('reserve_management_id')
                  ->foreign('reserve_management_id')
                  ->references('id')->on('reserve_managements')
                  ->onDelete('cascade');
            $table->integer('reserve_day_list_id')
                  ->foreign('reserve_day_list_id')
                  ->references('id')->on('reserve_day_lists')
                  ->onDelete('cascade');
            $table->timestamps();
            $table->engine = 'InnoDB';
            $table->charset = 'utf8mb4';
            $table->collation = 'utf8mb4_unicode_ci';
        });

Laravelには、中間テーブルのネーミングルールが決まっており、それに合わないと、正しく中間テーブルを認識できません。

しかし、ネーミングルールがあっていれば、中間テーブルのモデルを定義しなくても、Laravelは中間テーブルを認識します。

各モデルの関数も修正します。

class ReserveManagement extends Model
{
    protected $table = 'reserve_managements';

    public function reserveDayLists()
    {
        return $this->belongsToMany('App\Model\ReserveDayList');
    }
}

class ReserveDayList extends Model
{
    protected $table = 'reserve_day_lists';

    public function reserveManagements()
    {
        return $this->belongsToMany('App\Model\ReserveManagement');
    }
}

これで、各モデルから連携先のモデルを直接参照することができます。

最後にリポジトリの修正を行います。

    public function add($param)
    {
        $model = new ReserveManagement;
        foreach($this->paramNames as $name)
        {
            $model->$name = $param[$name];
        }
        $model->save();
        $model2 = new ReserveDayList();
        $model2->day = $model->start_day;
        $model2->save();
        $model->reserveDayLists()->attach($model2);
        for($i = 1; $i < $model->days; $i++)
        {
            $model2 = new ReserveDayList();
            $model2->day = date('Y-m-d', strtotime($model->start_day.'+'.$i.' day'));
            $model2->save();
            $model->reserveDayLists()->attach($model2);
        }
    }

ちょっと変数名がよろしくありませんが、attach関数でLaravelは自身で中間テーブルを認識し、レコードの紐付けを行います。

逆に削除する場合は、

    public function deleteById($id)
    {
        $model = $this->getItemById($id);
        $model2s = $model->reserveDayLists()->get();
        $model->reserveDayLists()->detach();
        foreach($model2s as $model2)
        {
            $model2->delete();
        }
        $model->delete();
    }

今度は逆にdetach関数で紐付けを解除します。

少し修正が発生しましたが、これで少ないコードでデータベースを簡単に扱うことができます。

↑よかったらクリックお願いします。

前回までの様子はこちら

お次はテーブルのデータを削除する処理を作成します。

まずは、ルーティング。

Route::get('/management/{id}/conform', 'RegisterManagementController@conform');
Route::post('/management/delete', 'RegisterManagementController@delete');

/management/{id}/conformにアクセスすると削除確認の画面が、

/management/deleteにアクセスすると、実際に削除処理を行うようにします。

次は一覧画面に削除確認画面へのリンクを作成します。

                            <td>{{ Html::link('/management/'.$list->id.'/conform', '削除') }}</td>

そして、削除確認画面。

@extends('layouts.app')

@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">削除確認</div>

                <div class="panel-body">
                {!! Form::open(['url' => action('RegisterManagementController@delete')]) !!}
                {!! Form::hidden('id', $item->id) !!}
                <table>
                    <tr>
                        <td>名前</td>
                        <td>{!! $item->name !!}</td>
                    </tr>
                    <tr>
                        <td>住所</td>
                        <td>{!! $item->address !!}</td>
                    </tr>
                    <tr>
                        <td>電話番号</td>
                        <td>{!! $item->phone !!}</td>
                    </tr>
                    <tr>
                        <td>人数</td>
                        <td>{!! $item->num !!}</td>
                    </tr>
                    <tr>
                        <td>宿泊日数</td>
                        <td>{!! $item->days !!}</td>
                    </tr>
                    <tr>
                        <td>宿泊日</td>
                        <td>{!! $item->start_day !!}</td>
                    </tr>
                </table>
                {!! Form::submit('削除') !!}
                {!! Form::close() !!}
                </div>
            </div>
        </div>
    </div>
</div>
@endsection

隠しパラメータにid番号を含め、formをSubmitしたときのパラメータにします。

次に、コントローラー。

    /**
     * 削除確認
     *
     * @return \Illuminate\Http\Response
     */
    public function conform($id)
    {
        return view('register.conform', ['item' => $this->registerManagement->getItemById($id)]);
    }

    /**
     * 削除処理
     */
    public function delete(Request $request)
    {
        $this->registerManagement->deleteById($request->id);
        return redirect('management');
    }

削除確認では、URLのID番号を受け取り、そのIDからデータを参照し、Viewに返しています。

削除処理では、$requestにID番号が入っていますので、そのIDをリポジトリに渡して、削除処理を行ったあと、一覧画面にリダイレクトします。

次はリポジトリ。

    /**
     * 予約を削除する
     * 
     * @return void
     */
    public function deleteById($id)
    {
        $model = $this->getItemById($id);
        $model->delete();
    }

IDでモデルを検索して、delete()メソッドを実行すれば、そのデータはデータベースから削除されます。

これで削除処理が完成しました。

次は、この情報から予約スケジュールを作成する処理を作成していきます。

↑よかったらクリックお願いします。

前回までの様子はこちら。

ソースコードはこちら。

https://github.com/takishita2nd/hotel-mng

今回は登録した内容を更新するところまでやります。

データを更新する前に、データを更新するページにリンクするように一覧画面を修正します。

@extends('layouts.app')

@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">予約一覧</div>

                <div class="panel-body">
                    <table>
                        <tr>
                            <th>名前</th>
                            <th>住所</th>
                            <th>電話番号</th>
                            <th>人数</th>
                            <th>宿泊日</th>
                            <th>宿泊日数</th>
                            <th>編集</th>
                            <th>削除</th>
                        </tr>
                    @foreach ($registerLists as $list)
                        <tr>
                            <td>{{ $list->name }}</td>
                            <td>{{ $list->address }}</td>
                            <td>{{ $list->phone }}</td>
                            <td>{{ $list->num }}</td>
                            <td>{{ $list->days }}</td>
                            <td>{{ $list->start_day }}</td>
                            <td>{{ Html::link('/management/'.$list->id.'/edit', '編集') }}</td>
                            <td>削除</td>
                        </tr>
                    @endforeach
                    </table>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection

そして、ルーティングの設定も追加します。

Route::get('/management/{id}/edit', 'RegisterManagementController@edit');
Route::post('/management/update', 'RegisterManagementController@update');

更新フォームへのリンクと、実際にデータを更新するリクエストですね。

コントローラーには、以下の関数を追加します。

    /**
     * 編集処理
     */
    public function edit($id)
    {
        return view('register.edit', ['item' => $this->registerManagement->getItemById($id)]);
    }

    /**
     * 更新処理
     */
    public function update(Request $request)
    {
        $param = $this->registerManagement->getParam();
        $this->registerManagement->updateById($request->id,
        [
            $param[0] => $request->name,
            $param[1] => $request->address,
            $param[2] => $request->phone,
            $param[3] => $request->num,
            $param[4] => $request->days,
            $param[5] => $request->start_day
        ]);
        return redirect('management');
    }

そして、リポジトリには以下の関数を追加。

    // IDから予約を１件取得する
    public function getItemById($id)
    {
        return ReserveManagement::where(['id' => $id])->first();
    }

    // 予約を更新する
    public function updateById($id, $param)
    {
        $model = $this->getItemById($id);
        foreach($this->paramNames as $name)
        {
            $model->$name = $param[$name];
        }
        $model->save();
    }

「編集」のリンクのURLにデータベースのID番号が入っていて、それをコントローラーで受け取り、データベースからIDで参照して、データを取得します。

そして、取得したデータをViewに渡します。

実際に編集画面のViewはこちら。

@extends('layouts.app')

@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">予約登録</div>

                <div class="panel-body">
                {!! Form::open(['url' => action('RegisterManagementController@update')]) !!}
                {!! Form::hidden('id', $item->id) !!}
                <table>
                    <tr>
                        <td>名前</td>
                        <td>{!! Form::text('name', $item->name) !!}</td>
                    </tr>
                    <tr>
                        <td>住所</td>
                        <td>{!! Form::text('address', $item->address) !!}</td>
                    </tr>
                    <tr>
                        <td>電話番号</td>
                        <td>{!! Form::number('phone', $item->phone) !!}</td>
                    </tr>
                    <tr>
                        <td>人数</td>
                        <td>{!! Form::select('num', ['1' => 1, '2' => 2], $item->num) !!}</td>
                    </tr>
                    <tr>
                        <td>宿泊日数</td>
                        <td>{!! Form::select('days', ['1' => 1, '2' => 2, '3' => 3, '4' => 4], $item->days) !!}</td>
                    </tr>
                    <tr>
                        <td>宿泊日</td>
                        <td>{!! Form::date('start_day', $item->start_day) !!}</td>
                    </tr>
                </table>
                {!! Form::submit('登録') !!}
                {!! Form::close() !!}
                </div>
            </div>
        </div>
    </div>
</div>
@endsection

見た目は登録と同じですが、デフォルト値を設定しているのが異なります。

コントローラーから受け取った値をデフォルト値として設定しています。

そして、登録ボタンを押すと、その情報がコントローラーのupdate関数に渡されます。

そして、その情報をデータベースに設定し、一覧画面にリダイレクトします。

これで更新処理が完成しました。

次回は削除処理を作りたいと思います。

↑よかったらクリックお願いします。