Melhora visual do frontend

src/main/webapp/js/layout.js

@@ -1 +1 @@
-window.Layout={mount(scope,active){Auth.require(scope);const label=localStorage.getItem('auth_label')||(scope==='master'?'Master':'Escritorio');const master=[['Clientes','/master/clientes.html','clientes'],['Planos','/master/planos.html','planos'],['Financeiro','/master/financeiro.html','financeiro'],['Configuracoes','/master/configuracoes.html','configuracoes'],['Backup','/master/backup.html','backup']];let cliente=[['Cadastro','/cliente/condominios.html','condominios'],['Lembrete','/cliente/lembretes.html','lembretes'],['Financeiro','/cliente/financeiro.html','financeiro'],['WhatsApp','/cliente/configuracoes.html','configuracoes']];if(scope==='empresa'&&!Auth.isAdminEmpresa())cliente=cliente.filter(x=>x[2]!=='configuracoes');const menu=(scope==='master'?master:cliente).map(([n,h,k])=>`<a class="${k===active?'active':''}" href="${h}">${n}</a>`).join('');document.body.insertAdjacentHTML('afterbegin',`<aside class="sidebar"><div><div class="brand">SeConectai</div><div class="user">${label}</div></div><nav class="menu">${menu}</nav><button class="btn" onclick="Auth.logout()">Sair</button></aside>`);document.body.classList.add('app');document.querySelector('main')?.classList.add('content')}};
+window.Layout={mount(scope,active){Auth.require(scope);const label=localStorage.getItem('auth_label')||(scope==='master'?'Master':'Escritório');const master=[['Clientes','/master/clientes.html','clientes'],['Planos','/master/planos.html','planos'],['Financeiro','/master/financeiro.html','financeiro'],['Configurações','/master/configuracoes.html','configuracoes'],['Backup','/master/backup.html','backup']];let cliente=[['Cadastro','/cliente/condominios.html','condominios'],['Lembretes','/cliente/lembretes.html','lembretes'],['Financeiro','/cliente/financeiro.html','financeiro'],['WhatsApp','/cliente/configuracoes.html','configuracoes']];if(scope==='empresa'&&!Auth.isAdminEmpresa())cliente=cliente.filter(x=>x[2]!=='configuracoes');const menu=(scope==='master'?master:cliente).map(([n,h,k])=>`<a class="${k===active?'active':''}" ${k===active?'aria-current="page"':''} href="${h}">${n}</a>`).join('');document.body.insertAdjacentHTML('afterbegin',`<aside class="sidebar"><div><div class="brand">SeConectai</div><div class="user">${label}</div></div><nav class="menu" aria-label="Navegação principal">${menu}</nav><button class="btn" type="button" onclick="Auth.logout()">Sair</button></aside>`);document.body.classList.add('app');document.querySelector('main')?.classList.add('content')}};

src/main/webapp/login.html

@@ -1 +1 @@
-<!doctype html><html lang="pt-BR"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1"><title>Login - SeConectai</title><link rel="stylesheet" href="/css/app.css"><script src="/js/auth.js"></script><script src="/js/util.js"></script></head><body class="login-page"><main class="login-box"><h1>SeConectai</h1><p class="user">Acesse o painel administrativo ou o escritorio.</p><div class="tabs"><button id="tab-master" class="active" type="button">Master</button><button id="tab-cliente" type="button">Escritorio</button></div><form id="master-form"><div class="field"><label>Senha master</label><input name="senha" type="password" required></div><button class="btn" type="submit">Entrar</button></form><form id="cliente-form" class="hidden"><div class="field"><label>E-mail</label><input name="email" type="email" required></div><div class="field"><label>Senha</label><input name="senha" type="password" required></div><button class="btn" type="submit">Entrar</button></form></main><script>const masterTab=document.querySelector('#tab-master'),clienteTab=document.querySelector('#tab-cliente'),masterForm=document.querySelector('#master-form'),clienteForm=document.querySelector('#cliente-form');function tab(scope){masterTab.classList.toggle('active',scope==='master');clienteTab.classList.toggle('active',scope==='cliente');masterForm.classList.toggle('hidden',scope!=='master');clienteForm.classList.toggle('hidden',scope!=='cliente')}masterTab.onclick=()=>tab('master');clienteTab.onclick=()=>tab('cliente');async function login(url,body,scope,label){try{const res=await fetch(url,{method:'POST',headers:{'Content-Type':'application/json'},body:JSON.stringify(body)});const data=await res.json();if(!res.ok)throw new Error(data.mensagem||data.erro||'Falha no login');Auth.save(scope,data.token,label);location.href=scope==='master'?'/master/clientes.html':'/cliente/condominios.html'}catch(e){Util.toast(e.message,true)}}masterForm.onsubmit=e=>{e.preventDefault();login('/api/master/login',Util.formData(masterForm),'master','Master')};clienteForm.onsubmit=e=>{e.preventDefault();const b=Util.formData(clienteForm);login('/api/auth/login',b,'empresa',b.email)};</script></body></html>
+<!doctype html><html lang="pt-BR"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1"><title>Login - SeConectai</title><link rel="stylesheet" href="/css/app.css"><script src="/js/auth.js"></script><script src="/js/util.js"></script></head><body class="login-page"><main class="login-box"><h1>SeConectai</h1><p class="user">Acesse o painel administrativo ou o escritório.</p><div class="tabs" role="tablist" aria-label="Tipo de acesso"><button id="tab-master" class="active" type="button">Master</button><button id="tab-cliente" type="button">Escritório</button></div><form id="master-form"><div class="field"><label for="master-senha">Senha master</label><input id="master-senha" name="senha" type="password" required autocomplete="current-password"></div><button class="btn" type="submit">Entrar</button></form><form id="cliente-form" class="hidden"><div class="field"><label for="cliente-email">E-mail</label><input id="cliente-email" name="email" type="email" required autocomplete="email"></div><div class="field"><label for="cliente-senha">Senha</label><input id="cliente-senha" name="senha" type="password" required autocomplete="current-password"></div><button class="btn" type="submit">Entrar</button></form></main><script>const masterTab=document.querySelector('#tab-master'),clienteTab=document.querySelector('#tab-cliente'),masterForm=document.querySelector('#master-form'),clienteForm=document.querySelector('#cliente-form');function tab(scope){masterTab.classList.toggle('active',scope==='master');clienteTab.classList.toggle('active',scope==='cliente');masterForm.classList.toggle('hidden',scope!=='master');clienteForm.classList.toggle('hidden',scope!=='cliente')}masterTab.onclick=()=>tab('master');clienteTab.onclick=()=>tab('cliente');async function login(url,body,scope,label){try{const res=await fetch(url,{method:'POST',headers:{'Content-Type':'application/json'},body:JSON.stringify(body)});const data=await res.json();if(!res.ok)throw new Error(data.mensagem||data.erro||'Falha no login');Auth.save(scope,data.token,label);location.href=scope==='master'?'/master/clientes.html':'/cliente/condominios.html'}catch(e){Util.toast(e.message,true)}}masterForm.onsubmit=e=>{e.preventDefault();login('/api/master/login',Util.formData(masterForm),'master','Master')};clienteForm.onsubmit=e=>{e.preventDefault();const b=Util.formData(clienteForm);login('/api/auth/login',b,'empresa',b.email)};</script></body></html>