isp-devlab · fajar-dev · Mar 3, 2024 · Mar 3, 2024 · Mar 3, 2024 · Mar 3, 2024
diff --git a/index.html b/index.html
@@ -6,6 +6,44 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>User</title>
     <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Poppins:300,400,500,600,700" />
+    <meta
+    name="keywords"
+    content=""
+    />
+    <meta name="author" content="Informatics Study Platform" />
+    <meta name="description" content="" />
+
+    <!-- Open Graph Meta Tags -->
+    <meta property="og:url" content="" />
+    <meta property="og:title" content="" />
+    <meta property="og:type" content="article" />
+    <meta property="og:image" content="" />
+    <meta
+      property="og:description"
+      content=""
+    />
+    <meta property="og:locale" content="id_ID" />
+
+    <!-- Twitter Card Meta Tags -->
+    <meta name="twitter:card" content="summary_large_image" />
+    <meta name="twitter:title" content="" />
+    <meta
+      name="twitter:description"
+      content=""
+    />
+    <meta name="twitter:image" content="" />
+
+    <!-- Additional SEO Meta Tags -->
+    <meta name="distribution" content="global" />
+    <meta name="revisit-after" content="7 days" />
+    <meta name="rating" content="general" />
+    <meta name="language" content="Indonesian" />
+    <meta name="geo.region" content="ID" />
+    <meta name="geo.placename" content="Aceh" />
+
+    <!-- Canonical Tag -->
+    <link rel="canonical" href="" />
+
   </head>
   <body>
     <div id="app"></div>

diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -11,6 +11,8 @@
     "@popperjs/core": "^2.11.8",
     "axios": "^1.4.0",
     "bootstrap": "^5.3.0",
+    "bootstrap-icons": "^1.11.3",
+    "swiper": "^11.0.7",
     "vue": "^3.3.4",
     "vue-router": "^4.2.2",
     "vuex": "^4.0.2"

diff --git a/src/assets/img/imgslider.png b/src/assets/img/imgslider.png
diff --git a/src/components/Header.vue b/src/components/Header.vue
@@ -26,8 +26,8 @@
 								</div>
 							</div>
 							<div class="d-flex align-items-stretch flex-shrink-0">
-								<div class="d-flex align-items-stretch flex-shrink-0">
-									<div class="d-flex align-items-stretch ms-2 me-2">
+								<div class="d-flex">
+									<div class="d-flex align-items-stretch ms-2 me-3">
 										<div id="kt_header_search" class="d-flex align-items-stretch d-md-none d-block dropdown">
 												<div class="d-flex align-items-center" data-bs-toggle="dropdown">
 													<div class="btn btn-icon btn-active-light-primary w-30px h-30px w-md-40px h-md-40px">
@@ -54,6 +54,14 @@
 												</div>
 										</div>
 									</div>
+									<!-- <div class=" pt-lg-7 pt-md-3 pt-5">
+										<router-link :to="{name: 'auth.register'}" class="btn btn-light me-6">
+											Daftar
+                    </router-link>
+										<router-link :to="{name: 'auth.login'}" class="btn btn-primary">
+											Masuk
+                    </router-link>
+									</div> -->
 									<div class="d-flex align-items-center ms-2">
 										<div class="dropdown">
 											<div class="btn btn-icon btn-active-light btn-active-color-primary position-relative w-30px h-30px w-md-40px h-md-40px" data-bs-toggle="dropdown">

diff --git a/src/router/index.js b/src/router/index.js
@@ -1,64 +1,68 @@
 import { createRouter, createWebHistory } from 'vue-router'
 
+const routes = [
+  {
+    path: '/',
+    name: 'home',
+    component: () => import('@/views/Home.vue')
+  },
+  {
+    path: '/auth/daftar',
+    name: 'auth.register',
+    component: () => import('@/views/auth/Register.vue')
+  },
+  {
+    path: '/auth/masuk',
+    name: 'auth.login',
+    component: () => import('@/views/auth/Login.vue')
+  },
+  {
+    path: '/auth/lupa-password',
+    name: 'auth.forget',
+    component: () => import('@/views/auth/Forget.vue')
+  },
+  {
+    path: '/tim/:id/diskusi',
+    name: 'tim.diskusi',
+    component: () => import('@/views/team/Discussion.vue')
+  },
+  {
+    path: '/tim/:id/tugas',
+    name: 'tim.tugas',
+    component: () => import('@/views/team/Assignment.vue')
+  },
+  {
+    path: '/profil/setelan',
+    name: 'profil.setelan',
+    component: () => import('@/views/profile/Setting.vue')
+  },
+  {
+    path: '/profil/tim',
+    name: 'profil.tim',
+    component: () => import('@/views/profile/Team.vue')
+  },
+  {
+    path: '/profil/kelas',
+    name: 'profil.kelas',
+    component: () => import('@/views/profile/Class.vue')
+  },
+]
+
 const router = createRouter({
   history: createWebHistory(),
-  routes: [
-    {
-      path: '/auth/daftar',
-      name: 'auth.register',
-      component: () => import('@/views/auth/Register.vue')
-    },
-    {
-      path: '/auth/masuk',
-      name: 'auth.login',
-      component: () => import('@/views/auth/Login.vue')
-    },
-    {
-      path: '/auth/lupa-password',
-      name: 'auth.forget',
-      component: () => import('@/views/auth/Forget.vue')
-    },
-    {
-      path: '/tim/:id/diskusi',
-      name: 'tim.diskusi',
-      component: () => import('@/views/team/Discussion.vue')
-    },
-    {
-      path: '/tim/:id/tugas',
-      name: 'tim.tugas',
-      component: () => import('@/views/team/Assignment.vue')
-    },
-    {
-      path: '/profil/setelan',
-      name: 'profil.setelan',
-      component: () => import('@/views/profile/Setting.vue')
-    },
-    {
-      path: '/profil/tim',
-      name: 'profil.tim',
-      component: () => import('@/views/profile/Team.vue')
-    },
-    {
-      path: '/profil/kelas',
-      name: 'profil.kelas',
-      component: () => import('@/views/profile/Class.vue')
-    },
-    // {
-    //   path: '/',
-    //   name: 'user.index',
-    //   component: () => import('@/views/user/Index.vue')
-    // },
-    // {
-    //   path: '/create',
-    //   name: 'user.create',
-    //   component: () => import('@/views/user/Create.vue')
-    // },
-    // {
-    //   path: '/edit/:id',
-    //   name: 'user.edit',
-    //   component: () => import('@/views/user/Edit.vue')
-    // },
-  ]
+  routes
+})
+
+router.beforeEach((to, from, next) => {
+  if (to.matched.some(record => record.meta.requiresAuth)) {
+    if (store.getters.isLoggedIn) {
+      next()
+      return
+    }
+    next('/')
+  } else {
+    next()
+  }
 })
 
 export default router
diff --git a/src/store/index.js b/src/store/index.js
@@ -0,0 +1,125 @@
+import { createStore } from 'vuex'
+import axios from 'axios'
+
+export default createStore({
+  state: {
+    success: '',
+    token: localStorage.getItem('token') || '',
+    user: {}
+  },
+
+  mutations: {
+    AUTH_REQUEST(state) {
+      state.status = 'loading'
+    },
+
+    AUTH_SUCCESS(state, token, user) {
+      state.status = 'success'
+      state.token   = token
+      state.user    = user
+    },
+
+    AUTH_ERROR(state) {
+      state.status = 'error'
+    },
+
+    AUTH_LOGOUT(state) {
+      state.status = ''
+      state.token = ''
+    },
+
+  },
+
+  actions: {
+    LOGIN({ commit }, user) {
+
+      return new Promise((resolve, reject) => {
+
+        commit('AUTH_REQUEST')
+        axios.post('http://laravel-jwt.test/api/login', {
+
+          email: user.email,
+          password: user.password
+
+        })
+
+        .then(response => {
+
+            const token = response.data.token
+            const user  = response.data.user
+
+            localStorage.setItem('token', token)
+            localStorage.setItem('user', JSON.stringify(user))
+
+            axios.defaults.headers.common['Authorization'] = "Bearer" +token
+            commit('AUTH_SUCCESS', token, user)
+
+            resolve(response)
+
+        }).catch(err => { 
+
+            commit('AUTH_ERROR')
+            localStorage.removeItem('token')
+
+            reject(err)
+
+        })
+      })
+    },
+
+    REGISTER({ commit }, user) {
+
+      return new Promise((resolve, reject) => {
+
+        commit('AUTH_REQUEST')
+        axios.post('http://laravel-jwt.test/api/register', {
+
+          name: user.name,
+          email: user.email,
+          password: user.password
+
+        })
+
+        .then(response => {
+
+            const token = response.data.token
+            const user  = response.data.user
+
+            localStorage.setItem('token', token)
+            localStorage.setItem('user', JSON.stringify(user))
+
+            axios.defaults.headers.common['Authorization'] = "Bearer" +token
+            commit('AUTH_SUCCESS', token, user)
+
+            resolve(response)
+
+        }).catch(err => { 
+
+            commit('AUTH_ERROR')
+            localStorage.removeItem('token')
+
+            reject(err)
+
+        })
+      })
+    },
+
+    LOGOUT({ commit }) {
+      return new Promise((resolve) => {
+        commit('AUTH_LOGOUT')
+        localStorage.removeItem('token')
+        localStorage.removeItem('user')
+        delete axios.defaults.headers.common['Authorization']
+        resolve()
+      })
+    }
+  },
+
+  getters: {
+    isLoggedIn: state => !!state.token,
+    authStatus: state => state.status,
+  },
+
+  modules: {
+  }
+})