@extends('web.layouts.mains')
@section('content')
  <div class="inner_header">
        <div class="container">
            <ul class="page_links">
                <li>
                    <a href="{{url(getCurrentLocale().'/')}}">{{__('web.home')}}</a>
                </li>
                <li>
                    <a href="{{url(getCurrentLocale().'/contactus')}}">{{__('web.contactus')}} </a>
                </li>
            </ul>
            <h3 class="text-center text-light mt-5">{{__('web.contactus')}} </h3>
        </div>
        <img src="{{url('')}}/assets/web/images/inner_nav_shap.png" alt="" class="l_shap">
        <img src="{{url('')}}/assets/web/images/inner_nav_shap.png" alt="" class="r_shap">
    </div>

    <!--Contents-->
    <main>
        <!-- -------------- about --------------- -->
        <div class="contact_pg">
            <div class="top">
                <div class="contact_info">
                    <div class="container">
                        <div class="section_head text-center mb-5 wow fadeInUp">
                            <h4>{{__('web.contactus')}}</h4>
                        </div>
                        <div class="row">
                            <div class="col-lg-4">
                                <div class="items">
                                    <!-- <div class="icon">
                                        <i class="fas fa-phone"></i>
                                    </div> -->
                                    <div class="info">
                                        <p>{{__('web.phone')}}</p>
                                        <h6>{{settings('phone')}}</h6>
                                    </div>
                                </div>
                            </div>
                            <div class="col-lg-4">
                                <div class="items">
                                    <!-- <div class="icon">
                                        <i class="fas fa-map-marker-alt"></i>
                                    </div> -->
                                    <div class="info">
                                        <p>ا{{__('web.email')}}</p>
                                        <h6>{{settings('email')}}</h6>
                                    </div>
                                </div>
                            </div>
                            <div class="col-lg-4">
                                <div class="items">
                                    <!-- <div class="icon">
                                        <i class="fas fa-envelope"></i>
                                    </div> -->
                                    <div class="info">
                                        <p>{{__('web.address')}}</p>
                                        <h6>{{settings('address')}} </h6>
                                    </div>
                                </div>
                            </div>
                            <div class="col-lg-4">
                                <div class="items">
                                    <!-- <div class="icon">
                                        <i class="fas fa-map-marker-alt"></i>
                                    </div> -->
                                    <div class="info">
                                        <p>{{__('web.fax')}}</p>
                                        <h6>{{settings('fax')}}</h6>
                                    </div>
                                </div>
                            </div>
                            <div class="col-lg-4">
                                <div class="items">
                                    <!-- <div class="icon">
                                        <i class="fas fa-map-marker-alt"></i>
                                    </div> -->
                                    <div class="info">
                                        <p>{{__('web.zip')}} </p>
                                        <h6>{{settings('zip')}}</h6>
                                    </div>
                                </div>
                            </div>
                            <div class="col-lg-4">
                                <div class="items">
                                    <!-- <div class="icon">
                                        <i class="fas fa-map-marker-alt"></i>
                                    </div> -->
                                    <div class="info">
                                        <p>{{__('web.tax')}} </p>
                                        <h6>{{settings('tax')}}</h6>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <div class="contact-inner section_padding">
                <div class="container">
                    <div class="section_head text-center mb-5 wow fadeInUp">
                        <h4>أرسل أستفسارك</h4>
                    </div>
                    <form onsubmit="savedata(this)"  method="post" action="{{url(getCurrentLocale().'/contacting')}}">
                        @CSRF
                        <div class="row">
                            <div class="col-lg-6 col-md-6 col-sm-12 col-xs-12">
                                <div class="form-group">
                                    <input type="text"  name="name" id="name" class="form-control" placeholder="{{__('web.name')}}">
                                </div>
                            </div>
                            <div class="col-lg-6 col-md-6 col-sm-12 col-xs-12">
                                <div class="form-group">
                                    <input type="number" name="phone" id="phone"  class="form-control" placeholder="{{__('web.phone')}}  ">
                                </div>
                            </div>
                            <div class="col-lg-6 col-md-6 col-sm-12 col-xs-12">
                                <div class="form-group">
                                    <input type="email"  name="email" id="email"  class="form-control" placeholder="{{__('web.email')}}">
                                </div>
                            </div>
                            <div class="col-lg-6 col-md-6 col-sm-12 col-xs-12">
                                <div class="form-group">
                                    <input type="text"  name="subject" id="subject"  class="form-control" placeholder="{{__('web.subject')}}">
                                </div>
                            </div>
                            <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
                                <div class="form-group">
                                    <textarea class="form-control"  name="message" id="message"  rows="10" placeholder="{{__('web.message')}}"></textarea>
                                </div>
                            </div>
                            <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 m-auto">
                                <button class="submit-btn" type="submit">{{__('web.send')}}</button>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
        <!-- -------------- subscribe --------------- -->
            <section class="subscribe section_padding">
            <div class="container">
                <div class="section_head light text-center mb-3 wow fadeInUp">
                    <h4>{{__('web.subscribe_us')}}</h4>
                </div>
                <div class="content">
                    <div class="row justify-content-center">
                        <div class="col-lg-6">
                            <form onsubmit="subscribe(this)" action="{{url(getCurrentLocale().'/subscribe')}}" method="post">
                                @CSRF
                                <div class="form-group wow fadeInUp">
                                    <button>{{__('web.subscribe')}} </button>
                                    <input type="email" name="email" placeholder=" {{__('web.email')}} ">
                                </div>
                            </form>
                        </div>
                    </div>
                </div>
            </div>
            <img src="{{url('')}}/assets/web/images/sub_r.png" alt="" class="sub_r wow fadeInRight">
            <img src="{{url('')}}/assets/web/images/sub_l.png" alt="" class="sub_l wow fadeInLeft">
        </section>





<!-- Modal login -->
        <div class="modal fade modal_login" id="modal_login" tabindex="-1" role="dialog" aria-labelledby="exampleModalCenterTitle" aria-hidden="true">
            <div class="modal-dialog modal-dialog-centered" role="document">
                <div class="modal-content">
                    <div class="modal-body text-center">
                        <div class="icon">
                            <img src="{{url('')}}/assets/web/images/icons/alert.svg" alt="">
                        </div>
                        <h4 class="text-danger">{{__('web.fillinputs')}} </h4>
                        <a href="#" class="butn sub_butn" data-dismiss="modal"><span>{{__('web.filinput')}}  </span></a>
                    </div>
                </div>
            </div>
        </div>

        <!--  modal_success -->
        <div class="modal fade modal_login" id="modal_success" tabindex="-1" role="dialog" aria-labelledby="exampleModalCenterTitle" aria-hidden="true">
            <div class="modal-dialog modal-dialog-centered" role="document">
                <div class="modal-content">
                    <div class="modal-body text-center">
                        <div class="icon">
                            <img src="{{url('')}}/assets/web/images/icons/checked.svg" alt="">
                        </div>
                        <h4>{{__('web.success')}} </h4>
                    </div>
                </div>
            </div>
        </div>
        
         <div class="modal fade modal_login" id="modalemailfail" tabindex="-1" role="dialog" aria-labelledby="exampleModalCenterTitle" aria-hidden="true">
            <div class="modal-dialog modal-dialog-centered" role="document">
                <div class="modal-content">
                    <div class="modal-body text-center">
                        <div class="icon">
                            <img src="{{url('')}}/assets/web/images/icons/alert.svg" alt="">
                        </div>
                        <h4 class="text-danger">{{__('web.enteremail')}}   </h4>
                        <a href="#" class="butn sub_butn" data-dismiss="modal"><span>{{__('web.fillinput')}}   </span></a>
                    </div>
                </div>
            </div>
        </div>

        <!--  modal_success -->
        <div class="modal fade modal_login" id="modalemailsuccess" tabindex="-1" role="dialog" aria-labelledby="exampleModalCenterTitle" aria-hidden="true">
            <div class="modal-dialog modal-dialog-centered" role="document">
                <div class="modal-content">
                    <div class="modal-body text-center">
                        <div class="icon">
                            <img src="{{url('')}}/assets/web/images/icons/checked.svg" alt="">
                        </div>
                        <h4>{{__('web.success')}} </h4>
                    </div>
                </div>
            </div>
        </div>
        
        
        
        
    </main>
@push('js')
<script>
    function savedata(elem){
          event.preventDefault();
   
         let action = $(elem).attr('action');
       
       let urls = action;
       
       let dataform = new FormData( $(elem)[0]);
        
     
      $.ajax({
          url : urls,
          type: 'POST',              
          data: dataform,
          contentType: false, 
          processData: false, 
          success:function(data)
          {
            
            $("#modal_success").modal('show');
            window.setTimeout(function(){location.reload()},1000)
               }
          ,error: function (data) {
              
              $('#modal_login').modal('show');
              $('.is-invalid').removeClass('is-invalid');
   $.each(data.responseJSON.errors, function(key,value) {
     
     $('#'+key).addClass('is-invalid');
     
 }); 
 
 
 
}
        })


    }
    function subscribe(elem){
               event.preventDefault();
   
         let action = $(elem).attr('action');
       
       let urls = action;
       
       let dataform = new FormData( $(elem)[0]);
        
     
      $.ajax({
          url : urls,
          type: 'POST',              
          data: dataform,
          contentType: false, 
          processData: false, 
          success:function(data)
          {
            
            $("#modalemailsuccess").modal('show');
            window.setTimeout(function(){location.reload()},1000)
               }
          ,error: function (data) {
              
              $('#modalemailfail').modal('show');
              
 
 
 
}
        })
    }
</script>
@endpush
@stop