@extends(get_view('index'))
@section('title'){{ translate('İletişim') }} - @endsection
@section('header')

@endsection
@section('content')

    @include(get_view('components.pages.page-title'), ['title' => __('İletişim')])
    
    <div class="axil-contact-page-area axil-section-gap">
        <div class="container">
            <div class="axil-contact-page">
                <div class="row row--30">
                    <div class="col-lg-8">
                        <div class="contact-form">
                            <h3 class="title mb--10">{{ __('Bize Mesaj Bırakın') }}</h3>
                            <p>{{ __('Nasıl yardımcı olabileceğimizi öğrenmek için bizimle iletişime geçin veya bizi arayın.') }}</p>

                            @if ($errors->any())
                                <div class="alert alert-danger mb-4">
                                    <ul>
                                        @foreach ($errors->all() as $error)
                                            <li>{{ $error }}</li>
                                        @endforeach
                                    </ul>
                                </div>
                            @endif

                            <div class="d-block">
                                <form id="contact-form" method="POST" action="{{ route('front.message.store') }}">
                                    @csrf
                                    <!-- Your form fields go here -->
    
                                    <div class="row row--10">
                                        <div class="col-lg-4">
                                            <div class="form-group">
                                                <label for="contact-name">{{ __('Adınız') }} <span>*</span></label>
                                                <input type="text" name="name" id="contact-name">
                                            </div>
                                        </div>
                                        <div class="col-lg-4">
                                            <div class="form-group">
                                                <label for="contact-phone">{{ __('Telefon') }} <span>*</span></label>
                                                <input type="text" name="phone" id="contact-phone">
                                            </div>
                                        </div>
                                        <div class="col-lg-4">
                                            <div class="form-group">
                                                <label for="contact-email">{{ __('E-posta') }} <span>*</span></label>
                                                <input type="email" name="email" id="contact-email">
                                            </div>
                                        </div>
                                        <div class="col-12">
                                            <div class="form-group">
                                                <label for="contact-message">{{ __('Mesajınız') }}</label>
                                                <textarea name="message" id="contact-message" cols="1" rows="2"></textarea>
                                            </div>
                                        </div>
                                        
                                        <div id="google_recaptcha"></div>
                                        <br>

                                        <div class="col-12">
                                            <div class="form-group mb--0">
                                                <button name="submit" type="submit" id="submit" class="axil-btn btn-bg-primary">{{ __('Gönder') }}</button>
                                            </div>
                                        </div>
                                    </div>
                                </form>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-4">
                        <div class="contact-location mb--40">
                            <h4 class="title mb--20">{{ __('Şirket Merkezi') }}</h4>
                            <span class="address mb--20">{{ __('Adres: ') . (isset(Site::contact()->contact_address) ? Site::contact()->contact_address : '') }}</span>
                            <span class="phone">{{ __('Telefon: ') . (isset(Site::contact()->contact_phone) ? Site::contact()->contact_phone : '') }}</span>
                            <span class="email">{{ __('E-posta: ') . (isset(Site::contact()->contact_email) ? Site::contact()->contact_email : '') }}</span>
                        </div>
                    </div>
                </div>
            </div>
            <!-- Start Google Map Area  -->
            <div class="axil-google-map-wrap axil-section-gap pb--0">
                <div class="mapouter">
                    <div class="gmap_canvas">
                        {!! get_google_map_iframe() !!}
                    </div>
                </div>
            </div>
            <!-- End Google Map Area  -->
        </div>
    </div>
@endsection
@section('footer')
<script>
// Example starter JavaScript for disabling form submissions if there are invalid fields
(function () {
    'use strict'

    // Fetch all the forms we want to apply custom Bootstrap validation styles to
    var forms = document.querySelectorAll('.needs-validation')

    // Loop over them and prevent submission
    Array.prototype.slice.call(forms)
        .forEach(function (form) {
        form.addEventListener('submit', function (event) {
            if (!form.checkValidity()) {
            event.preventDefault()
            event.stopPropagation()
            }

            form.classList.add('was-validated')
        }, false)
        })
    })()
</script>
@endsection