Atualizações do Visuais
This commit is contained in:
@@ -0,0 +1,323 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="pt-br">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="icon" href="imagens/icone.png">
|
||||
<link rel="stylesheet" href="configuracoes.css">
|
||||
<link href="https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&display=swap" rel="stylesheet">
|
||||
<title>Configuracoes - Focus Agenda</title>
|
||||
<script src="theme.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="topo">
|
||||
<h1 id="textotop">Focus Agenda</h1>
|
||||
<button class="theme-toggle-btn" onclick="toggleTheme()" title="Tema Escuro"><img src="imagens/moon-svgrepo-com.svg" class="theme-icon" alt="Tema"></button>
|
||||
<button id="voltar" onclick="window.location.href='calendario.html'">Voltar</button>
|
||||
</div>
|
||||
|
||||
<div id="log">
|
||||
<h1 class="titulo-pagina">Configuracoes</h1>
|
||||
<p class="subtitulo">Gerencie seus dados e preferencias</p>
|
||||
|
||||
<div id="mensagem-erro" role="alert"></div>
|
||||
<div id="mensagem-sucesso" role="status"></div>
|
||||
|
||||
<div class="secao">
|
||||
<div class="secao-titulo">Dados Pessoais</div>
|
||||
<form id="dadosForm" novalidate>
|
||||
<div class="campo">
|
||||
<label for="nomeid">Nome</label>
|
||||
<input type="text" placeholder="Seu nome completo" id="nomeid" autocomplete="name" required>
|
||||
</div>
|
||||
|
||||
<div class="campo">
|
||||
<label for="emailid">Email</label>
|
||||
<input type="email" placeholder="Seu email" id="emailid" autocomplete="email" required disabled>
|
||||
</div>
|
||||
|
||||
<div class="campo">
|
||||
<label for="cursoid">Curso</label>
|
||||
<input type="text" placeholder="Ex: Tecnico em Informatica" id="cursoid" required>
|
||||
</div>
|
||||
|
||||
<div class="linha-dupla">
|
||||
<div class="campo">
|
||||
<label for="periodoid">Periodo</label>
|
||||
<select id="periodoid" required>
|
||||
<option value="">Selecione</option>
|
||||
<option value="1">1</option>
|
||||
<option value="2">2</option>
|
||||
<option value="3">3</option>
|
||||
<option value="4">4</option>
|
||||
<option value="5">5</option>
|
||||
<option value="6">6</option>
|
||||
<option value="7">7</option>
|
||||
<option value="8">8</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<button type="submit" id="logbtn">Salvar Alteracoes</button>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
<div class="secao">
|
||||
<div class="secao-titulo">Alterar Senha</div>
|
||||
<form id="senhaForm" novalidate>
|
||||
<div class="campo">
|
||||
<label for="senhaAtualid">Senha Atual</label>
|
||||
<input type="password" placeholder="Digite sua senha atual" id="senhaAtualid" autocomplete="current-password" required>
|
||||
</div>
|
||||
|
||||
<div class="campo">
|
||||
<label for="novaSenhaid">Nova Senha</label>
|
||||
<input type="password" placeholder="Minimo 6 caracteres" id="novaSenhaid" autocomplete="new-password" required minlength="6">
|
||||
</div>
|
||||
|
||||
<div class="campo">
|
||||
<label for="confirmaNovaid">Confirmar Nova Senha</label>
|
||||
<input type="password" placeholder="Confirme a nova senha" id="confirmaNovaid" autocomplete="new-password" required>
|
||||
</div>
|
||||
|
||||
<button type="submit" id="btnSenha">Alterar Senha</button>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
<div class="secao">
|
||||
<div class="secao-titulo">Seus Dados (LGPD)</div>
|
||||
<p class="secao-descricao">
|
||||
Conforme a Lei Geral de Protecao de Dados (Lei n 13.709/2018),
|
||||
voce tem direito de acessar, exportar e excluir seus dados pessoais.
|
||||
</p>
|
||||
<div class="acoes-lgpd">
|
||||
<div class="acao-lgpd">
|
||||
<div>
|
||||
<strong>Exportar meus dados</strong>
|
||||
<p>Baixe um arquivo JSON com todas as suas tarefas, eventos e disciplinas.</p>
|
||||
</div>
|
||||
<button type="button" id="btnExportarDados">Exportar JSON</button>
|
||||
</div>
|
||||
<div class="acao-lgpd">
|
||||
<div>
|
||||
<strong>Politica de Privacidade</strong>
|
||||
<p>Veja como seus dados sao tratados e quais sao seus direitos.</p>
|
||||
</div>
|
||||
<a href="politica-privacidade.html" class="btn-link-politica">Ver politica</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="zona-perigo">
|
||||
<div class="secao-titulo">Zona de Perigo</div>
|
||||
<p>
|
||||
Ao excluir sua conta, exercendo o direito previsto no Art. 18, VI da LGPD,
|
||||
todos os seus dados pessoais (tarefas, eventos, disciplinas e notificacoes)
|
||||
serao removidos <strong>permanentemente e imediatamente</strong> dos nossos servidores.
|
||||
Esta acao e irreversivel.
|
||||
</p>
|
||||
<button type="button" id="btnExcluirConta">Excluir Minha Conta</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
const token = localStorage.getItem('fa_token');
|
||||
const userStr = localStorage.getItem('fa_user');
|
||||
|
||||
if (!token) {
|
||||
window.location.href = 'login.html';
|
||||
}
|
||||
|
||||
let usuario = null;
|
||||
try { usuario = JSON.parse(userStr); } catch(e) {}
|
||||
|
||||
const erroEl = document.getElementById('mensagem-erro');
|
||||
const sucessoEl = document.getElementById('mensagem-sucesso');
|
||||
|
||||
function mostrarErro(msg) {
|
||||
erroEl.textContent = msg;
|
||||
erroEl.style.display = 'block';
|
||||
sucessoEl.style.display = 'none';
|
||||
erroEl.scrollIntoView({ behavior: 'smooth', block: 'center' });
|
||||
}
|
||||
|
||||
function mostrarSucesso(msg) {
|
||||
sucessoEl.textContent = msg;
|
||||
sucessoEl.style.display = 'block';
|
||||
erroEl.style.display = 'none';
|
||||
sucessoEl.scrollIntoView({ behavior: 'smooth', block: 'center' });
|
||||
}
|
||||
|
||||
async function api(method, path, body) {
|
||||
const opts = {
|
||||
method,
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
'Authorization': 'Bearer ' + token
|
||||
}
|
||||
};
|
||||
if (body) opts.body = JSON.stringify(body);
|
||||
|
||||
const res = await fetch(path, opts);
|
||||
const json = await res.json().catch(() => ({}));
|
||||
|
||||
if (!res.ok) {
|
||||
throw new Error(json.message || 'Erro na requisicao');
|
||||
}
|
||||
return json.data;
|
||||
}
|
||||
|
||||
async function carregarUsuario() {
|
||||
try {
|
||||
const u = await api('GET', '/api/estudantes/me');
|
||||
usuario = u;
|
||||
localStorage.setItem('fa_user', JSON.stringify(u));
|
||||
|
||||
document.getElementById('nomeid').value = u.nome || '';
|
||||
document.getElementById('emailid').value = u.email || '';
|
||||
document.getElementById('cursoid').value = u.curso || '';
|
||||
document.getElementById('periodoid').value = u.periodo || '';
|
||||
} catch(e) {
|
||||
mostrarErro('Erro ao carregar dados: ' + e.message);
|
||||
}
|
||||
}
|
||||
|
||||
document.getElementById('dadosForm').addEventListener('submit', async (e) => {
|
||||
e.preventDefault();
|
||||
erroEl.style.display = 'none';
|
||||
sucessoEl.style.display = 'none';
|
||||
|
||||
const nome = document.getElementById('nomeid').value.trim();
|
||||
const curso = document.getElementById('cursoid').value.trim();
|
||||
const periodo = parseInt(document.getElementById('periodoid').value, 10);
|
||||
|
||||
if (!nome || !curso || !periodo) {
|
||||
mostrarErro('Preencha todos os campos.');
|
||||
return;
|
||||
}
|
||||
|
||||
const btn = document.getElementById('logbtn');
|
||||
btn.disabled = true;
|
||||
btn.textContent = 'Salvando...';
|
||||
|
||||
try {
|
||||
const atualizado = await api('PUT', '/api/estudantes/me', { nome, curso, periodo });
|
||||
localStorage.setItem('fa_user', JSON.stringify(atualizado));
|
||||
mostrarSucesso('Dados atualizados com sucesso!');
|
||||
} catch(err) {
|
||||
mostrarErro(err.message);
|
||||
} finally {
|
||||
btn.disabled = false;
|
||||
btn.textContent = 'Salvar Alteracoes';
|
||||
}
|
||||
});
|
||||
|
||||
document.getElementById('senhaForm').addEventListener('submit', async (e) => {
|
||||
e.preventDefault();
|
||||
erroEl.style.display = 'none';
|
||||
sucessoEl.style.display = 'none';
|
||||
|
||||
const senhaAtual = document.getElementById('senhaAtualid').value;
|
||||
const novaSenha = document.getElementById('novaSenhaid').value;
|
||||
const confirmaNova = document.getElementById('confirmaNovaid').value;
|
||||
|
||||
if (!senhaAtual || !novaSenha || !confirmaNova) {
|
||||
mostrarErro('Preencha todos os campos.');
|
||||
return;
|
||||
}
|
||||
|
||||
if (novaSenha.length < 6) {
|
||||
mostrarErro('A nova senha deve ter pelo menos 6 caracteres.');
|
||||
return;
|
||||
}
|
||||
|
||||
if (novaSenha !== confirmaNova) {
|
||||
mostrarErro('As senhas nao conferem.');
|
||||
document.getElementById('confirmaNovaid').focus();
|
||||
return;
|
||||
}
|
||||
|
||||
if (senhaAtual === novaSenha) {
|
||||
mostrarErro('A nova senha deve ser diferente da atual.');
|
||||
return;
|
||||
}
|
||||
|
||||
const btn = document.getElementById('btnSenha');
|
||||
btn.disabled = true;
|
||||
btn.textContent = 'Alterando...';
|
||||
|
||||
try {
|
||||
await api('PUT', '/api/estudantes/senha', { senhaAtual, novaSenha });
|
||||
mostrarSucesso('Senha alterada com sucesso!');
|
||||
document.getElementById('senhaAtualid').value = '';
|
||||
document.getElementById('novaSenhaid').value = '';
|
||||
document.getElementById('confirmaNovaid').value = '';
|
||||
} catch(err) {
|
||||
mostrarErro(err.message);
|
||||
} finally {
|
||||
btn.disabled = false;
|
||||
btn.textContent = 'Alterar Senha';
|
||||
}
|
||||
});
|
||||
|
||||
document.getElementById('btnExportarDados').addEventListener('click', async () => {
|
||||
const btn = document.getElementById('btnExportarDados');
|
||||
btn.disabled = true;
|
||||
btn.textContent = 'Gerando...';
|
||||
try {
|
||||
const res = await fetch('/api/estudantes/me/dados', {
|
||||
headers: { 'Authorization': 'Bearer ' + localStorage.getItem('fa_token') }
|
||||
});
|
||||
if (res.status === 401) {
|
||||
localStorage.clear();
|
||||
window.location.href = '/login.html?sessao=expirada';
|
||||
return;
|
||||
}
|
||||
const data = await res.json();
|
||||
const blob = new Blob([JSON.stringify(data.data, null, 2)], { type: 'application/json' });
|
||||
const url = URL.createObjectURL(blob);
|
||||
const a = document.createElement('a');
|
||||
a.href = url;
|
||||
a.download = 'focusagenda-meus-dados.json';
|
||||
a.click();
|
||||
URL.revokeObjectURL(url);
|
||||
} catch (err) {
|
||||
alert('Erro ao exportar dados: ' + err.message);
|
||||
} finally {
|
||||
btn.disabled = false;
|
||||
btn.textContent = 'Exportar JSON';
|
||||
}
|
||||
});
|
||||
|
||||
document.getElementById('btnExcluirConta').addEventListener('click', async () => {
|
||||
if (!confirm('Tem certeza que deseja excluir sua conta? Esta acao e irreversivel!')) {
|
||||
return;
|
||||
}
|
||||
|
||||
const confirmacao = prompt('Digite "EXCLUIR" para confirmar a exclusao da sua conta:');
|
||||
if (confirmacao !== 'EXCLUIR') {
|
||||
mostrarErro('Exclusao cancelada.');
|
||||
return;
|
||||
}
|
||||
|
||||
const btn = document.getElementById('btnExcluirConta');
|
||||
btn.disabled = true;
|
||||
btn.textContent = 'Excluindo...';
|
||||
|
||||
try {
|
||||
await api('DELETE', '/api/estudantes/me');
|
||||
localStorage.removeItem('fa_token');
|
||||
localStorage.removeItem('fa_user');
|
||||
mostrarSucesso('Conta excluida. Redirecionando...');
|
||||
setTimeout(() => window.location.href = 'login.html', 2000);
|
||||
} catch(err) {
|
||||
mostrarErro(err.message);
|
||||
btn.disabled = false;
|
||||
btn.textContent = 'Excluir Minha Conta';
|
||||
}
|
||||
});
|
||||
|
||||
carregarUsuario();
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user