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

FInished password reset (hopefully)

Browse Source
This commit is contained in:
Colin Kallemein
2024-11-03 21:56:19 +01:00
parent 56f455a08e
commit 67b6339ffc
4 changed files with 36 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

25
src/components/screens/partials/login/NewPasswordForm.vue
View File

@ -2,15 +2,11 @@
<form @submit.prevent="newPasswordFunc" 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-register" v-model="username" type="text" name="username" placeholder="Username" required autofocus />
<input class="input-field xs:min-w-[350px] min-w-64" id="email-register" v-model="email" type="email" name="email" placeholder="Email" required />
<div class="relative">
<input class="input-field xs:min-w-[350px] min-w-64" id="password-register" 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-4 h-3 top-1/2 -translate-y-1/2 bg-no-repeat"></button>
</div>
<input class="input-field xs:min-w-[350px] min-w-64" id="password-register" 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-4 h-3 top-1/2 -translate-y-1/2 bg-no-repeat"></button>
<span v-if="newPasswordError" class="text-red-200 text-xs absolute top-full mt-1">{{ newPasswordError }}</span>
</div>
<button class="btn-cyan xs:w-full" type="submit">Register now</button>
<button class="btn-cyan xs:w-full" type="submit">Change password</button>
<!-- Divider shape -->
<div class="absolute w-40 h-0.5 -bottom-8 left-1/2 -translate-x-1/2 flex justify-between">
@ -20,7 +16,7 @@
</div>
</div>
<div class="pt-8">
<p class="m-0 text-center"><button class="text-cyan-300 text-base p-0" @click.prevent="() => emit('switchToLogin')">Back to login</button></p>
<p class="m-0 text-center"><button class="text-cyan-300 text-base p-0" @click.prevent="cancelNewPassword">Back to login</button></p>
</div>
</form>
</template>
@ -34,9 +30,7 @@ import { useCookies } from '@vueuse/integrations/useCookies'
const emit = defineEmits(['switchToLogin'])
const gameStore = useGameStore()
const username = ref('')
const password = ref('')
const email = ref('')
const newPasswordError = ref('')
const showPassword = ref(false)
@ -56,12 +50,19 @@ async function newPasswordFunc() {
return
}
// send new password event to server
const response = await newPassword(token, password.value)
const urlToken = window.location.hash.split('#')[1]
// send new password event to server along with the token
const response = await newPassword(urlToken, password.value)
if (response.success === undefined) {
newPasswordError.value = response.error
return
}
window.location.href = '/'
}
function cancelNewPassword() {
window.location.href = '/'
}
</script>