diff --git a/aleksis/core/frontend/components/app/Error404.vue b/aleksis/core/frontend/components/app/ErrorPage.vue similarity index 63% rename from aleksis/core/frontend/components/app/Error404.vue rename to aleksis/core/frontend/components/app/ErrorPage.vue index 017f53174179ce346ab40956a8c05d2ff1ea17b4..b26cbca46be3a7566231e2b3cbcb74f445cc892a 100644 --- a/aleksis/core/frontend/components/app/Error404.vue +++ b/aleksis/core/frontend/components/app/ErrorPage.vue @@ -3,8 +3,8 @@ class="d-flex justify-center align-center flex-column text-center" id="wrapper" > - <h1 class="text-h2">{{ $t("network_errors.error_404") }}</h1> - <div>{{ $t("network_errors.page_not_found") }}</div> + <h1 class="text-h2">{{ $t(shortErrorMessageKey) }}</h1> + <div>{{ $t(longErrorMessageKey) }}</div> <v-btn color="secondary" :to="{ name: 'dashboard' }"> {{ $t("network_errors.take_me_back") }} </v-btn> @@ -13,7 +13,11 @@ <script> export default { - name: "Error404", + name: "ErrorPage", + props: { + shortErrorMessageKey: String, + longErrorMessageKey: String, + } }; </script> diff --git a/aleksis/core/frontend/plugins/aleksis.js b/aleksis/core/frontend/plugins/aleksis.js index c750f135db97a0c8819e6808dd17bd33e06c8885..9b2207585600a6154fcb8aaf01f1e07c25e7d4c8 100644 --- a/aleksis/core/frontend/plugins/aleksis.js +++ b/aleksis/core/frontend/plugins/aleksis.js @@ -72,6 +72,7 @@ AleksisVue.install = function (Vue) { Vue.component("ButtonMenu", () => import("../components/generic/ButtonMenu.vue") ); + Vue.component("ErrorPage", () => import("../components/app/ErrorPage.vue")) }; /** diff --git a/aleksis/core/frontend/routes.js b/aleksis/core/frontend/routes.js index 2732a7ba5623d02c7b3095ce8c40e0a1414efcee..bf895f65c34c6ef35fc5343864d258163dc3b05f 100644 --- a/aleksis/core/frontend/routes.js +++ b/aleksis/core/frontend/routes.js @@ -792,8 +792,9 @@ for (const [appName, appRoutes] of Object.entries(appObjects)) { // Fallback route defined last to ensure 404 view works routes.push({ path: "/*", - component: () => import("./components/app/Error404.vue"), + component: () => import("./components/app/ErrorPage.vue"), name: "core.error404", + props: { shortErrorMessageKey: "network_errors.error_404", longErrorMessageKey: "network_errors.page_not_found" }, }); export default routes;