75 lines
1.4 KiB
Vue
75 lines
1.4 KiB
Vue
<template>
|
|
<div class="page page-error">
|
|
<h1 class="mb-4 font-mono heading text-4xl">{{ statusCode }}</h1>
|
|
<h3 class="mb-4 heading font-mono text-xs">{{ message }}</h3>
|
|
<p class="mt-4 border-t border-tooltip">
|
|
<nuxt-link to="/">
|
|
<button class="icon button">
|
|
<i class="material-icons">home</i>
|
|
<span>
|
|
{{ $t("go_home") }}
|
|
</span>
|
|
</button>
|
|
</nuxt-link>
|
|
<button class="icon button" @click="reloadApplication">
|
|
<i class="material-icons">refresh</i>
|
|
<span>
|
|
{{ $t("reload") }}
|
|
</span>
|
|
</button>
|
|
</p>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import { initializeFirebase } from "~/helpers/fb"
|
|
|
|
export default {
|
|
props: {
|
|
error: {
|
|
type: Object,
|
|
default: null,
|
|
},
|
|
},
|
|
|
|
head() {
|
|
return {
|
|
bodyAttrs: {
|
|
class: "sticky-footer",
|
|
},
|
|
}
|
|
},
|
|
computed: {
|
|
statusCode() {
|
|
return (this.error && this.error.statusCode) || 500
|
|
},
|
|
message() {
|
|
return this.error.message || this.$t("something_went_wrong")
|
|
},
|
|
},
|
|
beforeMount() {
|
|
initializeFirebase()
|
|
},
|
|
|
|
methods: {
|
|
reloadApplication() {
|
|
window.location.reload()
|
|
},
|
|
},
|
|
}
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
.page-error {
|
|
@apply flex flex-col;
|
|
@apply items-center;
|
|
@apply justify-center;
|
|
@apply text-center;
|
|
}
|
|
|
|
.error_banner {
|
|
@apply w-24;
|
|
@apply mb-12;
|
|
}
|
|
</style>
|