Matthieu
cb49c69662
Auto Tag Develop / tag (push) Successful in 58s
- DetailHeader / MachineDetailHeader : le bouton Retour utilise router.back() (restaure l'URL précédente avec la query ?q=...) avec fallback sur le chemin nu si pas d'historique applicatif. Corrige la perte de recherche/tri/pagination au retour depuis une page détail (composants, produits, pièces, machines). - ManagementView : détecte l'annulation via controller.signal.aborted au lieu de error.name (ofetch encapsule l'AbortError dans une FetchError), supprimant le toast d'erreur affiché lors d'une nouvelle recherche.
69 lines
2.0 KiB
Vue
69 lines
2.0 KiB
Vue
<template>
|
|
<div class="flex flex-col gap-4 md:flex-row md:items-start md:justify-between">
|
|
<div class="flex flex-col gap-2">
|
|
<h1 class="text-3xl font-bold">{{ title }}</h1>
|
|
<p v-if="subtitle" class="text-sm text-base-content/70">{{ subtitle }}</p>
|
|
</div>
|
|
<div class="flex items-center gap-2">
|
|
<button
|
|
v-if="canEdit"
|
|
class="btn btn-primary"
|
|
:class="{ 'btn-outline': isEditMode }"
|
|
@click="$emit('toggle-edit')"
|
|
>
|
|
<IconLucideSquarePen v-if="!isEditMode" class="w-5 h-5 mr-2" aria-hidden="true" />
|
|
<IconLucideEye v-else class="w-5 h-5 mr-2" aria-hidden="true" />
|
|
{{ isEditMode ? 'Voir détails' : 'Modifier' }}
|
|
</button>
|
|
<button type="button" class="btn btn-ghost btn-sm md:btn-md" @click="goBack">
|
|
<IconLucideArrowLeft class="w-4 h-4 mr-1" aria-hidden="true" />
|
|
{{ backLabel }}
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import IconLucideSquarePen from '~icons/lucide/square-pen'
|
|
import IconLucideEye from '~icons/lucide/eye'
|
|
import IconLucideArrowLeft from '~icons/lucide/arrow-left'
|
|
|
|
const route = useRoute()
|
|
const router = useRouter()
|
|
|
|
const props = defineProps<{
|
|
title: string
|
|
subtitle?: string
|
|
isEditMode: boolean
|
|
canEdit: boolean
|
|
backLink: string
|
|
backLinkLabel?: string
|
|
}>()
|
|
|
|
defineEmits<{
|
|
'toggle-edit': []
|
|
}>()
|
|
|
|
// Retour : on revient à l'URL précédente pour préserver l'état de la liste
|
|
// (recherche, tri, pagination persistés en query params). Fallback sur le
|
|
// backLink si pas d'historique applicatif (accès direct, refresh, lien partagé).
|
|
const goBack = () => {
|
|
if (route.query.from === 'machine' && route.query.machineId) {
|
|
router.push(`/machine/${route.query.machineId}`)
|
|
return
|
|
}
|
|
if (window.history.state?.back) {
|
|
router.back()
|
|
return
|
|
}
|
|
router.push(props.backLink)
|
|
}
|
|
|
|
const backLabel = computed(() => {
|
|
if (route.query.from === 'machine') {
|
|
return 'Retour à la machine'
|
|
}
|
|
return props.backLinkLabel ?? 'Retour au catalogue'
|
|
})
|
|
</script>
|