<template>
    <div>
        <h1>Oooiiii</h1>
        <label for="email">Email: </label>
        <input v-model="formData.email" type="text" id="email" name="email" />
        <label for="senha">Senha: </label>
        <input v-model="formData.password" type="password" id="senha" name="senha" />
        <button @click="criarConta">Criar Conta</button>
    </div>
</template>

<script setup>

const formData = reactive({
    email: '',
    password: ''
})

async function criarConta() {
    try {
        (await fetch('/auth/register', {
        method: 'POST',
        headers: {
            'Content-Type': 'application/json'
        },
        body: JSON.stringify({
            email: formData.email,
            password: formData.password
        })
        }))()
    } catch (error) {
        window.alert('Ocorreu um erro ao criar a conta. Tente novamente mais tarde.', error.statusText)
    }
}
</script>