@extends('backend.layouts_backend.master2')

@section('title')
    All Bookings
@endsection

@section('content')
    {{-- header --}}
    <div class="d-flex justify-content-between align-items-center flex-wrap grid-margin">
        <div>
            <h4 class="mb-3 mb-md-0"> All Bookings</h4>
        </div>
        <div class="d-flex align-items-center flex-wrap text-nowrap">

            <a href="/admin/studio_business_bookings/create"><button type="button"
                    class="btn btn-primary btn-icon-text me-2 mb-2 mb-md-0">
                    <i class="btn-icon-prepend" data-feather="plus-circle"></i>
                    Add Booking
                </button> </a>
            {{-- <a href="/admin/studio_business_bookings"><button type="button" class="btn btn-success btn-icon-text me-2 mb-2 mb-md-0">
                    <i class="btn-icon-prepend" data-feather="eye"></i>
                    View Bookings
                </button> </a> --}}

        </div>
    </div>

    {{-- end header --}}

    <div class="justify-content-center">

        @include('backend.includes.message_alerts')

        <div class="card">

            <div class="card-body">
                <div class="table-responsive">
                    <table id="dataTableExample" class="table">
                        <thead>
                            <tr>
                                <th>#Id</th>
                                <th> Code</th>
                                <th>Product/Package </th>
                                <th>Client</th>
                                <th>Booked On</th>
                                <th>Total to Pay</th>
                                <th>Paid</th>
                                <th>Balance</th>
                                <th>Status</th>
                                {{-- <th>Created By</th> --}}
                                <th style="width:300px;">Action</th>
                            </tr>
                        </thead>
                        <tbody>

                            @foreach ($studio_business_bookings as $booking)
                                <tr>
                                    <td>{{ $booking->id ?? '' }}</td>
                                    <td>{{ $booking->booking_code ?? '' }}</td>
                                    <td>{{ $booking->product->product_name ?? '' }}</td>
                                    <td>{{ $booking->client->first_name ?? '' }} {{ $booking->client->last_name ?? '' }}
                                        {{ $booking->client->other_names ?? '' }}</td>
                                    <td>{{ short_date($booking->booking_date) ?? '' }}</td>
                                    <td>{{ $booking->total_amount_to_pay ?? '' }}</td>
                                    <td>{{ $booking->amount_paid ?? '' }}</td>
                                    <td>{{ $booking->balance ?? '' }}</td>
                                    <td>{!! get_booking_status($booking->booking_status) !!} </td>



                                    {{-- <td>{{ get_user_fullname($booking->created_by) ?? '' }}</td> --}}
                                    <td>
                                        <div class="d-flex align-items-center flex-wrap text-nowrap">
                                            {{-- @can('county-show') --}}

                                            <button type="button" class="btn btn-success btn-icon me-2 mb-2 mb-md-0"
                                                data-bs-toggle="modal" data-bs-target="#exampleModal{{ $booking->id }}">
                                                <i class="btn-icon-prepend" data-feather="eye"></i>
                                            </button>

                                            {{-- @endcan --}}

                                            {{-- @can('county-edit') --}}
                                            <a href="{{ route('studio_business_bookings.edit', $booking->id) }}">
                                                <button type="button" class="btn btn-primary btn-icon me-2 mb-2 mb-md-0">
                                                    <i class="btn-icon-prepend" data-feather="edit"></i>

                                                </button> </a>

                                            {{-- @endcan --}}

                                            {{-- @can('county-delete') --}}
                                            <form action="{{ route('studio_business_bookings.destroy', $booking->id) }}"
                                                method="post">
                                                @csrf
                                                @method('DELETE')
                                                <a>
                                                    <button type="submit"
                                                        class="btn btn-danger btn-icon me-2 mb-2 mb-md-0">
                                                        <i class="btn-icon-prepend" data-feather="trash-2"></i>

                                                    </button> </a>
                                            </form>
                                            {{-- @endcan --}}
                                        </div>

                                        <br>
                                    </td>

                                </tr>

                                {{-- view  details modal --}}
                                <div class="modal fade " id="exampleModal{{ $booking->id }}" tabindex="-1"
                                    aria-labelledby="exampleModalLabel" aria-hidden="true">
                                    <div class="modal-dialog modal-dialog-scrollable">
                                        <div class="modal-content">
                                            <div class="modal-header">
                                                <h5 class="modal-title" id="exampleModalLabel">Booking Details</h5>
                                                <button type="button" class="btn-close" data-bs-dismiss="modal"
                                                    aria-label="btn-close"></button>
                                            </div>
                                            <div class="modal-body">
                                                <ul class="list-group">
                                                    <li class="list-group-item">Booking code :
                                                        {{ $booking->booking_code ?? '' }} </li>
                                                    <li class="list-group-item">Product/Package :
                                                        {{ $booking->product->product_name ?? '' }} </li>
                                                    <li class="list-group-item">Client :
                                                        {{ $booking->client->first_name ?? '' }}
                                                        {{ $booking->client->last_name ?? '' }}
                                                        {{ $booking->client->other_names ?? '' }} </li>
                                                    <li class="list-group-item">Booking date :
                                                        {{ short_date($booking->booking_date) ?? '' }} </li>
                                                    <li class="list-group-item">Booking Time :
                                                        {{ $booking->booking_time ?? '' }} </li>
                                                    <li class="list-group-item">Job Location :
                                                        {{ $booking->job_location ?? '' }} </li>
                                                    <li class="list-group-item">Booking Status :
                                                        {!! get_booking_status($booking->booking_status) !!}
                                                    </li>
                                                    <li class="list-group-item">Payment Status :
                                                        {{ get_payment_status($booking->payment_status ?? '') }} </li>
                                                    <li class="list-group-item">Payment Method :
                                                        {{ get_payment_method($booking->payment_method ?? '') }} </li>
                                                    <li class="list-group-item">Payment Date :
                                                        {{ short_date($booking->payment_date) ?? '' }}</li>

                                                    <li class="list-group-item">Total Amount To Pay :
                                                        {{ $booking->total_amount_to_pay ?? '' }}
                                                    </li>
                                                    <li class="list-group-item">Status :
                                                        {{ $booking->booking_status ?? '' }}
                                                    </li>
                                                    <li class="list-group-item">Amount Paid :
                                                        {{ $booking->amount_paid ?? '' }}
                                                    </li>
                                                    <li class="list-group-item">Amount Balance :
                                                        {{ $booking->balance ?? '' }}
                                                    </li>
                                                    <li class="list-group-item">Created By :
                                                        {{ get_user_fullname($booking->created_by) ?? '' }}</li>
                                                    <li class="list-group-item">Description :
                                                        {{ $booking->booking_details ?? '' }} </li>

                                                </ul>

                                            </div>
                                            <div class="modal-footer">
                                                <button type="button" class="btn btn-secondary"
                                                    data-bs-dismiss="modal">Close</button>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                {{--   end of view modal --}}
                            @endforeach

                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
@endsection