@extends('layouts.app', [
    'title' => __('User Management'),
    'parentSection' => 'laravel',
    'elementName' => 'user-management'
])
<meta name="csrf-token" content="{{ csrf_token() }}">
@section('title', 'Novo Produto |')
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.1.1/css/all.min.css" integrity="sha512-KfkfwYDsLkIlwQp6LFnl8zNdLGxu9YAA1QvwINks4PhcElQSvqcyVLLD9aMhXd13uQjoXtEKNosOWaZqXgel0g==" crossorigin="anonymous" referrerpolicy="no-referrer" />

@section('content')
    @component('layouts.headers.auth')
        @component('layouts.headers.breadcrumbs')
            @slot('title')
               Novo Produto
            @endslot

            <li class="breadcrumb-item"><a class="text-default" href="{{ route('sales.show', $sale->id) }}">Venda do cliente {{ $sale->first_name . " ". $sale->last_name}} </a></li>
        @endcomponent
    @endcomponent

    <div class="container-fluid mt--6">
        <div class="row">
            <div class="col-xl-12 order-xl-1">
                <div class="card">
                    <div class="card-header">
                        <div class="row align-items-center">
                            <div class="col-8">
                                <h6 class="modal-title" id="modal-title-default">Adicionar Produto na Venda #{{$sale->id}}</h6>
                            </div>
                            <div class="col-4 text-right">
                                <a href="{{ route('sales.show', $sale->id) }}" class="btn btn-sm btn-primary">Voltar</a>
                            </div>
                        </div>
                    </div>
                    <div class="card-body">
                        <form action="{{route('salesproduct.store')}}" method="POST" enctype="multipart/form-data">
                            @csrf
                            <div class="row">
                                <div class="col-4">
                                    <div class="form-group">
                                        <label class="form-control-label text-left" style="float:left"  for="basic-url">Fornecedor</label>
                                        <select name="provider_id" id="provider_id" value="{{old('provider_id')}}"  class="form-control select2" @error('provider_id') is-invalid @enderror>
                                            <option value=""> -- Selecione --</option>
                                            @foreach ($providers as $provider)
                                                <option value="{{$provider->id}}">{{ $provider->name }}</option>
                                            @endforeach
                                        </select>
                                    </div>
                                </div>
                                <div class="col-4">
                                    <div class="form-group">
                                        <label class="form-control-label text-left" style="float:left"  for="basic-url">Produto</label>
                                        <select name="product_id" id="product_id" value="{{old('product_id')}}"  class="form-control select2" @error('product_id') is-invalid @enderror>
                                            <option value=""> -- Selecione --</option>
                                        </select>
                                    </div>
                                </div>
                                <div class="col-4">
                                    <div class="form-group{{ $errors->has('supplier_id') ? ' has-danger' : '' }}">
                                        <label class="form-control-label text-left" style="float:left"  for="basic-url">Prestador</label>
                                        <select name="supplier_id" id="supplier_id" value="{{old('supplier_id')}}" class="form-control select2" @error('supplier_id') is-invalid @enderror>
                                            <option value=""> -- Selecione --</option>
                                            @foreach ($suppliers as $supplier)
                                                <option value="{{$supplier->id}}">{{ $supplier->name }}</option>
                                            @endforeach
                                        </select>
                                        @include('alerts.feedback', ['field' => 'supplier_id'])
                                    </div>
                                </div>
                            </div>
                            <!-- Flights -->
                            <div id="flights" style="display: none;">
                                <div class="row">
                                    <div class="col-6">
                                        <div class="form-group{{ $errors->has('pickup_local_flight') ? ' has-danger' : '' }}">
                                            <label class="form-control-label text-left" style="float:left" for="basic-url"><i class="fa-solid fa-plane-circle-check"></i> De onde</label>
                                            <label class="custom-toggle" style="margin-left: 15px;">
                                                <input type="checkbox" name="modality" value="1" checked>
                                                <span class="custom-toggle-slider rounded-circle" data-label-off="Volta" data-size="mini" data-label-on="Ida" data-style-on="success" data-style-off="warning"></span>
                                            </label>
                                            <select name="pickup_local_flight" id="pickup_local_flight" value="{{old('pickup_local_flight')}}" class="form-control select2" @error('pickup_local_flight') is-invalid @enderror>
                                                <option value=""></option>
                                                    @foreach ($airports as $airport)
                                                        <option value="{{ $airport->id }}" title=" País-Estado: {{ ($airport->iso_region) }} | Cidade: {{ ($airport->municipality) }} | Nome do Aeroporto: {{ ($airport->name) }}" >{{ substr($airport->iso_country. " | ". $airport->iata_code . " | ". $airport->municipality . " | ". $airport->name, 0, 60) }}</option>
                                                    @endforeach
                                            </select>
                                        @include('alerts.feedback', ['field' => 'pickup_local_flight'])
                                        </div>
                                    </div>
                                    <div class="col-6">
                                        <div class="form-group{{ $errors->has('dropoff_local_flight') ? ' has-danger' : '' }}">
                                            <label class="form-control-label text-left" style="float:left" for="basic-url"><i class="fa-solid fa-plane-circle-check"></i> Para onde</label>
                                            <select name="dropoff_local_flight" id="dropoff_local_flight" value="{{old('dropoff_local_flight')}}" class="form-control select2" @error('dropoff_local_flight') is-invalid @enderror>
                                                <option value=""></option>
                                                    @foreach ($airports as $airport)
                                                        <option value="{{ $airport->id }}" title=" País-Estado: {{ ($airport->iso_region) }} | Cidade: {{ ($airport->municipality) }} | Nome do Aeroporto: {{ ($airport->name) }}">{{ substr($airport->iso_country. " | ". $airport->iata_code . " | ". $airport->municipality . " | ". $airport->name, 0, 60) }}</option>
                                                    @endforeach
                                            </select>
                                        @include('alerts.feedback', ['field' => 'pickup_local_flight'])
                                        </div>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col-4">
                                        <div class="form-group">
                                        <label class="form-control-label text-left" style="float:left" for="basic-url">Partida</label>
                                            <div class="input-group">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="basic-addon1"><i class="ni ni-calendar-grid-58"></i></span>
                                                </div>
                                                <input type="text" class="form-control" value="{{$sale->id}}" name="sale_id" hidden>
                                                <input type="datetime-local" class="form-control" name="start_datetime_flight" id="start_datetime_flight" value="{{ old('start_datetime') }}">
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-4">
                                        <div class="form-group">
                                        <label class="form-control-label text-left" style="float:left" for="basic-url">Chegada</label>
                                            <div class="input-group">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="basic-addon1"><i class="ni ni-calendar-grid-58"></i></span>
                                                </div>
                                                <input type="datetime-local" class="form-control" name="end_datetime_flight" id="end_datetime_flight" value="{{ old('end_datetime') }}">
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-4">
                                        <div class="form-group">
                                            <label class="form-control-label text-left" style="float:left"  for="input-name">Destino</label>
                                            <div class="input-group">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="basic-addon1"><i class="fa-solid fa-map-location"></i></span>
                                                </div>
                                                <select name="destiny_flight" id="destiny_flight" value="{{old('destiny')}}" class="form-control" @error('destiny') is-invalid @enderror>
                                                    <option value=""> -- Selecione --</option>
                                                    <option value="Nacional">Nacional</option>
                                                    <option value="Internacional">Internacional</option>
                                                </select>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col-4">
                                        <div class="form-group">
                                        <label class="form-control-label text-left" style="float:left" for="basic-url">Localizador</label>
                                            <div class="input-group">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="basic-addon1"><i class="fa-solid fa-arrow-up-1-9"></i></span>
                                                </div>
                                                <input type="text" class="form-control" name="reservation_number_flight" id="reservation_number_flight" value="{{ old('reservation_number') }}">
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-4">
                                        <div class="form-group">
                                        <label class="form-control-label text-left" style="float:left" for="basic-url">Nº do Voo</label>
                                            <div class="input-group">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="basic-addon1"><i class="fa-solid fa-plane-lock"></i></span>
                                                </div>
                                                <input type="text" class="form-control" name="flight_number" value="{{ old('flight_number') }}">
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-4">
                                        <div class="form-group">
                                        <label class="form-control-label text-left" style="float:left" for="basic-url">Classe</label>
                                            <div class="input-group">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="basic-addon1"><i class="fa-solid fa-address-card"></i></span>
                                                </div>
                                                <select name="category_flight" class="form-control"  id="category_flight">
                                                    <option value="" selected>-- Selecione --</option>
                                                    <option value="Econômica">Econômica</option>
                                                    <option value="Executiva">Executiva</option>
                                                </select>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col-12">
                                        <div class="form-group">
                                        <label class="form-control-label text-left" style="float:left" for="basic-included_services">Serviços Inclusos</label>
                                            <textarea name="included_services_flight" id="included_services_flight" rows="4" resize="none" class="form-control{{ $errors->has('included_services') ? ' is-invalid' : '' }}" placeholder="Serviços Inclusos" value="{{ old('included_services') }}"></textarea>
                                            @include('alerts.feedback', ['field' => 'included_services'])
                                        </div>
                                    </div>
                                </div>
                                <input type="text" class="form-control" name="country_dropoffflight" id="country_dropoffflight" hidden>
                                <input type="text" class="form-control" name="state_city_dropoffflight" id="state_city_dropoffflight" hidden>
                                <input type="text" class="form-control" name="lat_dropoffflight" id="lat_dropoffflight" hidden>
                                <input type="text" class="form-control" name="long_dropoffflight" id="long_dropoffflight" hidden>
                            </div>
                            <!-- Accommodation -->
                            <div id="accommodation" style="display: none;">
                                <div class="row">
                                    <div class="col-4">
                                        <div class="form-group">
                                            <label class="form-control-label text-left" style="float:left"  for="input-name">Destino</label>
                                            <div class="input-group">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="basic-addon1"><i class="fa-solid fa-map-location"></i></span>
                                                </div>
                                                <select name="destiny_accommodation" id="destiny_accommodation" value="{{old('destiny')}}" class="form-control" @error('destiny') is-invalid @enderror>
                                                    <option value=""> -- Selecione --</option>
                                                    <option value="Nacional">Nacional</option>
                                                    <option value="Internacional">Internacional</option>
                                                </select>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-4">
                                        <div class="form-group">
                                        <label class="form-control-label text-left" style="float:left" for="basic-url">Check-in</label>
                                            <div class="input-group">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="basic-addon1"><i class="ni ni-calendar-grid-58"></i></span>
                                                </div>
                                                <input type="text" class="form-control" value="{{$sale->id}}" name="sale_id" hidden>
                                                <input type="datetime-local" class="form-control" name="start_datetime_accommodation" id="start_datetime_accommodation"  value="{{ old('start_datetime') }}">
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-4">
                                        <div class="form-group">
                                        <label class="form-control-label text-left" style="float:left" for="basic-url">Check-out</label>
                                            <div class="input-group">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="basic-addon1"><i class="ni ni-calendar-grid-58"></i></span>
                                                </div>
                                                <input type="text" class="form-control" value="{{$sale->id}}" name="sale_id" hidden>
                                                <input type="datetime-local" class="form-control" name="end_datetime_accommodation" id="end_datetime_accommodation"  value="{{ old('start_datetime') }}">
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col-6">
                                        <div class="form-group{{ $errors->has('country') ? ' has-danger' : '' }}">
                                            <label class="form-control-label text-left" style="float:left" for="basic-url"> País</label>
                                            <select name="country_accommodation" id="country_accommodation" value="{{old('country_accommodation')}}" class="form-control select2"  @error('country_accommodation') is-invalid @enderror>
                                                <option value="--"></option>
                                                    @foreach ($countries as $country)
                                                        <option value="{{$country->country}}">{{$country->country}}</option>
                                                    @endforeach
                                            </select>
                                        @include('alerts.feedback', ['field' => 'country'])
                                        </div>
                                    </div>
                                    <div class="col-6">
                                        <div class="form-group{{ $errors->has('country') ? ' has-danger' : '' }}">
                                            <label class="form-control-label text-left" style="float:left" for="basic-url">Estado | Cidade</label>
                                            <select name="state_city_accommodation" id="state_city_accommodation" value="{{old('state_city_accommodation')}}" class="form-control select2"  @error('state_city_accommodation') is-invalid @enderror>
                                                    <option value="--"></option>
                                                </select>
                                        @include('alerts.feedback', ['field' => 'state_city'])
                                        </div>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col-6">
                                        <div class="form-group">
                                        <label class="form-control-label text-left" style="float:left" for="basic-url">Acomodação</label>
                                            <div class="input-group">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="basic-addon1"><i class="fa-solid fa-suitcase-rolling"></i></span>
                                                </div>
                                                <select name="accommodation" value="{{old('accommodation')}}" id="accommodation" class="form-control" @error('accommodation') is-invalid @enderror>
                                                    <option value=""> -- Selecione --</option>
                                                    <option value="Single">Single</option>
                                                    <option value="Duplo">Duplo</option>
                                                    <option value="Duplo Solteiro">Duplo Solteiro</option>
                                                    <option value="Duplo Casal">Duplo Casal</option>
                                                    <option value="Triplo">Triplo</option>
                                                    <option value="Quádruplo">Quádruplo</option>
                                                    <option value="Quintuplo">Quintuplo</option>
                                                </select>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-6">
                                        <div class="form-group">
                                        <label class="form-control-label text-left" style="float:left" for="basic-url">Regime</label>
                                            <div class="input-group">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="basic-addon1"><i class="fa-solid fa-cart-flatbed-suitcase"></i></span>
                                                </div>
                                                <select name="regime_accommodation" value="{{old('regime')}}" id="regime_accommodation" class="form-control" @error('regime') is-invalid @enderror>
                                                    <option value=""> -- Selecione --</option>
                                                    <option value="Café da Manhã">Café da Manhã</option>
                                                    <option value="Meia Pensão">Meia Pensão</option>
                                                    <option value="Pensão Completa">Pensão Completa</option>
                                                    <option value="Sem café">Sem café</option>
                                                    <option value="All Inclusive">All Inclusive</option>
                                                </select>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col-4">
                                        <div class="form-group">
                                        <label class="form-control-label text-left" style="float:left" for="basic-url">Diárias</label>
                                            <div class="input-group">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="basic-addon1"><i class="fa-solid fa-hashtag"></i></span>
                                                </div>
                                                <input type="text" class="form-control" value="{{$sale->id}}" name="sale_id" hidden>
                                                <input type="number" class="form-control" name="diaries_accommodation" id="diaries_accommodation" value="{{ old('diaries') }}">
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-4">
                                        <div class="form-group">
                                        <label class="form-control-label text-left" style="float:left" for="basic-url">Categoria</label>
                                            <div class="input-group">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="basic-addon1"><i class="fa-solid fa-person-walking-luggage"></i></span>
                                                </div>
                                                <input type="text" name="category_accommodation" class="form-control" id="category_accommodation" value="{{ old('category') }}">
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-4">
                                        <div class="form-group">
                                        <label class="form-control-label text-left" style="float:left" for="basic-url">Reserva</label>
                                            <div class="input-group">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="basic-addon1"><i class="fa-solid fa-arrow-up-1-9"></i></span>
                                                </div>
                                                <input type="text" class="form-control" name="reservation_number_accommodation" id="reservation_number_accommodation" value="{{ old('reservation_number') }}">
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col-12">
                                        <div class="form-group">
                                        <label class="form-control-label text-left" style="float:left" for="basic-included_services">Serviços Inclusos</label>
                                            <textarea name="included_services_accommodation" id="included_services_accommodation" rows="4" resize="none" class="form-control{{ $errors->has('included_services') ? ' is-invalid' : '' }}" placeholder="Serviços Inclusos" value="{{ old('included_services') }}"></textarea>
                                            @include('alerts.feedback', ['field' => 'included_services'])
                                        </div>
                                    </div>
                                </div>
                                <input type="text" class="form-control" name="lat_dropoffaccommodation" id="lat_dropoffaccommodation"  hidden >
                                <input type="text" class="form-control" name="long_dropoffaccommodation" id="long_dropoffaccommodation"  hidden >
                            </div>
                            <!-- Insurance -->
                            <div id="insurance" style="display: none;">
                                <div class="row">
                                    <div class="col-6">
                                        <div class="form-group">
                                            <label class="form-control-label text-left" style="float:left"  for="input-name">Destino</label>
                                            <div class="input-group">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="basic-addon1"><i class="fa-solid fa-map-location"></i></span>
                                                </div>
                                                <select name="destiny_insurance" id="destiny_insurance" value="{{old('destiny')}}" class="form-control" @error('destiny') is-invalid @enderror>
                                                    <option value=""> -- Selecione --</option>
                                                    <option value="Nacional">Nacional</option>
                                                    <option value="Internacional">Internacional</option>
                                                </select>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-6">
                                        <div class="form-group">
                                        <label class="form-control-label text-left" style="float:left" for="basic-url">Nº da Reserva</label>
                                            <div class="input-group">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="basic-addon1"><i class="fa-solid fa-hashtag"></i></span>
                                                </div>
                                                <input type="text" class="form-control" value="{{$sale->id}}" name="sale_id" hidden>
                                                <input type="text" class="form-control" name="reservation_number_insurance" id="reservation_number_insurance" value="{{ old('reservation_number') }}">
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col-6">
                                        <div class="form-group{{ $errors->has('country') ? ' has-danger' : '' }}">
                                            <label class="form-control-label text-left" style="float:left" for="basic-url"> País</label>
                                            <select name="country_insurance" id="country_insurance" value="{{old('country_insurance')}}" class="form-control select2"  @error('country_insurance') is-invalid @enderror>
                                                <option value="--"></option>
                                                    @foreach ($countries as $country)
                                                        <option value="{{$country->country}}">{{$country->country}}</option>
                                                    @endforeach
                                            </select>
                                        @include('alerts.feedback', ['field' => 'country'])
                                        </div>
                                    </div>
                                    <div class="col-6">
                                        <div class="form-group{{ $errors->has('country') ? ' has-danger' : '' }}">
                                            <label class="form-control-label text-left" style="float:left" for="basic-url">Estado | Cidade</label>
                                            <select name="state_city_insurance" id="state_city_insurance" value="{{old('state_city_insurance')}}" class="form-control select2" @error('state_city_accommodation') is-invalid @enderror>
                                                    <option value="--"></option>
                                                </select>
                                        @include('alerts.feedback', ['field' => 'state_city'])
                                        </div>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col-6">
                                        <div class="form-group">
                                        <label class="form-control-label text-left" style="float:left" for="basic-url">Início</label>
                                            <div class="input-group">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="basic-addon1"><i class="ni ni-calendar-grid-58"></i></span>
                                                </div>
                                                <input type="datetime-local" class="form-control" name="start_datetime_insurance" id="start_datetime_insurance" value="{{ old('start_datetime') }}">
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-6">
                                        <div class="form-group">
                                        <label class="form-control-label text-left" style="float:left" for="basic-url">Fim</label>
                                            <div class="input-group">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="basic-addon1"><i class="ni ni-calendar-grid-58"></i></span>
                                                </div>
                                                <input type="datetime-local" class="form-control" name="end_datetime_insurance" id="end_datetime_insurance" value="{{ old('end_datetime') }}">
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col-12">
                                        <div class="form-group">
                                        <label class="form-control-label text-left" style="float:left" for="basic-included_services">Serviços Inclusos</label>
                                            <textarea name="included_services_insurance" id="included_services_insurance" rows="4" resize="none" class="form-control{{ $errors->has('included_services') ? ' is-invalid' : '' }}" placeholder="Serviços Inclusos" value="{{ old('included_services') }}"></textarea>
                                            @include('alerts.feedback', ['field' => 'included_services_insurance'])
                                        </div>
                                    </div>
                                </div>
                                <input type="text" class="form-control" name="lat_dropoff_insurance" id="lat_dropoff_insurance"  hidden >
                                <input type="text" class="form-control" name="long_dropoff_insurance" id="long_dropoff_insurance"  hidden >
                            </div>
                            <!-- Car rental -->
                            <div id="carRental" style="display: none;">
                                <div class="row">
                                    <div class="col-4">
                                        <div class="form-group">
                                        <label class="form-control-label text-left" style="float:left" for="basic-url">Local Retirada</label>
                                            <div class="input-group">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="basic-addon1"><i class="fa-solid fa-car-side"></i></span>
                                                </div>
                                                <input type="text" class="form-control" name="pickup_local_carRental" id="pickup_local_carRental" value="{{ old('pickup_local_carRental') }}">
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-4">
                                        <div class="form-group">
                                        <label class="form-control-label text-left" style="float:left" for="basic-url">Local Devolução</label>
                                            <div class="input-group">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="basic-addon1"><i class="fa-solid fa-car-side"></i></span>
                                                </div>
                                                <input type="text" class="form-control" name="dropoff_local_carRental" id="dropoff_local_carRental" value="{{ old('dropoff_local_carRental') }}">
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-4">
                                        <div class="form-group">
                                        <label class="form-control-label text-left" style="float:left" for="basic-url">Nº da Reserva</label>
                                            <div class="input-group">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="basic-addon1"><i class="fa-solid fa-hashtag"></i></span>
                                                </div>
                                                <input type="text" class="form-control" value="{{$sale->id}}" name="sale_id" hidden>
                                                <input type="text" class="form-control" name="reservation_number_carRental" id="reservation_number_carRental" value="{{ old('reservation_number') }}">
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col-6">
                                        <div class="form-group{{ $errors->has('country') ? ' has-danger' : '' }}">
                                            <label class="form-control-label text-left" style="float:left" for="basic-url"> País</label>
                                            <select name="country_carRental" id="country_carRental" value="{{old('country_carRental')}}" class="form-control select2"  @error('country_carRental') is-invalid @enderror>
                                                <option value="--"></option>
                                                    @foreach ($countries as $country)
                                                        <option value="{{$country->country}}">{{$country->country}}</option>
                                                    @endforeach
                                            </select>
                                        @include('alerts.feedback', ['field' => 'country'])
                                        </div>
                                    </div>
                                    <div class="col-6">
                                        <div class="form-group{{ $errors->has('country') ? ' has-danger' : '' }}">
                                            <label class="form-control-label text-left" style="float:left" for="basic-url">Estado | Cidade</label>
                                            <select name="state_city_carRental" id="state_city_carRental" value="{{old('state_city_carRental')}}" class="form-control select2" @error('state_city_carRental') is-invalid @enderror>
                                                    <option value="--"></option>
                                                </select>
                                        @include('alerts.feedback', ['field' => 'state_city'])
                                        </div>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col-4">
                                        <div class="form-group">
                                        <label class="form-control-label text-left" style="float:left" for="basic-url">Retirada</label>
                                            <div class="input-group">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="basic-addon1"><i class="ni ni-calendar-grid-58"></i></span>
                                                </div>
                                                <input type="datetime-local" class="form-control" name="start_datetime_carRental" id="start_datetime_carRental" value="{{ old('start_datetime') }}">
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-4">
                                        <div class="form-group">
                                        <label class="form-control-label text-left" style="float:left" for="basic-url">Devolução</label>
                                            <div class="input-group">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="basic-addon1"><i class="ni ni-calendar-grid-58"></i></span>
                                                </div>
                                                <input type="datetime-local" class="form-control" name="end_datetime_carRental" id="end_datetime_carRental" value="{{ old('end_datetime') }}">
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-4">
                                        <div class="form-group">
                                        <label class="form-control-label text-left" style="float:left" for="basic-url">Diárias</label>
                                            <div class="input-group">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="basic-addon1"><i class="fa-solid fa-hashtag"></i></span>
                                                </div>
                                                <input type="number" class="form-control" name="diaries_carRental" id="diaries_carRental" value="{{ old('diaries') }}">
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col-6">
                                        <div class="form-group">
                                            <label class="form-control-label text-left" style="float:left"  for="input-name">Destino</label>
                                            <div class="input-group">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="basic-addon1"><i class="fa-solid fa-map-location"></i></span>
                                                </div>
                                                <select name="destiny_carRental" id="destiny_carRental" value="{{old('destiny')}}" class="form-control" @error('destiny') is-invalid @enderror>
                                                    <option value=""> -- Selecione --</option>
                                                    <option value="Nacional">Nacional</option>
                                                    <option value="Internacional">Internacional</option>
                                                </select>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-6">
                                        <div class="form-group">
                                        <label class="form-control-label text-left" style="float:left" for="basic-url">Categoria</label>
                                            <div class="input-group">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="basic-addon1"><i class="fa-solid fa-person-walking-luggage"></i></span>
                                                </div>
                                                <input type="text" name="category_carRental" id="category_carRental" class="form-control" value="{{ old('category') }}">
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col-12">
                                        <div class="form-group">
                                        <label class="form-control-label text-left" style="float:left" for="basic-included_services">Serviços Inclusos</label>
                                            <textarea name="included_services_carRental" id="included_services_carRental" rows="4" resize="none" class="form-control{{ $errors->has('included_services') ? ' is-invalid' : '' }}" placeholder="Serviços Inclusos" value="{{ old('included_services') }}"></textarea>
                                            @include('alerts.feedback', ['field' => 'included_services'])
                                        </div>
                                    </div>
                                </div>
                                <input type="text" class="form-control" hidden name="lat_dropoff_carRental" id="lat_dropoff_carRental" value="{{ old('lat_dropoff_carRental') }}"  >
                                <input type="text" class="form-control" hidden name="long_dropoff_carRental" id="long_dropoff_carRental" value="{{ old('long_dropoff_carRental') }}"  >
                            </div>
                            <!-- Others -->
                            <div id="others" style="display: none;">
                                <div class="row">
                                    <div class="col-6">
                                        <div class="form-group">
                                            <label class="form-control-label text-left" style="float:left"  for="input-name">Destino</label>
                                            <div class="input-group">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="basic-addon1"><i class="fa-solid fa-map-location"></i></span>
                                                </div>
                                                <select name="destiny_others" id="destiny_others" value="{{old('destiny')}}" class="form-control" @error('destiny') is-invalid @enderror>
                                                    <option value=""> -- Selecione --</option>
                                                    <option value="Nacional">Nacional</option>
                                                    <option value="Internacional">Internacional</option>
                                                </select>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-6">
                                        <div class="form-group">
                                        <label class="form-control-label text-left" style="float:left" for="basic-url">Nº da Reserva</label>
                                            <div class="input-group">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="basic-addon1"><i class="fa-solid fa-hashtag"></i></span>
                                                </div>
                                                <input type="text" class="form-control" value="{{$sale->id}}" name="sale_id" hidden>
                                                <input type="text" class="form-control" name="reservation_number_others" value="{{ old('reservation_number') }}">
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col-6">
                                        <div class="form-group{{ $errors->has('country') ? ' has-danger' : '' }}">
                                            <label class="form-control-label text-left" style="float:left" for="basic-url"> País</label>
                                            <select name="country_others" id="country_others" value="{{old('country_others')}}" class="form-control select2"  @error('country_others') is-invalid @enderror>
                                                <option value="--"></option>
                                                    @foreach ($countries as $country)
                                                        <option value="{{$country->country}}">{{$country->country}}</option>
                                                    @endforeach
                                            </select>
                                        @include('alerts.feedback', ['field' => 'country'])
                                        </div>
                                    </div>
                                    <div class="col-6">
                                        <div class="form-group{{ $errors->has('country') ? ' has-danger' : '' }}">
                                            <label class="form-control-label text-left" style="float:left" for="basic-url">Estado | Cidade</label>
                                            <select name="state_city_others" id="state_city_others" value="{{old('state_city_others')}}" class="form-control select2" @error('state_city_others') is-invalid @enderror>
                                                    <option value="--"></option>
                                                </select>
                                        @include('alerts.feedback', ['field' => 'state_city'])
                                        </div>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col-6">
                                        <div class="form-group">
                                        <label class="form-control-label text-left" style="float:left" for="basic-url">Início</label>
                                            <div class="input-group">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="basic-addon1"><i class="ni ni-calendar-grid-58"></i></span>
                                                </div>
                                                <input type="datetime-local" class="form-control" name="start_datetime_others" id="start_datetime_others" value="{{ old('start_datetime') }}">
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-6">
                                        <div class="form-group">
                                        <label class="form-control-label text-left" style="float:left" for="basic-url">Fim</label>
                                            <div class="input-group">
                                                <div class="input-group-prepend">
                                                    <span class="input-group-text" id="basic-addon1"><i class="ni ni-calendar-grid-58"></i></span>
                                                </div>
                                                <input type="datetime-local" class="form-control" name="end_datetime_others" id="end_datetime_others" value="{{ old('end_datetime') }}">
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col-12">
                                        <div class="form-group">
                                        <label class="form-control-label text-left" style="float:left" for="basic-included_services">Serviços Inclusos</label>
                                            <textarea name="included_services_others" id="included_services_others" rows="4" resize="none" class="form-control{{ $errors->has('included_services') ? ' is-invalid' : '' }}" placeholder="Serviços Inclusos" value="{{ old('included_services') }}"></textarea>
                                            @include('alerts.feedback', ['field' => 'included_services'])
                                        </div>
                                    </div>
                                </div>
                                <input type="text" class="form-control" name="lat_dropoff_others" hidden id="lat_dropoff_others" value="{{ old('lat_dropoff_others') }}"  >
                                <input type="text" class="form-control" name="long_dropoff_others" hidden id="long_dropoff_others" value="{{ old('long_dropoff_others') }}"  >
                            </div>
                    </div>
                            <div class="card-footer text-right" style="float: right;">
                                <button type="submit" class="btn btn-success btn-sm">Cadastrar</button>
                            </div>
                        </form>
                                </div>
                            </div>
                        </div>
                        @include('layouts.footers.auth')
                    </div>
@endsection
@push('js')
<!-- Get Products  -->
{{-- Provider Filter Product --}}
<script>
    $('#provider_id').on('change',function(){
        let id = $("#provider_id").val();
        $.ajax({
            type: 'PATCH',
            url: "{{ route('getproducts', '') }}" + "/" + id,
            success: function(response) {
                var response = JSON.parse(response);
                $('#product_id').empty();
                $('#product_id').append('<option value=""></option>');
                response.forEach(element => {
                    $('#product_id').append(`<option value="${element['id']}">${element["title"]}</option>`);
                });
            }
        });
    });
</script>
<!-- Get Conditional Fields -->
<script>
    $.ajaxSetup({
    headers: {
        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
    }
    });
    $(function(){
        $("#product_id").change(function(){
            var product = $("#product_id option:selected").text();
            console.log(product);
            if (product == "Aéreo") {
                $('#flights').show();
                $('#accommodation').hide();
                $('#insurance').hide();
                $('#carRental').hide();
                $('#others').hide();
            } else if (product == "Hospedagem"){
                $('#accommodation').show();
                $('#flights').hide();
                $('#insurance').hide();
                $('#carRental').hide();
                $('#others').hide();
            } else if (product == "Seguro Viagem") {
                $('#insurance').show();
                $('#accommodation').hide();
                $('#flights').hide();
                $('#carRental').hide();
                $('#others').hide();
            } else if (product == "Locação de Veículo") {
                $('#carRental').show();
                $('#accommodation').hide();
                $('#flights').hide();
                $('#insurance').hide();
                $('#others').hide();
            } else if (product == "Outros") {
                $('#others').show();
                $('#carRental').hide();
                $('#accommodation').hide();
                $('#flights').hide();
                $('#insurance').hide();
            } else {
                $('#others').show();
                $('#carRental').hide();
                $('#accommodation').hide();
                $('#flights').hide();
                $('#insurance').hide();
            }

        });
    })
</script>
{{-- Calculate Diares --}}
{{-- accommodation --}}
<script>
    $(function(){
        $("#start_datetime_accommodation").change(function(){
            var inicio_hotel = new Date($("#start_datetime_accommodation").val());
            var fim_hotel = new Date($("#end_datetime_accommodation").val());
            var diff_hotel = fim_hotel - inicio_hotel;
            var days_hotel = Math.ceil(diff_hotel / (1000 * 3600 * 24));
            $('#diaries_accommodation').val(days_hotel);
        });
    })
    $(function(){
        $("#end_datetime_accommodation").change(function(){
            var inicio_hotel = new Date($("#start_datetime_accommodation").val());
            var fim_hotel = new Date($("#end_datetime_accommodation").val());
            var diff_hotel = fim_hotel - inicio_hotel;
            var days_hotel = Math.ceil(diff_hotel / (1000 * 3600 * 24));
            $('#diaries_accommodation').val(days_hotel);
        });
    })
</script>
{{-- carRental --}}
<script>
    $(function(){
        $("#start_datetime_carRental").change(function(){
            var inicio_car = new Date($("#start_datetime_carRental").val());
            var fim_car = new Date($("#end_datetime_carRental").val());
            var diff_car = fim_car - inicio_car;
            var days_car = Math.ceil(diff_car / (1000 * 3600 * 24));
            $('#diaries_carRental').val(days_car);
        });
    })
    $(function(){
        $("#end_datetime_carRental").change(function(){
            var inicio_car = new Date($("#start_datetime_carRental").val());
            var fim_car = new Date($("#end_datetime_carRental").val());
            var diff_car = fim_car - inicio_car;
            var days_car = Math.ceil(diff_car / (1000 * 3600 * 24));
            $('#diaries_carRental').val(days_car);
        });
    })
</script>
<!-- Select2 With Search -->
<script>
    $(document).ready(function() {
    $('.select2').select2({});
});
</script>
<!-- Pickup and Dropoff Locals Flights -->
<script>
    const decodeUTF8  = (s) => decodeURIComponent(escape(s));
    $.ajaxSetup({
    headers: {
        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
    }
    });
    $('#pickup_local_flight').on('change',function(){
        let id = $('#pickup_local_flight').val();
        console.log(id);
        $.ajax({
            type: 'PATCH',
            url: "{{ route('getcountry', '') }}" + "/" + id,
            success: function(response) {
                var response = JSON.parse(response);
                console.log(response);
                $('#country_pickupflight').empty();
                $('#state_city_pickupflight').empty();
                $('#lat_pickupflight').empty();
                $('#long_pickupflight').empty();
                $('#country_pickupflight').val(`${response['country']}`);
                $('#state_city_pickupflight').val(`${response['municipality']}`);
                $('#lat_pickupflight').val(`${response['lat']}`);
                $('#long_pickupflight').val(`${response['long']}`);
            }
        })
    });
    $('#dropoff_local_flight').on('change',function(){
        let id2 = $('#dropoff_local_flight').val();
        console.log(id2);
        $.ajax({
            type: 'PATCH',
            url: "{{ route('getcountry2', '') }}" + "/" + id2,
            success: function(response) {
                var response = JSON.parse(response);
                console.log(response);
                $('#country_dropoffflight').empty();
                $('#state_city_dropoffflight').empty();
                $('#lat_dropoffflight').empty();
                $('#long_dropoffflight').empty();
                $('#country_dropoffflight').val(`${response['country']}`);
                $('#state_city_dropoffflight').val(`${response['municipality']}`);
                $('#lat_dropoffflight').val(`${response['lat']}`);
                $('#long_dropoffflight').val(`${response['long']}`);
            }
        })
    });
    // $('#state_city_accommodation').on('change',function(){
    //     let id3 = $('#state_city_accommodation').val();
    //     console.log(id3);
    //     $.ajax({
    //         type: 'PATCH',
    //         url: "{{ route('getcities', '') }}" + "/" + id3,
    //         success: function(response) {
    //             var response = JSON.parse(response);
    //             console.log(response);
    //             $('#lat_dropoffaccommodation').empty();
    //             $('#long_dropoffaccommodation').empty();
    //             $('#lat_dropoffaccommodation').val(`${response['lat']}`);
    //             $('#long_dropoffaccommodation').val(`${response['long']}`);
    //         }
    //     })
    // });
</script>
{{-- Country Filter Cities --}}
<script>
    $.ajaxSetup({
    headers: {
        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
    }
    });
    // Accommodation
    $('#country_accommodation').on('change',function(){
        let id = $("#country_accommodation").val();
        console.log(id);
        $.ajax({
            type: 'PATCH',
            url: "{{ route('getcities', '') }}" + "/" + id,
            success: function(response) {
                var response = JSON.parse(response);
                console.log(response);
                $('#lat_dropoffaccommodation').val("");
                $('#long_dropoffaccommodation').val("");
                $('#state_city_accommodation').empty();
                $('#state_city_accommodation').append(`<option value=""></option>`);
                response.forEach(element => {
                    $('#state_city_accommodation').append(`<option value="${element['city_ascii']}">${element['admin_name']} | ${element["city_ascii"]}</option>`);
                });
            }
        });
    });
    $('#state_city_accommodation').on('change',function(){
        let id = $("#state_city_accommodation").val();
        console.log(id);
        $.ajax({
            type: 'PATCH',
            url: "{{ route('getposition', '') }}" + "/" + id,
            success: function(response) {
                var response = JSON.parse(response);
                console.log(response);
                $('#lat_dropoffaccommodation').val("");
                $('#long_dropoffaccommodation').val("");
                $('#lat_dropoffaccommodation').val(`${response['latitude']}`);
                $('#long_dropoffaccommodation').val(`${response['longitude']}`);
            }
        });
    });
    // Insurance
    $('#country_insurance').on('change',function(){
        let id = $("#country_insurance").val();
        console.log(id);
        $.ajax({
            type: 'PATCH',
            url: "{{ route('getcities', '') }}" + "/" + id,
            success: function(response) {
                var response = JSON.parse(response);
                console.log(response);
                $('#lat_dropoff_insurance').val("");
                $('#long_dropoff_insurance').val("");
                $('#state_city_insurance').empty();
                $('#state_city_insurance').append(`<option value=""></option>`);
                response.forEach(element => {
                    $('#state_city_insurance').append(`<option value="${element['city_ascii']}">${element['admin_name']} | ${element["city_ascii"]}</option>`);
                });
            }
        });
    });
    $('#state_city_insurance').on('change',function(){
        let id = $("#state_city_insurance").val();
        console.log(id);
        $.ajax({
            type: 'PATCH',
            url: "{{ route('getposition', '') }}" + "/" + id,
            success: function(response) {
                var response = JSON.parse(response);
                console.log(response);
                $('#lat_dropoff_insurance').val("");
                $('#long_dropoff_insurance').val("");
                $('#lat_dropoff_insurance').val(`${response['latitude']}`);
                $('#long_dropoff_insurance').val(`${response['longitude']}`);
            }
        });
    });
    // Car Rental
    $('#country_carRental').on('change',function(){
        let id = $("#country_carRental").val();
        console.log(id);
        $.ajax({
            type: 'PATCH',
            url: "{{ route('getcities', '') }}" + "/" + id,
            success: function(response) {
                var response = JSON.parse(response);
                console.log(response);
                $('#lat_dropoff_carRental').val("");
                $('#long_dropoff_carRental').val("");
                $('#state_city_carRental').empty();
                $('#state_city_carRental').append(`<option value=""></option>`);
                response.forEach(element => {
                    $('#state_city_carRental').append(`<option value="${element['city_ascii']}">${element['admin_name']} | ${element["city_ascii"]}</option>`);
                });
            }
        });
    });
    $('#state_city_carRental').on('change',function(){
        let id = $("#state_city_carRental").val();
        console.log(id);
        $.ajax({
            type: 'PATCH',
            url: "{{ route('getposition', '') }}" + "/" + id,
            success: function(response) {
                var response = JSON.parse(response);
                console.log(response);
                $('#lat_dropoff_carRental').val("");
                $('#long_dropoff_carRental').val("");
                $('#lat_dropoff_carRental').val(`${response['latitude']}`);
                $('#long_dropoff_carRental').val(`${response['longitude']}`);
            }
        });
    });
    // Others
    $('#country_others').on('change',function(){
        let id = $("#country_others").val();
        console.log(id);
        $.ajax({
            type: 'PATCH',
            url: "{{ route('getcities', '') }}" + "/" + id,
            success: function(response) {
                var response = JSON.parse(response);
                console.log(response);
                $('#lat_dropoff_others').val("");
                $('#long_dropoff_others').val("");
                $('#state_city_others').empty();
                $('#state_city_others').append(`<option value=""></option>`);
                response.forEach(element => {
                    $('#state_city_others').append(`<option value="${element['city_ascii']}">${element['admin_name']} | ${element["city_ascii"]}</option>`);
                });
            }
        });
    });
    $('#state_city_others').on('change',function(){
        let id = $("#state_city_others").val();
        console.log(id);
        $.ajax({
            type: 'PATCH',
            url: "{{ route('getposition', '') }}" + "/" + id,
            success: function(response) {
                var response = JSON.parse(response);
                console.log(response);
                $('#lat_dropoff_others').val("");
                $('#long_dropoff_others').val("");
                $('#lat_dropoff_others').val(`${response['latitude']}`);
                $('#long_dropoff_others').val(`${response['longitude']}`);
            }
        });
    });
</script>
<script src="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/js/select2.min.js"></script>
@endpush
@push('css')
<link rel="stylesheet" href="{{ asset('argon/vendor/select2/dist/css/select2.min.css') }}">
<style>
    .select2-single-selection__rendered{
    word-wrap: break-word !important;
    text-overflow: inherit !important;
    white-space: normal !important;
    }
</style>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.1.1/css/all.min.css" integrity="sha512-KfkfwYDsLkIlwQp6LFnl8zNdLGxu9YAA1QvwINks4PhcElQSvqcyVLLD9aMhXd13uQjoXtEKNosOWaZqXgel0g==" crossorigin="anonymous" referrerpolicy="no-referrer" />
<link href="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/css/select2.min.css" rel="stylesheet" />
<link rel="stylesheet" href="{{ asset('argon') }}/vendor/datatables.net-bs4/css/dataTables.bootstrap4.min.css">
<link rel="stylesheet" href="{{ asset('argon') }}/vendor/datatables.net-buttons-bs4/css/buttons.bootstrap4.min.css">
<link rel="stylesheet" href="{{ asset('argon') }}/vendor/datatables.net-select-bs4/css/select.bootstrap4.min.css">
@endpush