fix(audit) : MalioButton + paliers month/year dans AuditTimeline

T-010 — remplace le <button> HTML brut par MalioButton variant=tertiary,
conformement a la regle projet (tous les boutons passent par Malio*).

T-014 — etend relativeDate avec les paliers 'month' (~30.44j) et 'year'
(~365.25j). Avant, une entree vieille d'un an affichait "il y a 52
semaines" au lieu de "l'an dernier" (RelativeTimeFormat FR).
This commit is contained in:
Matthieu
2026-04-23 11:44:55 +02:00
parent 2a835855b9
commit da35f29960

View File

@@ -77,14 +77,13 @@
<!-- Lazy loading : bouton "Voir plus" si plus de pages. -->
<div v-if="hasMore" class="mt-4 flex justify-center">
<button
type="button"
class="px-3 py-1.5 text-sm rounded border border-gray-300 hover:bg-gray-50 disabled:opacity-60"
<MalioButton
variant="tertiary"
:label="loading ? t('common.loading') : t('audit.timeline.load_more')"
:disabled="loading"
button-class="text-sm"
@click="loadMore"
>
{{ loading ? t('common.loading') : t('audit.timeline.load_more') }}
</button>
/>
</div>
</div>
</template>
@@ -163,22 +162,27 @@ function dotClass(action: string): string {
}
// Relativise une date via Intl.RelativeTimeFormat. On selectionne l'unite
// la plus grossiere possible (minutes < heures < jours < semaines). La
// locale suit dynamiquement celle de l'app pour qu'un switch de langue
// prenne effet sans nouveau mount (recomputed = cache par-locale).
// la plus grossiere possible (secondes < minutes < heures < jours < semaines
// < mois < annees). La locale suit dynamiquement celle de l'app pour qu'un
// switch de langue prenne effet sans nouveau mount (recomputed = cache
// par-locale). Paliers mois/annee approximes (30.44j / 365.25j) : suffisant
// pour un affichage humain, la tooltip absoluteDate garde la date exacte.
const rtf = computed(() => new Intl.RelativeTimeFormat(locale.value, { numeric: 'auto' }))
function relativeDate(iso: string): string {
const diffMs = Date.now() - new Date(iso).getTime()
const diffSec = Math.round(diffMs / 1000)
const absSec = Math.abs(diffSec)
const sign = -Math.sign(diffSec)
const fmt = rtf.value
if (absSec < 60) return fmt.format(-Math.sign(diffSec) * Math.abs(diffSec), 'second')
if (absSec < 3600) return fmt.format(-Math.sign(diffSec) * Math.round(absSec / 60), 'minute')
if (absSec < 86400) return fmt.format(-Math.sign(diffSec) * Math.round(absSec / 3600), 'hour')
if (absSec < 604800) return fmt.format(-Math.sign(diffSec) * Math.round(absSec / 86400), 'day')
return fmt.format(-Math.sign(diffSec) * Math.round(absSec / 604800), 'week')
if (absSec < 60) return fmt.format(sign * absSec, 'second')
if (absSec < 3600) return fmt.format(sign * Math.round(absSec / 60), 'minute')
if (absSec < 86400) return fmt.format(sign * Math.round(absSec / 3600), 'hour')
if (absSec < 604800) return fmt.format(sign * Math.round(absSec / 86400), 'day')
if (absSec < 2629800) return fmt.format(sign * Math.round(absSec / 604800), 'week') // < ~30.44j
if (absSec < 31557600) return fmt.format(sign * Math.round(absSec / 2629800), 'month') // < ~365.25j
return fmt.format(sign * Math.round(absSec / 31557600), 'year')
}
function absoluteDate(iso: string): string {