feat(03-03): create error.vue (404 page) with i18n keys
- error.vue in app/ with statusCode display, i18n message, clearError redirect - Added error.notFound, error.generic, error.backHome keys to fr.json and en.json
This commit is contained in:
@@ -0,0 +1,22 @@
|
||||
<script setup lang="ts">
|
||||
import type { NuxtError } from '#app'
|
||||
|
||||
const props = defineProps<{ error: NuxtError }>()
|
||||
const { t } = useI18n()
|
||||
|
||||
function handleError() {
|
||||
clearError({ redirect: '/' })
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="min-h-screen flex flex-col items-center justify-center gap-6 px-4">
|
||||
<h1 class="text-8xl font-bold text-primary">{{ error.statusCode }}</h1>
|
||||
<p class="text-xl text-gray-500 dark:text-gray-400 text-center max-w-md">
|
||||
{{ error.statusCode === 404 ? t('error.notFound') : t('error.generic') }}
|
||||
</p>
|
||||
<UButton size="lg" @click="handleError">
|
||||
{{ t('error.backHome') }}
|
||||
</UButton>
|
||||
</div>
|
||||
</template>
|
||||
Reference in New Issue
Block a user