@if(!empty($offersData))
<a href="#offer_pop"  data-fancybox-modal-offer></a>
<div class="popup_box offer_ md_box form_box " id="offer_pop" style="display: none;">
    <div class="inner_">

      <div class="img_box" id="popup-image">

      <picture>
          <source srcset="{{webp($offersData->getData('offer_image'))}}" type="image/webp">
          <source srcset="{{PP($offersData->getData('offer_image'))}}" type="image/{{FT($offersData->getData('offer_image'))}}">
          <img src="{{PP($offersData->getData('offer_image'))}}" loading="lazy" alt="{{ $offersData->getData('post_title')}}">
        </picture>

      </div>
      <div class="content_box">
        <div class="text_box">
          <h3>{{lang('inquire_about_this_offer')}}</h3>
        </div>
        {{Form::open(array('url'=>route('offer-request',[$lang]),'name'=>'offer-request','id'=>'offer-request','role'=>'form','autocomplete'=>'off') )}}
        <div class="f_inner_">
              <input type="hidden" id="offer_id" name="offer_id" value="{{$offersData->getData('post_id')}}">
              <div class="input-field ">
                <input id="full_name" name="full_name" type="text">
                <label for="full_name">{{lang('full_name')}}</label>
              </div>
              <div class="input-field ">
                  <input id="user_email" name="user_email" type="email">
                  <label for="user_email">{{lang('email')}}</label>
              </div>

              <div class="m_row">
                <div class="input-field ">
                  <select name="countryCode" id="countrycode">
                  @if(!empty($countryList))
                   @php
                    $uae=$countryList->filter(function ($value, $key) {
                                            return ($value->phonecode == '971');
                                        })->first();
                   @endphp
                   @if(!empty($uae))
                      <option data-countryCode="{{$uae->iso}}" value="+{{$uae->phonecode}}">{{$uae->getData('country_name')}} (+{{$uae->phonecode}})</option>
                   @endif
                   @foreach($countryList as $country)
                      @if($country->phonecode == '971')
                         @continue;
                       @endif
                      <option data-countryCode="{{$country->iso}}" value="+{{$country->phonecode}}">{{$country->getData('country_name')}} (+{{$country->phonecode}})</option>
                   @endforeach
                @endif

                  </select>
                  <label for="phone_number" >{{lang('country_code')}}</label>
                </div>
                <div class="input-field ">
                 <input id="phone_number" name="phone_number" type="text">
                 <label for="phone_number" >{{lang('phone_number')}}</label>
                </div>
              </div>

              <div class="input-field">
                  <select id="enquire_type" name="enquire_type" class="select_box_">
                    <option value="" disabled selected>{{lang('enquire_type')}}</option>
                    <option value="Client">{{lang('client')}}</option>
                    <option value="Broker">{{lang('broker')}}</option>
                  </select>
                  <label id="enquire_type-error" class="error" for="enquire_type"  > </label>
              </div>

            <div class="input-field full_">
                    <textarea id="message" name="message" class="materialize-textarea"></textarea>
                    <label for="message">{{lang('message')}} </label>
                    <span class="helper-text" >{{lang('maximum_250_words')}}</span>
            </div>

            <div class="input-field checkbox_field">
              <label>
              <input type="checkbox" name="commercial_messages" class="filled-in" value="Yes" />
                <span>{{ lang('receive_commercial_electronic_messages') }}</span>
              </label>
            </div>

            <div class="input-field  checkbox_field">
              <label>
                <input type="checkbox" name="accept_privacy_policy" class="filled-in" value="1" />
                <!-- <span>{{ lang('accept_the_website_cookies_and_privacy_policy') }}</span> -->
                @if ($lang=="ar")
                    <span>باستخدام هذا النموذج، فإنك تقبل <a href="{{route('cookie-policy',$lang)}}" class="link_" target="_blank">نص تعريف الارتباط</a> و <a href="{{route('privacy-policy',$lang)}}" class="link_" target="_blank">سياسة الخصوصية</a>.</span>
                @elseif ($lang=="ru")
                    <span>Используя эту форму, вы принимаете <a href="{{route('cookie-policy',$lang)}}" class="link_" target="_blank">политику использования файлов cookie</a> и <a href="{{route('privacy-policy',$lang)}}" class="link_" target="_blank">конфиденциальности веб-сайта</a>.</span>
                @else
                    <span>By using this form, you accept the <a href="{{route('cookie-policy',$lang)}}" class="link_" target="_blank">Website Cookies</a> and <a href="{{route('privacy-policy',$lang)}}" class="link_" target="_blank">Privacy Policy</a>.</span>
                @endif
              </label>
            </div>

              {!! RecaptchaV3::initJs() !!}
              <div class="input-field text-right">
                {!! RecaptchaV3::field('offerRequest') !!}
                <button type="submit" class="dir-btn  dir-btn--filled"
                  role="button">{{lang('submit')}}<span></span><span></span><span></span><span></span><b
                    aria-hidden="true">{{lang('submit')}}</b><b aria-hidden="true">{{lang('submit')}}</b><b aria-hidden="true">{{lang('submit')}}</b><b
                    aria-hidden="true">submit</b></button>
              </div>
          </div>
          <div class="aj_loader " id="offer-popup">
            <div class="inner_loader">
              <div class="c_loader"></div>
            </div>
          </div>
          {!! Form::close() !!}
      </div>
    </div>
    <button type="button" data-fancybox-close="" class="fancybox-button fancybox-close-small" title="Close"><svg
        xmlns="http://www.w3.org/2000/svg" version="1" viewBox="0 0 24 24">
        <path d="M13 12l5-5-1-1-5 5-5-5-1 1 5 5-5 5 1 1 5-5 5 5 1-1z"></path>
      </svg></button>
  </div>
  @endif
@section('scripts')
@parent
@include('frontend.scripts.datepicker')
<script>

  $(function () {
   // $('.select_box_').formSelect();
   $('.select_box_').selectric({
            disableOnMobile: false,
            nativeOnMobile: false,

        });
    $("[data-fancybox-modal-offer]").fancybox({
      modal: true,
    });
  })

      $(function () {
       // $('.input-field select').formSelect();
       $('.input-field select').selectric({
            disableOnMobile: false,
            nativeOnMobile: false,

        });
      })

$('#phone_number').mask("000000000000000");
$('#offer-request').validate({
			errorPlacement: function(error, element) {
			error.appendTo(element.parent());
			},
			ignore:{},
			rules :{
			  'full_name':{
					required:true,
					alphanumeric:true,
				},
				'user_email':{
					required:true,
					myEmail:true,
				},
				'phone_number':{
					required:true,
					minlength: 9
				},
        'enquire_type':{
          required:true,
        },
        // 'commercial_messages': {
        //     required: true,
        // },
        'accept_privacy_policy': {
            required: true,
        },
        /*
        'how_to_reach_you':{
					required:true,
				},
        'date':{
					required:true,
				},
        'time':{
					required:true,
				},
				*/

			},
			messages:{
				'full_name':{
					required:"{{ trans('messages.field_required') }}",
					alphanumeric:"{{ trans('messages.no_spcl_char') }}",
				},
				'last_name':{
					required:"{{ trans('messages.field_required') }}",
					alphanumeric:"{{ trans('messages.no_spcl_char') }}",
				},

				'user_email':{
					required:"{{ trans('messages.field_required') }}",
					myEmail:"{{ trans('messages.invalid_email') }}",
					email:"{{ trans('messages.invalid_email') }}",
				},
				'phone_number':{
					required:"{{ trans('messages.field_required') }}",
					minlength:"{{ trans('messages.no_min_length') }}",
				},
        // 'commercial_messages': {
        //     required: "{{ trans('messages.field_required') }}",
        // },
        'accept_privacy_policy': {
            required: "{{ trans('messages.field_required') }}",
        },
        'enquire_type':{
          required:"{{ trans('messages.field_required') }}",
        },
        /*
        'how_to_reach_you':{
					required:"{{ trans('messages.field_required') }}",
				},
        'date':{
					required:"{{ trans('messages.field_required') }}",
				},
        'time':{
					required:"{{ trans('messages.field_required') }}",
				},
        */

			},
			submitHandler:function(form){

				$('#offer-popup').addClass('show');
				activeForm = form;

				if (grecaptcha.getResponse)
				{
					activeForm = null;
					var $form = $(form);
					dataToSend = $(form).serializeArray();

					sendAjax($form.attr('action'),'POST',dataToSend,function(response){
						$('#offer-popup').removeClass('show');

						if(response.status==true)
						{
							$form[0].reset();
                            $.fancybox.close();
							$('.uploadFileName').html('');
							$('.uploadPercentage').html('');
							$('.uploadProgressWrapper').html('');
                  swal.fire({
                      title: response.warning,
                      html: response.userMessages,
                      confirmButtonText: "{{lang('ok')}}",
                      confirmButtonColor:'#000',
                      closeOnConfirm: false
                  });
						}else{
                $.each(response.formMessages, function( index, value ){
                        $('#'+index+'-error').remove();
                        $('#'+index).parent().prepend('<label id="'+index+'-error" class="error er-label" for="'+index+'">'+value+'</label>');
                        $('#'+index).addClass('error');
                    });
                    if(response.userMessages){
                      swal.fire({
                          title: response.warning,
                          html: response.userMessages,
                          confirmButtonText: "{{lang('ok')}}",
                          confirmButtonColor:'#000',
                          closeOnConfirm: false
                      });
                    }

            }

					});
				}
				else{
					grecaptcha.reset();
					grecaptcha.execute();
				}
				return false;
			}
		});


</script>
@stop