templates/front_v4/mca/store/single.html.twig line 393

Open in your IDE?
  1. {% extends ('front_v4/base.html.twig') %}
  2. {% block meta_title %}
  3.     {{ (store.name|length > 16 ? store.name|slice(0, 16) ~ '...' : store.name )|title }} {{ store.fullAddress }} Mon Centre Auditif
  4. {% endblock meta_title %}
  5. {% block meta_description %}
  6.     Laboratoire d’audition - {{ store.name|length > 15 ? store.name|slice(0, 15) ~ '...' : store.name }} - {{ store.fullAddress }} - Mon centre auditif
  7. {% endblock meta_description %}
  8. {% block meta_robots %}
  9.     {% if not store.storePage %}
  10.         <meta name="robots" content="noindex">
  11.     {% else %}
  12.         {{ parent() }}
  13.     {% endif %}
  14. {% endblock %}
  15. {% block stylesheets %}
  16.     {{ encore_entry_link_tags('store_single') }}
  17.     {{ encore_entry_script_tags('store_page') }}
  18. {% endblock stylesheets %}
  19. {% block content %}
  20.     <!-- ========== MAIN CONTENT ========== -->
  21.     <main id="content" role="main">
  22.         {# Header Content #}
  23.         <div class="bg-dark"
  24.              style="background-image: url({{ asset('build/front_v4/svg/components/wave-pattern-light.svg') }});">
  25.             <div class="container content-space-1 content-space-lg-2">
  26.                 <div class="w-lg-65 text-center mx-lg-auto my-5">
  27.                     <span class="badge bg-warning text-dark rounded-pill mb-3">Centre Auditif</span>
  28.                     <p class="h1 text-white mb-0">{{ store.name }}</p>
  29.                     <p class="text-white-70">Découvrez notre centre auditif, où nous offrons des services personnalisés
  30.                         pour améliorer votre audition. </p>
  31.                     <div class="text-center my-lg-3">
  32. {#                        {% if store.isOpenedForProspect %}#}
  33. {#                        <button class="btn btn-md btn-block btn-soft-warning w-100 btn-transition"#}
  34. {#                                style="color: white !important;"#}
  35. {#                                href="#" data-bilan-gtm="" data-bs-toggle="modal"#}
  36. {#                                data-bs-target="#prospectModal" data-id="{{ store.id }}"#}
  37. {#                                data-request="checkup" onclick="dataLayer.push({#}
  38. {#                                'event': 'click-checkup',#}
  39. {#                                'centreMarque': '{{ store.name }}',#}
  40. {#                                'centreID': '{{ store.id }}'#}
  41. {#                                });">#}
  42. {#                            Je prends RDV#}
  43. {#                        </button>#}
  44. {#                        {% endif %}#}
  45.                     </div>
  46.                 </div>
  47.             </div>
  48.         </div>
  49.         {# End Header Content #}
  50.         {# Main Content #}
  51.         <div class="container content-space-1 content-space-lg-0">
  52.             <div class="row">
  53.                 <div class="col-lg-4 mt-lg-n10 mb-7 mb-lg-0">
  54.                    {# Sticky Left Content #}
  55.                     <div id="stickyBlockStartPoint">
  56.                         <div class="js-sticky-block" data-hs-sticky-block-options='{
  57.                    "parentSelector": "#stickyBlockStartPoint",
  58.                    "targetSelector": "#header",
  59.                    "breakpoint": "lg",
  60.                    "startPoint": "#stickyBlockStartPoint",
  61.                    "endPoint": "#stickyBlockEndPoint",
  62.                    "stickyOffsetTop": 20
  63.                         }'>
  64.                         <div class="card">
  65.                             <div class="card-header border-bottom text-center">
  66.                                 {% if image_filter is not defined %}
  67.                                     {% set image_filter = 'brand_logo_medium' %}
  68.                                 {% endif %}
  69.                                 <img class="store-logo"
  70.                                         {% if store.hasLogo %}
  71.                                             src="{{ vich_uploader_asset(store, 'logoFile') | imagine_filter(image_filter) }}"
  72.                                         {% elseif store.hearingBrand %}
  73.                                             src="{{ vich_uploader_asset(store.hearingBrand, 'logoFile') | imagine_filter(image_filter) }}"
  74.                                         {% else %}
  75.                                             src="{{ asset('uploads/images/brand_logo/mca_logo_short.png') | imagine_filter(image_filter) }}"
  76.                                         {% endif %}
  77.                                      style="max-width: 100px;" alt="Mon Centre Auditif - {{ store.name }}"/>
  78.                             </div>
  79.                             <div class="card-body">
  80.                                 <dl class="row">
  81.                                     <dt class="col-sm-5">Adresse</dt>
  82.                                     <dd class="col-sm-7">{{ store.address }} {{ store.zipCode }} {{ store.city }}</dd>
  83.                                 </dl>
  84.                                 {% if not store.isOpenedForProspect %}
  85.                                 <dl class="row">
  86.                                     <dt class="col-sm-5">Téléphone</dt>
  87.                                     <dd class="col-sm-7"><a
  88.                                                 href="tel:{{ store.phoneNumber }}">{{ store.phoneNumber | format_french_phone_number }}</a>
  89.                                     </dd>
  90.                                 </dl>
  91.                                 {% endif %}
  92.                                 {# Store hours #}
  93.                                 {% if store_place_data.openHoursWeekdayDescriptions is defined and store_place_data.openHoursWeekdayDescriptions is not null %}
  94.                                     <dl class="row">
  95.                                         <dt class="col-sm-5 mb-1">Horaires</dt>
  96.                                         <dd class="col-12">
  97.                                             <table>
  98.                                                 {% for desc in store_place_data.openHoursWeekdayDescriptions %}
  99.                                                 <tr>
  100.                                                     <td class="small my-1">
  101.                                                         {{ desc }}
  102.                                                     </td>
  103.                                                 </tr>
  104.                                                 {% endfor %}
  105.                                             </table>
  106.                                         </dd>
  107.                                     </dl>
  108.                                 {% endif %}
  109.                                 {# End Store hours #}
  110.                                 {% if store_place_data.nearbyTransit is defined and store_place_data.nearbyTransit is not empty %}
  111.                                 {# Store Transport #}
  112.                                 <dl class="row">
  113.                                     <dt class="col-sm-5 col-lg-12 mb-1">Transport</dt>
  114.                                     <dd class="col-sm-7 col-lg-12 ">
  115.                                         <ul class="p-0 m-0">
  116.                                             {% set seen_names = [] %}
  117.                                             {% for station in store_place_data.nearbyTransit|slice(1, 5) %}
  118.                                                 {% if station.name not in seen_names %}
  119.                                                     {% set seen_names = seen_names|merge([station.name]) %}
  120.                                                     <li class="d-flex">
  121.                                                         <div class="flex-shrink-0">
  122.                                                             <div class="icon icon-xs icon-soft-secondary">
  123.                                                                 {% if station.primaryType == "transit_station" or station.primaryType == "train_station" %}
  124.                                                                     <i class="bi-train-front"></i>
  125.                                                                 {% elseif station.primaryType == "subway_station" %}
  126.                                                                     <i class="bi-train-front"></i>
  127.                                                                 {% elseif station.primaryType == "bus_stop" or station.primaryType == "bus_stop" %}
  128.                                                                     <i class="bi-bus-front"></i>
  129.                                                                 {% else %}
  130.                                                                     <i class="bi-pin-map"></i>
  131.                                                                 {% endif %}
  132.                                                             </div>
  133.                                                         </div>
  134.                                                         <div class="flex-grow-1 mt-1 ms-3">
  135.                                                             <span class="d-block small fw-semibold">{{ station.name }}</span>
  136.                                                             <small class="d-block text-body"
  137.                                                                    style="font-size: 0.7em;">
  138.                                                                 {% if station.primaryType == "transit_station" or station.primaryType == "train_station" %}
  139.                                                                     Transport en communs
  140.                                                                 {% elseif station.primaryType == "subway_station" %}
  141.                                                                     Métro
  142.                                                                 {% elseif station.primaryType == "bus_stop" or station.primaryType == "bus_stop" %}
  143.                                                                     Bus
  144.                                                                 {% else %}
  145.                                                                     Autre tansport
  146.                                                                 {% endif %}
  147.                                                             </small>
  148.                                                         </div>
  149.                                                     </li>
  150.                                                 {% endif %}
  151.                                             {% endfor %}
  152.                                         </ul>
  153.                                     </dd>
  154.                                 </dl>
  155.                                 {# End Store Transport #}
  156.                                 {% endif %}
  157.                                 {# Store Speciality #}
  158.                                 {% if store_page.speciality is defined and store_page.speciality is not empty %}
  159.                                     <hr class="my-4">
  160.                                     <div class="mb-3">
  161.                                         <h4>Spécialités</h4>
  162.                                     </div>
  163.                                     <ul class="list-checked list-checked-primary mb-0">
  164.                                         {% for speciality in store_page.speciality %}
  165.                                             <li class="list-checked-item">
  166.                                                  {{ speciality }}
  167.                                             </li>
  168.                                         {% endfor %}
  169.                                     </ul>
  170.                                 {% endif %}
  171.                                 {# End Store Speciality #}
  172.                                 {# Store Service #}
  173.                                 {% if store_page.service is defined and store_page.service is not empty %}
  174.                                     <hr class="my-4">
  175.                                     <div class="mb-3">
  176.                                         <h4>Services</h4>
  177.                                     </div>
  178.                                     <div class="row mb-7">
  179.                                         {% for service in store_page.service %}
  180.                                             <div class="col-6 col-md-12 col-lg-6 mb-4 d-flex align-items-center">
  181.                                                 <!-- Icon Block -->
  182.                                                 <div class="icon icon-xs icon-soft-primary me-2">
  183.                                                           <i class="bi {{ service.iconName }}"></i>
  184.                                                 </div>
  185.                                                         <span class="text-body small">{{ service }}</span>
  186.                                                 <!-- End Icon Block -->
  187.                                             </div>
  188.                                             <!-- End Col -->
  189.                                         {% endfor %}
  190.                                     </div>
  191.                                 {% endif %}
  192.                                 {# End Store Service #}
  193.                                 {# CTA Form #}
  194. {#                                {% if store.isOpenedForProspect %}#}
  195. {#                                    <button class="btn btn-md btn-block btn-warning w-100 btn-transition"#}
  196. {#                                            style="color: white !important;"#}
  197. {#                                            href="#" data-bilan-gtm="" data-bs-toggle="modal"#}
  198. {#                                            data-bs-target="#prospectModal" data-id="{{ store.id }}"#}
  199. {#                                            data-request="checkup" onclick="dataLayer.push({#}
  200. {#                                            'event': 'click-checkup',#}
  201. {#                                            'centreMarque': '{{ store.name }}',#}
  202. {#                                            'centreID': '{{ store.id }}'#}
  203. {#                                            });">#}
  204. {#                                        Je prends RDV#}
  205. {#                                    </button>#}
  206. {#                                {% endif %}#}
  207.                                 {# End CTA Form Service #}
  208.                             </div>
  209.                         </div>
  210.                     </div>
  211.                 </div>
  212.                 {# End Sticky Left Content #}
  213.             </div>
  214.             <!-- End Col -->
  215.             <div class="col-lg-8 content-space-t-lg-2">
  216.                 <div class="ps-lg-4">
  217.                     <h3 class="h2 text-center">Bienvenue chez <span
  218.                                 class="text-primary text-highlight-warning">{{ store.name }}</span>.</h3>
  219.                     <h1 class="h4">Services et solutions auditives personnalisées
  220.                         chez {{ store.nameAndZipcode }}</h1>
  221.                     {# Store Description #}
  222.                     {% if store_page.description is defined and store_page.description is not null %}
  223.                         <div class="text-secondary mb-5" style="text-align: justify">
  224.                             {% if store_page.description|length > 300 %}
  225.                                 {# Spliting Big Text Description #}
  226.                                 {% set words = store_page.description|split(' ') %}
  227.                                 {% set half_length = (words|length / 2)|round(0, 'floor') %}
  228.                                 {% set first_part = words[:half_length]|join(' ') %}
  229.                                 {% set second_part = words[half_length:]|join(' ') %}
  230.                                 <span id="collapse-description-store" class="mb-0">
  231.                                     {{ first_part|raw }} ...
  232.                                 </span>
  233.                                 <div id="employerOverviewDescriptionCollapse" class="collapse">
  234.                                     <p>
  235.                                         {{ first_part|raw }}
  236.                                         {{ second_part|raw }}
  237.                                     </p>
  238.                                 </div>
  239.                                 <a class="link link-collapse collapsed" data-bs-toggle="collapse"
  240.                                    href="#employerOverviewDescriptionCollapse" role="button" aria-expanded="false"
  241.                                    aria-controls="employerOverviewDescriptionCollapse">
  242.                                     <span class="link-collapse-default">Lire plus</span>
  243.                                     <span class="link-collapse-active">Lire moins</span>
  244.                                 </a>
  245.                             {% else %}
  246.                                 <p>{{ store_page.description|raw }}</p>
  247.                             {% endif %}
  248.                         </div>
  249.                     {% endif %}
  250.                     {# End Store Description #}
  251.                     {# Store Carrousel Img #}
  252.                     {% if store_page.storeImages is defined and store_page.storeImages is not empty %}
  253.                     <div id="fancyboxGallery" class="d-none d-lg-block my-lg-5 d-flex justify-content-center">
  254.                         <div class="row gx-3">
  255.                             {% for storeImg in store_page.storeImages %}
  256.                                 <div class="col-4 col-sm px-2 mb-3 mb-sm-0">
  257.                                     <!-- Media Viewer -->
  258.                                         <img class="img-fluid rounded-2 mx-auto"
  259.                                              src="{{ vich_uploader_asset(storeImg, 'imageFile') | imagine_filter('store_image_carrousel') }}"
  260.                                              alt="Photo - {{ store.nameAndZipcode }}">
  261.                                         <span class="media-viewer-container">
  262.                                             <span class="media-viewer-icon">
  263.                                                   <i class="bi-plus media-viewer-icon-inner"></i>
  264.                                             </span>
  265.                                         </span>
  266.                                     <!-- End Media Viewer -->
  267.                                 </div>
  268.                                 <!-- End Col -->
  269.                             {% endfor %}
  270.                         </div>
  271.                     </div>
  272.                     {% endif %}
  273.                     {# End Store Carrousel Img #}
  274.                     {# Store Highlited Staff Section #}
  275.                     {% if store_page.hasHighlightedStaff is defined and store_page.hasHighlightedStaff == true %}
  276.                     <hr class="my-5">
  277.                     <div class="row">
  278.                         <div class="col-sm-4 mb-4 mb-sm-0">
  279.                             <div class="mb-3">
  280.                                 {# image size : 300x300 #}
  281.                                 <img class="avatar avatar-xl avatar-circle"
  282.                                      src="{{ vich_uploader_asset(store_page, 'highlightedStaffPictureFile') | imagine_filter('store_highlighted_staff_image') }}"
  283.                                      alt="Audioprothésiste {{ store.nameAndZipcode }}">
  284.                             </div>
  285.                             <ul class="list-unstyled list-py-1">
  286.                                 <li class="fw-semibold text-primary">
  287.                                     <i class="bi-star-fill text-primary dropdown-item-icon"></i> {{ store_page.getHighlitedStaffSpecialityName }}
  288.                                 </li>
  289.                             </ul>
  290.                         </div>
  291.                         <!-- End Col -->
  292.                         <div class="col-sm-8">
  293.                             <!-- Info -->
  294.                             <div class="mb-2">
  295.                                 <h4 class="mb-1"><a href="">{{ store_page.highlightedStaffName }}</a></h4>
  296.                                 <p class="fw-semibold">{{ store_page.highlightedStaffJob }}</p>
  297.                             </div>
  298.                             <p>{{ store_page.highlightedStaffDescription }}</p>
  299.                             <!-- End Info -->
  300.                         </div>
  301.                         <!-- End Col -->
  302.                     </div>
  303.                     {% endif %}
  304.                     {# End Store Highlited Staff Section #}
  305.                     {# Store Map #}
  306.                     <div class="border border-primary rounded my-5" id="map" style="height: 330px;"
  307.                          data-store-latitude="{{ store.latitude }}"
  308.                          data-store-longitude="{{ store.longitude }}"
  309.                             {% if coordinates_used_in_finder|length>1 %}
  310.                                 data-from-latitude="{{ coordinates_used_in_finder[0] }}"
  311.                                 data-from-longitude="{{ coordinates_used_in_finder[1] }}"
  312.                             {% endif %}
  313.                     ></div>
  314.                     {# End Store Map #}
  315. {#                    {% if store.isOpenedForProspect %}#}
  316. {#                    <div class="text-center my-5">#}
  317. {#                        <p class="fs-4">Prenez rendez-vous pour un bilan auditif gratuit chez {{ store.name }}#}
  318. {#                            et#}
  319. {#                            faites le premier pas vers une meilleure qualité de vie.</p>#}
  320. {#                            <button class="btn btn-warning px-5"#}
  321. {#                                    style="color: white !important;"#}
  322. {#                                    href="#" data-bilan-gtm="" data-bs-toggle="modal"#}
  323. {#                                    data-bs-target="#prospectModal" data-id="{{ store.id }}"#}
  324. {#                                    data-request="checkup" onclick="dataLayer.push({#}
  325. {#                                    'event': 'click-checkup',#}
  326. {#                                    'centreMarque': '{{ store.name }}',#}
  327. {#                                    'centreID': '{{ store.id }}'#}
  328. {#                                    });">#}
  329. {#                                Je prends RDV#}
  330. {#                            </button>#}
  331. {#                    </div>#}
  332. {#                    {% endif %}#}
  333.                     <!-- End Sticky End Point -->
  334.                     <div id="stickyBlockEndPoint"></div>
  335.                 </div>
  336.             </div>
  337.             <!-- End Col -->
  338.         </div>
  339.         <!-- End Row -->
  340.     </div>
  341.     <!-- End Content -->
  342.         {# Section TEAM (employee) #}
  343.         {% if store_page.employees is defined and store_page.employees is not empty %}
  344.         <div class="container content-space-1">
  345.             <!-- Heading -->
  346.             <div class="w-md-80 w-lg-50 text-center mx-md-auto mb-3 mb-md-5">
  347.                 <h2 class="font-weight-bold mb-2">L'équipe {{ store.name }}</h2>
  348.             </div>
  349.             <!-- End Heading -->
  350.             <div class="row justify-content-center">
  351.                 {% for employee in store_page.employees %}
  352.                     <div class="col-sm-6 col-md-5 mb-4 mb-sm-0">
  353.                         <!-- Media -->
  354.                         <div class="d-flex justify-content-center">
  355.                             <div class="flex-shrink-0">
  356.                                 {# Img Size : 160x160 #}
  357.                                 {% if employee.picturePath is not null %}
  358.                                     <img class="avatar avatar-lg avatar-circle"
  359.                                          src="{{ vich_uploader_asset(employee, 'pictureFile') | imagine_filter('profile_image') }}"
  360.                                          alt="Bilan Auditif {{ store.nameAndZipcode }}">
  361.                                 {% else %}
  362.                                     <span class="avatar avatar-lg avatar-soft-warning avatar-circle">
  363.                                     <span class="avatar-initials">{{ employee.firstname|first|lower }}{{ employee.lastname|first|lower }}</span>
  364.                                   </span>
  365.                                 {% endif %}
  366.                             </div>
  367.                             <div class="ms-3">
  368.                                 <h4 class="mb-1 text-dark">
  369.                                    {{ employee.firstname }} {{ employee.lastname }}
  370.                                 </h4>
  371.                                 <p class="text-primary fw-bold">{{ employee.speciality }}</p>
  372.                             </div>
  373.                         </div>
  374.                         <!-- End Media -->
  375.                     </div>
  376.                     <!-- End Col -->
  377.                 {% endfor %}
  378.                 </div>
  379.                 <!-- End Col -->
  380.             </div>
  381.             <!-- End Row -->
  382.         </div>
  383.         {% endif %}
  384.         {# End Section TEAM (employee) #}
  385.         {# Section Hearing Brand #}
  386.         {% if store_page.hearingMaker is defined and store_page.hearingMaker is not empty %}
  387.         <hr class="my-1">
  388.         <div class="container content-space-1">
  389.             <div class="row align-items-lg-center">
  390.                 <div class="w-md-75 w-lg-50 text-center mx-md-auto mb-3">
  391.                     <h2>Les marques distribuées chez {{ store.name }}</h2>
  392.                 </div>
  393.                 <div class="col-md-7 col-lg-8 mb-5 mb-md-0">
  394.                     <div class="row align-items-center">
  395.                         {% for hearingMaker in store_page.hearingMaker|slice(0, 12) %}
  396.                             {% if hearingMaker.hasLogo %}
  397.                                 <div class="col text-center py-3">
  398.                                     <img class="avatar avatar-lg avatar-4x3"
  399.                                          src="{{ vich_uploader_asset(hearingMaker, 'logoFile') | imagine_filter('hearing_maker_carrousel') }}"
  400.                                          alt="Audioprothésiste {{ hearingMaker.name }}">
  401.                                 </div>
  402.                             {% endif %}
  403.                         {% endfor %}
  404.                     </div>
  405.                     <!-- End Row -->
  406.                 </div>
  407.                 <div class="col-md-5 col-lg-4">
  408.                     <div class="ps-md-4">
  409.                         <h2 class="display-5 text-primary">98%</h2>
  410.                         <p>Des clients recommandent ces marques pour leurs solutions auditives innovantes et
  411.                             fiables.</p>
  412.                     </div>
  413.                 </div>
  414.             </div>
  415.         </div>
  416.         {% endif %}
  417.         {# End Section Hearing Brand #}
  418.         {# Section Care Network #}
  419.         {% if store_page.careNetworks is defined and store_page.careNetworks is not empty %}
  420.         {# Separator #}
  421.         <div class="border-top mx-auto my-lg-5" style="max-width: 25rem;"></div>
  422.         {# End Separator #}
  423.         <div class="container content-space-1 content-space-lg-2 content-space-xl-3">
  424.             <div class="row">
  425.                 <div class="col-md-6 col-lg-5 pt-3 pt-md-0">
  426.                     <!-- Card -->
  427.                     <div class="card bg-primary shadow-lg mt-md-n6 aos-init aos-animate" data-aos="fade-up">
  428.                         <div class="card-body">
  429.                             <div class="mb-3">
  430.                                 <span class="card-subtitle text-warning text-center" style="font-size: 1.4em;">Découvrez les Réseaux de Soins affiliés</span>
  431.                                 <h2 class="h5 card-title text-white">Apprenez comment les réseaux de soins
  432.                                     auditifs
  433.                                     transforment l'expérience des patients en offrant des solutions
  434.                                     personnalisées
  435.                                     et de haute qualité.</h2>
  436.                             </div>
  437.                             <div class="d-grid">
  438.                                 <a class="btn btn-soft-light btn-transition" href="">Lire l'article</a>
  439.                             </div>
  440.                         </div>
  441.                     </div>
  442.                     <!-- End Card -->
  443.                 </div>
  444.                 <!-- End Col -->
  445.                 <div class="col-md-6 col-lg-7 my-5 my-md-0">
  446.                     <div class="row align-items-center gap-lg-5">
  447.                         {% for careNetwork in store_page.careNetworks|slice(0, 9) %}
  448.                             {% if careNetwork.haslogo and careNetwork.logoFile is not null %}
  449.                                 <div class="col col-lg-3 py-1">
  450.                                     <img class="avatar avatar-4x3 avatar-centered"
  451.                                          src="{{ vich_uploader_asset(careNetwork, 'logoFile') | imagine_filter('care_network_carrousel') }}"
  452.                                          alt="Réseau de soins {{ careNetwork.name }}">
  453.                                 </div>
  454.                             {% endif %}
  455.                             <!-- End Col -->
  456.                         {% endfor %}
  457.                     </div>
  458.                     <!-- End Row -->
  459.                 </div>
  460.                 <!-- End Col -->
  461.             </div>
  462.             <!-- End Row -->
  463.         </div>
  464.         {% endif %}
  465.         {# End Section Care Network #}
  466.         {% if store_place_data.rating is defined and store_place_data.rating is not null %}
  467.         {# Section Review Store #}
  468.             {% set rating = store_place_data.rating %}
  469.         <div id="reviews-section" class="bg-dark text-white" style="background-image: url({{ asset('build/front_v4/svg/components/wave-pattern-light.svg') }});">
  470.             <div class="container content-space-1">
  471.                 <div class="w-md-75 w-lg-50 text-center mx-md-auto mb-2 mb-md-5">
  472.                     <h2 class="text-white">A propos de nos clients</h2>
  473.                 </div>
  474.                 <div class="row mb-3">
  475.                     <div class="col-sm-6 mb-3 mb-sm-0 d-flex justify-content-center">
  476.                         <!-- Media -->
  477.                         <div class="d-flex align-items-center">
  478.                             <div class="flex-shrink-0">
  479.                                 <span class="display-4 text-white">{{ rating }}</span><small>/5</small>
  480.                             </div>
  481.                             <div class="flex-grow-1 ms-4">
  482.                                 <!-- Rating -->
  483.                                 <div class="d-flex gap-1 mb-2">
  484.                                     {% set fullStars = rating|round(0, 'floor') %}
  485.                                     {% set hasHalfStar = (rating - fullStars) >= 0.5 %}
  486.                                     {% set emptyStars = 5 - fullStars - (hasHalfStar ? 1 : 0) %}
  487.                                     {# Étoiles pleines #}
  488.                                     {% if fullStars > 0 %}
  489.                                     {% for i in 1..fullStars %}
  490.                                         <img src="{{ asset('build/front_v4/svg/illustrations/star.svg') }}"
  491.                                              alt="Full star"
  492.                                              width="14">
  493.                                     {% endfor %}
  494.                                     {% endif %}
  495.                                     {# Demi-étoile #}
  496.                                     {% if hasHalfStar %}
  497.                                         <img src="{{ asset('build/front_v4/svg/illustrations/star-half.svg') }}"
  498.                                              alt="Half star"
  499.                                              width="14">
  500.                                     {% endif %}
  501.                                     {# Étoiles vides #}
  502.                                     {% if emptyStars > 0 %}
  503.                                         {% for i in 1..emptyStars %}
  504.                                             <img src="{{ asset('build/front_v4/svg/illustrations/star-muted.svg') }}"
  505.                                                  alt="Empty star"
  506.                                                  width="14">
  507.                                         {% endfor %}
  508.                                     {% endif %}
  509.                                 </div>
  510.                                 <!-- End Rating -->
  511.                                 <span class="d-block">{{ store_place_data.userRatingCount }} avis</span>
  512.                             </div>
  513.                         </div>
  514.                         <!-- End Media -->
  515.                     </div>
  516.                     <!-- End Col -->
  517.                     <div class="col-sm-6 d-flex justify-content-center">
  518.                         <div class="d-flex flex-column flex-md-row align-items-center">
  519.                             <div class="flex-shrink-0">
  520.                                 <span class="display-4 text-white">{{ rating / 5 * 100 }}%</span>
  521.                             </div>
  522.                             <div class="flex-grow-1 ms-md-4">
  523.                                 <span class="font-size-1">des clients<br class="d-none d-md-block"> recommande notre centre auditif</span>
  524.                             </div>
  525.                         </div>
  526.                     </div>
  527.                     <!-- End Col -->
  528.                 </div>
  529.             </div>
  530.         </div>
  531.         {# End Section Review Store #}
  532.         {% endif %}
  533.         {# Section ORL #}
  534.         {% if orls|length > 0 %}
  535.         <div class="container content-space-1 content-space-lg-2">
  536.             <!-- Heading -->
  537.             <div class="w-md-75 w-lg-50 text-center mx-md-auto mb-3">
  538.                 <h2>ORL à proximité</h2>
  539.                 <p>
  540.                     Nous avons sélectionné {{ orls|length }} ORL à proximité.
  541.                     <a class="link"
  542.                        href="{{ absolute_path_orl ~ path('orl_finder', {'lat': store.latitude, 'lng':store.longitude}) }}"
  543.                        target="_blank">Découvrez d'autre ORL.</a>
  544.                 </p>
  545.             </div>
  546.             <!-- End Heading -->
  547.             <div class="row row-cols-1 row-cols-sm-2 row-cols-lg-3 mb-5 d-flex justify-content-center">
  548.                 {% for orlData in orls %}
  549.                     {% set orl = orlData[0] %}
  550.                     <div class="col mb-5">
  551.                         <!-- Card -->
  552.                         <div class="card card-bordered h-100">
  553.                             <!-- Card Body -->
  554.                             <div class="card-body">
  555.                                 <h3 class="card-title">
  556.                                     <a class="text-dark"
  557.                                        href="">{{ orl.name|length > 20 ? orl.name|slice(0, 25) ~ '...' : orl.name }}
  558. {#                                        {% if loop.index is even %}#}
  559. {#                                            <div class="flex-grow-1 d-inline-block">#}
  560. {#                                                <h6 class="card-title">#}
  561. {#                                                    <img class="avatar avatar-xss ms-1 mb-2"#}
  562. {#                                                         src="{{ asset('build/front_v4/svg/illustrations/top-vendor.svg') }}"#}
  563. {#                                                         alt="Review rating" data-toggle="tooltip"#}
  564. {#                                                         data-placement="top"#}
  565. {#                                                         title="Claimed profile">#}
  566. {#                                                </h6>#}
  567. {#                                            </div>#}
  568. {#                                        {% endif %}#}
  569.                                     </a>
  570.                                 </h3>
  571.                                 <div class="text-muted small mb-2">
  572.                                     <i class="bi-map-fill me-1"></i> {{ orl.address }}
  573.                                     , {{ orl.zipCode }} {{ orl.city }}
  574.                                 </div>
  575.                                 {% if orl.phoneNumber is defined and orl.phoneNumber is not null %}
  576.                                 <div class="text-muted small mb-2">
  577.                                     <i class="bi-phone me-1"></i> {{ orl.phoneNumber|format_french_phone_number }}
  578.                                 </div>
  579.                                 {% endif %}
  580.                                 <span class="badge bg-soft-success text-success me-2">
  581.                                     <span class="legend-indicator bg-success"></span>Ouvert
  582.                                 </span>
  583.                             </div>
  584.                             <!-- End Card Body -->
  585.     {#                                    <!-- Card Footer -->#}
  586.     {#                                    <div class="card-footer pt-0">#}
  587.     {#                                        <ul class="list-inline list-separator small text-body">#}
  588.     {#                                            <li class="list-inline-item">RDV dans les 3 jours</li>#}
  589.     {#                                            <li class="list-inline-item">A proximité</li>#}
  590.     {#                                            <li class="list-inline-item">ORL indépendant</li>#}
  591.     {#                                        </ul>#}
  592.     {#                                    </div>#}
  593.     {#                                    <!-- End Card Footer -->#}
  594.                         </div>
  595.                         <!-- End Card -->
  596.                     </div>
  597.                 {% endfor %}
  598.             </div>
  599.             <div class="text-center">
  600.                 <a class="btn btn-outline-primary"
  601.                    href="{{ absolute_path_orl ~ path('orl_finder', {'lat': store.latitude, 'lng':store.longitude}) }}"
  602.                    target="_blank">Trouver d'autres ORL <i
  603.                             class="bi-chevron-right small ms-1"></i></a>
  604.             </div>
  605.         </div>
  606.         <!-- End Card Grid -->
  607.         {% endif %}
  608.         {# End Section ORL #}
  609.     </main>
  610.     <!-- ========== END MAIN CONTENT ========== -->
  611.     {# Modal Prospect Form #}
  612.     {% use 'front_v4/mca/partials/_modal_prospect.html.twig' with inc_content as modal_lead_content %}
  613.     {{ block('modal_lead_content') }}
  614.     {# End Modal Prospect Form #}
  615. {% endblock content %}
  616. {% block javascripts %}
  617.     <script
  618.             src="https://code.jquery.com/jquery-3.7.1.min.js"
  619.             integrity="sha256-/JqT3SQfawRcv/BIHPThkBvs0OEvtFFmqPF/lYI/Cxo="
  620.             crossorigin="anonymous"></script>
  621.     {# Schema Balise SEO #}
  622.     <script type="application/ld+json">
  623.         {
  624.             "@context": "https://schema.org",
  625.             "@type": "Store",
  626.             "name": "{{ store.name }}",
  627.         {% if store.logoPath is defined and store.logoPath is not null %}
  628.             "image": "{{ store.logoPath }}",
  629.             {% endif %}
  630.         "address": {
  631.             "@type": "PostalAddress",
  632.             "streetAddress": "{{ store.address }}",
  633.                 "addressLocality": "{{ store.city }}",
  634.                 "postalCode": "{{ store.zipCode }}",
  635.                 "addressCountry": "FR"
  636.             },
  637.         {% if store.phoneNumber is defined and store.phoneNumber is not null %}
  638.             "telephone": "{{ store.phoneNumber }}",
  639.             {% endif %}
  640.             {% if store.latitude is defined and store.latitude is not null and store.longitude is defined and store.longitude is not null %}
  641.             "geo": {
  642.                 "@type": "GeoCoordinates",
  643.                 "latitude": "{{ store.latitude }}",
  644.                 "longitude": "{{ store.longitude }}"
  645.             }
  646.             {% endif %}
  647.         }
  648.     </script>
  649.     <script type="application/ld+json">
  650.         {
  651.             "@context": "https://schema.org",
  652.             "@type": "BreadcrumbList",
  653.             "itemListElement": [
  654.         {% for breadcrumb in breadcrumbs %}
  655.                 {
  656.                     "@type": "ListItem",
  657.                     "position": "{{ loop.index }}",
  658.                     "item": {
  659.                         "@id": "{{ breadcrumb.url }}",
  660.                         "name": "{{ breadcrumb.name }}"
  661.                     }
  662.                 }{{ not loop.last ? ',' : '' }}
  663.         {% endfor %}
  664.         ]
  665.     }
  666.     </script>
  667.     {# End Schema Balise SEO #}
  668.     {# Google API MAP #}
  669.     <script type="text/javascript"
  670.             src="https://maps.googleapis.com/maps/api/js?&key=AIzaSyAyLv6STXzvZeMXKMZU3DLaNIkBvv8HlBI&libraries=places&v=weekly"></script>
  671.     {# End Google API MAP #}
  672.     {# Modal Lead JS #}
  673.     {% use 'front_v4/mca/partials/_modal_prospect.html.twig' with inc_javascripts as modal_lead_javascripts %}
  674.     {{ block('modal_lead_javascripts') }}
  675.     {# End Modal Lead JS #}
  676.     {{ encore_entry_script_tags('display_center_number') }}
  677.     {{ encore_entry_script_tags('store_page') }}
  678.     {{ encore_entry_script_tags('store_single') }}
  679. {% endblock javascripts %}