@extends('layouts.app_new')
@section('title','Prices')


@section('content')
{{-- <div class="container-fluid"> --}}
    <!-- BEGIN INTRO SECTION -->
    <div id="intro" class="row flex-fill justify-content-center align-items-center">
        <div class="col-md-8 col-sm-12">
            <div class="card shadow-lg">
                <div class="card-body">
                    <form action="{{route('pricing.price')}}" method="POST">
                        @csrf
                        @method('put')
                        <div class="row my-2 g-2 justify-content-center align-items-center mb-2">
                            <div class="col-sm-12 col-md-6">
                                <label for="residence" class="form-label">{{ __('pricing.COUNTRY_OF_RESIDENCE')
                                    }}</label>
                                <br>
                                <select class="select2" name="trav_res" id="" required style="width: 100%;">
                                    @foreach ($countries as $country)
                                    <option value="{{ $country->id }}" @if($default_country==$country->id) selected
                                        @endif>{{ $country->getName() }}</option>
                                    @endforeach
                                </select>
                            </div>
                            <div class="col-sm-12 col-md-6">
                                <label for="destination" class="form-label">{{ __('pricing.DESTINATION_COUNTRY')
                                    }}</label>
                                <br>
                                <select class="select2" name="trav_dest" id="" required style="width: 100%;">
                                    @foreach ($countries as $country)
                                    <option value="{{ $country->id }}" @if($default_country==old('trav_dest')) selected
                                    @endif>{{ $country->getName() }}</option>
                                    @endforeach
                                </select>
                            </div>
                            <div class="col-sm-12 col-md-6">
                                <label for="trav_date" class="form-label">{{ __('pricing.DATE') }}</label>
                                <input name="trav_date" type="date" class="form-control" min="{{ date('Y-m-d') }}" max="9999-12-31" value="{{ date('Y-m-d') }}">
                            </div>
                            <div class="col-sm-12 col-md-6">
                                <label for="trav_count" class="form-label">{{ __('pricing.NUMBER_OF_TRAVELERS') }}</label>
                                <input id="trav_count" name="trav_count" class="form-control" type="number" min="1"
                                    max="10" value="1">
                            </div>
                            <div class="col-sm-12 col-md-6">
                                <label for="trave_days" class="form-label">{{ __('pricing.DAYS_NUM') }}</label>
                                <input id="trave_days" name="trave_days" class="form-control" type="number" min="1"
                                    value="1">
                            </div>
                        </div>
                        <hr class="text-light">
                        <div id="trav_birth" class="row my-2 g-2 align-items-center justify-content-center mb-2">
                            <div class="col-12 text-center">
                                <label for="birth" class="form-label">{{ __('pricing.TRAVELERS_BIRTH_DATES') }}</label>
                            </div>
                            <div class="col-md-4 trav-col">
                                @if (!empty(old('birth')))
                                @foreach (old('birth') as $key => $value)
                                <label for="birth" class="form-label">{{ __('pricing.TRAVELER_NUMBER') }}$key</label>
                                <input type="date" class="form-control" name="birth[]" max="{{ date('Y-m-d') }}"
                                    value="{{$value}}">
                                @endforeach
                                @else
                                <label for="birth" class="form-label">{{ __('pricing.TRAVELER_NUMBER') }} 1</label>
                                <input type="date" class="form-control" name="birth[]" max="{{ date('Y-m-d') }}">
                                @endif
                                {{-- @if(!empty(old('birth'))
                                --}}


                                {{-- @endforeach
                                @endif --}}

                            </div>
                        </div>
                        <div class="row my-2 ">
                            <div class="col">
                                <button type="submit" class="btn btn-primary float-end">{{ __('Submit') }}</button>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>

        <!-- BEGIN ABOUT SECTION -->

        <!-- END ABOUT SECTION -->
    </div>
    <!-- END INTRO SECTION -->
{{-- </div> --}}
@endsection
@section('script')
<script>
    $(".select2").select2({             theme: 'bootstrap-5' });
        $("#trav_count").on('change', function() {
            $('.trav-col').remove();
            var c = $("#trav_count").val();
            for (let i = 0; i < c; i++) {
                $('#trav_birth').append(
                    `<div class="col-md-4 trav-col">
                        <label for="birth" class="form-label">{{ __('pricing.TRAVELER_NUMBER') }} ${i+1}</label>
                        <input type="date" class="form-control" name="birth[]" max="{{ date('Y-m-d') }}" required>
                </div>`
                );
            }
        })
</script>
@endsection