# Portaria e Alertas TMS — Revisão Visual Implementation Plan > **For agentic workers:** REQUIRED SUB-SKILL: Use superpowers:subagent-driven-development (recommended) or superpowers:executing-plans to implement this plan task-by-task. Steps use checkbox (`- [ ]`) syntax for tracking. **Goal:** Aumentar densidade visual da Portaria de Pedidos, adicionar auto-refresh e converter Alertas TMS de link externo para modal inline com UX correta. **Architecture:** Três arquivos de view são modificados (HTML/CSS/JS), zero mudança de backend. A Portaria compacta células de tabela e remove o botão manual substituindo-o por `setInterval`. O botão GCB dos Alertas TMS troca de `` para ``; // DEPOIS tr.innerHTML = `
#${numPedido}
${tagsHtml?'
'+tagsHtml+'
':''} ${tipoPedido}
${dataEnvio}
${pedido.cliente_nome||'Cliente'}
${pedido.cidade_nome||'-'} / ${pedido.estado_uf||'UF'}
${tempoLabel} ${cubagem} ${valor} `; ``` - [ ] **Step 7: Verificar visualmente no browser** Abrir o painel Central e clicar no botão Portaria. Verificar: - Linhas da tabela são visivelmente mais compactas (~34px vs ~60px antes) - Ícone de lupa está centrado verticalmente no input - Cards de resumo menores (sem `text-2xl`) - Parágrafo "Gerencie os pedidos..." não aparece mais - [ ] **Step 8: Commit** ```bash git add componentes/Missoes/Logistica/sinais/Central/html/central_portaria.php git commit -m "feat(central): compactar densidade visual da Portaria de Pedidos" ``` --- ### Task 2: Portaria — Auto-refresh + Remover botão manual **Files:** - Modify: `componentes/Missoes/Logistica/sinais/Central/html/central_portaria.php` **Interfaces:** - Consumes: `window.__refreshPortariaTeste` (já definida na mesma view, linha ~765) - Produces: `window.__portariaRefreshTimer` (global, usado para clearInterval no fechar) - [ ] **Step 1: Adicionar setInterval em abrirPortaria()** Localizar a função `abrirPortaria` e adicionar a linha do timer após `carregarDadosPortaria()`: ```javascript // ANTES function abrirPortaria() { document.getElementById('modal-portaria').style.display = 'flex'; document.getElementById('busca-portaria').value = ''; idsSelecionados.clear(); carregarDadosPortaria(); } // DEPOIS function abrirPortaria() { document.getElementById('modal-portaria').style.display = 'flex'; document.getElementById('busca-portaria').value = ''; idsSelecionados.clear(); carregarDadosPortaria(); window.__portariaRefreshTimer = setInterval(window.__refreshPortariaTeste, 30000); } ``` - [ ] **Step 2: Adicionar clearInterval em fecharModalPortaria()** ```javascript // ANTES function fecharModalPortaria() { document.getElementById('modal-portaria').style.display = 'none'; idsSelecionados.clear(); limparFormulario(); } // DEPOIS function fecharModalPortaria() { clearInterval(window.__portariaRefreshTimer); document.getElementById('modal-portaria').style.display = 'none'; idsSelecionados.clear(); limparFormulario(); } ``` - [ ] **Step 3: Remover o botão manual de refresh** Remover as linhas 777–784 inteiras (o elemento ` ``` - [ ] **Step 4: Verificar no browser** 1. Abrir a Portaria; aguardar ~30s; verificar no Network tab do DevTools que uma requisição para `listarPortaria` é disparada automaticamente 2. Fechar a Portaria; aguardar mais 30s; confirmar que **não** há mais requisições automáticas (timer cancelado) 3. Confirmar que o botão laranja "Atualizar portaria" não aparece mais no canto inferior-esquerdo da tela - [ ] **Step 5: Commit** ```bash git add componentes/Missoes/Logistica/sinais/Central/html/central_portaria.php git commit -m "feat(central): substituir botão manual de refresh por setInterval 30s na Portaria" ``` --- ### Task 3: Alertas TMS — Wiring do modal + Densidade **Files:** - Modify: `componentes/Missoes/Logistica/sinais/Central/html/central.php` - Modify: `componentes/Missoes/Logistica/sinais/Central/forms/alertas_tms.php` **Interfaces:** - Consumes: `Sinal_alertasTms()` em `Central.php` (já existe, linha 310) — retorna HTML via Galaxia - Consumes: `$galaxia->abrirModal('alertasTms', [])['html']` — gera atributos `data-galaxia-*` para o botão - [ ] **Step 1: Trocar botão GCB em central.php** Localizar o bloco do Alertas TMS (linhas 4125–4133) e substituir o `` pelo ` ``` - [ ] **Step 2: Verificar que o modal abre** Abrir o painel Central, clicar em "Alertas TMS". O modal `.modal-config` deve abrir com o conteúdo do `forms/alertas_tms.php`. Verificar no Network tab que a requisição vai para o sinal `alertasTms` (não navega para nova aba). Verificar também: clicar no backdrop fecha o modal; pressionar Escape fecha o modal; o `×` no header fecha o modal. - [ ] **Step 3: Adicionar wrapper scroll em alertas_tms.php** Envolver todo o conteúdo PHP (a partir da linha 41, do `
` até o `
` final na linha 182) em um div scroll container. Adicionar o `
` wrapper logo antes de `
// DEPOIS — inserir wrapper ANTES da linha 41:
``` E no fim do arquivo, após o `
` final (linha 182), adicionar o fechamento: ```php // ANTES — última linha:
// DEPOIS:
``` - [ ] **Step 4: Compactar g-modal-conteudo** Localizar `style="padding:1.25rem 1.5rem;"` e trocar para `style="padding:0.8rem 1rem;"`: ```php // ANTES (linha 64):
// DEPOIS:
``` - [ ] **Step 5: Compactar cards de fantasmas** Localizar o card de fantasma (linha ~96) e reduzir padding + font do título: ```php // ANTES:
Pedido # // DEPOIS:
Pedido # ``` - [ ] **Step 6: Compactar bloco de guidance de fantasma** Localizar o `div` de guidance dentro do loop de fantasmas (linha ~111): ```php // ANTES:
// DEPOIS:
``` - [ ] **Step 7: Compactar section header de fantasmas e espaçamento entre seções** Localizar o `
` (linha ~80) e o `

` de título (linha ~82): ```php // ANTES:

;">

Rota TMS # Pedido # // DEPOIS:
Rota TMS # Pedido # ``` - [ ] **Step 9: Compactar bloco de guidance de bloqueios** Localizar o `div` de guidance dentro do loop de bloqueios (linha ~172): ```php // ANTES:
// DEPOIS:
``` - [ ] **Step 10: Compactar section header de bloqueios** Localizar o `

` de título da seção de bloqueios (linha ~133): ```php // ANTES:

// DEPOIS:

``` - [ ] **Step 11: Verificar no browser** Clicar no botão "Alertas TMS" no GCB. Verificar: 1. Modal abre inline (não nova aba) 2. Cards de fantasma e bloqueio mais compactos 3. Com vários alertas: rolar o conteúdo do modal enquanto o header com `×` permanece fixo no topo 4. Clicar fora do modal fecha; Escape fecha; `×` fecha - [ ] **Step 12: Commit** ```bash git add componentes/Missoes/Logistica/sinais/Central/html/central.php git add componentes/Missoes/Logistica/sinais/Central/forms/alertas_tms.php git commit -m "feat(central): Alertas TMS como modal inline + densidade e scroll UX" ```