@extends('layouts.app_booking')
@section('title',__('new.booking_by_staff'))
@section('content')
    <section class="content-header">
        <nav aria-label="breadcrumb">
            <ol class="breadcrumb breadcrumb-style1">
                <li class="breadcrumb-item">
                    <a href="#">{{__('home.home')}}</a>
                </li>
                <li class="breadcrumb-item">
                    <a href="#">{{__('restaurant.bookings')}}</a>
                </li>
                <li class="breadcrumb-item active"> {{__('new.booking_by_staff')}}  ({{ $day }})</li>
            </ol>
        </nav>

    </section>
    <div class="container">

        @component('components.filters', ['class' => 'card'])
            <div class="row mb-3">
                <!-- فلتر الفرع -->
                <div class="col-sm-3">
                    <div class="form-floating form-floating-outline mt-2">
                        {!! Form::select('location_id', $business_locations, $location_id,
                            ['id'=>'location_filter','class' => 'form-control select2',
                             'style'=>'width:100%', 'placeholder'=>__('lang_v1.all') ]); !!}
                        {!! Form::label('location_filter', __('purchase.business_location') . ':') !!}
                    </div>
                </div>
                <!-- فلتر العميل -->
                <div class="col-sm-3">
                    <div class="form-floating form-floating-outline mt-2">
                        {!! Form::select('customer_id', $customers, $customer_id,
                            ['id'=>'customer_filter','class'=>'form-control select2',
                             'style'=>'width:100%', 'placeholder'=>__('lang_v1.all') ]); !!}
                        {!! Form::label('customer_filter', __('contact.customer') . ':') !!}
                    </div>
                </div>
                <!-- فلتر اليوم -->
                <div class="col-sm-3">
                    <div class="form-floating form-floating-outline mt-2">
                        {!! Form::date('day', $day, ['id'=>'day_filter','class'=>'form-control']) !!}
                        {!! Form::label('day_filter', __('new.select_date') . ':') !!}
                    </div>
                </div>
            </div>
        @endcomponent
        <div class="card mt-5">

            <div class="row p-3" id="staff_services_grid">
                @forelse($services_by_staff as $staff_id => $services)
                    @php
                        $staff_name = $services->first()->staff_name;
                    @endphp

                    <div class="col-sm-3 mt-5">
                        <div class="card mb-3" id="printable-card">
                            <span class="position-absolute top-0 no-print start-100 translate-middle badge badge-center bg-label-danger border border-warning">{{count($services)}}</span>

                            <div class="card-header bg-primary text-white">
                                <strong>👨‍💼 {{ \App\User::find($staff_id) ? \App\User::find($staff_id)->first_name  . ' '. \App\User::find($staff_id)->last_name  : ' '}}  </strong>
                            </div>
                            <div class="card-body mt-1">
                                @foreach($services as $srv)
                                    <p class="border-bottom pb-1 mb-2 {{$srv->booking_status == 'completed' ? 'bg-label-success':''}}">
                                        <strong>🛎 {{__('new.booking_no')}}:</strong> {{ $srv->invoice_no }} <br>
                                        <strong>🛎 {{__('new.service')}}:</strong> {{ $srv->product_name }} <br>
                                        <strong>🚦 {{__('new.status')}}:</strong>
                                        @php
                                            $color = $srv->booking_status == 'completed' ? 'green' :
                                                     ($srv->booking_status == 'waiting' ? 'orange' : 'red');
                                        @endphp
                                        <span style="color: {{ $color }}">{{__('restaurant.'. $srv->booking_status )}}</span>
                                        <br>
                                        <small class="text-muted">(@lang('new.customer'): {{ \App\Contact::find($srv->contact_id)->name }})</small>
                                    <br>
                                        <small class="text-muted">(@lang('restaurant.booking_time'): {{ date('h:i A', strtotime($srv->booking_start_time))}})</small>
                                    </p>
                                @endforeach
                            </div>

                        </div>
                    </div>
                @empty
                    <div class="col-sm-12">
                        <p class="text-center text-muted">🚫{{__('new.no_booking_today')}}</p>
                    </div>
                @endforelse
            </div>
        </div>
    </div>
@endsection

@section('javascript')
    <script>
        $(document).ready(function() {
            $('#location_filter, #customer_filter, #day_filter').on('change', function() {
                filterBookings();
            });

            function filterBookings(){
                let location_id = $('#location_filter').val() || '';
                let customer_id = $('#customer_filter').val() || '';
                let day = $('#day_filter').val() || '';

                let url = "{{ route('bookings.staff_services_grid') }}";

                // إعادة تحميل الصفحة ببرامترات الفلاتر
                window.location.href = url + "?location_id=" + location_id + "&customer_id=" + customer_id + "&day=" + day;
            }
        });

    </script>
@endsection