@extends('master')

@section('content')
<section class="section">
    @include('admin.layout.breadcrumbs', [
        'title' => __('Add Destination'),
        'headerData' => __('Destination') ,
        'url' => 'events' ,
    ])

    <div class="section-body">
        <div class="row">
            <div class="col-lg-8"><h2 class="section-title"> {{__('Add Destination')}}</h2></div>
        </div>

        <div class="row">
            <div class="col-12">
              <div class="card">
                <div class="card-body">
                    <form method="post" class="event-form" action="{{route('destinations.store')}}" enctype="multipart/form-data" >
                        @csrf

                        <div class="row">
                            <div class="col-lg-6">
                                <div class="form-group center">
                                    <label>{{__('Image')}}</label>
                                    <div id="image-preview" class="image-preview">
                                        <label for="image-upload" id="image-label"> <i class="fas fa-plus"></i></label>
                                        <input type="file" name="image" id="image-upload" />
                                    </div>
                                    @error('image')
                                        <div class="invalid-feedback block">{{$message}}</div>
                                    @endif
                                </div>
                            </div>
                            <div class="col-lg-6">
                                <div class="form-group">
                                    <label>{{__('Name')}}</label>
                                    <input type="text" name="name" value="{{old('name')}}" placeholder="Name" class="form-control @error('name')? is-invalid @enderror">
                                    @error('name')
                                    <div class="invalid-feedback">{{$message}}</div>
                                    @endif
                                </div>
                            </div>

                        </div>

                        <div class="form-group">
                            <label>{{__('Description')}}</label>
                            <textarea name="description" Placeholder ="Description" class="textarea_editor @error('description')? is-invalid @enderror">
                                {{old('description')}}
                            </textarea>
                            @error('description')
                                <div class="invalid-feedback block">{{$message}}</div>
                            @endif
                        </div>
                        <h6 class="text-muted mt-4 mb-4">{{__('Location Detail')}}</h6>
                        <div class="location-detail {{old('type')=="online"? 'hide' : ''}}">
                            <div class="form-group">
                                <label>{{__('Destination Location')}}</label>
                                <input type="text" name="address" id="pac-input" value="{{old('address')}}" placeholder="Destination Location" class="form-control @error('address')? is-invalid @enderror">
                                @error('address')
                                <div class="invalid-feedback">{{$message}}</div>
                                @endif
                            </div>

                            <div id="map" style="height: 500px"></div>

                            <!-- Async script executes immediately and must be after any DOM elements used in callback. -->
                            <script
                                src="https://maps.googleapis.com/maps/api/js?key={{ $mapkey }}&callback=initAutocomplete&libraries=places&v=weekly"
                                async
                            ></script>

                            <div class="row">
                                <div class="col-lg-6">
                                    <div class="form-group">

                                        <input type="hidden" name="lat" id="actualLat" value="{{old('lat')}}" placeholder="Latitude" class="form-control @error('lat')? is-invalid @enderror">
                                        @error('lat')
                                        <div class="invalid-feedback">{{$message}}</div>
                                        @endif
                                    </div>
                                </div>
                                <div class="col-lg-6">
                                    <div class="form-group">

                                        <input type="hidden" name="lang" id="actualLng" value="{{old('lang')}}" placeholder="Longitude" class="form-control @error('lang')? is-invalid @enderror">
                                        @error('lang')
                                        <div class="invalid-feedback">{{$message}}</div>
                                        @endif
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="form-group">
                            <button type="submit" class="btn btn-primary">{{__('Submit')}}</button>
                        </div>
                    </form>
                </div>
              </div>
            </div>
          </div>
        </div>
    </section>
@endsection