<div x-data="hyva.modal()" @click="show('visagismModal', $event)" class="relative min-w-[80%] h-[484px] bg-center rounded-lg cursor-pointer bg-cover" style="background-image: url('/img/commitment/visagism.png');">
<div class="absolute inset-0 bg-black/10 rounded-lg"></div>
<h2 class="absolute top-6 left-6 font-medium text-white text-2xl">Visagisme</h2>
<div class="absolute bottom-6 right-6">
<button type="button" class=" btn btn-light btn-size-sm btn-only-icon">
<svg class=" shrink-0" width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M12.75 7C12.75 6.58579 12.4142 6.25 12 6.25C11.5858 6.25 11.25 6.58579 11.25 7V11.25H7C6.58579 11.25 6.25 11.5858 6.25 12C6.25 12.4142 6.58579 12.75 7 12.75H11.25V17C11.25 17.4142 11.5858 17.75 12 17.75C12.4142 17.75 12.75 17.4142 12.75 17V12.75H17C17.4142 12.75 17.75 12.4142 17.75 12C17.75 11.5858 17.4142 11.25 17 11.25H12.75V7Z" fill="currentColor" />
</svg>
</button>
</div>
<div x-cloak x-bind="overlay('visagismModal')" x-spread="overlay('visagismModal')" class="fixed inset-0 top-32 bg-black bg-opacity-50 backdrop-blur-xl z-50 overflow-y-auto cursor-default">
<div class="fixed flex w-full justify-center items-start text-left z-40 min-h-screen">
<div x-ref="visagismModal" role="dialog" aria-modal="true" class="relative bg-white shadow-xl rounded-3xl p-10 w-[960px] my-10">
<div class="sticky top-6 flex justify-end -mr-4" @click.stop="hide()">
<button type="button" class=" btn btn-dark-ghost btn-size-sm btn-only-icon">
<svg class=" shrink-0" width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M8.99469 7.9047C8.70179 7.6118 8.22692 7.6118 7.93403 7.9047C7.64113 8.19759 7.64113 8.67246 7.93403 8.96536L10.9392 11.9706L7.93403 14.9758C7.64114 15.2687 7.64114 15.7435 7.93403 16.0364C8.22693 16.3293 8.7018 16.3293 8.99469 16.0364L11.9999 13.0312L15.0051 16.0364C15.298 16.3293 15.7729 16.3293 16.0658 16.0364C16.3586 15.7435 16.3586 15.2687 16.0658 14.9758L13.0606 11.9706L16.0658 8.96536C16.3587 8.67246 16.3587 8.19759 16.0658 7.9047C15.7729 7.6118 15.298 7.6118 15.0051 7.9047L11.9999 10.9099L8.99469 7.9047Z" fill="currentColor" />
</svg>
</button>
</div>
<div class="flex flex-col md:mx-8 mb-8">
<span class="font-medium text-normal">Notre engagement</span>
<h2 class="font-medium text-3xl">Visagisme</h2>
<picture>
<source srcset="../../img/commitment/commitment-teleconsultant.jpg" media="(min-width: 640px)" />
<img x-ref="image" src="../../img/telemedecine/telemedecineMobile.png" alt="téléconsultation" class="object-cover object-center my-6 rounded-lg w-full h-full" loading="lazy" />
</picture>
<div class="flex flex-col gap-4">
<h2 class="font-medium text-3xl">Notre engagement pour votre vision</h2>
<p>Description de l'engagement...</p>
</div>
<div class="flex flex-col gap-6 my-8">
<div class="flex flex-col my-8 gap-4 ">
<div class="flex items-center w-full min-h-[88px] border rounded-full gap-4 bg-neutral-50">
<img src="/img/commitment/eye.jpeg" alt="" class="ml-4 rounded-full min-w-14 w-14 h-14 object-cover object-center" />
<span class="pr-8">ALAIN AFFLELOU prend soin de votre santé visuelle</span>
</div>
<div class="flex items-center w-full min-h-[88px] border rounded-full gap-4 bg-neutral-50">
<img src="/img/commitment/eyetest.jpeg" alt="" class="ml-4 rounded-full min-w-14 w-14 h-14 object-cover object-center" />
<span class="pr-8">Prise en charge par des ophtalmologistes et orthoptistes diplômés</span>
</div>
<div class="flex items-center w-full min-h-[88px] border rounded-full gap-4 bg-neutral-50">
<img src="/img/commitment/contente.jpeg" alt="" class="ml-4 rounded-full min-w-14 w-14 h-14 object-cover object-center" />
<span class="pr-8">Tarifs conventionnés sans dépassement d'honoraires</span>
</div>
</div>
<div class="flex flex-col lg:flex-row gap-6">
<div class="min-h-[496px] bg-neutral-100 rounded-lg lg:w-1/2 flex flex-col">
<div class="flex flex-col mx-4 my-9 md:mx-9 ">
<span class="text-xl font-medium">Déroulement de la téléconsultation</span>
<div>
<ol class="flex flex-col list-decimal pl-5 my-4 gap-6">
<li></li>
<li></li>
<li></li>
<li></li>
</ol>
</div>
</div>
<div class="flex flex-row items-center gap-1 mx-9 mb-9">
<span><svg class=" shrink-0" width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M12 2.75C6.89137 2.75 2.75 6.89137 2.75 12C2.75 17.1086 6.89137 21.25 12 21.25C17.1086 21.25 21.25 17.1086 21.25 12C21.25 6.89137 17.1086 2.75 12 2.75ZM1.25 12C1.25 6.06294 6.06294 1.25 12 1.25C17.9371 1.25 22.75 6.06294 22.75 12C22.75 17.9371 17.9371 22.75 12 22.75C6.06294 22.75 1.25 17.9371 1.25 12ZM9.25 11C9.25 10.5858 9.58579 10.25 10 10.25H12C12.2489 10.25 12.4815 10.3734 12.621 10.5795C12.7606 10.7856 12.7888 11.0475 12.6964 11.2785L11.5192 14.2215C11.3221 14.7141 11.685 15.25 12.2155 15.25H13C13.4142 15.25 13.75 15.5858 13.75 16C13.75 16.4142 13.4142 16.75 13 16.75H12.2155C10.6238 16.75 9.5353 15.1423 10.1265 13.6644L10.8922 11.75H10C9.58579 11.75 9.25 11.4142 9.25 11ZM12 7C11.4478 7 11 7.44772 11 8C11 8.55228 11.4478 9 12 9H12.1C12.6523 9 13.1 8.55228 13.1 8C13.1 7.44772 12.6523 7 12.1 7H12Z" fill="currentColor" />
</svg>
</span>
<span>Assurez-vous de la disponibilité de la salle en prenant <b>rendez-vous</b></span>
</div>
</div>
<div class="min-h-[496px] bg-neutral-100 rounded-lg lg:w-1/2 flex flex-col justify-between">
<div class="flex flex-col mx-4 my-9 md:mx-9 flex-grow gap-6">
<span class="text-xl font-medium">À ne pas oublier lors de votre<br> venue :</span>
<div class="flex items-center w-full min-h-[88px] border rounded-full gap-4 bg-neutral-50">
<img src="/img/commitment/cartevitale.png" alt="" class="ml-4 rounded-full min-w-14 w-14 h-14 object-cover object-center" />
<span class="pr-8">Prendre un rendez-vous dans le magasin de votre choix.</span>
</div>
<div class="flex items-center w-full min-h-[88px] border rounded-full gap-4 bg-neutral-50">
<img src="/img/commitment/phone.jpeg" alt="" class="ml-4 rounded-full min-w-14 w-14 h-14 object-cover object-center" />
<span class="pr-8">Prendre un rendez-vous dans le magasin de votre choix.</span>
</div>
<div class="flex items-center w-full min-h-[88px] border rounded-full gap-4 bg-neutral-50">
<img src="/img/commitment/cb.png" alt="" class="ml-4 rounded-full min-w-14 w-14 h-14 object-cover object-center" />
<span class="pr-8">Prendre un rendez-vous dans le magasin de votre choix.</span>
</div>
</div>
</div>
</div>
<div>
<div class="my-10">
<span class="text-xl font-medium">Questions fréquentes</span>
<div x-data="{ open: null }" class="divide-y border-y my-6">
<div x-data="{ expanded: false }" class=" text-neutral-800">
<h2 class="font-semibold">
<button type="button" @click="expanded = !expanded " class="flex justify-between items-center w-full py-4 ">
<span class="flex flex-wrap gap-3">
Quels sont les avantages de la téléconsultation ophtalmologique ?
</span>
<span :class="expanded ? 'rotate-180' : ''" class="transform transition-transform duration-300">
<svg class=" shrink-0" width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M12.5303 14.5303C12.2374 14.8232 11.7626 14.8232 11.4697 14.5303L7.46967 10.5303C7.17678 10.2374 7.17678 9.76256 7.46967 9.46967C7.76256 9.17678 8.23744 9.17678 8.53033 9.46967L12 12.9393L15.4697 9.46967C15.7626 9.17678 16.2374 9.17678 16.5303 9.46967C16.8232 9.76256 16.8232 10.2374 16.5303 10.5303L12.5303 14.5303Z" fill="currentColor" />
</svg>
</span>
</button>
</h2>
<div x-cloak x-show="expanded" x-collapse class="py-4 text-sm">
<span>La téléconsultation ophtalmologique proposée par Alain Afflelou présente plusieurs avantages...</span>
<ul class="list-disc pl-5 mt-2">
<li>Lutte contre les déserts médicaux</li>
<li>Pas de rendez-vous préalable nécessaire</li>
<li>Réduction des délais d'attente</li>
<li>Consultation immédiate</li>
<li>Technologie innovante</li>
<li>Dépistage de pathologies</li>
<li>Suivi médical de votre vision plus régulière</li>
</ul>
</div>
</div>
<div x-data="{ expanded: false }" class=" text-neutral-800">
<h2 class="font-semibold">
<button type="button" @click="expanded = !expanded " class="flex justify-between items-center w-full py-4 ">
<span class="flex flex-wrap gap-3">
Quels sont les équipements utilisés durant la téléconsultation ?
</span>
<span :class="expanded ? 'rotate-180' : ''" class="transform transition-transform duration-300">
<svg class=" shrink-0" width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M12.5303 14.5303C12.2374 14.8232 11.7626 14.8232 11.4697 14.5303L7.46967 10.5303C7.17678 10.2374 7.17678 9.76256 7.46967 9.46967C7.76256 9.17678 8.23744 9.17678 8.53033 9.46967L12 12.9393L15.4697 9.46967C15.7626 9.17678 16.2374 9.17678 16.5303 9.46967C16.8232 9.76256 16.8232 10.2374 16.5303 10.5303L12.5303 14.5303Z" fill="currentColor" />
</svg>
</span>
</button>
</h2>
<div x-cloak x-show="expanded" x-collapse class="py-4 text-sm">
<p>Lors de la téléconsultation ophtalmologique proposée par Alain Afflelou...</p>
<ul class="list-disc pl-5 mt-2">
<li>Frontofocomètre</li>
<li>Auto-réfractomètre</li>
<li>Réfractomètre binoculaire</li>
<li>Tonométrie</li>
<li>Pachymétrie</li>
<li>Topographie</li>
<li>Rétinographie</li>
</ul>
</div>
</div>
<div x-data="{ expanded: false }" class=" text-neutral-800">
<h2 class="font-semibold">
<button type="button" @click="expanded = !expanded " class="flex justify-between items-center w-full py-4 ">
<span class="flex flex-wrap gap-3">
Est-ce que le service est gratuit ?
</span>
<span :class="expanded ? 'rotate-180' : ''" class="transform transition-transform duration-300">
<svg class=" shrink-0" width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M12.5303 14.5303C12.2374 14.8232 11.7626 14.8232 11.4697 14.5303L7.46967 10.5303C7.17678 10.2374 7.17678 9.76256 7.46967 9.46967C7.76256 9.17678 8.23744 9.17678 8.53033 9.46967L12 12.9393L15.4697 9.46967C15.7626 9.17678 16.2374 9.17678 16.5303 9.46967C16.8232 9.76256 16.8232 10.2374 16.5303 10.5303L12.5303 14.5303Z" fill="currentColor" />
</svg>
</span>
</button>
</h2>
<div x-cloak x-show="expanded" x-collapse class="py-4 text-sm">
<p>Le service de téléconsultation ophtalmologique proposé par Alain Afflelou n'est pas gratuit, mais il est proposé au tarif conventionné, c'est-à-dire sans dépassement d'honoraires.
Cela signifie que les consultations sont facturées selon les tarifs fixés par la sécurité sociale, ce qui permet aux patients de bénéficier d'une prise en charge partielle ou totale par leur assurance maladie, en fonction de leur couverture.</p>
</div>
</div>
<div x-data="{ expanded: false }" class=" text-neutral-800">
<h2 class="font-semibold">
<button type="button" @click="expanded = !expanded " class="flex justify-between items-center w-full py-4 ">
<span class="flex flex-wrap gap-3">
Suis-je obligé d'acheter après ma téléconsultation ?
</span>
<span :class="expanded ? 'rotate-180' : ''" class="transform transition-transform duration-300">
<svg class=" shrink-0" width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M12.5303 14.5303C12.2374 14.8232 11.7626 14.8232 11.4697 14.5303L7.46967 10.5303C7.17678 10.2374 7.17678 9.76256 7.46967 9.46967C7.76256 9.17678 8.23744 9.17678 8.53033 9.46967L12 12.9393L15.4697 9.46967C15.7626 9.17678 16.2374 9.17678 16.5303 9.46967C16.8232 9.76256 16.8232 10.2374 16.5303 10.5303L12.5303 14.5303Z" fill="currentColor" />
</svg>
</span>
</button>
</h2>
<div x-cloak x-show="expanded" x-collapse class="py-4 text-sm">
<p>Non, vous êtes libre d'acheter vos lunettes, lentilles ou autres équipements où vous le souhaitez après avoir reçu l'ordonnance à la suite de la téléconsultation.
Il n'y a aucune obligation d'achat dans les magasins Alain Afflelou qui proposent ce service.</p>
</div>
</div>
<div x-data="{ expanded: false }" class=" text-neutral-800">
<h2 class="font-semibold">
<button type="button" @click="expanded = !expanded " class="flex justify-between items-center w-full py-4 ">
<span class="flex flex-wrap gap-3">
Pour quels motifs puis-je faire un rendez-vous en téléconsultation ?
</span>
<span :class="expanded ? 'rotate-180' : ''" class="transform transition-transform duration-300">
<svg class=" shrink-0" width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M12.5303 14.5303C12.2374 14.8232 11.7626 14.8232 11.4697 14.5303L7.46967 10.5303C7.17678 10.2374 7.17678 9.76256 7.46967 9.46967C7.76256 9.17678 8.23744 9.17678 8.53033 9.46967L12 12.9393L15.4697 9.46967C15.7626 9.17678 16.2374 9.17678 16.5303 9.46967C16.8232 9.76256 16.8232 10.2374 16.5303 10.5303L12.5303 14.5303Z" fill="currentColor" />
</svg>
</span>
</button>
</h2>
<div x-cloak x-show="expanded" x-collapse class="py-4 text-sm">
<div class="space-y-4">
<p>Vous pouvez prendre un rendez-vous pour plusieurs motifs, principalement liés à la correction visuelle et au dépistage de certaines pathologies.</p>
<p>Comme par exemple :</p>
<ul class="list-disc pl-5">
<li>Renouvellement ou primo-prescription de lunettes,</li>
<li>Renouvellement de lentilles,</li>
<li>Renouvellement de lunettes et lentilles.</li>
</ul>
<p>Un dépistage des pathologies sera systématiquement réalisé, cependant si vous êtes atteint d'une pathologie déjà connue (DMLA, cataracte, glaucome...) il sera préférable de consulter un ophtalmologue en physique. Aussi, la téléconsultation n'est pas adaptée pour des cas d'œil rouge, de conjonctivite, orgelet ou autre infection de ce type.</p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="flex w-full justify-center sticky bottom-0 p-4 z-5 gap-x-4 lg:gap-x-6">
<div class="">
<button type="button" class=" btn btn-dark btn-size-large btn-icons">
<svg class=" shrink-0" width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M8 1.25C8.41421 1.25 8.75 1.58579 8.75 2V3.25H15.25V2C15.25 1.58579 15.5858 1.25 16 1.25C16.4142 1.25 16.75 1.58579 16.75 2V3.25H20C21.5188 3.25 22.75 4.48122 22.75 6V20C22.75 21.5188 21.5188 22.75 20 22.75H4C2.48122 22.75 1.25 21.5188 1.25 20V6C1.25 4.48122 2.48122 3.25 4 3.25H7.25V2C7.25 1.58579 7.58579 1.25 8 1.25ZM7.25 4.75H4C3.30964 4.75 2.75 5.30964 2.75 6V8.25H21.25V6C21.25 5.30964 20.6904 4.75 20 4.75H16.75V6C16.75 6.41421 16.4142 6.75 16 6.75C15.5858 6.75 15.25 6.41421 15.25 6V4.75H8.75V6C8.75 6.41421 8.41421 6.75 8 6.75C7.58579 6.75 7.25 6.41421 7.25 6V4.75ZM21.25 9.75H2.75V20C2.75 20.6904 3.30964 21.25 4 21.25H20C20.6904 21.25 21.25 20.6904 21.25 20V9.75ZM12 14.5C12.5523 14.5 13 14.0523 13 13.5C13 12.9477 12.5523 12.5 12 12.5C11.4477 12.5 11 12.9477 11 13.5C11 14.0523 11.4477 14.5 12 14.5ZM8 17.5C8 18.0523 7.55228 18.5 7 18.5C6.44772 18.5 6 18.0523 6 17.5C6 16.9477 6.44772 16.5 7 16.5C7.55228 16.5 8 16.9477 8 17.5ZM12 18.5C12.5523 18.5 13 18.0523 13 17.5C13 16.9477 12.5523 16.5 12 16.5C11.4477 16.5 11 16.9477 11 17.5C11 18.0523 11.4477 18.5 12 18.5ZM17 14.5C17.5523 14.5 18 14.0523 18 13.5C18 12.9477 17.5523 12.5 17 12.5C16.4477 12.5 16 12.9477 16 13.5C16 14.0523 16.4477 14.5 17 14.5ZM17 18.5C17.5523 18.5 18 18.0523 18 17.5C18 16.9477 17.5523 16.5 17 16.5C16.4477 16.5 16 16.9477 16 17.5C16 18.0523 16.4477 18.5 17 18.5Z" fill="currentColor" />
</svg>
Prendre un rendez-vous
</button>
</div>
</div>
</div>
</div>
</div>
</div>
<script>
'use strict';
(function() {
const modals = [];
const excludedFromFocusTrapping = new Set();
function trapFocusInNextModalWithOverlay() {
for (let idx = modals.length - 1; idx >= 0; idx--) {
const nextOnStack = modals[idx];
const nextDialogElement = nextOnStack.instance.$refs[nextOnStack.name];
if (!isOverlayDisabled(nextDialogElement)) {
hyva.trapFocus(nextDialogElement);
break;
}
}
}
function focusables(dialogElement) {
const selector = 'button, [href], input, textarea, select, details, [tabindex]:not([tabindex="-1"])';
return Array.from(dialogElement.querySelectorAll(selector))
.filter(el => !el.hasAttribute('disabled'));
}
function firstVisible(elements) {
const a = Array.from(elements);
for (let i = 0; i < a.length; i++) {
if (a[i].offsetWidth || a[i].offsetHeight || a[i].getClientRects().length) return a[i];
}
return null;
}
function isInViewport(element) {
const rect = element && element.getBoundingClientRect();
return rect &&
rect.top >= 0 &&
rect.left >= 0 &&
rect.right <= window.innerWidth &&
rect.bottom <= window.innerHeight;
}
function setFocusAfterTransition(dialogElement, duration) {
/*
* If the dialog contains an x-focus-first element that is not within a nested dialog, set focus
* immediately from the trapFocus default, to avoid the switch after the transition duration.
*/
const nested = Array.from(dialogElement.querySelectorAll('[role="dialog"]'));
const candidates = Array.from(dialogElement.querySelectorAll('[x-focus-first]'));
next: for (let candidate of candidates) {
for (let child of nested) {
if (child.contains(candidate)) continue next;
}
setTimeout(() => candidate.focus(), 50);
break;
}
window.setTimeout(() => {
const focusElement = firstVisible(dialogElement.querySelectorAll('[x-focus-first]')) ||
focusables(dialogElement)[0] ||
null;
focusElement && isInViewport(focusElement) && focusElement.focus();
}, Math.max(1, duration));
}
function determineTrigger($refs, dialog, trigger) {
/* if show() was called without arguments use the event target as open trigger */
if (typeof trigger === 'undefined' && typeof dialog === 'object' && dialog.target instanceof HTMLElement) {
return dialog.target;
}
/* if show('name', $event) was called with the event as the second argument use the event target as trigger */
if (typeof dialog === 'string' && typeof trigger === 'object' && trigger.target instanceof HTMLElement) {
return trigger.target;
}
/* if show('name', 'trigger') was called with the ref name pr selector of the trigger element */
if (typeof trigger === 'string') {
try {
return $refs[trigger] || document.querySelector(trigger)
} catch (e) {
/* Intentionally left empty because we don't know if trigger is intended as a valid selector string */
}
}
/* if show('name', document.querySelector('...')) was called, use that as the trigger */
if (trigger instanceof Element) {
return trigger;
}
/* unknown trigger - no focus will be set when the dialog is hidden */
return null;
}
function isOverlayDisabled(dialog) {
return dialog && dialog.hasAttribute('x-no-overlay')
}
function areRemainingModalsWithoutOverlay(modals) {
const overflowDisabled = modals.map(modal => modal.instance.$refs[modal.name]).filter(isOverlayDisabled);
return overflowDisabled.length === modals.length;
}
window.hyva.modal = function(options) {
const config = Object.assign({
dialog: 'dialog',
duration: 300,
/* ms before allowing subsequent hiding of modals for nested modals (see transition duration) */
transitionEnter: 'transition ease-out duration-300',
transitionEnterStart: 'opacity-0',
transitionEnterEnd: 'opacity-100',
transitionLeave: 'transition ease-in duration-300',
transitionLeaveStart: 'opacity-100',
transitionLeaveEnd: 'opacity-0',
}, options);
let lastHide = 0;
return {
opened: {},
show(dialog, trigger) {
console.log('show');
const focusTargetAfterHide = determineTrigger(this.$refs, dialog, trigger);
const name = typeof dialog === 'string' ? dialog : config.dialog;
const dialogElement = this.$refs[name];
if (!dialogElement) {
console.error(`Use $modal->getShowJs() in the open trigger, or specify a custom name with\n$modal->withDialogRefName("my-name") and use show("my-name", $event).`);
return;
}
const useOverlay = !dialogElement.hasAttribute('x-no-overlay');
if (this.$refs.swiperContainer && this.$refs.swiperContainer.querySelector) {
const swiperWrapper = this.$refs.swiperContainer.querySelector('.swiper-wrapper');
if (swiperWrapper) {
swiperWrapper.classList.add('!transform-none');
}
}
dialogElement.scrollTop = 0;
/* Prevent adding the same modal on the stack twice */
if (this.opened[name]) {
return;
}
if (focusTargetAfterHide) {
focusTargetAfterHide.setAttribute('aria-expanded', 'true');
}
this.opened[name] = true;
useOverlay && this.$nextTick(() => hyva.trapFocus(dialogElement));
setFocusAfterTransition(dialogElement, config.duration);
const frame = {
name,
instance: this,
focusTarget: focusTargetAfterHide,
time: Date.now()
};
modals.push(frame);
if (useOverlay) {
document.body.classList.add('overflow-hidden');
}
return new Promise(resolve => frame.resolve = resolve);
},
cancel() {
this.hide(false);
},
ok() {
this.hide(true);
},
hide(value) {
// Guard against Escape being pressed multiple times before a transition is finished, otherwise
// this function will pop further dialogs from the stack but the display will not update.
console.log('Hiding modal:', value);
if (Date.now() - lastHide < config.duration) {
return;
}
lastHide = Date.now();
const modal = modals.pop() || {};
const name = modal.name;
this.opened[name] = false;
hyva.releaseFocus(modal.instance.$refs[modal.name])
trapFocusInNextModalWithOverlay();
const nextFocusAfterHide = modal.focusTarget;
nextFocusAfterHide && setTimeout(() => {
nextFocusAfterHide.setAttribute('aria-expanded', 'false');
nextFocusAfterHide.focus()
}, config.duration);
if (modals.length === 0 || areRemainingModalsWithoutOverlay(modals)) {
document.body.classList.remove('overflow-hidden');
}
if (this.$refs && this.$refs.swiperContainer && this.$refs.swiperContainer.querySelector) {
const swiperWrapper = this.$refs.swiperContainer.querySelector('.swiper-wrapper');
if (swiperWrapper) {
swiperWrapper.classList.remove('!transform-none');
}
}
modal.resolve(value);
},
overlay(dialog) {
const name = typeof dialog === 'string' ? dialog : config.dialog;
return {
['x-show']() {
return this.opened[name]
},
['x-transition:enter']: config.transitionEnter,
['x-transition:enter-start']: config.transitionEnterStart,
['x-transition:enter-end']: config.transitionEnterEnd,
['x-transition:leave']: config.transitionLeave,
['x-transition:leave-start']: config.transitionLeaveStart,
['x-transition:leave-end']: config.transitionLeaveEnd,
['@hyva-modal-show.window'](event) {
event.detail && event.detail.dialog === name && this.show(name, event.detail.focusAfterHide)
}
};
}
};
}
window.hyva.modal.peek = () => modals.length > 0 && modals[modals.length - 1]
window.hyva.modal.pop = function() {
if (modals.length > 0) {
const modal = modals[modals.length - 1];
modal.instance.hide();
}
}
window.hyva.modal.excludeSelectorsFromFocusTrap = function(selectors) {
typeof selectors === 'string' || selectors instanceof String ?
excludedFromFocusTrapping.add(selectors) :
selectors.map(selector => excludedFromFocusTrapping.add(selector));
}
window.hyva.modal.eventListeners = {
keydown: event => {
if (event.key === 'Escape') {
window.hyva.modal.pop();
}
},
/* generic modal @click.outside handler */
click: event => {
if (modals.length > 0) {
const modal = modals[modals.length - 1];
const dialog = modal.instance.$refs[modal.name];
if (modal.time + 50 < Date.now() && // if last click processing is more than 50ms ago
!isOverlayDisabled(dialog) && // if dialog has overlay
!dialog.contains(event.target)) { // if click is outside of dialog
modal.instance.hide();
}
}
}
};
document.addEventListener('keydown', window.hyva.modal.eventListeners.keydown);
document.addEventListener('click', window.hyva.modal.eventListeners.click);
})();
</script>
{# components/modal/modal.twig #}
<div x-data="hyva.modal()"
@click="show('{{ slide.id }}Modal', $event)"
class="relative min-w-[80%] h-[484px] bg-center rounded-lg cursor-pointer bg-cover"
style="background-image: url('{{ slide.backgroundImage }}');"
>
<div class="absolute inset-0 bg-black/10 rounded-lg"></div>
<h2 class="absolute top-6 left-6 font-medium text-white text-2xl">{{ slide.modalTitle }}</h2>
<div class="absolute bottom-6 right-6">
{% include "@template-button" with {
color: "light",
size: "sm",
type: "only-icon",
icon: {
name: "library--plus-outline",
width: '24',
height: '24'
}
} %}
</div>
{# Modal Content #}
<div x-cloak
x-bind="overlay('{{ slide.id }}Modal')"
x-spread="overlay('{{ slide.id }}Modal')"
class="fixed inset-0 top-32 bg-black bg-opacity-50 backdrop-blur-xl z-50 overflow-y-auto cursor-default"
>
<div class="fixed flex w-full justify-center items-start text-left z-40 min-h-screen">
<div x-ref="{{ slide.id }}Modal"
role="dialog"
aria-modal="true"
class="relative bg-white shadow-xl rounded-3xl p-10 w-[960px] my-10"
>
{# Close Button #}
<div class="sticky top-6 flex justify-end -mr-4" @click.stop="hide()">
{% include "@template-button" with {
color: "dark-ghost",
size: "sm",
type: "only-icon",
icon: {
name: "library--close-outline",
width: '24',
height: '24'
}
} %}
</div>
<div class="flex flex-col md:mx-8 mb-8">
{# Header #}
<span class="font-medium text-normal">{{ slide.subtitle }}</span>
<h2 class="font-medium text-3xl">{{ slide.title }}</h2>
{# Main Image #}
{% if slide.image.src %}
<picture>
<source srcset="{{ slide.image.src | path }}" media="(min-width: 640px)"/>
<img x-ref="image" src="{{ slide.image.srcMobile | path }}" alt="{{ slide.image.alt }}" class="object-cover object-center my-6 rounded-lg w-full h-full" loading="lazy"/>
</picture>
{% endif %}
{# Content Section #}
<div class="flex flex-col gap-4">
<h2 class="font-medium text-3xl">{{ slide.content.title }}</h2>
<p>{{ slide.content.description }}</p>
{% if slide.content.button|length > 0 %}
<span>
{% render "@template-link" with {
type: "leading-icon",
label: content.button.label,
icon: {
name: content.button.icon
}
} %}
</span>
{% endif %}
</div>
<div class="flex flex-col gap-6 my-8">
{# Questions #}
{% if slide.questions|length > 0 %}
<div class="flex flex-col lg:flex-row bg-neutral-100 rounded-lg w-full gap-9 p-9">
<img src="{{ slide.questions.image.src }}" alt="{{ slide.questions.image.alt }}"
class="h-[295px] lg:h-[425px] rounded-lg object-cover object-center lg:w-1/2">
<div class="lg:w-1/2">
<span class="text-xl font-medium">{{ slide.questions.title }}</span>
<div>
<ol class="flex flex-col list-decimal pl-5 my-4 gap-6">
{% for item in slide.questions.items %}
<li>{{ slide.item }}</li>
{% endfor %}
</ol>
</div>
</div>
</div>
{% endif %}
{# subContent #}
{% if slide.subContent|length > 0 %}
<div class="flex flex-col gap-4 my-9">
<h2 class="text-xl font-medium">{{ slide.subContent.title }}</h2>
<p>{{ slide.subContent.content }}</p>
</div>
{% endif %}
{# Features #}
{% if slide.featuresBubbles.items|length > 0 %}
{% if slide.featuresBubbles.title and slide.featuresBubbles.title %}
<div class="flex flex-col gap-4 my-12">
<span class="text-xl font-medium mb-2">{{ slide.featuresBubbles.title }}</span>
{% endif %}
<div class="flex flex-col my-8 gap-4 {{ slide.featuresBubbles.classItems }}">
{% for feature in slide.featuresBubbles.items %}
{% render "@infobubble" with {
src: feature.icon,
alt: '',
text: feature.text,
} %}
{% endfor %}
</div>
{% if slide.featuresBubbles.title and slide.featuresBubbles.title %}
</div>
{% endif %}
{% endif %}
{# recapArray #}
{% if slide.recapArray|length > 0 %}
<div class="bg-neutral-100 rounded-lg w-full flex flex-col">
<div class="flex flex-col m-9 gap-2">
<div class="flex flex-row items-center gap-1 mb-4">
<span>{% render "@icons-library--information-circle-outline" %}</span>
<span class="text-xl font-medium">{{ slide.recapArray.title }}</span>
</div>
{% for item in slide.recapArray.items %}
<div class="flex flex-row items-center justify-between gap-1 bg-white px-6 w-full min-h-14 rounded-lg shadow-sm">
<span>{{ slide.item.left }}</span>
<span>{% render "@icons-library--arrow-right" %}</span>
<span>{{ slide.item.right }}</span>
</div>
{% endfor %}
</div>
</div>
{% endif %}
{# Two Columns Section #}
{% if slide.featuresBubbles|length > 0 and slide.requirements|length > 0 %}
<div class="flex flex-col lg:flex-row gap-6">
{# Steps Column #}
<div class="min-h-[496px] bg-neutral-100 rounded-lg lg:w-1/2 flex flex-col">
<div class="flex flex-col mx-4 my-9 md:mx-9 ">
<span class="text-xl font-medium">{{ slide.steps.title }}</span>
<div>
<ol class="flex flex-col list-decimal pl-5 my-4 gap-6">
{% for step in slide.steps.items %}
<li>{{ slide.step }}</li>
{% endfor %}
</ol>
</div>
</div>
<div class="flex flex-row items-center gap-1 mx-9 mb-9">
<span>{% render "@icons-library--information-circle-outline" %}</span>
<span>{{ slide.steps.complementary }}</span>
</div>
</div>
{# Requirements Column #}
<div class="min-h-[496px] bg-neutral-100 rounded-lg lg:w-1/2 flex flex-col justify-between">
<div class="flex flex-col mx-4 my-9 md:mx-9 flex-grow gap-6">
<span class="text-xl font-medium">{{ slide.requirements.title }}</span>
{% for req in slide.requirements.items %}
{% render "@infobubble" with {
src: req.icon,
alt: '',
text: feature.text,
} %}
{% endfor %}
</div>
</div>
</div>
{% endif %}
{# FAQ Section #}
{% if slide.faq.items|length > 0 %}
<div>
<div class="my-10">
<span class="text-xl font-medium">{{ slide.faq.title }}</span>
<div x-data="{ open: null }" class="divide-y border-y my-6">
{% for item in slide.faq.items %}
{% render "@accordion" with {
title: item.question,
content: item.answer,
accordion_button_class: "py-4 ",
accordion_content_class: "py-4 text-sm"
} %}
{% endfor %}
</div>
</div>
</div>
{% endif %}
</div>
</div>
{% if slide.contactForm|length > 0 %}
{% render "@contactourcommitment" %}
{% endif %}
{# Footer Button #}
<div class="flex w-full justify-center sticky bottom-0 p-4 z-5 gap-x-4 lg:gap-x-6">
{% if slide.footerButtons|length > 0 %}
{% for button in slide.footerButtons %}
<div class="{{ slide.button.divClass }}">
{% include "@template-button" with {
color: button.color,
size: "large",
type: button.type,
label: button.label,
icon: {
name: button.icon,
width: '24',
height: '24'
}
} %}
</div>
{% endfor %}
{% endif %}
</div>
</div>
</div>
</div>
</div>
{% render "@commitmentscript" %}
{
"slide": {
"id": "visagism",
"modalTitle": "Visagisme",
"title": "Visagisme",
"subtitle": "Notre engagement",
"backgroundImage": "/img/commitment/visagism.png",
"image": {
"srcMobile": "/img/telemedecine/telemedecineMobile.png",
"src": "/img/commitment/commitment-teleconsultant.jpg",
"alt": "téléconsultation"
},
"content": {
"title": "Notre engagement pour votre vision",
"description": "Description de l'engagement..."
},
"featuresBubbles": {
"items": [
{
"icon": "/img/commitment/eye.jpeg",
"text": "ALAIN AFFLELOU prend soin de votre santé visuelle"
},
{
"icon": "/img/commitment/eyetest.jpeg",
"text": "Prise en charge par des ophtalmologistes et orthoptistes diplômés"
},
{
"icon": "/img/commitment/contente.jpeg",
"text": "Tarifs conventionnés sans dépassement d'honoraires"
}
]
},
"steps": {
"title": "Déroulement de la téléconsultation",
"items": [
"Créez votre compte grâce à votre carte vitale.",
"L'examen est réalisé par un orthoptiste",
"Un ophtalmologiste posera son diagnostique.",
"Récupérez le compte-rendu et l'ordonnance en fin de consultation."
],
"complementary": "Assurez-vous de la disponibilité de la salle en prenant <b>rendez-vous</b>"
},
"requirements": {
"title": "À ne pas oublier lors de votre<br> venue :",
"items": [
{
"icon": "/img/commitment/cartevitale.png",
"text": "Carte Vitale"
},
{
"icon": "/img/commitment/phone.jpeg",
"text": "Smartphone"
},
{
"icon": "/img/commitment/cb.png",
"text": "Carte Bleue"
}
]
},
"faq": {
"title": "Questions fréquentes",
"items": [
{
"question": "Quels sont les avantages de la téléconsultation ophtalmologique ?",
"answer": "\n <span>La téléconsultation ophtalmologique proposée par Alain Afflelou présente plusieurs avantages...</span>\n <ul class=\"list-disc pl-5 mt-2\">\n <li>Lutte contre les déserts médicaux</li>\n <li>Pas de rendez-vous préalable nécessaire</li>\n <li>Réduction des délais d'attente</li>\n <li>Consultation immédiate</li>\n <li>Technologie innovante</li>\n <li>Dépistage de pathologies</li>\n <li>Suivi médical de votre vision plus régulière</li>\n </ul>\n "
},
{
"question": "Quels sont les équipements utilisés durant la téléconsultation ?",
"answer": "\n <p>Lors de la téléconsultation ophtalmologique proposée par Alain Afflelou...</p>\n <ul class=\"list-disc pl-5 mt-2\">\n <li>Frontofocomètre</li>\n <li>Auto-réfractomètre</li>\n <li>Réfractomètre binoculaire</li>\n <li>Tonométrie</li>\n <li>Pachymétrie</li>\n <li>Topographie</li>\n <li>Rétinographie</li>\n </ul>\n "
},
{
"question": "Est-ce que le service est gratuit ?",
"answer": "\n <p>Le service de téléconsultation ophtalmologique proposé par Alain Afflelou n'est pas gratuit, mais il est proposé au tarif conventionné, c'est-à-dire sans dépassement d'honoraires.\n Cela signifie que les consultations sont facturées selon les tarifs fixés par la sécurité sociale, ce qui permet aux patients de bénéficier d'une prise en charge partielle ou totale par leur assurance maladie, en fonction de leur couverture.</p>\n "
},
{
"question": "Suis-je obligé d'acheter après ma téléconsultation ?",
"answer": "\n <p>Non, vous êtes libre d'acheter vos lunettes, lentilles ou autres équipements où vous le souhaitez après avoir reçu l'ordonnance à la suite de la téléconsultation.\n Il n'y a aucune obligation d'achat dans les magasins Alain Afflelou qui proposent ce service.</p>\n "
},
{
"question": "Pour quels motifs puis-je faire un rendez-vous en téléconsultation ?",
"answer": "\n <div class=\"space-y-4\">\n <p>Vous pouvez prendre un rendez-vous pour plusieurs motifs, principalement liés à la correction visuelle et au dépistage de certaines pathologies.</p>\n <p>Comme par exemple :</p>\n <ul class=\"list-disc pl-5\">\n <li>Renouvellement ou primo-prescription de lunettes,</li>\n <li>Renouvellement de lentilles,</li>\n <li>Renouvellement de lunettes et lentilles.</li>\n </ul>\n <p>Un dépistage des pathologies sera systématiquement réalisé, cependant si vous êtes atteint d'une pathologie déjà connue (DMLA, cataracte, glaucome...) il sera préférable de consulter un ophtalmologue en physique. Aussi, la téléconsultation n'est pas adaptée pour des cas d'œil rouge, de conjonctivite, orgelet ou autre infection de ce type.</p>\n </div>\n "
}
]
},
"footerButtons": [
{
"label": "Prendre un rendez-vous",
"icon": "library--calendar",
"color": "dark",
"type": "leading-icon"
}
]
},
"variants": [
{
"name": "free-test-audio",
"context": {
"id": "audioTest",
"modalTitle": "Test d'audition gratuit",
"backgroundImage": "/img/commitment/audiotest.png",
"subtitle": "Tester son audition est aussi simple que de tester sa vue.",
"title": "Test auditif gratuit*",
"image": {
"src": "/img/commitment/audio-test.png",
"srcMobile": "/img/commitment/audiotest.png",
"alt": "test de vue gratuit"
},
"content": {
"title": "Pourquoi se faire dépister ?",
"description": "Le dépistage est la première étape vers une bonne santé auditive. Pour cela, vous pouvez réaliser un test auditif par un professionnel de santé, médecin ORL ou audioprothésiste diplômé d’État.\n Ce test a pour but de suivre l’évolution de votre audition et de déceler une possible perte auditive.\n La prise en charge précoce d’un trouble auditif est la clé pour conserver son bien-être auditif le plus longtemps possible.",
"button": {
"label": "Reconnaitre une baisse d'audition",
"icon": "library--arrow-right"
}
},
"questions": {
"image": {
"src": "/img/commitment/goodmood.png",
"srcMobile": "/img/commitment/goodmood.png",
"alt": "/img/commitment/goodmood.png"
},
"title": "Comment se passe le test ?",
"items": [
"Votre audioprothésiste vous pose quelques questions sur votre santé auditive pour savoir si vous avez été exposé par le passé à des éléments qui auraient pu altérer votre audition.",
"Votre professionnel de santé va ensuite procéder à un examen de vos oreilles afin de vérifier qu’un bouchon n’obstrue pas votre conduit auditif par exemple.",
"Il va ensuite procéder à l’analyser de vos capacités auditives. Un test sonore totalement indolore.",
"En fonction de vos résultats, votre audioprothésiste vous conseille les solutions auditives les plus adaptées et vous donnera des conseils pour prendre soin de votre santé auditive."
]
},
"subContent": {
"title": "Être rappelé pour prendre rendez-vous",
"content": "Complétez le formulaire ci-dessous et nos conseillers vous rappelleront dans les plus brefs délais du lundi au vendredi de 10h à 12h et de 14h à 17h."
},
"contactForm": {
"show": true
},
"featuresBubbles": [],
"steps": {},
"requirements": {},
"faq": [],
"footerButtons": [
{
"color": "audio",
"label": "Être rappelé",
"icon": "library--call",
"type": "leading-icon"
},
{
"divClass": "hidden lg:flex",
"color": "audio-subtle",
"label": "Prendre un rendez-vous",
"icon": "library--calendar",
"type": "leading-icon"
},
{
"divClass": "lg:hidden",
"color": "audio-subtle",
"icon": "library--calendar",
"type": "only-icon"
}
]
}
},
{
"name": "free-test-optic",
"context": {
"id": "opticTest",
"modalTitle": "Test de vue gratuit",
"backgroundImage": "/img/commitment/test-optic.png",
"subtitle": "Êtes vous sûr de bien voir ?",
"title": "Test de vue gratuit",
"image": {
"src": "/img/commitment/eyetest2.png",
"srcMobile": "/img/commitment/test-optic.png",
"alt": "test de vue gratuit"
},
"content": {
"title": "Testez* gratuitement votre vue",
"description": "Aujourd’hui, les troubles visuels touchent environ 70% de la population française.Il est donc essentiel de faire contrôler votre vue régulièrement. Nous avons des solutions pour vous !"
},
"featuresBubbles": {
"title": "Faire vérifier votre vue en magasin, c'est simple et rapide !",
"classItems": "lg:grid lg:grid-rows-2 lg:grid-flow-col gap-6",
"items": [
{
"icon": "/img/commitment/phone2.png",
"text": "Prendre un rendez-vous dans le magasin de votre choix."
},
{
"icon": "/img/commitment/letter.png",
"text": "Notre opticien effectue une vérification de votre vue."
},
{
"icon": "/img/commitment/eyes3.png",
"text": "N'hésitez pas à apporter votre ordonnance."
},
{
"icon": "/img/commitment/lunette.png",
"text": "On vous aide à trouver la meilleure solution pour votre confort visuel"
}
]
},
"recapArray": {
"title": "Bon à savoir : durée de validité de votre ordonnance",
"items": [
{
"left": "Moins de 16 ans",
"right": "1 an de validité"
},
{
"left": "Moins de 16 ans",
"right": "1 an de validité"
},
{
"left": "Moins de 16 ans",
"right": "1 an de validité"
}
]
},
"steps": [],
"requirements": [],
"faq": [],
"footerButtons": [
{
"label": "Prendre un rendez-vous",
"icon": "library--calendar",
"color": "dark",
"type": "leading-icon"
}
]
}
},
{
"name": "Téléconsultation",
"context": {
"id": "teleconsulting",
"modalTitle": "Téléconsultation",
"title": "Téléconsultation ophtalmologique",
"subtitle": "Proximité, Innovation et Praticité",
"backgroundImage": "/img/commitment/commitment-teleconsultant.jpg",
"image": {
"srcMobile": "/img/telemedecine/telemedecineMobile.png",
"src": "/img/commitment/commitment-teleconsultant.jpg",
"alt": "téléconsultation"
},
"content": {
"title": "Gagnez un temps precieux !",
"description": "ALAIN AFFLELOU vous permet de bénéficier d'une téléconsultation avec un Ophtalmologue qui réalisera à distance\n un examen complet de la vue. C'est un service innovant avec ou sans rendez-vous disponible <br> dans nos magasins\n Alain Afflelou équipés près de chez vous."
},
"featuresBubbles": {
"items": [
{
"icon": "/img/commitment/eye.jpeg",
"text": "ALAIN AFFLELOU prend soin de votre santé visuelle"
},
{
"icon": "/img/commitment/eyetest.jpeg",
"text": "Prise en charge par des ophtalmologistes et orthoptistes diplômés"
},
{
"icon": "/img/commitment/contente.jpeg",
"text": "Tarifs conventionnés sans dépassement d'honoraires"
}
]
},
"steps": {
"title": "Déroulement de la <br> téléconsultation",
"items": [
"Créez votre compte grâce à votre carte vitale.",
"L'examen est réalisé par un orthoptiste",
"Un ophtalmologiste posera son diagnostique.",
"Récupérez le compte-rendu et l'ordonnance en fin de consultation."
],
"complementary": "Assurez-vous de la disponibilité de la salle en prenant <b>rendez-vous</b>"
},
"requirements": {
"title": "À ne pas oublier lors de votre<br> venue :",
"items": [
{
"icon": "/img/commitment/cartevitale.png",
"text": "Carte Vitale"
},
{
"icon": "/img/commitment/phone.jpeg",
"text": "Smartphone"
},
{
"icon": "/img/commitment/cb.png",
"text": "Carte Bleue"
}
]
},
"faq": {
"title": "Questions fréquentes",
"items": [
{
"question": "Quels sont les avantages de la téléconsultation ophtalmologique ?",
"answer": "\n <span>La téléconsultation ophtalmologique proposée par Alain Afflelou présente plusieurs avantages...</span>\n <ul class=\"list-disc pl-5 mt-2\">\n <li>Lutte contre les déserts médicaux</li>\n <li>Pas de rendez-vous préalable nécessaire</li>\n <li>Réduction des délais d'attente</li>\n <li>Consultation immédiate</li>\n <li>Technologie innovante</li>\n <li>Dépistage de pathologies</li>\n <li>Suivi médical de votre vision plus régulière</li>\n </ul>\n "
},
{
"question": "Quels sont les équipements utilisés durant la téléconsultation ?",
"answer": "\n <p>Lors de la téléconsultation ophtalmologique proposée par Alain Afflelou...</p>\n <ul class=\"list-disc pl-5 mt-2\">\n <li>Frontofocomètre</li>\n <li>Auto-réfractomètre</li>\n <li>Réfractomètre binoculaire</li>\n <li>Tonométrie</li>\n <li>Pachymétrie</li>\n <li>Topographie</li>\n <li>Rétinographie</li>\n </ul>\n "
},
{
"question": "Est-ce que le service est gratuit ?",
"answer": "\n <p>Le service de téléconsultation ophtalmologique proposé par Alain Afflelou n'est pas gratuit, mais il est proposé au tarif conventionné, c'est-à-dire sans dépassement d'honoraires.\n Cela signifie que les consultations sont facturées selon les tarifs fixés par la sécurité sociale, ce qui permet aux patients de bénéficier d'une prise en charge partielle ou totale par leur assurance maladie, en fonction de leur couverture.</p>\n "
},
{
"question": "Suis-je obligé d'acheter après ma téléconsultation ?",
"answer": "\n <p>Non, vous êtes libre d'acheter vos lunettes, lentilles ou autres équipements où vous le souhaitez après avoir reçu l'ordonnance à la suite de la téléconsultation.\n Il n'y a aucune obligation d'achat dans les magasins Alain Afflelou qui proposent ce service.</p>\n "
},
{
"question": "Pour quels motifs puis-je faire un rendez-vous en téléconsultation ?",
"answer": "\n <div class=\"space-y-4\">\n <p>Vous pouvez prendre un rendez-vous pour plusieurs motifs, principalement liés à la correction visuelle et au dépistage de certaines pathologies.</p>\n <p>Comme par exemple :</p>\n <ul class=\"list-disc pl-5\">\n <li>Renouvellement ou primo-prescription de lunettes,</li>\n <li>Renouvellement de lentilles,</li>\n <li>Renouvellement de lunettes et lentilles.</li>\n </ul>\n <p>Un dépistage des pathologies sera systématiquement réalisé, cependant si vous êtes atteint d'une pathologie déjà connue (DMLA, cataracte, glaucome...) il sera préférable de consulter un ophtalmologue en physique. Aussi, la téléconsultation n'est pas adaptée pour des cas d'œil rouge, de conjonctivite, orgelet ou autre infection de ce type.</p>\n </div>\n "
}
]
},
"footerButtons": [
{
"label": "Prendre un rendez-vous",
"icon": "library--calendar",
"color": "dark",
"type": "leading-icon"
}
]
}
}
]
}
No notes defined.