// ═══ GENESIS BUILD rbac-frota-completa · 2026-07-10 ═══ // Tidal — Solicitações (user view) + SolicitacoesOp (admin kanban) // Tipos: manutencao | ideia | evento | compras | conteudo | outro // Ideias viram prioridade por curtidas. Eventos aprovados vão pra Agenda. const TIPOS = { manutencao: {pt:'manutenção', en:'maintenance', icon:'tools', color:'#A86A52', private:true}, ideia: {pt:'ideia', en:'idea', icon:'star', color:'#C8A24A', private:false}, evento: {pt:'evento', en:'event', icon:'calendar',color:'#1F5755', private:false}, compras: {pt:'compras', en:'shopping', icon:'list', color:'#5C8AB8', private:true}, conteudo: {pt:'conteúdo', en:'content', icon:'film', color:'#7B6FA8', private:false}, outro: {pt:'outro', en:'other', icon:'flag', color:'#7A8388', private:false}, }; const URGENCIAS = { low: {pt:'baixa', en:'low', color:'#7A8388'}, mid: {pt:'média', en:'medium', color:'#C8A24A'}, high: {pt:'alta', en:'high', color:'#D9694B'}, }; const STATUS_LIST = ['open','triage','progress','done','rejected']; const STATUS = { open: {pt:'aberta', en:'open', dot:'#5C8AB8'}, triage: {pt:'em triagem', en:'in triage', dot:'#C8A24A'}, progress: {pt:'em andamento', en:'in progress', dot:'#1F5755'}, done: {pt:'resolvida', en:'resolved', dot:'#7BB67E'}, rejected: {pt:'arquivada', en:'archived', dot:'#A8A8A8'}, }; // ─── User view: minhas + mural ─── const Solicitacoes = ({state, setState}) => { const _staff = useMemo(() => (state.allUsers||[]).filter(u => u.role==='admin' || u.is_staff===true).sort((a,b)=>(a.nome||'').localeCompare(b.nome||'')), [state.allUsers]); const _canManage = (state.currentUser||{}).role==='admin' || (state.currentUser||{}).is_staff===true || ((state.currentUser||{}).permissoes||[]).includes('solicitacoes.moderar'); const tt = useT(); const lang = tt.lang; const toast = useToast(); const isMobile = useMobile(); const token = () => localStorage.getItem('genesis_token'); const me = state.currentUser || {}; const [tab, setTab] = useState('mural'); const [filterTipo, setFilterTipo] = useState('all'); const [filterStatus, setFilterStatus] = useState('all'); const [sortBy, setSortBy] = useState('votos'); const [opening, setOpening] = useState(null); const [requests, setRequests] = useState([]); const [loading, setLoading] = useState(true); const fetchRequests = async () => { try { const res = await fetch('/api/requests', { headers:{'Authorization':`Bearer ${token()}`} }); if (res.ok) setRequests(await res.json()); fetch('/api/requests/metricas/painel', { headers:{'Authorization':`Bearer ${token()}`} }).then(r=>r.ok?r.json():null).then(m=>m&&setMetricas(m)).catch(()=>{}); } catch(e) { console.error(e); } finally { setLoading(false); } }; useEffect(() => { fetchRequests(); }, []); const usersById = useMemo(() => { const map = {}; (state.allUsers||[]).forEach(u => map[u.id] = u); return map; }, [state.allUsers]); const visibleRequests = useMemo(() => { return requests.filter(r => { if (tab === 'minhas') return r.autor === me.id; if (TIPOS[r.tipo]?.private && r.autor !== me.id) return false; return r.status !== 'rejected'; }).filter(r => filterTipo === 'all' || r.tipo === filterTipo) .filter(r => tab !== 'mural' || filterStatus === 'all' || (filterStatus === 'andamento' ? ['triage','progress'].includes(r.status) : r.status === filterStatus)) .sort((a,b) => { if (tab === 'mural' && sortBy === 'votos') { const dv = (b.votos||0) - (a.votos||0); if (dv !== 0) return dv; } return new Date(b.created_at||0) - new Date(a.created_at||0); }); }, [requests, tab, filterTipo, filterStatus, sortBy, me.id]); const myCount = requests.filter(r => r.autor === me.id).length; const toggleLike = async (r) => { if (!me?.id) return; try { const res = await fetch(`/api/requests/${r.id}/votar`, { method:'POST', headers:{'Authorization':`Bearer ${token()}`} }); const data = await res.json(); if (res.ok) { setRequests(prev => prev.map(x => x.id === r.id ? {...x, votos: data.votos, votei: data.votei} : x)); if (opening?.id === r.id) setOpening(prev => ({...prev, votos: data.votos, votei: data.votei})); } } catch(e) { toast.push({icon:'x', title: lang==='pt'?'Erro ao votar':'Vote failed'}); } }; return (
{/* Cabeçalho de página */}
{lang==='pt'?'pedidos e mural':'requests & wall'}

{lang==='pt'?<>Solicitações.:<>Requests.}

{/* Tabs */}
{[ {id:'mural', pt:'mural', en:'wall', count:requests.filter(r=>!TIPOS[r.tipo]?.private&&r.status!=='rejected').length}, {id:'minhas', pt:'minhas', en:'mine', count:myCount}, {id:'nova', pt:'+ nova', en:'+ new'}, ].map(t => ( ))}
{tab === 'nova' ? ( toggleLike(r)} onDone={()=>{ fetchRequests(); setTab('minhas'); }}/> ) : loading ? ( // Skeleton loaders
{[1,2,3,4].map(i=>(
))}
) : ( <>
{tab === 'mural' && (
{[['votos', '🔥', lang==='pt'?'em alta':'trending'],['recentes', '🕐', lang==='pt'?'recentes':'newest']].map(([k, ic, l]) => ( ))}
)}
{Object.entries(TIPOS).map(([k,v]) => ( ))}
{tab === 'mural' && ( )}
{visibleRequests.map(r => ( setOpening(r)} onLike={()=>toggleLike(r)} me={me}/> ))} {visibleRequests.length === 0 && (
{tab==='minhas' ? (lang==='pt'?'você ainda não criou solicitações.':'no requests yet.') : (lang==='pt'?'nada por aqui ainda.':'nothing here yet.')}
)}
)} {opening && ( { await fetch(`/api/requests/${opening.id}/assign`, { method:'PUT', headers:{'Content-Type':'application/json','Authorization':`Bearer ${token()}`}, body: JSON.stringify({ user_id: uid }) }); const res = await fetch('/api/requests', {headers:{'Authorization':`Bearer ${token()}`}}); if (res.ok) { const all = await res.json(); setRequests(all); setOpening(all.find(x => x.id === opening.id) || opening); } }} onRefresh={async ()=>{ const res = await fetch('/api/requests', {headers:{'Authorization':`Bearer ${token()}`}}); if (res.ok) { const all = await res.json(); setRequests(all); setOpening(all.find(x => x.id === opening.id) || null); } }} onFundir={async (de)=>{ if (!de || isNaN(de)) return; const rr = await fetch(`/api/requests/${opening.id}/duplicada`, {method:'POST',headers:{'Content-Type':'application/json','Authorization':`Bearer ${token()}`},body:JSON.stringify({de})}); const d = await rr.json(); if (rr.ok) { toast.push({icon:'check', title: lang==='pt'?`Fundida com a #${de} — votos migrados 🔗`:`Merged into #${de} 🔗`}); const res = await fetch('/api/requests', {headers:{'Authorization':`Bearer ${token()}`}}); if (res.ok) setRequests(await res.json()); setOpening(null); } else toast.push({icon:'x', title: d.error || (lang==='pt'?'Não consegui fundir':'Merge failed')}); }} onConverter={async (alvo) => { const r2 = await fetch(`/api/requests/${opening.id}/converter-${alvo}`, { method:'POST', headers:{'Content-Type':'application/json','Authorization':`Bearer ${token()}`}, body: JSON.stringify({}) }); const d2 = await r2.json().catch(()=>({})); if (r2.ok) toast.push({icon:'check', title: alvo==='faina' ? (lang==='pt'?`⚒ Virou a faina #${d2.faina_id}`:`⚒ Now task #${d2.faina_id}`) : (lang==='pt'?`🛒 Virou a PO REQ-${opening.id}`:`🛒 Now PO REQ-${opening.id}`)}); else toast.push({icon:'x', title: d2.error || 'Erro'}); const res = await fetch('/api/requests', {headers:{'Authorization':`Bearer ${token()}`}}); if (res.ok) { const all = await res.json(); setRequests(all); setOpening(all.find(x => x.id === opening.id) || opening); } }} onConfirm={async (ok) => { const r2 = await fetch(`/api/requests/${opening.id}/confirm`, { method:'POST', headers:{'Content-Type':'application/json','Authorization':`Bearer ${token()}`}, body: JSON.stringify({ ok }) }); if (r2.ok) toast.push({icon: ok?'check':'bell', title: ok ? (lang==='pt'?'Valeu por confirmar! ✓':'Thanks for confirming! ✓') : (lang==='pt'?'Reaberta — o time foi avisado':'Reopened — the team was notified')}); const res = await fetch('/api/requests', {headers:{'Authorization':`Bearer ${token()}`}}); if (res.ok) { const all = await res.json(); setRequests(all); setOpening(all.find(x => x.id === opening.id) || opening); } }} token={token} onClose={()=>setOpening(null)} onLike={()=>toggleLike(opening)} onComment={async (msg, interno) => { await fetch(`/api/requests/${opening.id}/comment`, { method:'POST', headers:{'Content-Type':'application/json','Authorization':`Bearer ${token()}`}, body: JSON.stringify({msg, interno: !!interno}) }); await fetchRequests(); // Atualiza o detail aberto const updated = await fetch(`/api/requests`, {headers:{'Authorization':`Bearer ${token()}`}}); if (updated.ok) { const all = await updated.json(); const fresh = all.find(x => x.id === opening.id); if (fresh) setOpening(fresh); setRequests(all); } }} /> )}
); }; // ─── card (estilo Canny: voto à esquerda · conteúdo · foto à direita) ─── const RequestCard = ({r, usersById, lang, onClick, onLike, me}) => { const tipo = TIPOS[r.tipo]; const urg = URGENCIAS[r.urgencia]; const status = STATUS[r.status]; const author = usersById[r.autor]; const liked = !!r.votei; const votavel = r.tipo === 'ideia' || r.tipo === 'evento' || r.tipo === 'conteudo'; return (
{e.currentTarget.style.transform='translateY(-2px)';e.currentTarget.style.boxShadow='var(--shadow-lg)'}} onMouseLeave={e=>{e.currentTarget.style.transform='none';e.currentTarget.style.boxShadow='var(--shadow-sm)'}}> {/* caixa de voto — o coração do mural */} {votavel ? ( ) : (
)} {/* conteúdo */}
{lang==='pt'?tipo.pt:tipo.en} {urg && r.urgencia === 'high' && {lang==='pt'?urg.pt:urg.en}}
{r.titulo}
{(r.desc || r.descricao) && (
{r.desc || r.descricao}
)}
{lang==='pt'?status.pt:status.en} {r.resposta_oficial && 📣} {r.duplicada_de && 🔗} {r.link_tipo && {r.link_tipo==='faina'?'⚒':'🛒'}} {author && · {author.nome.split(' ')[0]}} {r.responsavel_nome && → {r.responsavel_nome.split(' ')[0]}}
{/* foto — quem tem, brilha; quem não tem, não deixa buraco */} {r.foto_url && ( )}
); }; // ─── new request form ─── // compressão de foto no navegador (resize + JPEG) — poupa satélite e memória do celular function _reqComprimirFoto(file, maxW = 1280, quality = 0.72) { return new Promise((resolve) => { if (!file || !file.type || !file.type.startsWith('image/')) { resolve(file); return; } const img = new Image(); const url = URL.createObjectURL(file); img.onload = () => { URL.revokeObjectURL(url); let { width, height } = img; if (width > maxW) { height = Math.round(height * maxW / width); width = maxW; } const canvas = document.createElement('canvas'); canvas.width = width; canvas.height = height; canvas.getContext('2d').drawImage(img, 0, 0, width, height); canvas.toBlob(b => resolve(b ? new File([b], (file.name||'foto').replace(/\.[^.]+$/,'') + '.jpg', { type: 'image/jpeg' }) : file), 'image/jpeg', quality); }; img.onerror = () => { URL.revokeObjectURL(url); resolve(file); }; img.src = url; }); } const NewRequestForm = ({me, lang, toast, token, onDone, requests, onVotar}) => { const [tipo, setTipo] = useState('manutencao'); const [titulo, setTitulo] = useState(''); const [desc, setDesc] = useState(''); const [local, setLocal] = useState(''); const [urgencia, setUrgencia] = useState('low'); const [saving, setSaving] = useState(false); const [fotoUrl, setFotoUrl] = useState(null); const [fotoBusy, setFotoBusy] = useState(false); const fotoRef = React.useRef(null); const minhaCabine = me && (me.cabine_atual || me.cab) ? String(me.cabine_atual || me.cab) : ''; const trocarTipo = (t) => { setTipo(t); if (t === 'manutencao' && !local.trim() && minhaCabine) setLocal(lang==='pt' ? `Cabine ${minhaCabine}` : `Cabin ${minhaCabine}`); }; const phTitulo = { manutencao: lang==='pt'?'ex.: torneira pingando, luz queimada…':'e.g.: dripping tap, dead light…', compras: lang==='pt'?'o item — ex.: filtro de ar XYZ-99':'the item — e.g.: air filter XYZ-99', conteudo: lang==='pt'?'nome do filme ou série…':'movie or series name…', ideia: lang==='pt'?'sua ideia em poucas palavras…':'your idea in a few words…', evento: lang==='pt'?'ex.: torneio de sinuca…':'e.g.: pool tournament…', outro: lang==='pt'?'em poucas palavras…':'in a few words…', }; const enviarFoto = async (file) => { if (!file) return; setFotoBusy(true); try { const comprimida = await _reqComprimirFoto(file); const fd = new FormData(); fd.append('photo', comprimida, comprimida.name || 'foto.jpg'); const r = await fetch('/api/upload/photo', { method:'POST', headers:{ 'Authorization':`Bearer ${token()}` }, body: fd }); const d = await r.json(); if (r.ok && d.url) setFotoUrl(d.url); else toast.push({icon:'x', title: lang==='pt'?'Erro no upload':'Upload error'}); } catch(e) { toast.push({icon:'x', title: lang==='pt'?'Erro no upload':'Upload error'}); } setFotoBusy(false); }; const submit = async () => { if (!titulo.trim()) { toast.push({icon:'lock', title:lang==='pt'?'Título obrigatório':'Title required'}); return; } setSaving(true); try { const res = await fetch('/api/requests', { method:'POST', headers:{'Content-Type':'application/json','Authorization':`Bearer ${token()}`}, body: JSON.stringify({ tipo, titulo:titulo.trim(), descricao:desc.trim(), local:local.trim(), urgencia, publico:!TIPOS[tipo].private, foto_url: fotoUrl }) }); if (res.ok) { toast.push({icon:'check', title:lang==='pt'?'Solicitação enviada!':'Request sent!', body: TIPOS[tipo].private ? (lang==='pt'?'visível só para você e operação':'visible to you and ops only') : (lang==='pt'?'publicado no mural':'posted to wall')}); onDone(); } else { const d = await res.json(); toast.push({icon:'x', title:'Erro', body: d.error}); } } catch(e) { toast.push({icon:'x', title:'Erro de conexão'}); } finally { setSaving(false); } }; const showUrg = tipo === 'manutencao'; return (
{lang==='pt'?'nova solicitação':'new request'}
{lang==='pt' ? 'manutenção e compras ficam privadas. Ideias, eventos e conteúdo aparecem no mural pra todo mundo curtir.' : 'maintenance and shopping stay private. Ideas, events and content show up on the wall for everyone to like.'}
{Object.entries(TIPOS).map(([k,v]) => ( ))}
setTitulo(e.target.value)} placeholder={phTitulo[tipo] || phTitulo.outro} style={{width:'100%'}}/> {(() => { // parecidas: palavras significativas do título contra o mural (evita duplicadas na origem) const palavras = titulo.toLowerCase().split(/\s+/).filter(w => w.length > 3); if (palavras.length === 0) return null; const parecidas = (requests || []) .filter(r => !TIPOS[r.tipo]?.private && r.status !== 'rejected') .map(r => ({ r, hits: palavras.filter(w => (r.titulo||'').toLowerCase().includes(w)).length })) .filter(x => x.hits > 0) .sort((a,b) => b.hits - a.hits || (b.r.votos||0) - (a.r.votos||0)) .slice(0, 3); if (parecidas.length === 0) return null; return (
{lang==='pt'?'já pediram algo parecido — que tal votar em vez de repetir?':'similar requests exist — vote instead of repeating?'}
{parecidas.map(({r}) => (
{r.titulo}
))}
); })()}