49 lines
1.3 KiB
Vue
49 lines
1.3 KiB
Vue
|
<script setup>
|
||
|
|
||
|
const credentials = reactive({
|
||
|
email: undefined,
|
||
|
password: undefined,
|
||
|
test: undefined,
|
||
|
})
|
||
|
|
||
|
const { login } = useDirectusAuth()
|
||
|
|
||
|
async function attemptLogin() {
|
||
|
if (credentials.test === undefined) {
|
||
|
try {
|
||
|
await login({
|
||
|
email: credentials.email,
|
||
|
password: credentials.password
|
||
|
})
|
||
|
|
||
|
// Redirect on success
|
||
|
navigateTo('/dashboard')
|
||
|
|
||
|
} catch (e) {
|
||
|
console.log(e)
|
||
|
}
|
||
|
}
|
||
|
|
||
|
}
|
||
|
</script>
|
||
|
|
||
|
<template>
|
||
|
<div class="form">
|
||
|
<form :state="credentials" @submit.prevent="attemptLogin">
|
||
|
<h2>Sign in to your account</h2>
|
||
|
<p>Don't have an account? <NuxtLink to="/contact">Get in touch</NuxtLink></p>
|
||
|
|
||
|
<label for="email" >Email address</label>
|
||
|
<input v-model="credentials.email" name="email" type="email" placeholder="Enter your email address" required="true" />
|
||
|
|
||
|
<input v-model="credentials.test" type="text" class="hidden" />
|
||
|
|
||
|
<label for="password" >Password</label>
|
||
|
<input v-model="credentials.password" name="password" type="password" placeholder="********" required="true" />
|
||
|
|
||
|
<NuxtLink to="/contact" class="reset" >Forgot password</NuxtLink>
|
||
|
|
||
|
<button type="submit">Sign in</button>
|
||
|
</form>
|
||
|
</div>
|
||
|
</template>
|