@extends('web.layouts.container')

@section('header')
    <div class="container">
        <div class="inner">
            <div class="top">
                <a href="{{LaravelLocalization::getLocalizedURL(getCurrentLocale(), route('home'), [], true)}}">{{__('main.home')}}</a>
                <span>{{$consultationPage->title}}</span>
            </div>
{{--            <h2>{{$consultationPage->title}}</h2>--}}
{{--            <p>{{stripText($consultationPage->description)}}</p>--}}
        </div>
    </div>
@endsection

@section('content')
    <section class="faq_pg section-padding">
        <div class="container">
            <div class="contact_form">
                <div class="row">
                    <div class="col-lg-12">
                        <form method="post" action="{{route('consultation.store')}}" class="form-row consultation_form">
                            <div class="form_head col-12 text-center">
                                <h5>{{__('consultations.ask_consultation')}}</h5>
{{--                                <p>عند موافقة العميل المبدئية على التصميم يتم ازالة هذا النص من التصميم </p>--}}
                            </div>
                            <div class="form-group col-lg-6">
                                <input name="name" type="text" class="form-control" placeholder="{{__('consultations.name')}}">
                            </div>
                            <div class="form-group col-lg-6">
                                <input name="email" type="email" class="form-control" placeholder="{{__('consultations.email')}}">
                            </div>
                            <div class="form-group col-lg-6">
                                <input name="phone" type="tel" class="form-control" placeholder="{{__('consultations.phone')}} ">
                            </div>
                            <div class="form-group col-lg-6">
                                <select name="consulting_id" class="form-control">
                                    <option>{{__('consultations.consulting_id')}}</option>
                                    @if(count($consultings))
                                        @foreach($consultings as $consulting)
                                            <option value="{{$consulting->id}}">{{$consulting->name}}</option>
                                        @endforeach
                                    @endif
                                </select>
                            </div>
                            <div class="form-group col-12">
                                <textarea name="subject" rows="6" class="form-control" placeholder="{{__('consultations.subject')}}"></textarea>
                            </div>
                            <div class="form-group col-12">
                                <a href="#" class="main-butn consultation_button"><span>{{__('consultations.send')}}</span></a>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </section>
@endsection

@section('inner_js')
    <script>
        let url = "{{asset($consultationPage->image)}}";
        $('header').addClass('inner_header').attr('style', 'background: url('+url+')');
        $('.navs-container').addClass('inner_nav');


        $('.consultation_button').click(async function (e) {
            e.preventDefault();

            let form = $('.consultation_form'),
                data = new FormData(form[0]),
                url = form.attr('action'),
                method = form.attr('method');

            const response=await ajax({
                url,
                data,
                dataType: 'json',
                method
            });

            if (response.errors) {
                toasterError(response.errors);
            }
            if (response.message) {
                toasterSuccess(response.message);
                $('.consultation_form input, textarea').val('');
            }
        });


    </script>
@endsection