30 lines
1.7 KiB
Vue
30 lines
1.7 KiB
Vue
 
|
<template>
|
||
|
|
<NuxtLayout>
|
||
|
|
<section class="py-32 relative overflow-hidden">
|
||
|
|
<div class="absolute top-1/4 right-0 w-[550px] h-[550px] bg-brand-100/50 dark:bg-brand-600/15 rounded-full blur-[140px] pointer-events-none -z-10" />
|
||
|
|
<div class="max-w-xl mx-auto px-4 text-center space-y-5">
|
||
|
|
<div class="text-7xl font-black text-transparent bg-clip-text bg-gradient-to-r from-brand-600 via-brand-500 to-sky-400">{{ toFa(error.statusCode) }}</div>
|
||
|
|
<h1 class="text-2xl sm:text-3xl font-black text-slate-900 dark:text-white">{{ is404 ? "صفحهای که دنبالش بودید پیدا نشد." : "خطایی رخ داد." }}</h1>
|
||
|
|
<p class="text-slate-600 dark:text-slate-300">{{ is404 ? "ممکن است آدرس تغییر کرده یا حذف شده باشد." : "لطفاً چند لحظه دیگر دوباره تلاش کنید." }}</p>
|
||
|
|
<button
|
||
|
|
type="button"
|
||
|
|
class="inline-flex items-center gap-2.5 px-6 py-3 rounded-full bg-brand-600 text-white font-bold text-sm hover:bg-brand-700 active:scale-95 transition-all duration-300 shadow-md shadow-brand-600/25"
|
||
|
|
@click="clearError({ redirect: '/' })"
|
||
|
|
>
|
||
|
|
بازگشت به صفحه اصلی
|
||
|
|
</button>
|
||
|
|
</div>
|
||
|
|
</section>
|
||
|
|
</NuxtLayout>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script setup lang="ts">
|
||
|
|
import type { NuxtError } from "#app";
|
||
|
|
|
||
|
|
const props = defineProps<{ error: NuxtError }>();
|
||
|
|
const is404 = computed(() => props.error.statusCode === 404);
|
||
|
|
const toFa = (n?: number) => String(n ?? 500).replace(/\d/g, (d) => "۰۱۲۳۴۵۶۷۸۹"[Number(d)]);
|
||
|
|
|
||
|
|
useSeoMeta({ title: is404.value ? "صفحه پیدا نشد — منتک" : "خطا — منتک", robots: "noindex,follow" });
|
||
|
|
</script>
|