AliceClass/login/index.md

70 lines
2.0 KiB
Markdown

---
layout: default
title: About
lang: pt
---
<div class="auth-conteiner is-flex is-align-items-center is-justify-content-center">
<div class="box">
<h1 class="has-text-centered is-size-4 has-text-weight-semibold mb-6">Entrar no AliceCast</h1>
<form id="login-form">
<label>Login:</label>
<input class="input my-3" id="email">
<label>Senha:</label>
<input class="input my-3" id="password">
<button class="button is-fullwidth mt-4">Logar</button>
</form>
<p class="mt-4">Esqueceu sua senha? <a>Lembre-se aqui</a></p>
</div>
</div>
<style>
.auth-conteiner{
position: absolute;
top: 0%;
right: 0%;
width: 100%;
height: 100%;
font-family: 'Roboto', sans-serif;
}
.box{
width: 20vw;
}
</style>
<script>
const form = document.getElementById('login-form');
const email = document.getElementById('email').value;
const password = document.getElementById('password').value;
form.addEventListener('submit', (event) => {
event.preventDefault(); // Evita o envio padrão do formulário
const data = {
username: email,
password: password
};
fetch('https://172.18.0.83:33003/login', {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify(data)
})
.then(response => response.json())
.then(response => {
if (response.success) {
// Usuário autenticado! Redirecionar para página protegida, etc.
console.log('Usuário autenticado!');
//window.location.href = '/pagina-protegida';
} else {
alert('Credenciais inválidas!');
}
})
.catch(error => {
console.error('Erro na requisição:', error);
alert('Falha ao conectar com o servidor!');
});
});
</script>