85 lines
2.2 KiB
Vue
85 lines
2.2 KiB
Vue
<script setup>
|
|
useHead({
|
|
title: 'Sign in | Tinysites',
|
|
meta: [
|
|
{
|
|
name: 'description',
|
|
content: `Sign into your Tinysites account. Effortlessly design, edit, and launch your website with Tinysites.`
|
|
},
|
|
],
|
|
})
|
|
|
|
definePageMeta({
|
|
layout: 'main',
|
|
middleware: ["dashboard"]
|
|
})
|
|
|
|
const credentials = reactive({
|
|
email: undefined,
|
|
password: undefined,
|
|
test: undefined,
|
|
})
|
|
|
|
const { login } = useDirectusAuth()
|
|
|
|
let error
|
|
|
|
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.errors)
|
|
|
|
error = e
|
|
}
|
|
}
|
|
}
|
|
|
|
</script>
|
|
|
|
<template>
|
|
<div class="auth">
|
|
|
|
<div class="login modal">
|
|
|
|
<AuthBanner />
|
|
|
|
<div class="form-container">
|
|
<div class="form">
|
|
<h3>Sign in to your account</h3>
|
|
<h4 class="policy">By continuing, you agree to our <NuxtLink to="/docs/terms">Terms of
|
|
use</NuxtLink> and <NuxtLink to="/docs/privacy">Privacy policy</NuxtLink>.</h4>
|
|
|
|
<p class="error"></p>
|
|
|
|
<form :state="credentials" @submit.prevent="attemptLogin">
|
|
<div class="input border">
|
|
<label>Email address</label>
|
|
<input v-model="credentials.email" name="email" type="email" placeholder="Your email address" required="true" />
|
|
</div>
|
|
|
|
<div class="input border">
|
|
<label>Password</label>
|
|
<input v-model="credentials.password" name="password" type="password" placeholder="********" required="true" />
|
|
</div>
|
|
|
|
<button type="submit">Sign in</button>
|
|
</form>
|
|
|
|
<p class="newbie">Don't have an account? <NuxtLink to="/register">Create account</NuxtLink></p>
|
|
<p class="reset">Forgot password? <NuxtLink to="/reset">Reset password</NuxtLink></p>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
</template> |