adicionado detalhes

src/components/eli/EliTabela/EliTabela.vue

@@ -31,6 +31,7 @@
         <EliTabelaHead
           :colunas="colunasEfetivas"
           :temAcoes="temAcoes"
+          :temColunasInvisiveis="temColunasInvisiveis"
           :colunaOrdenacao="colunaOrdenacao"
           :direcaoOrdenacao="direcaoOrdenacao"
           @alternar-ordenacao="alternarOrdenacao"
@@ -38,11 +39,15 @@
 
         <EliTabelaBody
           :colunas="colunasEfetivas"
+          :colunasInvisiveis="colunasInvisiveisEfetivas"
+          :temColunasInvisiveis="temColunasInvisiveis"
+          :linhasExpandidas="linhasExpandidas"
           :linhas="linhas"
           :temAcoes="temAcoes"
           :menuAberto="menuAberto"
           :possuiAcoes="possuiAcoes"
           :toggleMenu="toggleMenu"
+          :alternarLinhaExpandida="alternarLinhaExpandida"
         />
       </table>
 
@@ -93,6 +98,7 @@ import EliTabelaBody from "./EliTabelaBody.vue";
 import EliTabelaMenuAcoes from "./EliTabelaMenuAcoes.vue";
 import EliTabelaPaginacao from "./EliTabelaPaginacao.vue";
 import EliTabelaModalColunas from "./EliTabelaModalColunas.vue";
+import type { EliColuna } from "./types-eli-tabela";
 /** Tipos da configuração/contrato da tabela */
 import type { EliTabelaConsulta } from "./types-eli-tabela";
 import {
@@ -158,8 +164,37 @@ export default defineComponent({
       carregarConfigColunas(props.tabela.nome)
     );
 
+    /** Linhas expandidas (para exibir colunas invisíveis) */
+    const linhasExpandidas = ref<Record<number, boolean>>({});
+
     const rotulosColunas = computed(() => props.tabela.colunas.map((c) => c.rotulo));
 
+    const colunasInvisiveisEfetivas = computed(() => {
+      const colunas = props.tabela.colunas as Array<EliColuna<any>>;
+      const invisiveisSet = new Set(configColunas.value.invisiveis ?? []);
+      const base = colunas.filter((c) => invisiveisSet.has(c.rotulo));
+
+      // ordenação: usa a lista salva de invisíveis (se existir), senão segue ordem original
+      const ordemSalva = configColunas.value.invisiveis ?? [];
+      const mapa = new Map<string, EliColuna<any>>();
+      for (const c of base) {
+        if (!mapa.has(c.rotulo)) mapa.set(c.rotulo, c);
+      }
+
+      const ordenadas: Array<EliColuna<any>> = [];
+      for (const r of ordemSalva) {
+        const c = mapa.get(r);
+        if (c) ordenadas.push(c);
+      }
+      for (const c of base) {
+        if (!ordenadas.includes(c)) ordenadas.push(c);
+      }
+
+      return ordenadas;
+    });
+
+    const temColunasInvisiveis = computed(() => colunasInvisiveisEfetivas.value.length > 0);
+
     const colunasEfetivas = computed(() => {
       const colunas = props.tabela.colunas;
       const todosRotulos = rotulosColunas.value;
@@ -202,6 +237,17 @@ export default defineComponent({
       configColunas.value = cfg;
       salvarConfigColunas(props.tabela.nome, cfg);
       modalColunasAberto.value = false;
+
+      // ao mudar colunas, fecha detalhes expandidos
+      linhasExpandidas.value = {};
+    }
+
+    function alternarLinhaExpandida(indice: number) {
+      const atual = Boolean(linhasExpandidas.value[indice]);
+      linhasExpandidas.value = {
+        ...linhasExpandidas.value,
+        [indice]: !atual,
+      };
     }
 
     /** Registros por consulta (normaliza para inteiro positivo) */
@@ -383,6 +429,7 @@ export default defineComponent({
       erro.value = null;
       acoesVisiveis.value = [];
       menuAberto.value = null;
+      linhasExpandidas.value = {};
 
       const limite = Math.max(1, registrosPorConsulta.value);
       const offset = (paginaAtual.value - 1) * limite;
@@ -523,6 +570,7 @@ export default defineComponent({
         valorBusca.value = "";
         modalColunasAberto.value = false;
         configColunas.value = carregarConfigColunas(props.tabela.nome);
+        linhasExpandidas.value = {};
         if (paginaAtual.value !== 1) {
           paginaAtual.value = 1;
         } else {
@@ -546,6 +594,7 @@ export default defineComponent({
     /** Watch: mudança nas linhas fecha o menu aberto */
     watch(linhas, () => {
       menuAberto.value = null;
+      linhasExpandidas.value = {};
     });
 
     /** Exposição para o template (state, computed, helpers e actions) */
@@ -574,10 +623,16 @@ export default defineComponent({
       modalColunasAberto,
       configColunas,
 
+      temColunasInvisiveis,
+      colunasInvisiveisEfetivas,
+      linhasExpandidas,
+
       abrirModalColunas,
       fecharModalColunas,
       salvarModalColunas,
 
+      alternarLinhaExpandida,
+
       // actions
       alternarOrdenacao,
       atualizarBusca,