tristan
7d7b2fb720
All checks were successful
Release / release (push) Successful in 1m24s
| Numéro du ticket | Titre du ticket | |------------------|-----------------| | | | ## Description de la PR ## Modification du .env ## Check list - [ ] Pas de régression - [ ] TU/TI/TF rédigée - [ ] TU/TI/TF OK - [ ] CHANGELOG modifié Co-authored-by: matthieu <matthieu@yuno.malio.fr> Co-authored-by: THOLOT DECHENE Matthieu <matthieu@yuno.malio.fr> Reviewed-on: #52 Co-authored-by: tristan <tristan@yuno.malio.fr> Co-committed-by: tristan <tristan@yuno.malio.fr>
71 lines
1.7 KiB
Vue
71 lines
1.7 KiB
Vue
<template>
|
|
<div class="flex h-[36px] justify-between border-b border-black/60 mb-3">
|
|
<button
|
|
type="button"
|
|
data-test="header-prev"
|
|
class="ml-2 flex self-start rounded"
|
|
:aria-label="viewMode === 'days' ? 'Mois précédent' : 'Année précédente'"
|
|
@click="emit('prev')"
|
|
>
|
|
<Icon
|
|
icon="mdi:chevron-left"
|
|
:width="25"
|
|
:height="25"
|
|
/>
|
|
</button>
|
|
|
|
<button
|
|
type="button"
|
|
data-test="header-toggle"
|
|
class="flex gap-1 rounded text-base font-medium"
|
|
@click="emit('toggle-view')"
|
|
>
|
|
<span class="mt-[2px]">{{ label }}</span>
|
|
<Icon
|
|
icon="mdi:chevron-down"
|
|
:width="25"
|
|
:height="25"
|
|
/>
|
|
</button>
|
|
|
|
<button
|
|
type="button"
|
|
data-test="header-next"
|
|
class="mr-2 flex self-start rounded"
|
|
:aria-label="viewMode === 'days' ? 'Mois suivant' : 'Année suivante'"
|
|
@click="emit('next')"
|
|
>
|
|
<Icon
|
|
icon="mdi:chevron-right"
|
|
:width="25"
|
|
:height="25"
|
|
/>
|
|
</button>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import {computed} from 'vue'
|
|
import {Icon} from '@iconify/vue'
|
|
|
|
defineOptions({name: 'MalioDateCalendarHeader'})
|
|
|
|
const props = defineProps<{
|
|
viewMode: 'days' | 'months'
|
|
currentMonth: number
|
|
currentYear: number
|
|
}>()
|
|
|
|
const emit = defineEmits<{
|
|
(e: 'prev' | 'next' | 'toggle-view'): void
|
|
}>()
|
|
|
|
const monthsLong = ['janvier', 'février', 'mars', 'avril', 'mai', 'juin',
|
|
'juillet', 'août', 'septembre', 'octobre', 'novembre', 'décembre']
|
|
|
|
const label = computed(() => {
|
|
const name = monthsLong[props.currentMonth]
|
|
return `${name.charAt(0).toUpperCase()}${name.slice(1)} ${props.currentYear}`
|
|
})
|
|
</script>
|