Substitui botoes de texto por icones na secao Responsaveis pela assembleia

This commit is contained in:
Tiago
2026-10-09 16:26:32 -03:00
parent 215583489b
commit cc7adefe54
2 changed files with 12 additions and 3 deletions
+1 -1
View File
@@ -1 +1 @@
<!doctype html><html lang="pt-BR"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1"><title>Assembleia</title><link rel="stylesheet" href="/css/app.css"><script src="/js/auth.js"></script><script src="/js/util.js"></script><script src="/js/api.js"></script><script src="/js/layout.js"></script></head><body><main><div class="topbar"><h1>Assembleia</h1></div><section class="panel"><div class="section-head"><h2>Todas as assembleias</h2><div class="section-actions"><button class="search-icon-btn" type="button" onclick="alternarBuscaAssembleias()" aria-label="Buscar assembleias" title="Buscar"><svg viewBox="0 0 24 24" aria-hidden="true"><circle cx="11" cy="11" r="7"></circle><path d="m16.5 16.5 4 4"></path></svg></button><button class="icon-btn calendar-open" type="button" onclick="abrirCalendarioAssembleias()" title="Calendário de assembleias" aria-label="Calendário de assembleias"></button></div></div><div id="assembleia-search" class="search-strip hidden"><input id="assembleia-search-input" placeholder="Buscar por condominio, tipo, data, local ou status"></div><div class="table-wrap"><table><thead><tr><th>Condominio</th><th>Tipo</th><th>Data</th><th>Local</th><th>Status</th><th>Notificados</th><th>Ações</th></tr></thead><tbody id="rows"></tbody></table></div></section><section class="panel"><div class="section-head"><h2>Responsáveis pela assembleia</h2><div class="section-actions"><button class="btn" type="button" onclick="abrirNovoResponsavel()">Novo</button></div></div><div class="table-wrap"><table><thead><tr><th>Nome</th><th>WhatsApp</th><th>E-mail</th><th>Dias disponíveis</th><th>Status</th><th>Ações</th></tr></thead><tbody id="responsaveis-rows"></tbody></table></div></section><div id="responsavel-modal" class="modal hidden"><div class="modal-backdrop" onclick="fecharResponsavelModal()"></div><section class="modal-panel"><div class="modal-head"><h2 id="responsavel-modal-title">Responsável</h2><button class="btn secondary" type="button" onclick="fecharResponsavelModal()">Fechar</button></div><div id="responsavel-modal-body"></div></section></div></main><script>Layout.mount('empresa','assembleias');</script><script src="/cliente/assembleias.js"></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>Assembleia</title><link rel="stylesheet" href="/css/app.css"><script src="/js/auth.js"></script><script src="/js/util.js"></script><script src="/js/api.js"></script><script src="/js/layout.js"></script></head><body><main><div class="topbar"><h1>Assembleia</h1></div><section class="panel"><div class="section-head"><h2>Todas as assembleias</h2><div class="section-actions"><button class="search-icon-btn" type="button" onclick="alternarBuscaAssembleias()" aria-label="Buscar assembleias" title="Buscar"><svg viewBox="0 0 24 24" aria-hidden="true"><circle cx="11" cy="11" r="7"></circle><path d="m16.5 16.5 4 4"></path></svg></button><button class="icon-btn calendar-open" type="button" onclick="abrirCalendarioAssembleias()" title="Calendário de assembleias" aria-label="Calendário de assembleias"></button></div></div><div id="assembleia-search" class="search-strip hidden"><input id="assembleia-search-input" placeholder="Buscar por condomínio, tipo, data, local ou status"></div><div class="table-wrap"><table><thead><tr><th>Condomínio</th><th>Tipo</th><th>Data</th><th>Local</th><th>Status</th><th>Notificados</th><th style="text-align:right">Ações</th></tr></thead><tbody id="rows"></tbody></table></div></section><section class="panel"><div class="section-head"><h2>Responsáveis pela assembleia</h2><div class="section-actions"><button class="header-add-btn" type="button" onclick="abrirNovoResponsavel()" title="Novo responsável" aria-label="Novo responsável"><svg viewBox="0 0 24 24" aria-hidden="true"><line x1="12" y1="5" x2="12" y2="19"></line><line x1="5" y1="12" x2="19" y2="12"></line></svg></button></div></div><div class="table-wrap"><table><thead><tr><th>Nome</th><th>WhatsApp</th><th>E-mail</th><th>Dias disponíveis</th><th>Status</th><th style="text-align:right">Ações</th></tr></thead><tbody id="responsaveis-rows"></tbody></table></div></section><div id="responsavel-modal" class="modal hidden"><div class="modal-backdrop" onclick="fecharResponsavelModal()"></div><section class="modal-panel"><div class="modal-head"><h2 id="responsavel-modal-title">Responsável</h2><button class="btn secondary" type="button" onclick="fecharResponsavelModal()">Fechar</button></div><div id="responsavel-modal-body"></div></section></div></main><script>Layout.mount('empresa','assembleias');</script><script src="/cliente/assembleias.js"></script></body></html>
+11 -2
View File
@@ -15,10 +15,16 @@ function formHtml(r={}){
return `<form id="responsavel-form" class="modal-form"><input type="hidden" name="id" value="${r.id||''}"><div class="form-grid"><div class="field"><label>Nome</label><input name="nome" required value="${esc(r.nome||'')}"></div><div class="field"><label>WhatsApp</label><input name="telefone" value="${esc(r.telefone||'')}"></div><div class="field"><label>E-mail</label><input name="email" type="email" value="${esc(r.email||'')}"></div><div class="field"><label>Status</label><select name="status"><option value="ativo" ${r.status==='ativo'||!r.status?'selected':''}>Ativo</option><option value="inativo" ${r.status==='inativo'?'selected':''}>Inativo</option></select></div><div class="field field-wide"><label>Dias da semana</label><div class="check-grid">${diasNomes.map((d,i)=>`<label><input type="checkbox" name="dias" value="${i}" ${dias.has(String(i))?'checked':''}> ${d}</label>`).join('')}</div></div></div><div class="modal-actions"><button class="btn secondary" type="button" onclick="fecharResponsavelModal()">Cancelar</button><button class="btn">${r.id?'Salvar':'Cadastrar'}</button></div></form>`;
}
const Icons = {
send: '<svg viewBox="0 0 24 24" aria-hidden="true"><line x1="22" y1="2" x2="11" y2="13"></line><polygon points="22 2 15 22 11 13 2 9 22 2"></polygon></svg>',
edit: '<svg viewBox="0 0 24 24" aria-hidden="true"><path d="M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7"></path><path d="M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z"></path></svg>',
trash: '<svg viewBox="0 0 24 24" aria-hidden="true"><polyline points="3 6 5 6 21 6"></polyline><path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path><line x1="10" y1="11" x2="10" y2="17"></line><line x1="14" y1="11" x2="14" y2="17"></line></svg>'
};
function renderAssembleias(){
const q=termo();
const lista=assembleias.filter(a=>contem(q,a.condominio_nome,a.tipo,a.data_hora,a.local,a.status,destinatariosLabel(a)));
rows.innerHTML=lista.map(a=>`<tr><td><strong>${esc(a.condominio_nome||'-')}</strong></td><td>${esc(a.tipo)}</td><td>${Util.date(a.data_hora)}</td><td>${esc(a.local||'')}</td><td>${Util.badge(a.status)}</td><td>${esc(destinatariosLabel(a))}</td><td><div class="table-actions"><button class="table-icon-btn send" type="button" onclick="enviarNotificacaoAssembleia(this,${a.condominio_id},${a.id})" title="Enviar notificação" aria-label="Enviar notificação"><svg viewBox="0 0 24 24" aria-hidden="true"><line x1="22" y1="2" x2="11" y2="13"></line><polygon points="22 2 15 22 11 13 2 9 22 2"></polygon></svg></button><button class="table-icon-btn danger" type="button" onclick="excluirAssembleia(${a.condominio_id},${a.id})" title="Excluir assembleia" aria-label="Excluir assembleia"><svg viewBox="0 0 24 24" aria-hidden="true"><polyline points="3 6 5 6 21 6"></polyline><path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path><line x1="10" y1="11" x2="10" y2="17"></line><line x1="14" y1="11" x2="14" y2="17"></line></svg></button></div></td></tr>`).join('')||'<tr><td colspan="7">Nenhuma assembleia encontrada.</td></tr>';
rows.innerHTML=lista.map(a=>`<tr><td><strong>${esc(a.condominio_nome||'-')}</strong></td><td>${esc(a.tipo)}</td><td>${Util.date(a.data_hora)}</td><td>${esc(a.local||'')}</td><td>${Util.badge(a.status)}</td><td>${esc(destinatariosLabel(a))}</td><td style="text-align:right"><div class="table-actions"><button class="table-icon-btn send" type="button" onclick="enviarNotificacaoAssembleia(this,${a.condominio_id},${a.id})" title="Enviar notificação" aria-label="Enviar notificação">${Icons.send}</button><button class="table-icon-btn danger" type="button" onclick="excluirAssembleia(${a.condominio_id},${a.id})" title="Excluir assembleia" aria-label="Excluir assembleia">${Icons.trash}</button></div></td></tr>`).join('')||'<tr><td colspan="7">Nenhuma assembleia encontrada.</td></tr>';
}
function ensureCalendarModal(){let m=document.querySelector('#assembleia-calendar-modal');if(m)return m;document.body.insertAdjacentHTML('beforeend','<div id="assembleia-calendar-modal" class="modal hidden"><div class="modal-backdrop" onclick="fecharCalendarioAssembleias()"></div><section class="modal-panel calendar-modal"><div class="modal-head"><h2>Calendário de assembleias</h2><button class="btn secondary" type="button" onclick="fecharCalendarioAssembleias()">Fechar</button></div><div class="calendar-layout"><div><div class="calendar-toolbar"><button class="btn secondary" type="button" onclick="mudarMesCalendario(-1)">Anterior</button><strong id="calendar-title"></strong><button class="btn secondary" type="button" onclick="mudarMesCalendario(1)">Próximo</button></div><div id="calendar-grid" class="calendar-grid"></div></div><aside class="calendar-side"><h3 id="calendar-day-title">Selecione um dia</h3><div id="calendar-day-list" class="calendar-day-list"><p class="muted">Clique em um dia para ver as assembleias.</p></div></aside></div></section></div>');return document.querySelector('#assembleia-calendar-modal')}
function renderCalendarioAssembleias(selected){ensureCalendarModal();const title=document.querySelector('#calendar-title'),grid=document.querySelector('#calendar-grid');title.textContent=monthLabel(calMonth);const y=calMonth.getFullYear(),m=calMonth.getMonth(),start=new Date(y,m,1-new Date(y,m,1).getDay()),todayKey=dateKey(new Date());let html=['Dom','Seg','Ter','Qua','Qui','Sex','Sáb'].map(x=>'<div class="calendar-weekday">'+x+'</div>').join('');for(let i=0;i<42;i++){const d=new Date(start);d.setDate(start.getDate()+i);const key=dateKey(d),items=assembleias.filter(a=>dateKey(a.data_hora)===key),classes=['calendar-day'];if(d.getMonth()!==m)classes.push('other');if(items.length)classes.push('busy');if(key===todayKey)classes.push('today');html+='<button type="button" class="'+classes.join(' ')+'" data-date="'+key+'"><span>'+d.getDate()+'</span>'+(items.length?'<b>'+items.length+'</b>':'')+'</button>'}grid.innerHTML=html;grid.querySelectorAll('.calendar-day').forEach(btn=>btn.onclick=()=>selecionarDiaCalendario(btn.dataset.date));if(selected)selecionarDiaCalendario(selected,false)}
@@ -39,7 +45,10 @@ async function loadResponsaveis(){
}
function renderResponsaveis(){
const admin=Auth.isAdminEmpresa();
responsaveisRows.innerHTML=responsaveis.map(r=>`<tr><td><strong>${esc(r.nome)}</strong></td><td>${esc(r.telefone||'')}</td><td>${esc(r.email||'')}</td><td>${esc(diasLabel(r.dias_semana))}</td><td>${Util.badge(r.status)}</td><td>${admin?`<button class="btn secondary" onclick="editarResponsavel(${r.id})">Editar</button> <button class="btn danger" onclick="excluirResponsavel(${r.id})">Excluir</button>`:'-'}</td></tr>`).join('')||'<tr><td colspan="6">Nenhum responsável cadastrado.</td></tr>';
responsaveisRows.innerHTML=responsaveis.map(r=>{
const acoes=admin?`<div class="table-actions"><button class="table-icon-btn" type="button" onclick="editarResponsavel(${r.id})" title="Editar responsável" aria-label="Editar responsável">${Icons.edit}</button><button class="table-icon-btn danger" type="button" onclick="excluirResponsavel(${r.id})" title="Excluir responsável" aria-label="Excluir responsável">${Icons.trash}</button></div>`:'-';
return `<tr><td><strong>${esc(r.nome)}</strong></td><td>${esc(r.telefone||'')}</td><td>${esc(r.email||'')}</td><td>${esc(diasLabel(r.dias_semana))}</td><td>${Util.badge(r.status)}</td><td style="text-align:right">${acoes}</td></tr>`;
}).join('')||'<tr><td colspan="6">Nenhum responsável cadastrado.</td></tr>';
}
function abrirResponsavel(r){
modalTitle.textContent=r?.id?'Editar responsável':'Novo responsável';