@extends('layouts.web')

@section('css')
<link href="{{ asset('css/dataTables.bootstrap4.min.css') }}" rel="stylesheet" />
<link href="{{ asset('css/bootstrap-datepicker.min.css') }}" rel="stylesheet" />
<link href="{{ asset('css/bootstrap-select.min.css') }}" rel="stylesheet" />
<link href="{{ asset('css/icheck-bootstrap.min.css') }}" rel="stylesheet" />
<link href="{{ asset('css/sweetalert2.min.css') }}" rel="stylesheet" />
<style>
    .bootstrap-datetimepicker-widget tr:hover {
        background-color: #808080;
    }
    .calendar tr {
        line-height: 12px;
        font-size: 12px;
    }
    .sig {
        border: 2px solid rgb(22, 22, 22);
    }
</style>
@endsection

@section('content')
<div class="container-fluid pt-3">
    <div class="row">
        <div class="col-4">
            <form action="{{ route('calendar.submit') }}"
            novalidate class="{{ ($errors->any()) ? 'was-validated' : 'needs-validation' }}"
            method="get"
            >
            {{-- @csrf --}}
                <div class="form-group">
                    <label for="date">วันที่ (ระบบจะแสดงตารางเป็นรายสัปดาห์)<span class="text-red">*</span></label>
                    <div class="input-group mb-3">
                        <input type="text" class="form-control datepiacker" id="date" name="date" placeholder="วันที่" autocomplete="off" value="{{$date}}" required>
                        <div class="input-group-append">
                            <span class="input-group-text"><i class="far fa-calendar-alt"></i></span>
                        </div>
                        <button type="submit" class="btn btn-outline-success show-outline-btn ml-2" value="add-student">แสดง</button>
                    </div>
                    @error('date')
                    <div class="text-danger">{{ $message }}</div>
                    @enderror
                </div>
            </form>
        </div>
    </div>
    <div class="row mt-3">
        <div class="col-12">
            <div class="d-flex justify-content-center">
                {!! $vehicles->links() !!}
            </div>
            @foreach($vehicles as $keyIndex => $vehicle)
                <div class="card">
                    <div class="card-body">
                        <label>{{ $vehicle->type . " (" . $vehicle->gear . ") คันที่ : ".$vehicle->number . " , " . $vehicle->brand." ".$vehicle->model. " [ ".$vehicle->registration_class." ".$vehicle->registration_number." ]" }}</label>
                        @for($w=0; $w<count($week); $w++)
                        <div class="row align-items-center mt-2 @if(date('Y-m-d')==$week[$w]) bg-today @endif">
                            <div class="col-1">
                                <p style="font-size: 12px;">วันที่ {{ showDateToCalendar($week[$w])}}</p>
                            </div>
                            <div class="col-11">
                                <table class="table table-sm calendar" id="vehicle{{$vehicle->id}}">
                                    <thead>
                                        <tr>
                                            <th scope="col" width="16%"></th>
                                            @for($i=7; $i<21; $i++)
                                            <th scope="col" colspan="2" width="6%" class="text-center">
                                                @if(date('Y-m-d') <= $week[$w])
                                                    @if(date('Y-m-d') == $week[$w])
                                                        @if(date('H') < $i)
                                                            <a href="#" data-toggle="modal" data-target="#vehicleBookingModal"
                                                                data-vehicle="{{ $vehicle->id }}"
                                                                data-type="{{ $vehicle->type }}"
                                                                data-date="{{ $week[$w] }}"
                                                                data-time="{{ $i }}"
                                                            >{{ $i .":00"}}</a>
                                                            @extends('calendar.modal_vehicle_booking')
                                                        @else
                                                            {{ $i .":00"}}
                                                        @endif
                                                    @else
                                                        <a href="#" data-toggle="modal" data-target="#vehicleBookingModal"
                                                                data-vehicle="{{ $vehicle->id }}"
                                                                data-type="{{ $vehicle->type }}"
                                                                data-date="{{ $week[$w] }}"
                                                                data-time="{{ $i }}"
                                                            >{{ $i .":00"}}</a>
                                                        @extends('calendar.modal_vehicle_booking')
                                                    @endif
                                                @elseif(date('Y-m-d') > $week[$w])
                                                {{ $i .":00"}}
                                                @endif

                                            </th>
                                            @endfor
                                        </tr>
                                    </thead>
                                    <tbody>
                                        <tr>
                                            <td width="16%">เพิ่มประสบการณ์</td>
                                            @for($i=0; $i<28; $i++)
                                                @if($arr1[$w][$vehicle->id][$i] != '-1')
                                                <td @if($arrSpan1[$w][$vehicle->id][$i] > '1') colspan="{{$arrSpan1[$w][$vehicle->id][$i]}}" class="bg-primary border-right border-left text-center @if($arrSig1[$w][$vehicle->id][$i]=='1') sig @endif" @endif width="{{ (($arrSpan1[$w][$vehicle->id][$i])*3) ."%" }}" >
                                                @if('1' == $arr1[$w][$vehicle->id][$i])
                                                    <a href="#teacherModal1{{$vehicle->id.$w.$i}}" data-toggle="modal" data-target="#teacherModal1{{$vehicle->id.$w.$i}}">
                                                        {{ getFirstname($arrValue1[$w][$vehicle->id][$i]) }}
                                                    </a>
                                                    @include('calendar.modal_booking_1')
                                                @endif
                                                </td>
                                                @endif
                                            @endfor
                                        </tr>
                                        <tr>
                                            <td width="16%">เรียนและสอบ</td>
                                            @for($i=0; $i<28; $i++)
                                                @if($arr2[$w][$vehicle->id][$i] != '-1')
                                                <td @if( $arrSpan2[$w][$vehicle->id][$i] > '1' ) colspan="{{$arrSpan2[$w][$vehicle->id][$i]}}" class="@if($arrGear2[$w][$vehicle->id][$i]=='m') bg-danger @else bg-success @endif border-right border-left text-center @if($arrSig2[$w][$vehicle->id][$i]=='1') sig @endif" @endif width="{{(($arrSpan2[$w][$vehicle->id][$i])*3)}}%" >
                                                @if('1' == $arr2[$w][$vehicle->id][$i])
                                                    <a href="#teacherModal2{{$vehicle->id.$w.$i}}" data-toggle="modal" data-target="#teacherModal2{{$vehicle->id.$w.$i}}">
                                                        <span class="@if($arrSig2[$w][$vehicle->id][$i]=='1') font-weight-bold font-italic @endif">{{ wordwrap(getFirstname($arrValue2[$w][$vehicle->id][$i])) }}</span>
                                                    </a>
                                                    @include('calendar.modal_booking_2')
                                                @endif
                                                </td>
                                                @endif
                                            @endfor
                                        </tr>
                                        <tr>
                                            <td>เก็บชั่วโมงเพื่อสอบ</td>
                                            @for($i=0; $i<28; $i++)
                                                @if($arr3[$w][$vehicle->id][$i] != '-1')
                                                <td @if($arrSpan3[$w][$vehicle->id][$i] > '1') colspan="{{$arrSpan3[$w][$vehicle->id][$i]}}" class="bg-warning border-right border-left text-center @if($arrSig3[$w][$vehicle->id][$i]=='1') sig @endif" @endif width="{{ (((int)$arrSpan3[$w][$vehicle->id][$i])*3) ."%" }}" >
                                                @if('1' == $arr3[$w][$vehicle->id][$i])
                                                    <a href="#teacherModal3{{$vehicle->id.$w.$i}}" data-toggle="modal" data-target="#teacherModal3{{$vehicle->id.$w.$i}}">
                                                        {{ getFirstname($arrValue3[$w][$vehicle->id][$i]) }}
                                                    </a>
                                                    @include('calendar.modal_booking_3')
                                                   
                                                @endif
                                                </td>
                                                @endif
                                            @endfor
                                        </tr>
                                    </tbody>
                                </table>
                            </div>
                        </div>
                        @endfor
                    </div>
                </div>
            @endforeach
            <div class="d-flex justify-content-center">
                {!! $vehicles->appends(request()->query())->links() !!}
            </div>
        </div>

    </div>
</div>
@endsection

@section('footerscript')
<script src="{{ asset('js/sweetalert2.min.js') }}"></script>
<script src="{{ asset('js/bootstrap-select.min.js') }}"></script>
<script src="{{ asset('js/jquery.dataTables.min.js') }}"></script>
<script src="{{ asset('js/dataTables.bootstrap4.min.js') }}"></script>
<script src="{{ asset('js/bootstrap-datepicker.min.js') }}"></script>
<script src="{{ asset('js/bootstrap-datepicker.th.min.js') }}"></script>
<script src="{{ asset('js/calendar.js') }}"></script>
<script src="{{ asset('js/custom.js') }}"></script>
{{-- <script>
    Swal.fire({
                text: '{{ session('feedback') }}',
                icon: 'success',
                confirmButtonText: 'ตกลง',
                confirmButtonColor: '#62966C'
    })
</script> --}}
@endsection
