nouveau-theatre-de-besancon/site/snippets/calendar-strip.php
2024-07-26 08:46:47 +02:00

43 lines
1.3 KiB
PHP

<div
class="calendar-strip"
x-data="{
monthNumb: dayjs().month(),
token: '<?= $site->mapadoToken() ?>',
contractId: '<?= $site->mapadoContractId() ?>',
dates: [],
get monthName() {
return dayjs().month(this.monthNumb).format('MMMM');
},
async updateDates() {
this.dates = getDatesInMonth(this.monthNumb);
const mapadoDates = await getMapadoDates(this.monthNumb)
// mapadoDates.forEach(mapadoDate => {
// const day = parseInt(mapadoDate.day)
// this.dates[day].push(mapadoDate.name)
// })
// console.log('dates', this.dates)
}
}"
x-init="updateDates()"
>
<div class="calendar-strip__selector">
<button class="prev-month" @click="monthNumb--; updateDates()" :disabled="monthNumb === -4 ? true : false"></button>
<span x-text="monthName"></span>
<button class="next-month" @click="monthNumb++; updateDates()"></button>
</div>
<ul class="calendar-strip__days">
<template x-for="(date, index) in dates">
<li class="calendar-strip__day">
<button x-text="index" :disabled="date.length === 0 ? true : false" title="Voir les événements"></button>
</li>
</template>
</ul>
<button class="calendar-strip__calendar-btn">calendrier</button>
<div class="calendar-strip__date"></div>
</div>