@extends('layouts.app')
@section('title', __('gbs::lang.edit_visit'))

@section('content')
<section class="content-header">
    <h1 class="tw-text-xl md:tw-text-3xl tw-font-bold tw-text-black">@lang('gbs::lang.edit_visit')</h1>
</section>

<section class="content">
    {!! Form::model($route, [
        'url' => action([\Modules\Gbs\Http\Controllers\RouteController::class, 'update'], [$route->id]),
        'method' => 'PUT',
        'id' => 'edit_route_form',
    ]) !!}

    @component('components.widget', ['class' => 'box-primary'])
        <div class="row">

            {{-- بيانات المسار --}}
            <div class="col-sm-4">
                <div class="form-group">
                    {!! Form::label('name', __('gbs::lang.route_name') . ':*') !!}
                    {!! Form::text('name', null, ['class' => 'form-control', 'required', 'placeholder' => __('gbs::lang.route_name')]) !!}
                </div>

                <div class="form-group">
                    {!! Form::label('user_id', __('gbs::lang.users') . ':*') !!}
                    {!! Form::select('user_id', $users, $route->user_id, ['class' => 'form-control select2', 'required']) !!}
                </div>
            </div>

            @php
                $days = [
                    'sunday' => __('gbs::lang.sunday'),
                    'monday' => __('gbs::lang.monday'),
                    'tuesday' => __('gbs::lang.tuesday'),
                    'wednesday' => __('gbs::lang.wednesday'),
                    'thursday' => __('gbs::lang.thursday'),
                    'friday' => __('gbs::lang.friday'),
                    'saturday' => __('gbs::lang.saturday'),
                ];

                $intervals = [7, 14, 21, 28];
                $intervalLabels = [
                    7 => __('gbs::lang.every_week'),
                    14 => __('gbs::lang.every_2_weeks'),
                    21 => __('gbs::lang.every_3_weeks'),
                    28 => __('gbs::lang.every_4_weeks'),
                ];
            @endphp

            <div class="col-sm-8">
                @foreach($days as $key => $dayName)
                    <div class="day-container">
                        <h4 class="day-title">{{ $dayName }}</h4>
                        @php $counter = 0; @endphp
                        <div class="interval-row">
                            @foreach($intervals as $interval)
                                <div class="form-group" style="flex:1;">
                                    <label for="contacts_{{ $key }}_{{ $interval }}">
                                        {{ __('gbs::lang.contacts_for') }} - {{ $intervalLabels[$interval] }}
                                    </label>
                                    {!! Form::select(
                                        "contacts[$key][$interval][]", 
                                        $clients, 
                                        $selectedContacts[$key][$interval] ?? [], 
                                        [
                                            'class' => 'form-control select2-ajax',
                                            'multiple',
                                            'data-placeholder' => __('gbs::lang.select_clients'),
                                            'id' => "contacts_{$key}_{$interval}"
                                        ]
                                    ) !!}
                                </div>

                                @php
                                    $counter++;
                                    if($counter % 2 == 0){
                                        echo '</div><div class="interval-row">';
                                    }
                                @endphp
                            @endforeach
                        </div>
                    </div>
                @endforeach
            </div>

        </div>
    @endcomponent

    <button type="submit" class="tw-dw-btn tw-dw-btn-primary tw-dw-btn-lg tw-text-white mt-3">
        {{ __('messages.update') }}
    </button>

    {!! Form::close() !!}
</section>
@endsection

@section('javascript')
<script>
$(document).ready(function () {
    $('.select2-ajax').select2({
        placeholder: '{{ __("gbs::lang.select_clients") }}',
        minimumInputLength: 1,
        ajax: {
            url: '{{ route("gbs.clients.search") }}',
            dataType: 'json',
            delay: 250,
            data: function (params) { return { q: params.term }; },
            processResults: function (data) {
                return {
                    results: $.map(data, function (item) {
                        return { text: item.name, id: item.id }
                    })
                };
            },
            cache: true
        }
    });
});
</script>

<style>
.day-container {
    background-color: #f9f9f9;
    padding: 20px;
    margin-bottom: 20px;
    border-radius: 10px;
    border: 1px solid #e2e2e2;
}

.day-title {
    font-weight: 600;
    margin-bottom: 15px;
    color: #333;
}

.interval-row {
    display: flex;
    gap: 15px;
    margin-bottom: 15px;
}

select.form-control {
    min-height: 100px;
}
</style>
@endsection