<!-- 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>