add file

src/stores/auth.ts

@@ -1,11 +1,12 @@
 import { ref, computed } from 'vue'
 import { defineStore } from 'pinia'
 import { dispatchNotification } from '@/components/Notification'
+import { readData, removeData, writeData } from './storage'
 import router from '@/router'
 
 export const useAuthStore = defineStore('auth', () => {
     // token from localStorage
-    const token = ref(localStorage.getItem('token') || '')
+    const token = ref(readData('token') || '')
     // create a shared state
     const username = ref('')
     const password = ref('')
@@ -13,7 +14,7 @@ export const useAuthStore = defineStore('auth', () => {
     const isLoggedIn = computed(() => token.value !== '')
 
     // define your actions
-    function login() {
+    const login = () => {
         if (username.value == '' || password.value == '') {
             dispatchNotification({ title: 'Perhatian', content: 'Username atau password tidak boleh kosong', type: 'warning' })
         } else {
@@ -22,11 +23,10 @@ export const useAuthStore = defineStore('auth', () => {
                 isLoading.value = false
                 if (username.value == 'demo' && password.value == 'demo') {
                     // store token in localStorage
-                    localStorage.setItem('token', 'secret-token')
+                    writeData('token', 'secret-token')
                     dispatchNotification({ title: 'Berhasil', content: 'Login berhasil, selamat datang kembali!', type: 'success' })
                     // redirect to home page after login
-                    // router.replace('/')
-                    router.go(0)
+                    router.push('/home')
                 } else {
                     dispatchNotification({ title: 'Login Gagal', content: 'Username atau password salah', type: 'error' })
                 }
@@ -34,10 +34,15 @@ export const useAuthStore = defineStore('auth', () => {
         }
     }
 
-    function logout() {
-        localStorage.removeItem('token')
-    }
+    const logout = () => removeData('token')
 
-    // expose everything
-    return { token, username, password, isLoggedIn, login, logout, isLoading }
+    return {
+        token,
+        username,
+        password,
+        isLoggedIn,
+        isLoading,
+        login,
+        logout,
+    }
 })

src/stores/storage.ts

@@ -0,0 +1,28 @@
+import { EncryptStorage } from 'encrypt-storage'
+const encryptStorage = new EncryptStorage('qwertyuiopasdfghjklzxcvbnm-1234567890')
+
+const writeData = (key: string, data: any) => encryptStorage.setItem(key, data)
+const writeDataJson = (key: string, data: any) => encryptStorage.setItem(key, JSON.stringify(data))
+const removeData = (key: string) => encryptStorage.removeItem(key)
+const readData = (key: string) => {
+    try {
+        return encryptStorage.getItem(key)
+    } catch (error) {
+        return undefined
+    }
+}
+const readDataJson = (key: string) => {
+    try {
+        return encryptStorage.getItem(key)
+    } catch (error) {
+        return undefined
+    }
+}
+
+export {
+    removeData,
+    writeData,
+    writeDataJson,
+    readData,
+    readDataJson
+}