{{-- @dd(date('d-m-Y', strtotime($date))) --}}
<div class="card card-info">
    <div class="card-header">
        <h3 class="card-title">
            <i class="fa fa-th mr-1"></i>
            Booking List</h3>
        <div class="card-tools d-flex">
            <input type="date" class="form-control local_date" id="booding_date" value="{{$date}}"
            onchange="bookingList('{{ $game_id }}', this.value, '{{ $type }}')"/>
            @if($type)
                <button type="button" class="btn btn-tool" data-card-widget="collapse">
                    <i class="fas fa-minus"></i>
                </button>
            @endif
        </div>
    </div>
    <div class="card-body">
        <div class="d-flex flex-wrap">
            @foreach ($time_slot->time_slot->details as $slot)
                @php
                    $hasBooks = $today_books->where('date',$date)->where('start_time','=',$slot->start_time)->where('end_time','=',$slot->end_time);
                @endphp
                <div class="p-2" style="width: 270px">
                    <div style="background: #000000; padding: 5px; color:white;">
                        {{date('h:i A', strtotime($slot->start_time))}} - {{date('h:i A', strtotime($slot->end_time))}}
                    </div>
                    @if($hasBooks->count() > 0)
                        @if($type)
                            @foreach ($hasBooks as $hasBook)
                                @php
                                    $bookStatus = $hasBook->transactionStatus;
                                @endphp
                                    <button type="button" onclick="bookingTransaction('{{ encrypt($hasBook->id) }}')"
                                        style="background: rgb(0, 122, 27); padding: 5px; color: white; width:100%; border: none; border-top: 1px solid black;">
                                        <span class="{{ $bookStatus?->icon }}">{{ $bookStatus?->name }}</span>
                                        {{$hasBook->user ? $hasBook->user->name : $hasBook->booker_name}}
                                        @if($hasBook->dueAmount() < 0)
                                            <span class="badge badge-danger">{{ abs($hasBook->dueAmount()) }}</span>
                                        @elseif($hasBook->dueAmount() == 0)
                                        @else
                                            <span class="badge badge-info">{{ abs($hasBook->dueAmount()) }}</span>
                                        @endif
                                    </button>
                            @endforeach
                            @if ($bookStatus?->id == 9)
                                @if (strtotime($date . ' ' . $slot->start_time) >= strtotime(date("Y-m-d H:i:s",time())) || $type)
                                    <button type="button" onclick="bookingCreate({{ $game_id }}, '{{$date}}','{{$slot->start_time}}','{{$slot->end_time}}','{{$slot->price}}','{{$type}}', '{{$slot->id}}')"
                                        style="background: #ebebeb; padding: 5px; width:100%; border: none;">
                                            ৳{{$slot->price}}
                                    </button>
                                @else
                                    <label style="background: #ebebeb; padding: 5px; width:100%; border: none; text-align: center;">৳{{$slot->price}}</label>
                                @endif
                            @endif
                        @else
                            @if($hasBooks->last()->transactionStatus?->id == 9)
                                @if (strtotime($date . ' ' . $slot->start_time) >= strtotime(date("Y-m-d H:i:s",time())) || $type)
                                    <button type="button" onclick="bookingCreate({{ $game_id }}, '{{$date}}','{{$slot->start_time}}','{{$slot->end_time}}','{{$slot->price}}','{{$type}}', '{{$slot->id}}')"
                                        style="background: #ebebeb; padding: 5px; width:100%; border: none;">
                                            ৳{{$slot->price}}
                                    </button>
                                @else
                                    <label style="background: #ebebeb; padding: 5px; width:100%; border: none; text-align: center;">৳{{$slot->price}}</label>
                                @endif
                            @else
                                @if(auth()->check())
                                    @if ($hasBooks->last()->user_id == auth()->user()->id)
                                        <div style="background: #007a1b; padding: 5px; color: white; text-align: center;">Booked</div>
                                    @else
                                        <div style="background: #a90000; padding: 5px; color: white; text-align: center;">Booked</div>
                                    @endif
                                @else
                                    <div style="background: #a90000; padding: 5px; color: white; text-align: center;">Booked</div>
                                @endif
                            @endif
                        @endif
                    @else
                        @if (strtotime($date . ' ' . $slot->start_time) >= strtotime(date("Y-m-d H:i:s",time())) || $type)
                            <button type="button" onclick="bookingCreate({{ $game_id }}, '{{$date}}','{{$slot->start_time}}','{{$slot->end_time}}','{{$slot->price}}','{{$type}}', '{{$slot->id}}')"
                                style="background: #ebebeb; padding: 5px; width:100%; border: none;">
                                    ৳{{$slot->price}}
                            </button>
                        @else
                            <label style="background: #ebebeb; padding: 5px; width:100%; border: none; text-align: center;">৳{{$slot->price}}</label>
                        @endif
                    @endif
                </div>
            @endforeach
        </div>
    </div>
</div>

<script>

    function bookingList(game_id, date, type) {
        data = {
            'game_id': game_id,
            'date': date,
            'type': type,
            _token: "{{ csrf_token() }}",
        }
        $.ajax({
            url: "{{route('get_booking_list')}}",
            type: "GET",
            data: data,
            success: function (response) {
                if(response.status == 'success'){
                    $('#bookingList'+game_id).html(response.html);
                }
            },
            error: function (error) {
                toastr.error('Something went wrong');
            }
        });
    }

    function bookingCreate(game_id, date, start_time, end_time, amount, type, slot_id) {
        $.ajax({
            url: `{{ route('sports-transaction-sport_booking-create') }}`,
            type: 'GET',
            data: {
                game_id: game_id,
                date : date,
                start_time: start_time,
                end_time: end_time,
                amount: amount,
                type: type,
                slot_id: slot_id,
                _token: '{{ csrf_token() }}'
            },
            success: function (response) {
                if(response.status == 'success') {
                    $('#modal-data').html(response.html);
                    $('#modal-show').modal('show');
                } else {
                    toastr.error(response.message);
                }
            },
            error: function (error) {
                if(error.responseJSON.message == 'Unauthenticated.') {
                    toastr.error(error.responseJSON.message);
                    window.location.href = '{{ route("login") }}';
                }
                toastr.error(error.responseJSON.message);
            }
        });
    }

    function bookingTransaction(id) {
        $.ajax({
            url: `{{ route('sports-transaction-sport_booking-transactions') }}`,
            type: 'GET',
            data: {
                id: id,
                _token: '{{ csrf_token() }}'
            },
            success: function (response) {
                if(response.status == 'success') {
                    $('#modal-data').html(response.html);
                    $('#modal-show').modal('show');
                } else {
                    toastr.error(response.message);
                }
            },
            error: function (error) {
                toastr.error('Something went wrong');
            }
        });
    }
</script>