templates/home/index.html.twig line 1

Open in your IDE?
  1. {% extends 'base.html.twig' %}
  3. {% block body %}
  4.     <div class="container-fluid">
  5.         <p class="lead">Afin de réserver vos activités du 10•55, veuillez remplir ci-dessous les champs de formulaire.<br> Nous vous informons que toutes les données collectées sont utilisées <b>uniquement pour votre réservation</b> et <b>ne seront pas cédées à des tiers.</b><br><br>
  6.         A très bientôt.</p>
  7.         {# <p class="bg-warning text-dark p-3">Les formules anniversaires évoluent. La réservation anniversaire sera à nouveau disponible le mercredi 7 février</p> #}
  8.         <hr class="mt-3 mb-3">
  9.     </div>
  10.     {% if offres is defined %}
  11.         <h4 class="mb-3 container-fluid">Les offres du moment !</h4>
  12.         <div class="mb-3 container-fluid" id="offres_container">
  13.             <div id="offres">
  14.                 {% for offre in offres %}
  15.                     <div class="offre" id="offre{{ offre.id }}">
  16.                         {% if offre.type == 1 %}
  17.                             <a href="{{ offre.lien }}" target="_blank" title="{{ offre.titre }}">
  18.                                 <img src="{{ asset('uploads/images/' ~ offre.image ) | imagine_filter('diapo') }}" alt="{{ offre.titre }}">
  19.                             </a>
  20.                         {% else %}
  21.                             <button
  22.                             class="{% if offre.type == 2 %}formule{% else %}forfait{% endif %}Button"
  23.                             data-formule="{% if offre.type == 2 %}{{ offre.formule.code }}{% else %}{{ offre.forfait.formule.code }}{% endif %}"
  24.                             {% if offre.type == 3 %}data-forfait="{{ offre.forfait.id }}"{% endif %}
  25.                             title="{{ offre.titre }}"
  26.                             >
  27.                                 <img src="{{ asset('uploads/images/' ~ offre.image ) | imagine_filter('diapo') }}" alt="{{ offre.titre }}">
  28.                             </button>
  29.                         {% endif %}
  30.                     </div>
  31.                 {% endfor %}
  32.             </div>
  33.             <div id="offres_nav">
  34.                 <span class="prev"><</span>
  35.                 <span class="next">></span>
  36.             </div>
  37.         </div>
  38.     {% endif %}
  39.     <div class="container-fluid">
  40.         {% if formules is defined %}
  41.             <form action="/forfait" method="POST">
  42.                 <input type="hidden" name="offreForfait" id="offreForfait">
  44.                 <h4 class="mb-3">Quelle formule souhaitez-vous réserver ?</h4>
  45.                 <div class="row my-3 list-formule">
  47.                     {% for formule in formules %}
  49.                     {#% if formule.code != "escape-game-1055" %#}
  50.                     {% if formule.actif %}
  51.                     <div class="custom-radio col-12 col-sm-10 offset-sm-1 offset-md-0 col-md-6 col-lg-4 my-3">
  52.                         {# {% if vich_uploader_asset(formule, 'imageFile') %} #}
  53.                             <label for="{{ formule.code }}" class="w-100">
  54.                                 {# <img src="{{ vich_uploader_asset(formule, 'imageFile') }}" class="img-thumbnail"> #}
  55.                                 <img src="{{ asset('uploads/images/' ~ formule.image ) | imagine_filter('my_thumb') }}" class="img-thumbnail" alt="{{ formule.designation }}">
  56.                             </label>
  57.                         {# {% endif %} #}
  58.                         <div class="flex align-items-center"><input id="{{ formule.code }}" name="formule" class="custom-control-input ml-3 position-relative" required="" value="{{ formule.code }}" data-id="{{ formule.id }} " type="radio">
  59.                         <label class="custom-control-label h4" for="{{ formule.code }}">{{ formule.designation }}</label></div>
  60.                     </div>
  61.                     {% endif %}
  63.                     {% endfor %}
  65.                 </div>
  66.                 <button type="reset" class="btn btn-sm bg-danger text-white"><i class="fas fa-backspace"></i>&nbsp;&nbsp;Changer de formule</button>
  68.                 <div id="infosAnniversaire" class="row col-md-12">
  69.                     <hr class="mb-4 col-12">
  70.                     <h4 class="mb-3">Nom, prénom et âge de l'enfant concerné :</h4>
  71.                     <div class="row col-md-12 d-flex flex-column">
  72.                         <div class="row">
  73.                             <div class="col-lg-5 mb-2">
  74.                                 <div class="mb-3">
  75.                                     <label for="firstnameEnfant">Prénom <span class="text-muted">(Obligatoire)</span></label>
  76.                                     <input class="form-control" id="firstnameEnfant" name="firstnameEnfant" placeholder="" value="" type="text">
  77.                                 </div>
  78.                                 <label for="lastnameEnfant">Nom <span class="text-muted">(Obligatoire)</span></label>
  79.                                 <input class="form-control" id="lastnameEnfant" name="lastnameEnfant" placeholder="" value="" type="text">
  80.                             </div>
  81.                             <div class="col-lg-5 mb-2">
  82.                                 <div class="mb-3">
  83.                                     <label for="naissanceEnfant">Date de naissance <span class="text-muted">(Obligatoire)</span></label>
  84.                                     <input class="form-control" id="naissanceEnfant" name="naissanceEnfant" placeholder="jj/mm/aaaa" value="" type="date">
  85.                                 </div>
  86.                                 <label for="ageEnfant">Âge <span class="text-muted">(Obligatoire)</span></label>
  87.                                 <input class="form-control col-md-4" id="ageEnfant" name="ageEnfant" placeholder="" value="" type="number" data-parsley-type="integer">
  88.                             </div>
  89.                         </div>
  90.                     </div>
  91.                     <div class="row">
  92.                         <h4 id="titleParticipants" class="col-12 mb-3">Pour combien d'enfants souhaitez-vous réserver ?</h4>
  93.                         <div class="col-md-12 mb-3 d-flex flex-row">
  94.                             <label for="nbreParticipants" class="pt-2">Nombre d'enfants prévus (mini. 4 / max. 20) :</label>
  95.                             <div class="col-lg-3 ml-0">
  96.                                 <input type="number" name="nbreParticipants" id="nbreParticipants" class="form-control spinner" value="4" min="4" max="20" data-parsley-errors-messages-disabled />
  97.                                 <div id="error-anniversaire" class="invalid-feedback">Le nombre minimum de participants pour un anniversaire doit être de 4 et maximum 20.</div>
  98.                             </div>
  99.                         </div>
  100.                     </div>
  101.                 </div>
  102.                 {# {% if cart != null %}{{ dump(cart) }}{% endif %} #}
  103.                 <hr class="mb-4">
  104.                 <div class="container-calendar" {% if bookingDate %}style="display:block;"{% endif %}>
  105.                     <div class="calendar">
  106.                         <div class="row d-flex flex-row">
  107.                             <div class="col-lg-6 mb-4">
  108.                                 {% if not bookingDate %}
  109.                                     <h4 class="mb-3 calendar">Pour quelle date souhaitez-vous réserver ? <br>
  110.                                         <small><small>Veuillez utiliser le calendrier pour selectionner votre date.</small></small>
  111.                                     </h4>
  112.                                     <input class="form-control col-md-10" id="bookingDate" name="bookingDate" readonly="" placeholder="jj/mm/aaaa" required="" type="text" >
  113.                                 {% else %}
  114.                                     <h4 class="mb-3 date_registred">
  115.                                         Date d'arrivée : <small><small class="badge text-white bg-primary ml-2">( {{ bookingDate | date('d/m/Y') }} )</small></small>
  116.                                     </h4>
  117.                                 {% endif %}
  118.                             </div>
  119.                             <div id="creneauxFormule" class="col-lg-6 mb-4">
  120.                                 <h4 class="mb-3">Créneaux disponibles</h4>
  121.                                 <input class="" id="creneau_anniv" name="creneau_anniv" required="" type="hidden" >
  122.                                 <div id="sessions" class="row my-0 py-0 creneaux">
  123.                                     <p class="text-danger py-3">Veuillez sélectionner une date !</p>
  124.                                 </div>
  125.                             </div>
  126.                         </div>
  127.                     </div>
  128.                 </div>
  129.         
  130.                 <div class="container-fluid mt-3">
  131.                     <div class="row justify-content-end">
  132.                         <button class="btn btn-primary btn-lg ladda-button d-flex align-items-center" disabled id="etape1" type="submit" data-style="zoom-out" data-spinner-color="#FFFFFF">
  133.                             <span class="ladda-label">Configurer la formule</span>
  134.                             <span class="h3 mb-0">&nbsp;&gt;</span>
  135.                             <div class="ladda-progress"></div>
  136.                         </button>
  137.                     </div>
  138.                 </div>
  139.             </form>
  141.             {% if bookingDate %}
  142.             <form action="/" method="POST">
  143.                 <input type="hidden" name="reset_cart" value="true">
  144.                 <button class="btn btn-danger btn-sm ladda-button d-flex align-items-center my-auto" data-bs-toggle="tooltip" data-bs-placement="top" title="Cette action videra le panier !" type="submit">
  145.                                     <i class="fas fa-trash mr-2"></i>
  146.                     <span class="ladda-label">Modifier mon choix</span>
  147.                 </button>
  148.             </form>
  149.             {% endif %}
  151.         {% else %}
  152.             <div class="py-5">
  153.                 <h3 class="text-center alert alert-warning">Aucune formule disponible</h3>
  154.             </div>
  155.         {% endif %}
  157.     </div>
  158. {% endblock %}