templates/front/hunt/bracelet.html.twig line 1

Open in your IDE?
  1. {% set currentOffer = offer %}
  2. {% set territoryOffersCount = 0 %}
  3. {% for offer in offer.getTerritory().getOffers() %}
  4.     {% if offer.getId() != currentOffer.getId() and offer.getStatus() == 1 %}
  5.         {% set territoryOffersCount = territoryOffersCount + 1 %}
  6.     {% endif %}
  7. {% endfor %}
  8. {% if app.user %}
  9.     {% set userIsOwner = offer.createdBy.id == app.user.id %}
  10. {% else %}
  11.     {% set userIsOwner = false %}
  12. {% endif %}
  14. <div class="details">
  15.     <div class="detail-tac">
  16.         {% set territory = offer.territory %}
  17.         <p class="type {{ offer.type }}">Bracelet</p>
  18.         {% if offer.isTuchassouSelected %}
  19.             <p class="type br"> Sélection Tuchassou</p>
  20.         {% endif %} </div>
  21.     <h1>{{ offer.title }}</h1>
  22.     <p class="city">
  23.         <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
  24.             <defs>
  25.                 <style>.cls-1 {
  26.                         fill: none;
  27.                     }
  29.                     .cls-2 {
  30.                         fill: #ff5203;
  31.                     } </style>
  32.             </defs>
  33.             <g id="pin-solid" transform="translate(-0.5)">
  35.                 <g id="icons_Q2" data-name="icons Q2" transform="translate(3.423 1.14)">
  36.                     <path id="Tracé_12723" data-name="Tracé 12723" class="cls-2"
  37.                           d="M15.6,2A8.541,8.541,0,0,0,7,10.78c0,4.829,5.817,10.39,7.891,12.39a.985.985,0,0,0,1.416,0c2.074-2,7.891-7.463,7.891-12.39A8.484,8.484,0,0,0,15.6,2Zm0,10.731a3.479,3.479,0,0,1-3.541-3.415,3.543,3.543,0,0,1,7.081,0A3.479,3.479,0,0,1,15.6,12.731Z"
  38.                           transform="translate(-7 -2)"/>
  39.                 </g>
  40.             </g>
  41.         </svg>
  42.         {{ territory.city }}
  43.     </p>
  46.     <ul class="libs">
  47.         <li>
  48.             <p>
  49.                 <span><icon><img src="{{ asset('assets/img/forest.png') }}"></icon>Biotope <i class="fa fa-info-circle"
  50.                                                                                               data-bs-toggle="modal"
  51.                                                                                               data-bs-target="#modal-biotope">&nbsp;</i></span>
  52.                 <span>{% for biotope in territory.biotope %}{{ biotope }}{% if not loop.last %}, {% endif %}{% endfor %}</span>
  53.             </p>
  54.         </li>
  55.         <li>
  56.             <p>
  57.                 <span><icon><img src="{{ asset('assets/img/space.png') }}"></icon>Superficie</span>
  58.                 <span>{{ territory.nbHectares }} hectares</span>
  59.             </p>
  60.         </li>
  61.         <li>
  62.             <p>
  63.                 <span><icon><img src="{{ asset('assets/img/hunt.png') }}"></icon>Mode de chasse</span>
  64.                 <span>{% for huntingMode in offer.huntingMode %}{{ huntingMode.title }}{% if not loop.last %}, {% endif %}{% endfor %}</span>
  65.             </p>
  66.         </li>
  67.         <li>
  70.             <p>
  71.                 <span><icon>
  72.                 <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20.04" viewBox="0 0 20 20.04">
  73.     <path data-name="Tracé 12813"
  74.           d="M38.5-571.625a1.285 1.285 0 0 1 1.168.854 2.616 2.616 0 0 1 .052 1.738v.01a5.2 5.2 0 0 0-.1.6c-.045.639-.1 7.652-.064 8.563.121 3.233.068 4.356-.246 5.221a3.835 3.835 0 0 1-2.237 2.353 2.712 2.712 0 0 1-.813.125 3.208 3.208 0 0 1-2.341-1.1 10.507 10.507 0 0 1-2.224-5.675 14.527 14.527 0 0 1 0-3.141 15.731 15.731 0 0 1 1.4-4.81 10.911 10.911 0 0 1 2.314-3.24 6.035 6.035 0 0 1 2.308-1.333 2.478 2.478 0 0 1 .783-.165zm-.484 2.194a3.54 3.54 0 0 0 .057-.3 4.236 4.236 0 0 0-1.507.919 9.193 9.193 0 0 0-1.891 2.681 14.012 14.012 0 0 0-1.244 4.284 12.854 12.854 0 0 0 0 2.684 8.957 8.957 0 0 0 1.774 4.713 1.492 1.492 0 0 0 1.057.543.956.956 0 0 0 .286-.044 2.13 2.13 0 0 0 1.119-1.282c.215-.591.249-1.7.142-4.558-.036-.98.019-8.1.068-8.762v-.01a6.806 6.806 0 0 1 .142-.868z"
  75.           transform="translate(-29.496 571.87)" style="fill:#172a3b"/>
  76.     <path data-name="Tracé 12814"
  77.           d="M243.664-565.081a3.387 3.387 0 0 1 1.137.24 7.624 7.624 0 0 1 3 2.581 10.9 10.9 0 0 1 .717 1.388 14.489 14.489 0 0 1 .727 2.622 20.83 20.83 0 0 1 .119 5.66c-.1.9-.271 2.18-.37 2.791a6.551 6.551 0 0 1-1.08 3.065 3.188 3.188 0 0 1-2.614 1.234 3.1 3.1 0 0 1-1.916-.616h-.006a3.69 3.69 0 0 1-1.094-1.448v-.007a5.46 5.46 0 0 1-.354-1.22 5.923 5.923 0 0 1-.1-1.558 26.469 26.469 0 0 1 .3-3.728 35.516 35.516 0 0 0 .424-5.3c-.011-.266-.035-.752-.057-1.181l-.012-.236a31.646 31.646 0 0 1-.051-1.444 13.874 13.874 0 0 1 .116-1.762 1.272 1.272 0 0 1 .253-.723 1.06 1.06 0 0 1 .861-.358zm1.637 17.829a1.447 1.447 0 0 0 1.21-.526 5.123 5.123 0 0 0 .757-2.3v-.005c.1-.586.26-1.827.359-2.709a19.014 19.014 0 0 0-.1-5.166 12.727 12.727 0 0 0-.627-2.269 9.938 9.938 0 0 0-.539-1.053 6.067 6.067 0 0 0-2.131-1.91 8.338 8.338 0 0 0-.049.943c0 .277.022.894.048 1.347l.012.245c.022.433.046.924.057 1.2a36.285 36.285 0 0 1-.437 5.589 24.735 24.735 0 0 0-.282 3.509 4.358 4.358 0 0 0 .067 1.2v.008a3.745 3.745 0 0 0 .249.884 1.964 1.964 0 0 0 .539.743 1.358 1.358 0 0 0 .866.27z"
  78.           transform="translate(-231.542 565.541)" style="fill:#172a3b"/>
  79. </svg>
  80. </icon>Gibiers<i class="fa fa-info-circle"
  81.                  style="margin-left: 5px;"
  82.                  data-bs-toggle="modal"
  83.                  data-bs-target="#modal-gibiers">&nbsp;</i></span>
  84.                 <span>{% for gibier in offer.gibiers %}{% if loop.index0 < 2 %}{{ gibier.title }}{% endif %}{% if loop.index0 == 0 %}, {% endif %}{% endfor %}{% if offer.gibiers|length > 2 %}...{% endif %}</span>
  85.             </p>
  86.         </li>
  87.         <li>
  88.             <p>
  89.                <span><icon><svg version="1.2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" width="32" height="32">
  90.     <title>empreinte-de-patte</title>
  91.     <defs>
  92.         <image  width="32" height="32" id="img1" href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgAQMAAABJtOi3AAAAAXNSR0IB2cksfwAAAAZQTFRFAAAAlZWV0uzaQAAAAAJ0Uk5TAP9bkSK1AAAAd0lEQVR4nGXNMQqEMBSE4QkpLD3B6lFyLRtJbrDXsZKAhWWOoOAFXFIqb/YFtbL5mhn4gdMFGPEBVnyETYfy/T2krFAHU9aPuAG+awUMhhfbNM3YUlaWY0YmEzj2hD+dXOdmrztgrzW0Vjc22vhirUqNWiMDQOIPVPhH/rwMseUAAAAASUVORK5CYII="/>
  93.     </defs>
  94.     <style>
  95.     </style>
  96.     <use id="Background" href="#img1" x="0" y="0"/>
  97. </svg></icon>Animal <i class="fa fa-info-circle"
  98.                        style="margin-left: 5px;"
  99.                        data-bs-toggle="modal"
  100.                        data-bs-target="#modal-animal">&nbsp;</i></span>
  101.                 <span>{% for animal in offer.animals %}{% if loop.index0 < 2 %}{{ animal.name }}{% endif %}{% if loop.index0 == 0 %}, {% endif %}{% endfor %}{% if offer.animals|length > 2 %}...{% endif %}</span>
  102.             </p>
  103.         </li>
  104.         <li>
  105.             <p>
  106.                 <span><icon><img src="{{ asset('assets/img/user.png') }}"></icon>Statut de l'hôte</span>
  107.                 <span>{{ territory.status }}</span>
  108.             </p>
  109.         </li>
  110.     </ul>
  111.     <ul class="tabs">
  112.         <li class="tab active" data-tab="about"><a href="#">A propos</a></li>
  113.         <li class="tab" data-tab="huntMap"><a href="#">Carte</a></li>
  114.         <li class="tab" data-tab="details"><a href="#">Informations détaillées</a></li>
  115.         {% if offer.getTerritory().getOffers()|length > 1  and territoryOffersCount > 0 %}
  116.             <li class="tab" data-tab="related-offers"><a href="#">Les offres du territoire</a></li>
  117.         {% endif %}
  118.     </ul>
  119.     <div class="tab-content" id="about">
  120.         <p id="valid-days" class="d-none">
  121.             {% if offer.validDays is defined %}
  122.                 {% for day in offer.validDays %}{% if loop.index0 != 0 %}, {% endif %}{{ day }}{% endfor %}
  123.             {% endif %}
  124.         </p>
  125.         <h2>Description de l'expérience de proposée</h2>
  126.         <div class="description">{{ offer.unfoldsDay }}</div>
  128.         {% if offer.planningText %}
  129.             <h2>Planning</h2>
  130.             <p class="description">{{ offer.planningText }}</p>
  131.         {% endif %}
  132.     </div>
  133.     <div class="tab-content" id="huntMap">
  134.         <div id="map_details" style="width: 100%; height: 500px;"></div>
  135.     </div>
  136.     <div class="tab-content" id="details">
  137.         <p class="information-title">Options</p>
  138.         <ul class="informations">
  139.             {% for service in offer.offerAdditionalServices %}
  140.                 {% if service.additionalService.name not in ["repas","hébergement"] %}
  141.                     <li>
  142.                         {% if service.isActive %}
  143.                             <span>{{ service.additionalService.name|capitalize }}</span>
  144.                             <span class="valide" >Oui</span>
  145.                             <span style="margin-left: 100px;">{% if service.price is not null and service.price > 0 %}{{ service.price }} €{% else %}Gratuit{% endif %}</span>
  146.                         {% else %}
  147.                             <span>{{ service.additionalService.name|capitalize }}</span>
  148.                             <span class="non-valide" >Non</span>
  149.                         {% endif %}
  150.                     </li>
  151.                 {% endif %}
  152.             {% endfor %}
  153.             {% if offer.hasShowServices() %}
  154.                     {% for service in offer.offerAdditionalServices %}
  155.                         {% if service.additionalService.name in ["repas","hébergement"] %}
  156.                             <li>
  157.                                 {% if service.isActive %}
  158.                                     <span>{{ service.additionalService.name|capitalize }}</span>
  159.                                     <span class="valide">Oui</span>
  160.                                     <span style="margin-left: 100px;">{% if service.price is not null and service.price > 0 %}{{ service.price }} €{% endif %}</span>
  161.                                 {% else %}
  162.                                     <span>{{ service.additionalService.name|capitalize }}</span>
  163.                                     <span class="non-valide">Non</span>
  164.                                 {% endif %}
  165.                             </li>
  166.                         {% endif %}
  167.                     {% endfor %}
  168.             {% endif %}
  169.         </ul>
  170.         {% if offer.furtherInformation or offer.getWeapons() or offer.equipement %}
  171.             <p class="information-title">A savoir</p>
  172.             <ul class="informations">
  173.                 <li>
  174.                     <span>Armes Autorisées</span>
  175.                     <span>
  176.                         {% if  offer.getWeapons()|length > 0 %}
  177.                             {{ offer.getWeapons()|join(', ') }}
  178.                         {% endif %}
  179.                     </span>
  180.                 </li>
  181.                 {% if offer.equipement %}
  182.                     <li>
  183.                         <span>Equipement : {{ offer.equipement }}</span>
  184.                     </li>
  185.                 {% endif %}
  186.                 <li>
  187.                     <span>Informations complémentaires : {{ offer.furtherInformation }}</span>
  188.                 </li>
  189.             </ul>
  190.         {% endif %}
  191.     </div>
  192.     {% if offer.getTerritory().getOffers()|length > 1  and territoryOffersCount > 0 %}
  193.     <div class="tab-content" id="related-offers">
  194.         <ul class="carousel_slides_related_offers">
  195.             {% set currentOffer = offer %}
  196.             {% set currentOffer = offer %}
  197.             {% for offer in offer.getTerritory().getOffers() %}
  198.                 {% if offer.getId() != currentOffer.getId() %}
  199.                     <li>
  200.                         {% include 'front/hunt/offer_bloc.html.twig' with {'class': 'other-territory-offers'}  %}
  201.                     </li>
  202.                 {% endif %}
  203.             {% endfor %}
  204.         </ul>
  205.     </div>
  206.     {% endif %}
  207. </div>
  208. <div class="order bracelet  {% if offer.status == 3 %} offer-ep {% endif %}">
  209. <div class="or ">
  210. <span class="close">
  211. <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
  212.                     <path data-name=""
  213.                           d="M233.218 162.145h-11.907l4.936 4.936a1.014 1.014 0 1 1-1.434 1.434l-6.671-6.671a1.007 1.007 0 0 1 0-1.434l6.671-6.671a1.014 1.014 0 1 1 1.434 1.434l-4.936 4.97h11.907a1 1 0 0 1 0 2z"
  214.                           transform="translate(-213.866 -149.485)" style="fill:#172a3b;fill-rule:evenodd"></path>
  215.                 </svg>
  216. </span>
  218.     <form method="post" action="{{ path('booking_create') }}">
  219.         {% if app.request.get('error') is defined and app.request.get('error') != '' %}
  220.             <div class="alert alert-danger">{{ app.request.get('error') }}</div>
  221.         {% endif %}
  222.         <input type="hidden" name="offerType" id="offerType" value="br">
  223.         <input type="hidden" name="offerId" value="{{ offer.getId() }}" id="offerId">
  224.         <input type="hidden" name="quantity" value="1" id="quantity">
  225.         <input type="hidden" name="startDate" value="" id="startDate">
  226.         <input type="hidden" name="endDate" value="" id="endDate">
  227.         <input type="hidden" name="nbDayBooks" value="" id="nbDayBooks">
  228.         <input type="hidden" name="initial_formated_price" value="{{ offer.getBasePrice()|number_format(2, '.', '') }}" id="initial_formated_price">
  229.         <input type="hidden" id="nbmax" value="{{ offer.nbBraceletPersonMax }}"/>
  230.         <input type="hidden" id="nbdispo" value="{{ offer.getNbBraceletAvaibleToBooking() }}"/>
  231.         <input type="hidden" id="validdays" value="{{ offer.getValidDays()|json_encode }}"/>
  232.         <input type="hidden" id="bookingdays" value="{{ offer.getBookingDays()|json_encode }}"/>
  233.         <input type="hidden" id="selectedDates" value="oui" name="selectedDates">
  234.         {#<div class="alert alert-danger" style="display: none;" id="errorNbDispo">Le nombre maximum des bracelets disponibles est {{ offer.nbBraceletsAvailable }}.</div>#}
  235.         <div class="alert alert-danger" style="display: none;" id="errorNbMax">Le nombre maximum de bracelets disponible par personne est {{ offer.nbBraceletPersonMax }}.</div>
  236.         <!--<div class="alert alert-danger" style="display: none;" id="errorNbMaxDates"></div>-->
  237.         <div class="form">
  238.             <div id="sidebar">
  239.                 <div class="headline">
  240.                     <a href="#" class="back">
  241.                         <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
  242.                             <path data-name=""
  243.                                   d="M233.218 162.145h-11.907l4.936 4.936a1.014 1.014 0 1 1-1.434 1.434l-6.671-6.671a1.007 1.007 0 0 1 0-1.434l6.671-6.671a1.014 1.014 0 1 1 1.434 1.434l-4.936 4.97h11.907a1 1 0 0 1 0 2z"
  244.                                   transform="translate(-213.866 -149.485)"
  245.                                   style="fill:#172a3b;fill-rule:evenodd"></path>
  246.                         </svg>
  247.                         Sélectionner une date
  248.                     </a>
  249.                 </div>
  250.             </div>
  251.             <div class="modifable" style="display:none;">
  252.                 <div id="dates">
  253.                     <div class="headline">
  254.                         <a href="#" class="back">
  255.                             <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
  256.                                 <path data-name=""
  257.                                       d="M233.218 162.145h-11.907l4.936 4.936a1.014 1.014 0 1 1-1.434 1.434l-6.671-6.671a1.007 1.007 0 0 1 0-1.434l6.671-6.671a1.014 1.014 0 1 1 1.434 1.434l-4.936 4.97h11.907a1 1 0 0 1 0 2z"
  258.                                       transform="translate(-213.866 -149.485)"
  259.                                       style="fill:#172a3b;fill-rule:evenodd"></path>
  260.                             </svg>
  261.                             Sélectionner une date
  262.                         </a>
  263.                     </div>
  264.                     <input type="text" class="startDate d-none" onkeydown="return false" >
  265.                 </div>
  266.             </div>
  267.             <!--<div class="alert alert-info infosStockDay" style="display: none;"></div>-->
  268.             <div class="mob-variant select-date">
  269.                 <p class="price"><span id="initial_price">{{ offer.getBasePrice()|number_format(2, '.', ',') }} €</span> /
  270.                     Bracelet</p>
  271.                 <a class=" d btn btn-default">Sélectionner une date</a>
  272.             </div>
  273.             <div class="mob-variant reservation-mob" style="display:none;">
  274.                 <div class="left-c">
  275.                     <p class="details"><span class="final_price">{{ offer.getBasePrice()|number_format(2, '.', ',') }}</span> €
  276.                         <span> Voir le détail</span></p>
  277.                     <p class="total">Total<span>Tva et services inclus</span></p>
  278.                 </div>
  279.                 <button class="submit">Réserver</button>
  280.             </div>
  281.             <p class="price"><span id="initial_price">{{ offer.getBasePrice()|number_format(2, '.', ',') }} €</span> / Bracelet
  282.             </p>
  283.             {% if userIsOwner %}
  284.                 <div class="booking-not-allowed">
  285.                     Vous ne pouvez pas réserver votre propre annonce.
  286.                 </div>
  287.             {% else %}
  288.                 <ul class="variants">
  289.                     <li>
  290.                         <div>
  291.                             <p>Quantité</p>
  292.                             <span id="qty" name="qty">1</span> Bracelet<span class="plusriels"
  293.                                                                              style="display: none">s</span>
  294.                         </div>
  295.                         <div>
  296.                             <button data-action="minis">-</button>
  297.                             <button data-action="add">+</button>
  298.                         </div>
  299.                     </li>
  300.                     <li class="position-relative">
  301.                         <div class="d-flex justify-content-between align-items-center" style="width: 100%">
  302.                             <p class="showSelectedDate">Sélectionner une date</p>
  303.                             <div id="open-calendar" class="border rounded-circle" style="width: 45px; height: 44px; cursor:pointer;">
  304.                                 <svg style="padding: 11px;width: 43px; height: 42px;fill:#26251d" xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'><g data-name='invisible box'><path data-name='Rectangle 584' style='fill:none' d='M0 0h24v24H0z'/></g><g data-name='icons Q2'><path data-name='Tracé 12158' d='M22.1 4.865h-4.3V3a1.007 1.007 0 0 0-.814-1.007.958.958 0 0 0-1.1.959v1.913H9.18V3a1.007 1.007 0 0 0-.814-1.007.958.958 0 0 0-1.1.959v1.913H2.957A.958.958 0 0 0 2 5.824v15.344a.958.958 0 0 0 .957.959H22.1a.958.958 0 0 0 .957-.959V5.824a.958.958 0 0 0-.957-.959zm-.957 15.344H3.915v-9.59h17.232zm0-11.508H3.915V6.783h17.232z' transform='translate(-.708 -.357)' style='fill:%23172a3b'/></g></svg>
  305.                             </div>
  306.                             <p style="display: none">
  307.                                 <input type="text" class=" d-none" onkeydown="return false">
  308.                             </p>
  309.                         </div>
  310.                         <div class="position-absolute d-none offer-calendar">
  311.                             <div id="myCalendar" class="rolyart-calendar"></div>
  312.                             <div class="buttons">
  313.                                 <a id="update-calendar" href="javascript:void(0)">Valider</a>
  314.                                 <a id="cancel-calendar" href="javascript:void(0)" class="d-none">Annuler</a>
  315.                             </div>
  316.                             <button class="cancelBtn cancelBtnMobile btn btn-sm btn-default" type="button">Annuler</button>
  317.                         </div>
  318.                     </li>
  319.                 </ul>
  320.                 <div class="selected-dates-container">
  321.                     <div class="alert alert-info">Le nombre de bracelets disponibles est : {{ offer.nbBraceletsAvailable }}</div>
  322.                     <div style="margin-bottom: 16px;">
  323.                         <small class="text-sm" style="font-style: italic; font-size: 0.70rem;" id="selectedDatesShow">
  324.                             Sélectionnez une date.
  325.                         </small>
  326.                     </div>
  327.                 </div>
  328.             {% endif %}
  329.             <div class="order-totals">
  330.                 <p class="total">Total<span>Tva et services inclus</span></p>
  331.                 <p class="details">
  332.                     <span class="final_price">{{ offer.getBasePrice()|number_format(2, '.', ',') }}</span> €
  333.                     <span type="button" data-bs-toggle="collapse" data-bs-target="#coll" aria-expanded="false">Voir le détail</span>
  334.                 </p>
  335.             </div>
  336.             <div class="coll collapse" id="coll">
  337.                 <ul>
  338.                     <li class="homey_price_first">
  339.                         Prix de bracelet <span>{{ offer.getBasePrice() }} €</span>
  340.                     </li>
  341.                     <li>
  342.                         Frais de service <span>{{ offer.getFraisService() }} €</span>
  343.                     </li>
  344.                     <li class="payment-due">Paiement dû <span class="final_price">{{ offer.getBasePrice()|number_format(2, '.', ',') }} €</span>
  345.                     </li>
  346.                 </ul>
  347.             </div>
  348.         </div>
  351.         <p class="confirm">Je confirme</p>
  352.         <ul class="checkboxes">
  353.             <li>
  354.                 <input id="isAcceptPermis" type="checkbox" required>
  355.                 <span>Que mon permis de chasse est valide pour le lieu et les dates auxquelles je compte chasser</span>
  356.             </li>
  357.             <li>
  358.                 <input id="isAcceptCivilite" type="checkbox" required>
  359.                 <span>Que je suis détenteur d'une responsabilité civile chasse</span>
  360.             </li>
  361.             <li>
  362.                 <input id="isAcceptCgu" type="checkbox" required>
  363.                 <span>Que j'ai lu et j'accepte les <a href="#" target="_blank" style="color: #1db3a3 !important">CGU.</a></span>
  364.             </li>
  365.         </ul>
  366.         <p class="order-notification">
  367.             La réservation est à titre personnel.<br>
  368.             Pour une réservation à plusieurs,<br>
  369.             veuillez <span>contacter TUCHASSOU.</span>
  370.         </p>
  371.         {% if app.user and not app.user.isAdminValidated %}
  372.             <span class="btn-modal-not-allowed" href="#" data-bs-toggle="modal" data-bs-target="#modal-not-allowed">Réserver</span>
  374.             <div class="modal fade" id="modal-not-allowed" tabindex="-1" aria-labelledby="modal-not-allowed" aria-hidden="true">
  375.                 <div class="modal-dialog">
  376.                     <div class="modal-content">
  378.                         <div class="modal-body-right">
  379.                             <div class="modal-content" style="display: flex; flex-direction: column">
  380.                                 <div class="modal-header">
  381.                                     <button type="button" class="close" data-bs-dismiss="modal" aria-label="Close"><span
  382.                                                 aria-hidden="true">×</span></button>
  383.                                     <span class="modal-title">Compte non validé</span>
  384.                                 </div>
  385.                                 <div class="modal-body">
  386.                                     <div>
  387.                                         <div>
  388.                                             <div class="body offre su d-flex mt-0">
  389.                                                 <p style="text-align: center; color: #1db3a3; font-size: 50px; margin-right: 20px;"><i class="fa fa-calendar-check">&nbsp</i></p>
  390.                                                 <p>
  391.                                                     La réservation vous sera accessible dès qu'un membre Tuchassou aura validé votre compte. N'hésitez pas à nous écrire pour toute question : <a href="mailto:support@tuchassou.fr">support@tuchassou.fr</a>
  392.                                                 </p>
  393.                                             </div>
  394.                                         </div>
  395.                                     </div>
  396.                                 </div>
  397.                             </div>
  398.                         </div>
  400.                     </div>
  401.                 </div>
  402.             </div>
  404.         {% else %}
  405.             <button id="reservation" class="submit" {% if userIsOwner %}disabled{% endif %}>Réserver</button>
  406.         {% endif %}
  407.     </form>
  408.      {% if offer.status == 3 %}
  409.     <p class="center">Offre épuisée, contactez-nous si vous souhaitez être averti lors de sa disponibilité</p>
  410.     <a href="https://www.tuchassou.fr/contactez-nous/" class="btn btn-default">Contactez-nous</a>
  411.      {% endif %}
  414.     <div class="bes">
  415.         <p>
  416.             <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
  417.                 <path data-name="Tracé 78"
  418.                       d="M179.522 109.063a10.574 10.574 0 1 0 4.768-2.782 10.648 10.648 0 0 0-4.768 2.782zM187.05 108a8.566 8.566 0 0 1 5.3 1.827l-2.706 2.706a4.807 4.807 0 0 0-5.182 0l-2.706-2.706A8.563 8.563 0 0 1 187.05 108zm1.944 10.526a2.726 2.726 0 1 1 .813-1.94 2.747 2.747 0 0 1-.813 1.94zm-10.529-1.94a8.52 8.52 0 0 1 1.83-5.3L183 114a4.808 4.808 0 0 0 0 5.182l-2.706 2.706a8.521 8.521 0 0 1-1.83-5.298zm3.29 6.755 2.706-2.706a4.808 4.808 0 0 0 5.182 0l2.706 2.706a8.586 8.586 0 0 1-10.594 0zm12.05-1.456-2.706-2.706a4.808 4.808 0 0 0 0-5.182l2.706-2.706a8.586 8.586 0 0 1 0 10.594z"
  419.                       transform="translate(-175.182 -104.708)" style="fill:#172a3b"/>
  420.             </svg>
  421.             <span> Besoin d'aide ? </span> <a href="https://www.tuchassou.fr/contactez-nous/"> Contactez-nous </a>
  422.         </p>
  424.     </div>
  426. </div>
  429. <div class="fix_vas_mobile" style="display:none;">
  430. <div class="mob-variant select-date">
  431.                 <p class="price"><span id="initial_price">{{ offer.getBasePrice()|number_format(2, '.', ',') }} €</span> /
  432.                     Bracelet</p>
  433.                 <a class=" new_d btn btn-default">Sélectionner une date</a>
  436. </div>
  437. </div>
  439. </div>
  441. <div class="modal fade custom-modal-login in modal-more-info" id="modal-gibiers" tabindex="-1" role="dialog">
  442.     <div class="modal-dialog clearfix" role="document">
  443.         <div class="modal-content">
  444.             <div class="modal-header">
  445.                 <button type="button" class="close" data-bs-dismiss="modal" aria-label="Close"><span
  446.                             aria-hidden="true">×</span>
  447.                 </button>
  448.                 <span class="modal-title d-flex align-items-center"><icon>
  449.                 <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20.04" viewBox="0 0 20 20.04">
  450.     <path data-name="Tracé 12813"
  451.           d="M38.5-571.625a1.285 1.285 0 0 1 1.168.854 2.616 2.616 0 0 1 .052 1.738v.01a5.2 5.2 0 0 0-.1.6c-.045.639-.1 7.652-.064 8.563.121 3.233.068 4.356-.246 5.221a3.835 3.835 0 0 1-2.237 2.353 2.712 2.712 0 0 1-.813.125 3.208 3.208 0 0 1-2.341-1.1 10.507 10.507 0 0 1-2.224-5.675 14.527 14.527 0 0 1 0-3.141 15.731 15.731 0 0 1 1.4-4.81 10.911 10.911 0 0 1 2.314-3.24 6.035 6.035 0 0 1 2.308-1.333 2.478 2.478 0 0 1 .783-.165zm-.484 2.194a3.54 3.54 0 0 0 .057-.3 4.236 4.236 0 0 0-1.507.919 9.193 9.193 0 0 0-1.891 2.681 14.012 14.012 0 0 0-1.244 4.284 12.854 12.854 0 0 0 0 2.684 8.957 8.957 0 0 0 1.774 4.713 1.492 1.492 0 0 0 1.057.543.956.956 0 0 0 .286-.044 2.13 2.13 0 0 0 1.119-1.282c.215-.591.249-1.7.142-4.558-.036-.98.019-8.1.068-8.762v-.01a6.806 6.806 0 0 1 .142-.868z"
  452.           transform="translate(-29.496 571.87)" style="fill:#172a3b"/>
  453.     <path data-name="Tracé 12814"
  454.           d="M243.664-565.081a3.387 3.387 0 0 1 1.137.24 7.624 7.624 0 0 1 3 2.581 10.9 10.9 0 0 1 .717 1.388 14.489 14.489 0 0 1 .727 2.622 20.83 20.83 0 0 1 .119 5.66c-.1.9-.271 2.18-.37 2.791a6.551 6.551 0 0 1-1.08 3.065 3.188 3.188 0 0 1-2.614 1.234 3.1 3.1 0 0 1-1.916-.616h-.006a3.69 3.69 0 0 1-1.094-1.448v-.007a5.46 5.46 0 0 1-.354-1.22 5.923 5.923 0 0 1-.1-1.558 26.469 26.469 0 0 1 .3-3.728 35.516 35.516 0 0 0 .424-5.3c-.011-.266-.035-.752-.057-1.181l-.012-.236a31.646 31.646 0 0 1-.051-1.444 13.874 13.874 0 0 1 .116-1.762 1.272 1.272 0 0 1 .253-.723 1.06 1.06 0 0 1 .861-.358zm1.637 17.829a1.447 1.447 0 0 0 1.21-.526 5.123 5.123 0 0 0 .757-2.3v-.005c.1-.586.26-1.827.359-2.709a19.014 19.014 0 0 0-.1-5.166 12.727 12.727 0 0 0-.627-2.269 9.938 9.938 0 0 0-.539-1.053 6.067 6.067 0 0 0-2.131-1.91 8.338 8.338 0 0 0-.049.943c0 .277.022.894.048 1.347l.012.245c.022.433.046.924.057 1.2a36.285 36.285 0 0 1-.437 5.589 24.735 24.735 0 0 0-.282 3.509 4.358 4.358 0 0 0 .067 1.2v.008a3.745 3.745 0 0 0 .249.884 1.964 1.964 0 0 0 .539.743 1.358 1.358 0 0 0 .866.27z"
  455.           transform="translate(-231.542 565.541)" style="fill:#172a3b"/>
  456. </svg>
  457. </icon> <span style="margin-left: 10px;">Gibiers</span> <br></span>
  458.             </div>
  459.             <div class="modal-body">
  460.                 <span> <b> Gibiers </b> </span><br>
  461.                 <span>{% for gibier in offer.gibiers %}{{ gibier.title }}{% if not loop.last %}, {% endif %}{% endfor %}</span>
  462.             </div>
  463.         </div>
  464.     </div>
  465. </div>
  467. <div class="modal fade custom-modal-login in modal-more-info" id="modal-animal" tabindex="-1" role="dialog">
  468.     <div class="modal-dialog clearfix" role="document">
  469.         <div class="modal-content">
  470.             <div class="modal-header">
  471.                 <button type="button" class="close" data-bs-dismiss="modal" aria-label="Close"><span
  472.                             aria-hidden="true">×</span>
  473.                 </button>
  474.                 <span class="modal-title d-flex align-items-center"><icon>
  475.                 <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20.04" viewBox="0 0 20 20.04">
  476.     <path data-name="Tracé 12813"
  477.           d="M38.5-571.625a1.285 1.285 0 0 1 1.168.854 2.616 2.616 0 0 1 .052 1.738v.01a5.2 5.2 0 0 0-.1.6c-.045.639-.1 7.652-.064 8.563.121 3.233.068 4.356-.246 5.221a3.835 3.835 0 0 1-2.237 2.353 2.712 2.712 0 0 1-.813.125 3.208 3.208 0 0 1-2.341-1.1 10.507 10.507 0 0 1-2.224-5.675 14.527 14.527 0 0 1 0-3.141 15.731 15.731 0 0 1 1.4-4.81 10.911 10.911 0 0 1 2.314-3.24 6.035 6.035 0 0 1 2.308-1.333 2.478 2.478 0 0 1 .783-.165zm-.484 2.194a3.54 3.54 0 0 0 .057-.3 4.236 4.236 0 0 0-1.507.919 9.193 9.193 0 0 0-1.891 2.681 14.012 14.012 0 0 0-1.244 4.284 12.854 12.854 0 0 0 0 2.684 8.957 8.957 0 0 0 1.774 4.713 1.492 1.492 0 0 0 1.057.543.956.956 0 0 0 .286-.044 2.13 2.13 0 0 0 1.119-1.282c.215-.591.249-1.7.142-4.558-.036-.98.019-8.1.068-8.762v-.01a6.806 6.806 0 0 1 .142-.868z"
  478.           transform="translate(-29.496 571.87)" style="fill:#172a3b"/>
  479.     <path data-name="Tracé 12814"
  480.           d="M243.664-565.081a3.387 3.387 0 0 1 1.137.24 7.624 7.624 0 0 1 3 2.581 10.9 10.9 0 0 1 .717 1.388 14.489 14.489 0 0 1 .727 2.622 20.83 20.83 0 0 1 .119 5.66c-.1.9-.271 2.18-.37 2.791a6.551 6.551 0 0 1-1.08 3.065 3.188 3.188 0 0 1-2.614 1.234 3.1 3.1 0 0 1-1.916-.616h-.006a3.69 3.69 0 0 1-1.094-1.448v-.007a5.46 5.46 0 0 1-.354-1.22 5.923 5.923 0 0 1-.1-1.558 26.469 26.469 0 0 1 .3-3.728 35.516 35.516 0 0 0 .424-5.3c-.011-.266-.035-.752-.057-1.181l-.012-.236a31.646 31.646 0 0 1-.051-1.444 13.874 13.874 0 0 1 .116-1.762 1.272 1.272 0 0 1 .253-.723 1.06 1.06 0 0 1 .861-.358zm1.637 17.829a1.447 1.447 0 0 0 1.21-.526 5.123 5.123 0 0 0 .757-2.3v-.005c.1-.586.26-1.827.359-2.709a19.014 19.014 0 0 0-.1-5.166 12.727 12.727 0 0 0-.627-2.269 9.938 9.938 0 0 0-.539-1.053 6.067 6.067 0 0 0-2.131-1.91 8.338 8.338 0 0 0-.049.943c0 .277.022.894.048 1.347l.012.245c.022.433.046.924.057 1.2a36.285 36.285 0 0 1-.437 5.589 24.735 24.735 0 0 0-.282 3.509 4.358 4.358 0 0 0 .067 1.2v.008a3.745 3.745 0 0 0 .249.884 1.964 1.964 0 0 0 .539.743 1.358 1.358 0 0 0 .866.27z"
  481.           transform="translate(-231.542 565.541)" style="fill:#172a3b"/>
  482. </svg>
  483. </icon> <span style="margin-left: 10px;">Animal</span> <br></span>
  484.             </div>
  485.             <div class="modal-body">
  486.                 <span> <b> Animal </b> </span><br>
  487.                 <span>{% for animal in offer.animals %}{{ animal.name }}{% if not loop.last %}, {% endif %}{% endfor %}</span>
  488.             </div>
  489.         </div>
  490.     </div>
  491. </div>