@extends('layouts.app')

@section('content')
    <div class="content">
        <x-content.header title="{{ __('title.locations') }}" />

        <form id="form" name="locations-form" action="{{route('settings.locations.update', $location->id)}}" method="POST">
            <div class="tw-card">
                <div class="p-6">
                    @include('locations.form', ['edit' => true])
                </div>
            </div>

            <div class="flex flex-row gap-2 pt-4 mt-6">
                <button type="submit" class="btn-primary-base btn-save">
                    {{trans('forms.lbl_save')}}
                </button>
                <a href="{{route('settings.locations.index')}}"  class="btn-tertiary-base">{{trans('forms.lbl_cancel')}}</a>
            </div>
        </form>
    </div>
@stop

@section('footer-script')
    <script type="text/javascript">

        $("input[type='file']").on('change', function(){
            $(".btn-upload").removeClass("hidden");
        });

        $(".btn-upload").on('click', function(event) {
            const fileInput = document.querySelector( '#logo' );
            const formData = new FormData();
            formData.append( 'featured_image', fileInput.files[0] );
            PDRequest({
                type    : "POST",
                url     : "{{route('settings.locations.upload.logo', $location->id)}}",
                data    : formData,
                event   : event,
                media   : true
            }).then(function(response){
                $(".btn-upload").addClass("hidden");
            });
        });

        drEvent.on('dropify.beforeClear', function(event, element){
            if(confirm("{{trans('forms.do_you_really_want_delete')}}")) {
                return PDRequest({
                    type    : "POST",
                    url     : "{{route('settings.locations.remove.logo', $location->id)}}"
                }).then(function(response){
                    return $(".btn-upload").addClass("hidden");
                });;
            } else {
                return false;
            }
        });

		$(".btn-save, .btn-complete").on("click", function(event) {
			event.preventDefault();
			let data =  $('#form').serializeFiles();
			PDRequest({
				type    : "POST",
				url     : $("#form").prop("action"),
				data    : data,
				event   : event
			}).then((response) => {
                window.location = "{{route('settings.locations.index')}}";
            });
		});


    </script>
@stop