|
|
|
@@ -1,4 +1,4 @@
|
|
|
|
|
import React, { useEffect, useState } from 'react';
|
|
|
|
|
import React, { useEffect, useState, useRef } from 'react';
|
|
|
|
|
import { createRoot } from 'react-dom/client';
|
|
|
|
|
import '../css/app.css';
|
|
|
|
|
import '../css/tempo-theme.css';
|
|
|
|
@@ -14,7 +14,11 @@ import DirectCostsWorkspace from './DirectCostsWorkspace.jsx';
|
|
|
|
|
import IndustrialBudgetsWorkspace from './IndustrialBudgetsWorkspace.jsx';
|
|
|
|
|
import PurchasingBudgetWorkspace from './PurchasingBudgetWorkspace.jsx';
|
|
|
|
|
import IndustrialCostsWorkspace from './IndustrialCostsWorkspace.jsx';
|
|
|
|
|
import WorkspaceNavigation, {navigationGroups} from './WorkspaceNavigation.jsx';
|
|
|
|
|
import {navigationGroups} from './WorkspaceNavigation.jsx';
|
|
|
|
|
import ModuleNavigation, {moduleGroups} from './ModuleNavigation.jsx';
|
|
|
|
|
import {ContextTransition} from './context-transition.js';
|
|
|
|
|
import ModuleRecordsWorkspace from './ModuleRecordsWorkspace.jsx';
|
|
|
|
|
import ContextTransitionDialog from './ContextTransitionDialog.jsx';
|
|
|
|
|
import WorkspaceHome from './WorkspaceHome.jsx';
|
|
|
|
|
import WorkshopBillingWorkspace from './WorkshopBillingWorkspace.jsx';
|
|
|
|
|
import WorkshopCorrectionsWorkspace from './WorkshopCorrectionsWorkspace.jsx';
|
|
|
|
@@ -37,22 +41,47 @@ function App() {
|
|
|
|
|
const [busy, setBusy] = useState(false);
|
|
|
|
|
const [page, setPage] = useState('home');
|
|
|
|
|
const [aSelection, setASelection] = useState(null);
|
|
|
|
|
const transitions = useRef(new ContextTransition());
|
|
|
|
|
const [pendingTransition, setPendingTransition] = useState(null);
|
|
|
|
|
const [transitionBusy, setTransitionBusy] = useState(false);
|
|
|
|
|
const context = state?.context;
|
|
|
|
|
const currentToken = useRef(context?.token); currentToken.current = context?.token;
|
|
|
|
|
const mountedToken = useRef(context?.token);
|
|
|
|
|
useEffect(() => { if(mountedToken.current !== context?.token) { transitions.current.discard(); setASelection(null); setPage('home'); mountedToken.current=context?.token; } }, [context?.token]);
|
|
|
|
|
useEffect(() => { const leave=e=>{transitions.current.prune(); if(transitions.current.dirty.size||transitions.current.pending){e.preventDefault();e.returnValue='';}}; window.addEventListener('beforeunload',leave); return ()=>window.removeEventListener('beforeunload',leave); }, []);
|
|
|
|
|
function transition(action) { transitions.current.prune(); if(transitions.current.pending||busy||transitionBusy) {setError('Aguarde a conclusão da operação antes de mudar de contexto.');return;} if(transitions.current.dirty.size) setPendingTransition(()=>action); else action(); }
|
|
|
|
|
async function resolveTransition(save) { setTransitionBusy(true);setError(''); try { if(save) await transitions.current.save(); else transitions.current.discard(); const action=pendingTransition;setPendingTransition(null); await action(); } catch(e){setError(e.message);} finally{setTransitionBusy(false);} }
|
|
|
|
|
const can = (permission, unit = null) => !!context?.grants.some(g => g.permission === permission && g.unit_id === unit);
|
|
|
|
|
|
|
|
|
|
const groups = navigationGroups(can, context?.unit?.id ?? null);
|
|
|
|
|
const navigate = (id,selection=null) => { setASelection(selection); setPage(id); setError(''); };
|
|
|
|
|
const allGroups = navigationGroups(can, context?.unit?.id ?? null);
|
|
|
|
|
const groups = [...allGroups.filter(g=>['start','admin'].includes(g.id)), ...moduleGroups(allGroups,context?.module_id)];
|
|
|
|
|
const navigate = (id,selection=null) => transition(async () => {
|
|
|
|
|
setError('');
|
|
|
|
|
if(!groups.some(g=>g.items.some(i=>i.id===id))) {
|
|
|
|
|
const target=context?.modules?.find(m=>moduleGroups(allGroups,m.id).some(g=>g.items.some(i=>i.id===id)));
|
|
|
|
|
if(!target){setError('Destino sem módulo ou permissão autorizados.');return;}
|
|
|
|
|
try {
|
|
|
|
|
const next=await api('/api/context','POST',{tenant_id:context.company.tenant_id,company_id:context.company.id,unit_id:context.unit?.id??null,module_id:target.id});
|
|
|
|
|
mountedToken.current=next.context.token;currentToken.current=next.context.token;setState(next);
|
|
|
|
|
} catch(e){setError(e.message);return;}
|
|
|
|
|
}
|
|
|
|
|
transitions.current.discard();setASelection(selection);setPage(id);
|
|
|
|
|
});
|
|
|
|
|
useEffect(() => { if (!groups.some(g => g.items.some(i => i.id === page))) setPage('home'); }, [context?.token, JSON.stringify(context?.grants), page]);
|
|
|
|
|
|
|
|
|
|
async function api(path, method = 'GET', body, token = context?.token, commandKey = null) {
|
|
|
|
|
const execute = async () => {
|
|
|
|
|
const response = await fetch(path, { method, credentials: 'same-origin', headers: { Accept: 'application/json', 'Content-Type': 'application/json', 'X-CSRF-TOKEN': state?.csrf || '', 'X-SGF-Context': token || '', ...(commandKey ? { 'Idempotency-Key': commandKey } : {}) }, ...(body === undefined ? {} : { body: JSON.stringify(body) }) });
|
|
|
|
|
const result = await response.json().catch(() => ({}));
|
|
|
|
|
if (!response.ok) {
|
|
|
|
|
if (response.status === 401) { await refresh(); }
|
|
|
|
|
if ([401,403,409].includes(response.status)) { await refresh(); }
|
|
|
|
|
const message = response.status === 419 ? 'A sessão expirou. Actualize a página e entre novamente.' : Object.values(result.errors || {}).flat().join(' ') || result.message || 'Não foi possível concluir a operação.';
|
|
|
|
|
throw new Error(message);
|
|
|
|
|
}
|
|
|
|
|
if(token && token !== currentToken.current) throw new Error('Resposta de um contexto anterior ignorada.');
|
|
|
|
|
return result;
|
|
|
|
|
};
|
|
|
|
|
return method==='GET' ? execute() : transitions.current.command(execute);
|
|
|
|
|
}
|
|
|
|
|
async function refresh() {
|
|
|
|
|
const response = await fetch('/api/session', { credentials: 'same-origin', headers: { Accept: 'application/json' } });
|
|
|
|
@@ -70,21 +99,23 @@ function App() {
|
|
|
|
|
async function select(companyId, unitId = null) {
|
|
|
|
|
const company = state.companies.find(c => c.id === Number(companyId));
|
|
|
|
|
if (!company) return;
|
|
|
|
|
await perform(() => api('/api/context', 'POST', { tenant_id: company.tenant_id, company_id: company.id, unit_id: unitId }), 'Contexto alterado. Os formulários foram recarregados.');
|
|
|
|
|
transition(() => perform(() => api('/api/context', 'POST', { tenant_id: company.tenant_id, company_id: company.id, unit_id: unitId }), 'Contexto alterado. Seleccione o módulo.'));
|
|
|
|
|
}
|
|
|
|
|
if (!state) return <main className="loading"><h1>SGF TEMPO</h1><p role="status">{error || 'A carregar…'}</p></main>;
|
|
|
|
|
if (state.setup_pending) return <main className="setup-pending"><p className="eyebrow">SGF TEMPO · PREPARAÇÃO LOCAL</p><h1>Falta concluir a primeira conta</h1><p>A aplicação está pronta, mas ainda não existe um utilizador. O login ficará disponível depois de definires a palavra-passe no procedimento local já autorizado.</p><section className="panel"><h2>Concluir no terminal do VS Code</h2><p>Executa este comando, confere o âmbito apresentado e define a palavra-passe nos dois pedidos de entrada oculta:</p><pre>powershell.exe -NoProfile -ExecutionPolicy Bypass -File C:\laragon\data\sgf-tempo\run\complete-first-admin.ps1</pre><p className="help">Não envies a palavra-passe pelo chat. Nenhuma conta é criada por este ecrã.</p><button className="primary" disabled={busy} onClick={() => perform(async () => {}, '')}>Já concluí — actualizar estado</button>{error && <p role="alert">{error}</p>}</section></main>;
|
|
|
|
|
if (!state.user) return <div className="login-layout"><aside><span className="brand">TEMPO<span>SGF</span></span><h1>O seu trabalho,<br />no contexto certo.</h1><p>Uma entrada para as empresas e unidades a que tem acesso.</p><small>Ambiente local · Primeiro percurso funcional</small></aside><main className="login-card"><p className="eyebrow">BEM-VINDO AO SGF TEMPO</p><h2>Entrar na aplicação</h2><p className="muted">Use a conta preparada pelo procedimento local autorizado.</p>{error && <div className="alert error" role="alert">{error}</div>}<Login busy={busy} onSubmit={(email, password) => perform(() => api('/api/login', 'POST', { email, password }), 'Sessão iniciada. Seleccione o contexto de trabalho.')} /><p className="help">Precisa de recuperar o acesso? Solicite recuperação local assistida. Não existe recuperação por email nesta etapa.</p></main></div>;
|
|
|
|
|
return <div className="shell"><WorkspaceNavigation key={context?.token ?? "no-context"} groups={groups} page={page} navigate={navigate} user={state.user} busy={busy} logout={() => perform(() => api("/api/logout", "POST"), "Sessão terminada.")} /><div className="workspace"><header><div><span className="eyebrow">CONTEXTO DE TRABALHO</span><strong>{context?.company.name || 'Seleccione uma empresa'}</strong><span className="muted">{context?.unit?.name || 'Sem unidade seleccionada'}</span></div><span className="local-badge">Ambiente local</span><div className="workspace-safety" role="status">Ensaios e rascunhos nos percursos identificados · Operações reais de custeio, oficinas, recebimentos e emissão bloqueadas.</div></header><main>
|
|
|
|
|
return <div className="shell" onSubmitCapture={e=>{transitions.current.submitting=e.target;}} onInputCapture={e=>e.target.closest('main')&&!e.target.closest('.context-card')&&transitions.current.changed(e.target.closest('form')||e.target.closest('section')||e.target)} onChangeCapture={e=>e.target.closest('main')&&!e.target.closest('.context-card')&&transitions.current.changed(e.target.closest('form')||e.target.closest('section')||e.target)} onClickCapture={e=>{transitions.current.submitting=e.target.closest('form')||e.target.closest('section');const a=e.target.closest('a[href]');if(a&&a.origin===location.origin){e.preventDefault();transition(()=>{location.href=a.href;});}}}><ModuleNavigation groups={allGroups} context={context} page={page} navigate={navigate} changeModule={module_id=>transition(async()=>{await perform(()=>api('/api/context','POST',{tenant_id:context.company.tenant_id,company_id:context.company.id,unit_id:context.unit?.id??null,module_id}),'Módulo alterado.');})} user={state.user} busy={busy||transitionBusy} logout={()=>transition(()=>perform(()=>api('/api/logout','POST'),'Sessão terminada.'))} />{pendingTransition&&<ContextTransitionDialog busy={transitionBusy} error={error} onSave={()=>resolveTransition(true)} onDiscard={()=>resolveTransition(false)} onCancel={()=>setPendingTransition(null)}/>}<div className="workspace"><header><div><span className="eyebrow">CONTEXTO DE TRABALHO</span><strong>{context?.company.name || 'Seleccione uma empresa'}</strong><span className="muted">{context?.unit?.name || 'Sem unidade seleccionada'}</span></div><span className="local-badge">Ambiente local</span><div className="workspace-safety" role="status">Ensaios e rascunhos nos percursos identificados · Operações reais de custeio, oficinas, recebimentos e emissão bloqueadas.</div></header><main>
|
|
|
|
|
{error && <div className="alert error" role="alert">{error}</div>}{notice && <div className="alert success" role="status">{notice}</div>}
|
|
|
|
|
<section className="context-card"><label>Empresa<select aria-label="Empresa activa" disabled={busy} value={context?.company.id || ''} onChange={e => select(e.target.value)}><option value="">Escolher empresa autorizada</option>{state.companies.map(c => <option value={c.id} key={c.id}>{c.name}</option>)}</select></label><label>Unidade<select aria-label="Unidade activa" disabled={busy || !context} value={context?.unit?.id || ''} onChange={e => select(context.company.id, e.target.value ? Number(e.target.value) : null)}><option value="">Sem unidade seleccionada</option>{context?.units.map(u => <option value={u.id} key={u.id}>{u.name}</option>)}</select></label><p>Apenas os contextos com acesso explícito são apresentados.</p></section>
|
|
|
|
|
{!state.companies.length ? <section className="panel"><h1>Sem empresas autorizadas</h1><p>A conta existe, mas ainda não tem acesso a uma empresa. Peça ao responsável uma concessão explícita.</p></section> : !context ? <section className="panel"><h1>Escolha onde vai trabalhar</h1><p>Seleccione uma empresa. A pertença a um cliente contratante não dá acesso automático às suas empresas ou unidades.</p></section> : <div key={context.token}>
|
|
|
|
|
{!state.companies.length ? <section className="panel"><h1>Sem empresas autorizadas</h1><p>A conta existe, mas ainda não tem acesso a uma empresa. Peça ao responsável uma concessão explícita.</p></section> : !context ? <section className="panel"><h1>Escolha onde vai trabalhar</h1><p>Seleccione uma empresa. A pertença a um cliente contratante não dá acesso automático às suas empresas ou unidades.</p></section> : <div key={`${context.token}:${page}`}>
|
|
|
|
|
{page !== 'home' && page !== 'module_records' && context.module_id && <p className="help" role="status">Cadastros e rascunhos: apenas associações explícitas ao módulo activo. Dados anteriores sem associação estão preservados e pendentes de conferência pelo responsável. {can('access.manage')&&<button onClick={()=>navigate('module_records')}>Associações de módulos</button>}</p>}
|
|
|
|
|
{page === 'home' && <WorkspaceHome context={context} />}
|
|
|
|
|
{page === 'module_records' && <ModuleRecordsWorkspace context={context} can={can} api={api}/>}
|
|
|
|
|
{page === 'workshop_billing' && <WorkshopBillingWorkspace context={context} can={can} api={api} busy={busy} />}
|
|
|
|
|
{page === 'workshop_corrections' && <WorkshopCorrectionsWorkspace context={context} can={can} api={api} busy={busy} />}
|
|
|
|
|
{page === 'company' && <section className="panel"><p className="eyebrow">DADOS BÁSICOS</p><h1>Empresa</h1><NameForm key={context.company.id} label="Nome da empresa" initial={context.company.name} editable={can('company.edit')} busy={busy} onSave={name => perform(() => api(`/api/companies/${context.company.id}`, 'PATCH', { name }, context.token), 'Nome da empresa actualizado.')} />{!can('company.edit') && <p className="help">O seu acesso permite consulta. A edição exige uma concessão própria.</p>}</section>}
|
|
|
|
|
{page === 'units' && <><section className="panel"><p className="eyebrow">DADOS BÁSICOS</p><h1>Unidades autorizadas</h1>{!context.units.length && <p>Não tem consulta concedida a nenhuma unidade desta empresa.</p>}<ul className="unit-list">{context.units.map(u => <li key={u.id}><strong>{u.name}</strong><button disabled={busy || context.unit?.id === u.id} onClick={() => select(context.company.id, u.id)}>{context.unit?.id === u.id ? 'Seleccionada' : 'Seleccionar'}</button></li>)}</ul>{context.unit && <NameForm label="Nome da unidade" initial={context.unit.name} editable={can('unit.edit', context.unit.id)} busy={busy} onSave={name => perform(() => api(`/api/units/${context.unit.id}`, 'PATCH', { name }, context.token), 'Nome da unidade actualizado.')} />}</section>{can('unit.create') && <section className="panel"><h2>Criar unidade</h2><p className="help">A unidade será criada nesta empresa. Receberá consulta e edição explícitas apenas para a nova unidade.</p><NameForm label="Nome da nova unidade" initial="" editable busy={busy} button="Criar unidade" onSave={name => perform(() => api('/api/units', 'POST', { name }, context.token), 'Unidade criada com os seus acessos explícitos.')} /></section>}</>}
|
|
|
|
|
{serviceAreas[page] && <ServicesWorkspace key={page} area={page} context={context} can={can} api={api} perform={perform} busy={busy} initialId={aSelection?.area === page ? aSelection.id : null} initialCreate={aSelection?.area === page && aSelection.create} navigate={(area,id) => { setASelection({area,id}); setPage(area); }} />}
|
|
|
|
|
{serviceAreas[page] && <ServicesWorkspace key={page} area={page} context={context} can={can} api={api} perform={perform} busy={busy} initialId={aSelection?.area === page ? aSelection.id : null} initialCreate={aSelection?.area === page && aSelection.create} navigate={(area,id) => navigate(area,{area,id})} />}
|
|
|
|
|
{billingSections.some(s=>s.id===page)&&page!=='billing_drafts'&&<BillingMenuWorkspace key={JSON.stringify(context.grants)} section={page} context={context} can={can} api={api} navigate={(area,id=null,create=false)=>navigate(area,{area,id,create})}/>}
|
|
|
|
|
{stockSections.some(s=>s.id===page)&&<StockMenuWorkspace key={JSON.stringify(context.grants)} section={page} context={context} can={can} navigate={navigate}/>}
|
|
|
|
|
{accountingSections.some(s=>s.id===page)&&<AccountingMenuWorkspace key={JSON.stringify(context.grants)} section={page} context={context} can={can} navigate={navigate}/>}
|
|
|
|
|
