80 lines
1.5 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<script setup lang="ts">
import { useRouter } from "vue-router";
import noAccess from "@/assets/status/403.svg?component";
defineOptions({
name: "403"
});
const router = useRouter();
</script>
<template>
<div
class="flex flex-col md:flex-row justify-center items-center min-h-full w-full p-4 md:p-0"
>
<noAccess />
<div class="mt-8 md:ml-12 md:mt-0 text-center md:text-left">
<p
v-motion
class="font-medium text-4xl mb-4! dark:text-white"
:initial="{
opacity: 0,
y: 100
}"
:enter="{
opacity: 1,
y: 0,
transition: {
delay: 80
}
}"
>
403
</p>
<p
v-motion
class="text-xl mb-4! text-gray-500"
:initial="{
opacity: 0,
y: 100
}"
:enter="{
opacity: 1,
y: 0,
transition: {
delay: 120
}
}"
>
抱歉你无权访问该页面
</p>
<el-button
v-motion
type="primary"
class="block mx-auto md:inline-block md:mx-0"
:initial="{
opacity: 0,
y: 100
}"
:enter="{
opacity: 1,
y: 0,
transition: {
delay: 160
}
}"
@click="router.push('/')"
>
返回首页
</el-button>
</div>
</div>
</template>
<style scoped>
.main-content {
margin: 0 !important;
}
</style>