noxious/client
6
0
Fork 1
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Several fixes, improvements, refactor for authentication

Browse Source
This commit is contained in:
Dennis Postma
2024-12-27 19:00:53 +01:00
parent 9d0f810ab3
commit 18b07d2f46
20 changed files with 113 additions and 131 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
src/components/login/LoginForm.vue
View File

@ -1,5 +1,5 @@
<template>
<form @submit.prevent="loginFunc" class="relative px-6 py-11">
<form @submit.prevent="submit" class="relative px-6 py-11">
<div class="flex flex-col gap-5 p-2 mb-8 relative">
<div class="w-full grid gap-3 relative">
<input class="input-field xs:min-w-[350px] min-w-64" id="username-login" v-model="username" type="text" name="username" placeholder="Username" required autofocus />
@ -7,7 +7,7 @@
<input class="input-field xs:min-w-[350px] min-w-64" id="password-login" v-model="password" :type="showPassword ? 'text' : 'password'" name="password" placeholder="Password" required />
<button type="button" @click.prevent="showPassword = !showPassword" :class="{ 'eye-open': showPassword }" class="bg-[url('/assets/icons/eye.svg')] p-0 absolute right-3 w-5 h-4 top-1/2 -translate-y-1/2 bg-no-repeat bg-center"></button>
</div>
<span v-if="loginError" class="text-red-200 text-xs absolute top-full mt-1">{{ loginError }}</span>
<span v-if="formError" class="text-red-200 text-xs absolute top-full mt-1">{{ formError }}</span>
</div>
<button @click.stop="() => emit('openResetPasswordModal')" type="button" class="inline-flex self-end p-0 text-cyan-300 text-base">Forgot password?</button>
<button class="btn-cyan px-0 xs:w-full" type="submit">Play now</button>
@ -36,7 +36,7 @@ const emit = defineEmits(['openResetPasswordModal', 'switchToRegister'])
const gameStore = useGameStore()
const username = ref('')
const password = ref('')
const loginError = ref('')
const formError = ref('')
const showPassword = ref(false)
// automatic login because of development
@ -48,10 +48,10 @@ onMounted(async () => {
}
})
async function loginFunc() {
async function submit() {
// check if username and password are valid
if (username.value === '' || password.value === '') {
loginError.value = 'Please enter a valid username and password'
formError.value = 'Please enter a valid username and password'
return
}
@ -59,7 +59,7 @@ async function loginFunc() {
const response = await login(username.value, password.value)
if (response.success === undefined) {
loginError.value = response.error
formError.value = response.error
return
}
gameStore.setToken(response.token)