tethys.backend/resources/js/Pages/Error.vue
2023-03-03 16:54:28 +01:00

80 lines
2.3 KiB
Vue

<!-- https://github.com/inertiajs/inertia-laravel/issues/56 -->
<script setup>
import LayoutAuthenticated from '@/Layouts/LayoutAuthenticated.vue';
import SectionMain from '@/Components/SectionMain.vue';
import { computed } from 'vue';
import SectionTitleLineWithButton from '@/Components/SectionTitleLineWithButton.vue';
import BaseButton from '@/Components/BaseButton.vue';
import { mdiChartTimelineVariant, mdiGithub } from '@mdi/js';
const props = defineProps({
status: {
type: Number,
default: null,
},
message: {
type: String,
default: "",
},
});
const title = computed(() => {
return {
503: '503: Service Unavailable',
500: '500: Server Error',
404: '404: Page Not Found',
403: '404: Forbidden',
401: '401: Unauthorized',
}[props.status];
});
const description = computed(() => {
return {
503: 'Sorry, we are doing some maintenance. Please check back soon.',
500: 'Whoops, something went wrong on our servers.',
404: 'Sorry, the page you are looking for could not be found.',
403: 'Sorry, you are forbidden from accessing this page.',
401: 'Sorry, you are forbidden from accessing this page.',
}[props.status];
});
// export default {
// // layout: LayoutAuthenticated,
// props: {
// status: Number,
// },
// computed: {
// title() {
// return {
// 503: '503: Service Unavailable',
// 500: '500: Server Error',
// 404: '404: Page Not Found',
// 403: '404: Forbidden',
// 401: '404: Forbidden',
// }[this.status];
// },
// description() {
// return {
// 503: 'Sorry, we are doing some maintenance. Please check back soon.',
// 500: 'Whoops, something went wrong on our servers.',
// 404: 'Sorry, the page you are looking for could not be found.',
// 403: 'Sorry, you are forbidden from accessing this page.',
// 401: 'Sorry, you are forbidden from accessing this page.',
// }[this.status];
// },
// },
// };
</script>
<template>
<LayoutAuthenticated>
<SectionMain>
<SectionTitleLineWithButton v-bind:icon="mdiChartTimelineVariant" title="Error" main>
<BaseButton href="https://gitea.geologie.ac.at/geolba/tethys" target="_blank" :icon="mdiGithub"
label="Star on Gitea" color="contrast" rounded-full small />
</SectionTitleLineWithButton>
<h1>{{ title }}</h1>
<div>{{ props.message }}</div>
</SectionMain>
</LayoutAuthenticated>
</template>