templates/FrontCommun/contact.html.twig line 1

Open in your IDE?
  1. {% extends 'FrontCommun/base.html.twig' %}
  2. {% block title %}
  3.     Contact
  4. {% endblock %}
  5. {% block stylesheets %}
  6.     {{ parent() }}
  7.     <style>
  8.         #section-body {
  9.             background-color: #ffffff;
  10.         }
  12.         .header-media {
  13.             margin-bottom: 25px;
  14.         }
  17.     </style>
  18. {% endblock %}
  20. {% block body %}
  22.     <div class="container">
  23.         <div class="row">
  24.             <div class="col-md-12">
  25.                 <iframe
  26.                         src="https://www.google.com/maps?q={{ agence.latitude }},{{ agence.longitude }}&z=8&output=embed"
  27.                         width="100%" height="500" style="border:0;" allowfullscreen
  28.                         loading="lazy">
  30.                 </iframe>
  33.             </div>
  34.         </div>
  35.         <div class="membership-content-area">
  36.             <div class="row">
  37.                 <div class="col-lg-12 col-md-12 col-sm-12">
  38.                     <div id="content-area" class="contact-area">
  39.                         <div class="white-block">
  40.                             <div class="row">
  41.                                 <div class="col-md-4 col-sm-6 col-xs-12">
  44.                                     <img src=" {{ domaineBack() }}{{ asset('/file_manager/source/contact.webp') }}"
  45.                                          style="object-fit: cover;" class="pull-left">
  48.                                 </div>
  49.                                 <div class="col-md-5 col-sm-6 col-xs-12 col-xs-12 contact-block-inner">
  50.                                     <div class="contact-info-block">
  51.                                         <h4 class="contact-info-title">  {{ "Contact"|trans }} </h4>
  52.                                     </div>
  53.                                     {{ form_start(form, {
  54.                                         'attr': {
  55.                                             'action': path('contact'),
  56.                                             'class': 'form-contact',
  57.                                             'id': 'contact-form'
  58.                                         }
  59.                                     }) }}
  60.                                     <div class="form-group">
  61.                                         <label class="control-label" for="nom">  {{ "Nom & Prénom"|trans }} <span
  62.                                                     class="text-danger">*</span></label>
  63.                                         {{ form_widget(form.nom,{id:'nom',attr:{placeholder:'Votre Nom & Prénom',class:'form-control'}}) }}
  64.                                     </div>
  65.                                     <div class="form-group">
  66.                                         <label class="control-label" for="email"> {{ "Email"|trans }} <span
  67.                                                     class="text-danger">*</span></label>
  68.                                         {{ form_widget(form.email,{id:'email',attr:{placeholder:'Votre Email',class:'form-control'}}) }}
  69.                                     </div>
  70.                                     <div class="form-group">
  71.                                         <label class="control-label" for="gsm"> {{ "Numéro de téléphone"|trans }}
  72.                                             <span
  73.                                                     class="text-danger">*</span></label>
  74.                                         {{ form_widget(form.gsm,{id:'gsm',attr:{placeholder:'Votre Téléphone',class:'form-control'}}) }}
  75.                                     </div>
  78.                                     <div class="form-group">
  79.                                         <label class="control-label" for="objet"> {{ "Objet"|trans }} <span
  80.                                                     class="text-danger">*</span></label>
  81.                                         {{ form_widget(form.objet,{id:'objet'}) }}
  82.                                     </div>
  85.                                     <div class="form-group">
  86.                                         <label class="control-label" for="message"> {{ "Message"|trans }} <span
  87.                                                     class="text-danger">*</span></label>
  88.                                         {{ form_widget(form.message,{id:'message',attr:{rows:'5',style:'margin-bottom: 5px',class:'form-control'}}) }}
  89.                                     </div>
  91.                                     <div class="form-group">
  92.                                         <label class="control-label" for="message"> {{ "Pièce Joint"|trans }} </label>
  93.                                         <input type="file" id="_piecejoint" class="form-control">
  94.                                         {{ form_widget(form.piecejoint,{attr:{class:'hidden'}}) }}
  95.                                     </div>
  96.                                     {{ form_widget(form.website,{id:'website',attr:{placeholder:'',id:'website'}}) }}
  98.                                     {% if  configAffichage!= null and configAffichage.GENERALE.RECAPTCHA_FORM is defined and configAffichage.GENERALE.RECAPTCHA_FORM == 'oui' and agence is defined and agence.recaptcha is defined and agence.recaptcha != '' %}
  99.                                         <div class="form-group">
  100.                                              <div class="g-recaptcha"
  101.                                                data-sitekey="{{ agence.recaptcha }}"
  102.                                                data-callback="onSubmit"
  103.                                                data-expired-callback="onExpired"
  104.                                                 data-action="submit">
  106.                                                 </div>
  107.                                         </div>
  108.                                         <br>
  109.                                     {% endif %}
  110.                                     <div class="form-group">
  111.                                         <button type="submit"
  112.                                                 class="btn btn-secondary btn-long" id="submit-validate"> {{ "Envoyer"|trans }}  </button>
  113.                                         <span class="status-message"></span>
  114.                                     </div>
  116.                                     <div id="flash-message" class="alert alert-danger mt-2" style="display:none;">
  117.                                         ⏰ Votre vérification a expiré. Veuillez la recommencer.
  118.                                     </div>
  119.                                     <div hidden id="display">{{ form_widget(form.checkRobot) }}</div>
  120.                                     {{ form_end(form) }}
  121.                                 </div>
  122.                                 <div class="col-md-3 col-sm-6 col-xs-12">
  123.                                     {% if infoAgence is not null %}
  124.                                         {{ infoAgence|raw }}
  125.                                     {% endif %}
  127.                                 </div>
  129.                             </div>
  130.                         </div>
  131.                     </div>
  132.                 </div>
  133.             </div>
  134.         </div>
  135.     </div>
  136. {% endblock %}
  137. {% block javascripts %}
  138.     {{ parent() }}
  139.     <!-- GOOGLE map -->
  140.     <script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyAZWB8_k7_O-60IwFqsGCPELoclcweZh1Q"></script>
  141.     <script type="text/javascript" src="{{ asset('assets-commun/js/vegas.min.js') }}"></script>
  142.     <script type="text/javascript" src="{{ asset('assets-commun/js/infobox.js') }}"></script>
  143.     <script type="text/javascript" src="{{ asset('assets-commun/js/markerclusterer.js') }}"></script>
  144.     <script>
  145.     
  146.         document.getElementById('_piecejoint').addEventListener('change', (e) => {
  147.             const file = e.target.files[0];// Get a reference to the file
  148.             $('#form_piecejoint').val('');
  149.             if (file === undefined) return
  150.             const reader = new FileReader();// Encode the file using the FileReader API
  151.             reader.onloadend = () => {
  152.                 const base64String = reader.result
  153.                     .replace('data:', '')
  154.                     .replace(/^.+,/, '');
  155.                 $('#form_piecejoint').val(JSON.stringify({
  156.                     data: base64String,
  157.                     filename: file.name,
  158.                     contentType: file.type
  159.                 }));
  160.             };
  161.             reader.readAsDataURL(file);
  162.         });
  165.     </script>
  167. {% endblock %}