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:
@@ -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 {
|
||||
|
||||
Reference in New Issue
Block a user