bkp

src/playground/tabela.playground.vue

@@ -42,22 +42,52 @@ export default defineComponent({
         acao: (linha) => {
           console.log("Remover registro de", linha.nome);
         },
-        exibir: async () => {
-          await new Promise((resolve) => setTimeout(resolve, 250));
-          return true;
-        },
+        exibir: (linha) => linha.email !== "ana@eli.com",
       },
     ];
 
+    const linhasPadrao: Linha[] = [
+      { nome: "Ana", email: "ana@eli.com" },
+      { nome: "Bruno", email: "bruno@eli.com" },
+      { nome: "Carla", email: "carla@eli.com" },
+    ];
+
+    const ordenarLinhas = (
+      linhas: Linha[],
+      parametros?: { coluna_ordem?: keyof Linha; direcao_ordem?: "asc" | "desc" }
+    ) => {
+      if (!parametros?.coluna_ordem) {
+        return [...linhas];
+      }
+
+      const direcao = parametros.direcao_ordem ?? "asc";
+      const chave = parametros.coluna_ordem;
+      const multiplicador = direcao === "asc" ? 1 : -1;
+
+      return [...linhas].sort((a, b) => {
+        const valorA = a[chave];
+        const valorB = b[chave];
+
+        return (
+          multiplicador *
+          String(valorA ?? "").localeCompare(String(valorB ?? ""), "pt-BR", {
+            sensitivity: "base",
+          })
+        );
+      });
+    };
+
     const tabelaOk: EliTabelaConsulta<Linha> = {
       colunas: [
         {
           rotulo: "Nome",
           celula: (l) => l.nome,
+          coluna_ordem: "nome",
         },
         {
           rotulo: "E-mail",
           celula: (l) => l.email,
+          coluna_ordem: "email",
           acao: () => {
             // Exemplo de ação: poderia abrir detalhes
             console.log("clicou na coluna e-mail");
@@ -65,18 +95,17 @@ export default defineComponent({
         },
       ],
       acoes: acoesTabela,
-      resposta: async () => {
+      consulta: async (parametrosConsulta) => {
+        const valores = ordenarLinhas(linhasPadrao, parametrosConsulta);
+
         return {
           cod: codigosResposta.sucesso,
           eCerto: true,
           eErro: false,
           mensagem: undefined,
           valor: {
-            quantidade: 2,
-            valores: [
-              { nome: "Ana", email: "ana@eli.com" },
-              { nome: "Bruno", email: "bruno@eli.com" },
-            ],
+            quantidade: valores.length,
+            valores,
           },
         };
       },
@@ -84,7 +113,7 @@ export default defineComponent({
 
     const tabelaVazia: EliTabelaConsulta<Linha> = {
       colunas: tabelaOk.colunas,
-      resposta: async () => {
+      consulta: async () => {
         return {
           cod: codigosResposta.sucesso,
           eCerto: true,
@@ -103,7 +132,7 @@ export default defineComponent({
     const tabelaErro: EliTabelaConsulta<Linha> = {
       colunas: tabelaOk.colunas,
       acoes: acoesTabela,
-      resposta: async () => {
+      consulta: async () => {
         return {
           cod: codigosResposta.erroConhecido,
           eCerto: false,