SyntaxSquad/DADProject
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects 3 Releases Wiki Activity

Implement login page with email/password authentication #69

Merged
FernandoJVideira merged 6 commits from feature/login-page into develop 2025-12-22 17:08:38 +00:00
Conversation 3 Commits 6 Files Changed 10
+31 -7
6 changed files with 31 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit 511e645d7e - Show all commits
.gitignore
+2
View File
@@ -99,3 +99,5 @@ Desktop.ini
# If you have any local secrets or files not to track, add them here: # If you have any local secrets or files not to track, add them here:
# /path/to/some/file # /path/to/some/file
package-lock.json
deployment/kubernetes-vue.yml
+1 -1
View File
@@ -17,7 +17,7 @@ spec:
priorityClassName: low-priority priorityClassName: low-priority
containers: containers:
- name: web - name: web
image: registry-172.22.21.115.sslip.io/dad-group-x/web:v1.0.0 image: registry-172.22.21.115.sslip.io/dad-group-46/web:v1.0.1
resources: resources:
requests: requests:
memory: "64Mi" memory: "64Mi"
frontend/index.html
+1 -1
View File
@@ -5,7 +5,7 @@
<link rel="icon" href="/favicon.ico" /> <link rel="icon" href="/favicon.ico" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" href="/src/index.css" /> <link rel="stylesheet" href="/src/index.css" />
<title>Vite App</title> <title>Bisca</title>
</head> </head>
<body> <body>
<div id="app"></div> <div id="app"></div>
frontend/src/main.js
+1 -1
View File
@@ -13,7 +13,7 @@ console.log('[main.js] ws connection', wsConnection)
const app = createApp(App) const app = createApp(App)
app.provide('socket', io(wsConnection)) //app.provide('socket', io(wsConnection))
app.provide('serverBaseURL', `http://${apiDomain}`) app.provide('serverBaseURL', `http://${apiDomain}`)
app.provide('apiBaseURL', `http://${apiDomain}/api`) app.provide('apiBaseURL', `http://${apiDomain}/api`)
frontend/src/pages/login/LoginPage.vue
+3 -3
View File
@@ -1,5 +1,5 @@
<template> <template>
<div class="flex min-h-screen items-center justify-center bg-gray-50 px-4 py-12 sm:px-6 lg:px-8"> <div class="flex min-h-screen items-center justify-center px-4 py-12 sm:px-6 lg:px-8">
<div class="w-full max-w-md space-y-8"> <div class="w-full max-w-md space-y-8">
<div> <div>
<h2 class="mt-6 text-center text-3xl font-bold tracking-tight text-gray-900"> <h2 class="mt-6 text-center text-3xl font-bold tracking-tight text-gray-900">
@@ -64,13 +64,13 @@ const formData = ref({
const handleSubmit = async () => { const handleSubmit = async () => {
console.log(formData, authStore)
toast.promise(authStore.login(formData.value), { toast.promise(authStore.login(formData.value), {
loading: 'Calling API', loading: 'Calling API',
success: (data) => { success: (data) => {
return `Login Sucessfull - ${data?.name}` return `Login Sucessfull - ${data?.name}`
}, },
error: (data) => `[API] Error saving game - ${data?.response?.data?.message}`, error: (data) => `[API] Error - ${data?.response?.data?.message}`
}) })
frontend/src/stores/auth.js
+23 -1
View File
@@ -6,18 +6,36 @@ export const useAuthStore = defineStore('auth', () => {
const apiStore = useAPIStore() const apiStore = useAPIStore()
const currentUser = ref(undefined) const currentUser = ref(undefined)
const token = ref(localStorage.getItem('token') || null)
const isLoggedIn = computed(() => { const isLoggedIn = computed(() => {
return currentUser.value !== undefined return currentUser.value !== undefined && token.value !== null
}) })
const currentUserID = computed(() => { const currentUserID = computed(() => {
return currentUser.value?.id return currentUser.value?.id
}) })
const setToken = (jwtToken) => {
token.value = jwtToken
if (jwtToken) {
localStorage.setItem('token', jwtToken)
} else {
localStorage.removeItem('token')
}
}
const getToken = () => {
return token.value
}
const login = async (credentials) => { const login = async (credentials) => {
await apiStore.postLogin(credentials) await apiStore.postLogin(credentials)
const response = await apiStore.getAuthUser() const response = await apiStore.getAuthUser()
const jwtToken = response
const user = response.data
setToken(jwtToken)
currentUser.value = response.data currentUser.value = response.data
return response.data return response.data
} }
@@ -25,12 +43,16 @@ export const useAuthStore = defineStore('auth', () => {
const logout = async () => { const logout = async () => {
await apiStore.postLogout() await apiStore.postLogout()
currentUser.value = undefined currentUser.value = undefined
setToken(null)
} }
return { return {
currentUser, currentUser,
isLoggedIn, isLoggedIn,
currentUserID, currentUserID,
token,
setToken,
getToken,
login, login,
logout, logout,
} }