From 736071ee580d7297303f30fc2344ae6baf8edf9a Mon Sep 17 00:00:00 2001
From: Saladin21 <13519187@std.stei.itb.ac.id>
Date: Sun, 17 Apr 2022 21:03:28 +0700
Subject: [PATCH] route protetion, not found page
---
src/components/header.vue | 1 +
src/router/index.js | 57 ++++++++++++++++++++++++++------
src/views/Login.vue | 2 +-
src/views/NotFound.vue | 66 +++++++++++++++++++++++++++++++++++++
src/views/Test.vue | 68 ---------------------------------------
5 files changed, 116 insertions(+), 78 deletions(-)
create mode 100644 src/views/NotFound.vue
delete mode 100644 src/views/Test.vue
diff --git a/src/components/header.vue b/src/components/header.vue
index 883f277..11b76e7 100644
--- a/src/components/header.vue
+++ b/src/components/header.vue
@@ -108,6 +108,7 @@ export default {
// console.log(b)
localStorage.removeItem("token");
console.log('token removed')
+ window.location.reload()
},
getProfile(){
HTTP.get("users/profile").then((res)=>{
diff --git a/src/router/index.js b/src/router/index.js
index b7abd14..832bff2 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -16,20 +16,23 @@ import KpiIndex from "../views/KpiIndex.vue";
import KpiDetail from "../views/KpiDetail.vue";
import KpiCreate from "../views/KpiCreate.vue";
import KpiManagerDetail from "../views/KpiManagerDetail.vue";
-import Test from "../views/Test.vue";
+import NotFound from "../views/NotFound.vue";
import ManagerKpiIndex from "../views/ManagerKpiIndex.vue";
import ManagerKaryawanIndex from "../views/ManagerKaryawanIndex.vue";
import ManagerKaryawanDetail from "../views/ManagerKaryawanDetail.vue";
import ResponseIndex from "../views/ResponseIndex.vue";
import ResponseDetail from "../views/ResponseDetail.vue";
import ResponseEmployee from "../views/ResponseEmployee.vue";
+import { HTTP } from '../http-common'
+
+const adminRoute = ['Login', 'profil-admin', 'change-pass', 'User', 'Admin', 'KaryawanInsert', 'Departemen', 'KaryawanEdit', 'KaryawanDetail', 'AdminInsert', 'AdminEdit']
+const empRoute = ['Login', 'profil-user', 'change-pass', 'kpiIndex', 'KpiDetail', 'KpiResponses', 'ResponseEmployee', 'KpiCreate', 'KpiManagerDetail', 'ManagerkpiIndex', 'ManagerkaryawanIndex', 'ManagerKaryawanDetail', 'ResponseIndex', 'ResponseDetail']
const routes = [
- // {
- // path: "/",
- // name: "Home",
- // component: Login,
- // },
+ {
+ path: "/",
+ redirect: "/login"
+ },
{
path: "/login",
name: "Login",
@@ -148,9 +151,9 @@ const routes = [
component: ResponseDetail
},
{
- path: "/test",
- name: "test",
- component: Test,
+ path: "/:catchAll(.*)",
+ name: "NotFound",
+ component: NotFound,
},
];
@@ -159,4 +162,40 @@ const router = createRouter({
routes,
});
+router.beforeEach((to,from, next)=>{
+ if (to.name != "Login" && to.name != "NotFound"){
+ HTTP.get("users/profile").then((res)=>{
+ let isAdmin = res.data.data.is_admin
+ if (isAdmin){
+ if (adminRoute.includes(to.name)){
+ next()
+ }else{
+ next("/forbidden")
+ }
+ }else{
+ if (empRoute.includes(to.name)){
+ next()
+ }else{
+ next("/forbidden")
+ }
+ }
+ }).catch(()=>{
+ next("/login")
+ })
+ }else if (to.name != "NotFound"){
+ HTTP.get("users/profile").then((res)=>{
+ if (res.data.data.is_admin){
+ next("/user")
+ }else{
+ next("/kpi")
+ }
+ }).catch(()=>{
+ next()
+ })
+ }else{
+ next()
+ }
+
+})
+
export default router;
diff --git a/src/views/Login.vue b/src/views/Login.vue
index 69d6570..f1fbac3 100644
--- a/src/views/Login.vue
+++ b/src/views/Login.vue
@@ -110,7 +110,7 @@ export default {
.then((response) => {
localStorage.setItem("token", response.data.token)
if (response.data.success) {
- this.$router.push({ name: "User" });
+ window.location.reload()
}
})
.catch(() => alert("username atau password salah"));
diff --git a/src/views/NotFound.vue b/src/views/NotFound.vue
new file mode 100644
index 0000000..3b00b25
--- /dev/null
+++ b/src/views/NotFound.vue
@@ -0,0 +1,66 @@
+<template>
+ <div class="d-flex align-items-center justify-content-center" style="height:100vh;">
+ <div class="align-self-center justify-content-center">
+ <h1 class="text-center" style="
+ font-size: 100px;" >404</h1>
+ <h3 class="text-center" style="
+ font-size: 50px;" >Not Found</h3>
+ <div
+ id="logo"
+ class="d-flex flex-row justify-content-start align-items-center illustration"
+ >
+ <i class="icon ion-ios-navigate" style="font-size: 73px"></i>
+ <p
+ class="text-center"
+ style="
+ font-size: 40px;
+ padding: 0;
+ width: 115px;
+ margin-top: 16px;
+ margin-left: 2px;
+ font-family: nunito;
+ font-weight: bold;
+ "
+ >
+ simkpi
+ </p>
+ </div>
+ </div>
+ </div>
+</template>
+
+<script>
+
+
+export default {
+ name: "NotFound",
+ components: {
+ },
+}
+</script>
+
+<style scoped>
+* {
+ margin: 0;
+ padding: 0;
+ box-sizing: border-box;
+}
+
+body {
+ min-height: 100vh;
+ background-color: #fff;
+}
+
+.illustration {
+ text-align: center;
+ padding: 0 0 20 20px;
+ font-size: 100px;
+ color: rgb(244, 71, 107);
+}
+
+#logo {
+ margin-left: 30px;
+}
+
+
+</style>
\ No newline at end of file
diff --git a/src/views/Test.vue b/src/views/Test.vue
deleted file mode 100644
index 0c051c1..0000000
--- a/src/views/Test.vue
+++ /dev/null
@@ -1,68 +0,0 @@
-<template>
- <div class="container-fluid">
- <div class="row flex-nowrap">
- <Sidebar current_page = "About"></Sidebar>
- <div class="col ps-md-2 pt-2">
- <Header></Header>
- <input v-model="filter" type="text">
- <Table2 :endpoint="'kpis'" :columns="columns" :filter="filter" :filter_column="'name'" @edit-entry="print" @delete-entry="print" @detail-entry="print" ></Table2>
- </div>
- </div>
- </div>
-</template>
-
-<script>
-
-import Header from "../components/header"
-import Sidebar from "../components/sidebar"
-import Table2 from "../components/table-2";
-
-
-export default {
- name: "Template",
- components: {
- Header,
- Sidebar,
- Table2
- },
- data(){
- return{
- filter: "",
- columns: {
- Id: {
- name : "Id",
- data : "id",
- hidden : true,
- clickable : false
- },
- Nama: {
- name : "Nama",
- data : "name",
- hidden : false,
- clickable : true
- },
- },
- }
- },
- methods: {
- print(id){
- console.log(id)
- }
- }
-}
-</script>
-
-<style scoped>
-* {
- margin: 0;
- padding: 0;
- box-sizing: border-box;
-}
-
-body {
- min-height: 100vh;
- background-color: #fff;
-}
-
-
-</style>
\ No newline at end of file
--
GitLab