Skip to content
Snippets Groups Projects
Commit 48a79f14 authored by VIktorGrev's avatar VIktorGrev
Browse files

feat: Adding NotFoundView and UnauthorizedView

parent ffd422a5
No related branches found
No related tags found
No related merge requests found
Pipeline #273559 failed
Stage: install
Stage: build
Hide whitespace changes
Inline Side-by-side
src/assets/icons/danger.svg 0 → 100644
+ 1
− 0
View file @ 48a79f14
<svg xmlns="http://www.w3.org/2000/svg" height="48" viewBox="0 -960 960 960" width="48"><path d="m40-120 440-760 440 760H40Zm104-60h672L480-760 144-180Zm340.175-57q12.825 0 21.325-8.675 8.5-8.676 8.5-21.5 0-12.825-8.675-21.325-8.676-8.5-21.5-8.5-12.825 0-21.325 8.675-8.5 8.676-8.5 21.5 0 12.825 8.675 21.325 8.676 8.5 21.5 8.5ZM454-348h60v-224h-60v224Zm26-122Z" fill="#ffffff"/></svg>
\ No newline at end of file
src/router/index.ts
+ 1
− 1
View file @ 48a79f14
...@@ -39,7 +39,7 @@ const routes = [ ...@@ -39,7 +39,7 @@ const routes = [
{ {
path: 'unauthorized', path: 'unauthorized',
name: 'unauthorized', name: 'unauthorized',
component: () => import('@/views/TestView.vue'), component: () => import('@/views/UnauthorizedView.vue'),
}, },
] ]
}, },
......
src/views/NotFoundView.vue
+ 42
− 3
View file @ 48a79f14
<template> <template>
<div> <div class="container-fluid"> <!-- Changed from 'container' to 'container-fluid' -->
<h1 id="errorMessage">404 - Not Found</h1> <div class="row">
<div class="col-md-12">
<div class="error-template text-center"> <!-- 'text-center' for centering text content -->
<h1>
Oops!</h1>
<h2>
404 Not Found</h2>
<div class="error-details">
Sorry, an error has occurred, Requested page not found!
</div>
<div class="error-actions">
<Button1 button-text="Take Me Home" @click="home" />
</div>
</div>
</div>
</div> </div>
</template> </div>
\ No newline at end of file </template>
<script setup lang="ts">
import { useRouter } from 'vue-router';
import Button1 from '@/components/Buttons/Button1.vue';
const router = useRouter();
const home = () => {
router.push('/'); // Assuming the root URL '/' is your home route
};
</script>
<style scoped>
.error-template {
text-align: center; /* Ensures all text and inline elements within are centered */
display: flex;
flex-direction: column;
align-items: center; /* Aligns child elements (which are block-level) centrally */
justify-content: center; /* Optional: if you want vertical centering */
margin: 2rem;
}
</style>
\ No newline at end of file
src/views/UnauthorizedView.vue 0 → 100644
+ 28
− 0
View file @ 48a79f14
<template>
<body class="bg-dark text-white py-5">
<div class="container py-5">
<div class="row">
<div class="col-md-2 text-center">
<p><img src="@/assets/icons/danger.svg"> <br/>Status Code: 403</p>
</div>
<div class="col-md-10">
<h3>OPPSSS!!!! Sorry...</h3>
<p>Sorry, your access is refused due to security reasons of our server and also our sensitive data.<br/>Please go back to the home page to continue browsing.</p>
<Button1 :button-text="'Take Me Home'" @click="home" />
</div>
</div>
</div>
</body>
</template>
<script setup lang="ts">
import { defineComponent } from 'vue';
import { useRouter } from 'vue-router';
import Button1 from '@/components/Buttons/Button1.vue';
const router = useRouter();
const home = () => {
router.push('/');
};
</script>
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment