feat(front) : ameliorations UI onglets client (compta, RIB, blocs, placeholder)
- Onglet Comptabilite : grille alignee sur les autres onglets (grid-cols-4 gap-x-[44px] gap-y-4) en creation / modification / consultation. - Bloc RIB toujours visible (au moins un bloc, meme vide) en creation, modification et consultation ; un bloc vide n'est jamais persiste. - Blocs Contact / Adresse / RIB toujours affiches meme vides en consultation et modification ; suppression des messages « Aucun ... enregistre ». - Onglets a venir (Transport, Statistiques, Rapports, Echanges) : nouveau composant partage ComingSoonPlaceholder (shared/components/ui) « En cours de dev » + gif, reutilisable par tous les modules ; remplace TabPlaceholderBlank.
This commit is contained in:
@@ -0,0 +1,51 @@
|
||||
<template>
|
||||
<!--
|
||||
Placeholder generique « En cours de dev » pour les ecrans / onglets non
|
||||
encore implementes. Composant PARTAGE (shared/components) : auto-importe
|
||||
sans prefixe (`<ComingSoonPlaceholder>`) et reutilisable depuis n'importe
|
||||
quel module. Affiche un gif (asset local par defaut) + un message i18n.
|
||||
-->
|
||||
<div class="flex min-h-[240px] flex-col items-center justify-center gap-4 rounded-md bg-white py-10">
|
||||
<img
|
||||
v-if="!imageFailed"
|
||||
:src="src"
|
||||
:alt="resolvedTitle"
|
||||
class="max-h-[220px] w-auto rounded-md"
|
||||
@error="imageFailed = true"
|
||||
>
|
||||
<!-- Repli si le gif ne charge pas (offline, CSP, asset absent) :
|
||||
illustration emoji, le message reste affiche. -->
|
||||
<div v-else class="text-5xl" aria-hidden="true">🚧 👨💻 🚧</div>
|
||||
|
||||
<div class="text-center">
|
||||
<p class="text-xl font-bold text-black">{{ resolvedTitle }}</p>
|
||||
<p class="mt-1 text-black/60">{{ resolvedSubtitle }}</p>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
const props = withDefaults(
|
||||
defineProps<{
|
||||
/** Source de l'image/gif affichee. Defaut : asset local `/coming-soon.gif`. */
|
||||
src?: string
|
||||
/** Titre. Defaut : i18n `common.comingSoon.title`. */
|
||||
title?: string
|
||||
/** Sous-titre. Defaut : i18n `common.comingSoon.subtitle`. */
|
||||
subtitle?: string
|
||||
}>(),
|
||||
{
|
||||
src: '/coming-soon.gif',
|
||||
title: '',
|
||||
subtitle: '',
|
||||
},
|
||||
)
|
||||
|
||||
const { t } = useI18n()
|
||||
const imageFailed = ref(false)
|
||||
|
||||
// Les props priment sur les libelles i18n par defaut (permet a un module
|
||||
// d'override le texte sans toucher au composant).
|
||||
const resolvedTitle = computed(() => props.title || t('common.comingSoon.title'))
|
||||
const resolvedSubtitle = computed(() => props.subtitle || t('common.comingSoon.subtitle'))
|
||||
</script>
|
||||
Reference in New Issue
Block a user