@extends('adminlte::page')

@section('title', '医院申込履歴')

@section('content_header')
    <h5><label class="title-underbar">医院申込履歴</label></h5>
@stop

@section('content')
    <div class="row">
        <div class="col-md-5">
            <form method="GET" action="{{ route('smartsupport.admin.rentalItems.clinicHistory') }}" id="search">
                <div class="input-group mb-4">
                    {{-- 現状検索処理が医院名のみの条件となっているため、「キーワードから探す」をコメントアウト --}}
                    {{-- <input type="text" name="clinic_name" class="form-control" placeholder="キーワードから探す" value="{{ $inputs['clinic_name'] ?? '' }}"> --}}
                    <input type="text" name="clinic_name" class="form-control" placeholder="医院名から探す" value="{{ $inputs['clinic_name'] ?? '' }}" style="border-top-left-radius: 10px; border-bottom-left-radius: 10px;">
                    <div class="input-group-append">
                        <button class="btn button-go" type="submit" style="margin-top: 0px; margin-left: -2px; border-top-right-radius: 10px; border-bottom-right-radius: 10px;">
                            &emsp;<i class="fas fa-search"></i>&emsp;
                        </button>
                    </div>
                </div>
            </form>
        </div>
    </div>
        
    <div class="row">
        <div class="col-md-4">
            <form method="GET" action="{{ route('smartsupport.admin.rentalItems.clinicHistory') }}" id="search">

            </form>
        </div>

        <div class="col-md-12 mb-4">
            <div class="row">
                <div class="col-md-6">
                    <div class="row">
                        <label style="margin: 10px 15px 10px 5px;">
                            カテゴリー：
                        </label>

                        <div class="btn-group-toggle" data-toggle="buttons">
                            <label class="btn rounded-pill">
                                <input type="radio" name="category" form="search" value="1" id="option1" autocomplete="off"
                                    @if ( $inputs["category"] == "1") checked @endif> 国内歯科
                            </label>
                            <label class="btn rounded-pill" style="margin-left:10px">
                                <input type="radio" name="category" form="search" value="2" id="option2" autocomplete="off"
                                    @if ( $inputs["category"] == "2") checked @endif> 獣医科
                            </label>
                            <label class="btn rounded-pill">
                                <input type="radio" name="category" form="search" value="3" id="option3" autocomplete="off"
                                    @if ( $inputs["category"] == "3") checked @endif> 医科
                            </label>
                            {{-- <label class="btn rounded-pill" style="margin-left:10px">
                                <input type="radio" name="category" form="search" value="4" id="option4" autocomplete="off"
                                    @if ( $inputs["category"] == "4") checked @endif> その他
                            </label> --}}
                        </div>
                    </div>
                </div>

                <div class="col-md-6">
                    <div class="row">
                        <label style="margin: 10px 15px 10px 5px;">
                            貸出期間：
                        </label>

                        <div class="btn-group-toggle" data-toggle="buttons">
                            <label class="btn rounded-pill" style="margin-left:10px">
                                <input type="radio" name="period" form="search" value="0" id="option0" autocomplete="off"
                                @if ( $inputs["period"] == "0") checked @endif> 指定なし
                            </label>
                            <label class="btn rounded-pill" style="margin-left:10px">
                                <input type="radio" name="period" form="search" value="1" id="option1" autocomplete="off"
                                @if ( $inputs["period"] == "1") checked @endif> 1ヶ月以上
                            </label>
                            <label class="btn rounded-pill">
                                <input type="radio" name="period" form="search" value="2" id="option2" autocomplete="off"
                                @if ( $inputs["period"] == "2") checked @endif> 2ヶ月以上
                            </label>
                            <label class="btn rounded-pill">
                                <input type="radio" name="period" form="search" value="3" id="option3" autocomplete="off"
                                @if ( $inputs["period"] == "3") checked @endif> 3ヶ月以上
                            </label>
                        </div>
                    </div>
                </div>

                <!--<div class="col-md-1" style="margin-top:6px; text-align: right;">
                    <label>
                        並び替え
                </label>
                </div>
                <div class="col-md-3">
                    <div class="form-group">
                        <select class="custom-select" name="order" form="search">
                            <option value="created_at_desc">依頼登録日の新しい順</option>
                            <option value="created_at_asc">依頼登録日の古い順</option>
                        </select>
                    </div>
                </div>-->
            </div>
        </div>
    </div><!-- /.row -->

    <div class="row">
        <div class="col-md-12">
            <div class="card" style="border-radius: 20px; box-shadow: 0px 3px 0px 0px rgba(0, 0, 0, 0.04);">
                <div class="card-body">
                    <table class="table table-responsive mt-3">
                        <thead class="thead-light medium-heading">
                            <tr>
                                <th style="width: 10%">依頼番号</th>
                                <th style="width: 15%">形式</th>
                                <th style="width: 10%">管理番号</th>
                                <th style="width: 15%">カテゴリー</th>
                                <th style="width: 10%">金額</th>
                                <th style="width: 20%">医院名/代表者名</th>
                                <th style="width: 10%">依頼登録日</th>
                                <th style="width: 10%">貸出日</th>
                                <th style="width: 10%">返却日</th>
                            </tr>
                        </thead>
                        <tbody class="main-text">
                            @if (count($repairRentalItems) > 0)
                            @foreach ($repairRentalItems as $repairRentalItem)
                                <tr>
                                    <td><a href="{{ route('smartsupport.admin.repairRequests.show', ['id' => $repairRentalItem->repairRequest->id]) }}">{{ $repairRentalItem->repairRequest->repair_request_num }}</a></td>
                                    <td>{{ $repairRentalItem->rentalItem ? $repairRentalItem->rentalItem->equipmentType->internal_name: '-' }}</td>
                                    <td>{{ $repairRentalItem->rentalItem ? $repairRentalItem->rentalItem->management_number: '-' }}</td>
                                    <td>{{ $repairRentalItem->rentalItem ? $repairRentalItem->rentalItem->getUsecase(): '-' }}</td>
                                    <td>{{ $repairRentalItem->rentalItem ? '¥' . number_format($repairRentalItem->rentalItem->equipmentType->getRentalPrice()): '-' }}</td>
                                    <td>{{ $repairRentalItem->repairRequest->getClinicName() }}<br>{{$repairRentalItem->repairRequest->getClinicManagerName() }}</td>
                                    <td>{{ $repairRentalItem->repairRequest->created_at->format('Y.m.d') }}</td>
                                    <td>{{ $repairRentalItem->rental_at ?  $repairRentalItem->rental_at->format('Y.m.d') : '未貸出' }}</td>
                                    <td>{{ $repairRentalItem->returned_at ? $repairRentalItem->returned_at->format('Y.m.d') : '未返却' }}</td>
                                </tr>
                            @endforeach
                            @else
                                <tr>
                                    <td colspan="9">貸出中の機器はありません</td>
                                </tr>
                            @endif
                        </tbody>
                    </table>
                </div>

                <div style="margin: 0 auto;">
                    {{ $repairRentalItems->links() }}
                </div>
            </div>
        </div>
    </div>
@stop

@section('css')
    <link rel="stylesheet" href="/css/admin_custom.css">
    <style>
        /* 選択されたラジオボタンの色 */
        .btn-group-toggle label.btn.active {
            background-color: #b89c81;
            color: #fff;
        }
        
        /* 非選択状態のラジオボタンの色 */
        .btn-group-toggle label.btn:not(.active) {
            background-color: #fff;
            color: #000;
            border: 2px solid #dcdcdc;
        }
        
        /* 選択されたラジオボタンにカーソルを合わせた時の文字色 */
        .btn-group-toggle label.btn.active:hover {
            color: #fff;
        }
    </style>
@stop

@section('js')
<script>
    $(function(){
        $( 'input[name="category"]:radio' ).change( function() {
            document.getElementById('search').submit();
        });
        $( 'input[name="period"]:radio' ).change( function() {
            document.getElementById('search').submit();
        });
    });
</script>
@stop