melhorias de simulação

This commit is contained in:
Luiz Silva 2026-02-16 12:05:05 -03:00
parent eee275877d
commit ba0e116a92
3 changed files with 567 additions and 402 deletions

View file

@ -1,6 +1,6 @@
{ {
"name": "eli-vue", "name": "eli-vue",
"version": "0.1.98", "version": "0.1.102",
"private": false, "private": false,
"main": "./dist/eli-vue.umd.js", "main": "./dist/eli-vue.umd.js",
"module": "./dist/eli-vue.es.js", "module": "./dist/eli-vue.es.js",

View file

@ -0,0 +1,419 @@
import { respostaComuns, type tipoResposta } from "p-respostas"
import type { tipoFiltro } from "@/componentes/EliTabela/types-eli-tabela"
export type Linha = {
codigo: string
empreendedor: string
empreendimento: string
documento: string
email: string
telefone: string
faturamento: number
peso_kg: number
criado_em: string
atualizado_em: string
}
// == SIMULAÇÃO DE API (CRUD) ==
// Dados isolados (simulando um banco de dados no servidor)
const _bancoDeDados: Linha[] = [
{
codigo: String(Math.random()),
empreendedor: "Maria Silva",
empreendimento: "Doces da Maria",
documento: "12.345.678/0001-90",
email:
"contato.comercial.super.longo@doces-da-maria-exemplo-muito-grande.com.br",
telefone: "(11) 91234-5678",
faturamento: 12500.5,
peso_kg: 12.4,
criado_em: "2026-01-09T16:15:00Z",
atualizado_em: "2026-01-29T15:30:00-03:00",
},
{
codigo: String(Math.random()),
empreendedor: "João Pereira",
empreendimento: "Café Peregrino",
documento: "98.765.432/0001-12",
email: "contato@cafeperegrino.com",
telefone: "(11) 93456-7810",
faturamento: 8000,
peso_kg: 6.2,
criado_em: "2026-01-02T10:00:00-03:00",
atualizado_em: "2026-01-20T08:10:00-03:00",
},
{
codigo: String(Math.random()),
empreendedor: "Ana Costa",
empreendimento: "Flor de Sal Gastronomia",
documento: "45.678.912/0001-55",
email: "ana@flordesal.com",
telefone: "(21) 99876-5432",
faturamento: 3200.75,
peso_kg: 4.8,
criado_em: "2025-12-10T09:30:00-03:00",
atualizado_em: "2026-01-15T19:20:00-03:00",
},
{
codigo: String(Math.random()),
empreendedor: "Rafael Lima",
empreendimento: "Tech Agro Solutions",
documento: "07.654.321/0001-00",
email: "rafael@techagro.com",
telefone: "(31) 94567-8899",
faturamento: 15999.9,
peso_kg: 9.1,
criado_em: "2026-01-12T12:00:00-03:00",
atualizado_em: "2026-01-28T11:00:00-03:00",
},
{
codigo: String(Math.random()),
empreendedor: "Juliana Torres",
empreendimento: "Torres Moda Sustentável",
documento: "33.210.987/0001-44",
email: "juliana@torresmoda.com",
telefone: "(71) 97766-5544",
faturamento: 4500,
peso_kg: 3.3,
criado_em: "2026-01-01T00:00:00Z",
atualizado_em: "2026-01-10T13:45:00-03:00",
},
{
codigo: String(Math.random()),
empreendedor: "Marcos Vieira",
empreendimento: "Padaria Pão Quentinho",
documento: "21.109.876/0001-32",
email: "marcos@paoquentinho.com",
telefone: "(48) 99654-3210",
faturamento: 2200.4,
peso_kg: 15.7,
criado_em: "2026-01-05T07:25:00-03:00",
atualizado_em: "2026-01-23T20:15:00-03:00",
},
{
codigo: String(Math.random()),
empreendedor: "Bianca Rocha",
empreendimento: "Studio Beleza em Casa",
documento: "54.321.098/0001-21",
email: "contato@belezaemcasa.com",
telefone: "(85) 98877-1122",
faturamento: 990,
peso_kg: 1.9,
criado_em: "2026-01-03T14:00:00-03:00",
atualizado_em: "2026-01-29T09:00:00-03:00",
},
{
codigo: String(Math.random()),
empreendedor: "Caio Albuquerque",
empreendimento: "Albuquerque Engenharia Verde",
documento: "65.432.109/0001-09",
email: "caio@engenhariaverde.com",
telefone: "(61) 98123-4567",
faturamento: 100000,
peso_kg: 21.3,
criado_em: "2025-11-18T16:10:00-03:00",
atualizado_em: "2026-01-25T10:40:00-03:00",
},
{
codigo: String(Math.random()),
empreendedor: "Fernanda Almeida",
empreendimento: "Faz Bem Produtos Naturais",
documento: "87.654.210/0001-98",
email: "fernanda@fazbem.com",
telefone: "(41) 99777-6655",
faturamento: 5600.2,
peso_kg: 8.6,
criado_em: "2026-01-08T12:12:00-03:00",
atualizado_em: "2026-01-21T17:55:00-03:00",
},
{
codigo: String(Math.random()),
empreendedor: "Gabriel Martins",
empreendimento: "Martins Tech Repair",
documento: "19.876.543/0001-76",
email: "suporte@martinstech.com",
telefone: "(19) 98888-9090",
faturamento: 7550,
peso_kg: 7.7,
criado_em: "2026-01-11T11:00:00-03:00",
atualizado_em: "2026-01-18T11:30:00-03:00",
},
{
codigo: String(Math.random()),
empreendedor: "Helena Duarte",
empreendimento: "Ateliê Costura Criativa",
documento: "23.456.789/0001-65",
email: "helena@costuracriativa.com",
telefone: "(51) 98765-4433",
faturamento: 2700,
peso_kg: 2.5,
criado_em: "2026-01-07T08:00:00-03:00",
atualizado_em: "2026-01-16T14:10:00-03:00",
},
{
codigo: String(Math.random()),
empreendedor: "Igor Santos",
empreendimento: "Santos Consultoria Financeira",
documento: "43.219.876/0001-54",
email: "igor@santosconsultoria.com",
telefone: "(31) 99332-1100",
faturamento: 12000,
peso_kg: 5.4,
criado_em: "2026-01-06T10:30:00-03:00",
atualizado_em: "2026-01-22T18:30:00-03:00",
},
{
codigo: String(Math.random()),
empreendedor: "Jéssica Nunes",
empreendimento: "Nunes Eventos & Decoração",
documento: "09.876.543/0001-33",
email: "jessica@nunesdecora.com",
telefone: "(62) 99922-3344",
faturamento: 3300.1,
peso_kg: 4.1,
criado_em: "2026-01-04T13:30:00-03:00",
atualizado_em: "2026-01-26T09:20:00-03:00",
},
{
codigo: String(Math.random()),
empreendedor: "Leonardo Prado",
empreendimento: "Prado Bike Courier",
documento: "72.345.098/0001-27",
email: "contato@pradobike.com",
telefone: "(47) 98444-6677",
faturamento: 4100,
peso_kg: 6.8,
criado_em: "2026-01-02T18:40:00-03:00",
atualizado_em: "2026-01-27T12:00:00-03:00",
},
{
codigo: String(Math.random()),
empreendedor: "Marina Lopes",
empreendimento: "Lopes Design Digital",
documento: "56.789.012/0001-11",
email: "marina@lopesdesign.com",
telefone: "(27) 99911-2233",
faturamento: 2100,
peso_kg: 3.7,
criado_em: "2026-01-09T09:00:00-03:00",
atualizado_em: "2026-01-19T15:35:00-03:00",
},
{
codigo: String(Math.random()),
empreendedor: "Nicolas Teixeira",
empreendimento: "QualiVida Fitness",
documento: "34.567.890/0001-02",
email: "nicolas@qualivida.com",
telefone: "(92) 99456-7788",
faturamento: 8600.9,
peso_kg: 11.2,
criado_em: "2026-01-12T19:15:00-03:00",
atualizado_em: "2026-01-29T10:50:00-03:00",
},
{
codigo: String(Math.random()),
empreendedor: "Olívia Azevedo",
empreendimento: "Azevedo Pet Care",
documento: "88.901.234/0001-45",
email: "olivia@petcare.com",
telefone: "(16) 99788-6655",
faturamento: 1900.3,
peso_kg: 2.2,
criado_em: "2026-01-10T15:00:00-03:00",
atualizado_em: "2026-01-14T16:00:00-03:00",
},
{
codigo: String(Math.random()),
empreendedor: "Paulo Henrique",
empreendimento: "Henrique Soluções Elétricas",
documento: "44.556.778/0001-90",
email: "paulo@solucoeseletricas.com",
telefone: "(13) 98810-2020",
faturamento: 50000,
peso_kg: 17.9,
criado_em: "2026-01-13T10:10:00-03:00",
atualizado_em: "2026-01-24T21:00:00-03:00",
},
{
codigo: String(Math.random()),
empreendedor: "Renata Souza",
empreendimento: "Souza Traduções Especializadas",
documento: "11.223.344/0001-08",
email: "renata@souzatraducoes.com",
telefone: "(24) 99661-7788",
faturamento: 6400,
peso_kg: 9.9,
criado_em: "2026-01-08T07:00:00-03:00",
atualizado_em: "2026-01-28T09:05:00-03:00",
},
{
codigo: String(Math.random()),
empreendedor: "Tiago Moura",
empreendimento: "Moura Agro Sustentável",
documento: "78.912.345/0001-67",
email: "tiago@mouraagro.com",
telefone: "(68) 99999-4545",
faturamento: 7200,
peso_kg: 13.5,
criado_em: "2026-01-03T12:00:00-03:00",
atualizado_em: "2026-01-23T12:45:00-03:00",
},
{
codigo: String(Math.random()),
empreendedor: "Viviane Castro",
empreendimento: "Castro Arte & Cerâmica",
documento: "32.165.498/0001-87",
email: "viviane@castroarte.com",
telefone: "(81) 98787-1212",
faturamento: 2800,
peso_kg: 4.6,
criado_em: "2026-01-01T09:00:00-03:00",
atualizado_em: "2026-01-17T09:30:00-03:00",
},
]
// Helpers internos da API (não expostos)
const _filtrarPorBusca = (lista: Linha[], texto?: string) => {
const termo = texto?.trim().toLowerCase()
if (!termo) return [...lista]
return lista.filter((linha) =>
[linha.empreendedor, linha.empreendimento].some((v) =>
v.toLowerCase().includes(termo),
),
)
}
// biome-ignore lint/suspicious/noExplicitAny: playground
const _comparar = (op: string, valLine: any, valFiltro: any): boolean => {
switch (op) {
case "=":
return valLine == valFiltro
case "!=":
return valLine != valFiltro
case ">":
return Number(valLine) > Number(valFiltro)
case ">=":
return Number(valLine) >= Number(valFiltro)
case "<":
return Number(valLine) < Number(valFiltro)
case "<=":
return Number(valLine) <= Number(valFiltro)
case "like":
return String(valLine ?? "")
.toLowerCase()
.includes(String(valFiltro ?? "").toLowerCase())
case "in": {
const arr = Array.isArray(valFiltro)
? valFiltro
: String(valFiltro ?? "")
.split(",")
.map((s) => s.trim())
.filter(Boolean)
return arr.includes(String(valLine))
}
case "isNull":
return valLine === null || valLine === undefined || valLine === ""
default:
return true
}
}
const _filtrarAvancado = (lista: Linha[], filtros?: tipoFiltro[]) => {
if (!filtros?.length) return [...lista]
// biome-ignore lint/suspicious/noExplicitAny: playground
return lista.filter((linha: any) =>
filtros.every((f) =>
_comparar(String(f.operador), linha?.[String(f.coluna)], f.valor),
),
)
}
const _ordenar = (
lista: Linha[],
p?: { coluna_ordem?: keyof Linha; direcao_ordem?: "asc" | "desc" },
) => {
if (!p?.coluna_ordem) return [...lista]
const dir = p.direcao_ordem === "desc" ? -1 : 1
const key = p.coluna_ordem
return [...lista].sort((a, b) => {
const va = String(a[key] ?? "")
const vb = String(b[key] ?? "")
return dir * va.localeCompare(vb, "pt-BR", { sensitivity: "base" })
})
}
const delay = (ms: number) =>
new Promise((r) => setTimeout(r, ms * Math.random() + 2000))
// -- API PÚBLICA SIMULADA --
// biome-ignore lint/suspicious/noExplicitAny: playground
export async function api_ler(params: any) {
await delay(600) // simula latência de rede
// 1. Filtro
let resultado = params.texto_busca
? _filtrarPorBusca(_bancoDeDados, params.texto_busca)
: _filtrarAvancado(_bancoDeDados, params.filtros)
// 2. Ordenação
resultado = _ordenar(resultado, params)
// 3. Paginação
const limit = Math.max(1, Number(params.limit ?? 10))
const offset = Math.max(0, Number(params.offSet ?? 0))
const paginado = resultado.slice(offset, offset + limit)
return {
total: resultado.length,
dados: paginado,
}
}
export async function api_criar(
dados: Partial<Linha>,
): Promise<tipoResposta<Linha>> {
await delay(1500) // simula tempo de salvar
if (!dados.empreendedor) {
return respostaComuns.erro("Empreendedor é obrigatório")
}
const novo: Linha = {
codigo: Math.random().toString(),
empreendedor: dados.empreendedor || "Novo",
empreendimento: dados.empreendimento || "Novo Emp",
documento: dados.documento || "00.000.000/0000-00",
email: dados.email || "novo@email.com",
telefone: dados.telefone || "(00) 0000-0000",
faturamento: dados.faturamento || 0,
peso_kg: dados.peso_kg || 0,
criado_em: new Date().toISOString(),
atualizado_em: new Date().toISOString(),
}
_bancoDeDados.unshift(novo)
return respostaComuns.valor(novo)
}
export async function api_editar(
codigo: string,
novosDados: Partial<Linha>,
): Promise<tipoResposta<Linha>> {
await delay(1000)
const idx = _bancoDeDados.find((l) => l.codigo === codigo)
if (!idx) return respostaComuns.erro("Registro não encontrado")
Object.assign(idx, novosDados)
return respostaComuns.valor(idx)
}
export async function api_deletar(
codigo: string,
): Promise<tipoResposta<string>> {
await delay(800)
const idx = _bancoDeDados.findIndex((l) => l.codigo === codigo)
if (idx !== -1) {
_bancoDeDados.splice(idx, 1)
return respostaComuns.valor("Registro deletado com sucesso")
}
return respostaComuns.erro("Registro não encontrado")
}

View file

@ -8,6 +8,56 @@
<EliTabela :tabela="tabelaVazia" /> <EliTabela :tabela="tabelaVazia" />
<EliTabela :tabela="tabelaErro" /> <EliTabela :tabela="tabelaErro" />
<!-- Modal de simulação de cadastro -->
<v-dialog v-model="mostrarModalCadastro" max-width="500px">
<v-card>
<v-card-title>Novo Cadastro</v-card-title>
<v-card-text>
<v-alert
v-if="erroCadastro"
type="error"
variant="tonal"
density="compact"
class="mb-4"
>
{{ erroCadastro }}
</v-alert>
<v-text-field
v-model="novoCadastro.empreendedor"
label="Empreendedor"
variant="outlined"
density="compact"
class="mb-2"
></v-text-field>
<v-text-field
v-model="novoCadastro.empreendimento"
label="Empreendimento"
variant="outlined"
density="compact"
></v-text-field>
</v-card-text>
<v-card-actions>
<v-spacer></v-spacer>
<v-btn
color="grey-darken-1"
variant="text"
@click="mostrarModalCadastro = false"
:disabled="salvando"
>
Cancelar
</v-btn>
<v-btn
color="primary"
variant="elevated"
@click="salvarNovoCadastro"
:loading="salvando"
>
Salvar
</v-btn>
</v-card-actions>
</v-card>
</v-dialog>
</section> </section>
</template> </template>
@ -18,19 +68,8 @@ import { defineComponent, ref } from "vue"
import type { ComponenteEntrada } from "@/componentes/EliEntrada/tiposEntradas" import type { ComponenteEntrada } from "@/componentes/EliEntrada/tiposEntradas"
import type { tipoEliTabelaConsulta } from "@/componentes/EliTabela" import type { tipoEliTabelaConsulta } from "@/componentes/EliTabela"
import { celulaTabela, EliTabela } from "@/componentes/EliTabela" import { celulaTabela, EliTabela } from "@/componentes/EliTabela"
import type { tipoFiltro } from "@/componentes/EliTabela/types-eli-tabela"
type Linha = { import { api_criar, api_deletar, api_ler, type Linha } from "./api_simulador"
empreendedor: string
empreendimento: string
documento: string
email: string
telefone: string
faturamento: number
peso_kg: number
criado_em: string
atualizado_em: string
}
export default defineComponent({ export default defineComponent({
name: "TabelaPlayground", name: "TabelaPlayground",
@ -50,377 +89,89 @@ export default defineComponent({
cor: "#dc2626", cor: "#dc2626",
rotulo: "Remover", rotulo: "Remover",
acao: (linha) => { acao: (linha) => {
console.log("Remover cadastro de", linha.empreendedor) removerCadastro(linha)
}, },
exibir: (linha) => !linha.empreendimento.toLowerCase().includes("café"), exibir: (linha) => !linha.empreendimento.toLowerCase().includes("café"),
}, },
] ]
const linhasPadrao = ref<Linha[]>([
{
empreendedor: "Maria Silva",
empreendimento: "Doces da Maria",
documento: "12.345.678/0001-90",
email:
"contato.comercial.super.longo@doces-da-maria-exemplo-muito-grande.com.br",
telefone: "(11) 91234-5678",
faturamento: 12500.5,
peso_kg: 12.4,
criado_em: "2026-01-09T16:15:00Z",
atualizado_em: "2026-01-29T15:30:00-03:00",
},
{
empreendedor: "João Pereira",
empreendimento: "Café Peregrino",
documento: "98.765.432/0001-12",
email: "contato@cafeperegrino.com",
telefone: "(11) 93456-7810",
faturamento: 8000,
peso_kg: 6.2,
criado_em: "2026-01-02T10:00:00-03:00",
atualizado_em: "2026-01-20T08:10:00-03:00",
},
{
empreendedor: "Ana Costa",
empreendimento: "Flor de Sal Gastronomia",
documento: "45.678.912/0001-55",
email: "ana@flordesal.com",
telefone: "(21) 99876-5432",
faturamento: 3200.75,
peso_kg: 4.8,
criado_em: "2025-12-10T09:30:00-03:00",
atualizado_em: "2026-01-15T19:20:00-03:00",
},
{
empreendedor: "Rafael Lima",
empreendimento: "Tech Agro Solutions",
documento: "07.654.321/0001-00",
email: "rafael@techagro.com",
telefone: "(31) 94567-8899",
faturamento: 15999.9,
peso_kg: 9.1,
criado_em: "2026-01-12T12:00:00-03:00",
atualizado_em: "2026-01-28T11:00:00-03:00",
},
{
empreendedor: "Juliana Torres",
empreendimento: "Torres Moda Sustentável",
documento: "33.210.987/0001-44",
email: "juliana@torresmoda.com",
telefone: "(71) 97766-5544",
faturamento: 4500,
peso_kg: 3.3,
criado_em: "2026-01-01T00:00:00Z",
atualizado_em: "2026-01-10T13:45:00-03:00",
},
{
empreendedor: "Marcos Vieira",
empreendimento: "Padaria Pão Quentinho",
documento: "21.109.876/0001-32",
email: "marcos@paoquentinho.com",
telefone: "(48) 99654-3210",
faturamento: 2200.4,
peso_kg: 15.7,
criado_em: "2026-01-05T07:25:00-03:00",
atualizado_em: "2026-01-23T20:15:00-03:00",
},
{
empreendedor: "Bianca Rocha",
empreendimento: "Studio Beleza em Casa",
documento: "54.321.098/0001-21",
email: "contato@belezaemcasa.com",
telefone: "(85) 98877-1122",
faturamento: 990,
peso_kg: 1.9,
criado_em: "2026-01-03T14:00:00-03:00",
atualizado_em: "2026-01-29T09:00:00-03:00",
},
{
empreendedor: "Caio Albuquerque",
empreendimento: "Albuquerque Engenharia Verde",
documento: "65.432.109/0001-09",
email: "caio@engenhariaverde.com",
telefone: "(61) 98123-4567",
faturamento: 100000,
peso_kg: 21.3,
criado_em: "2025-11-18T16:10:00-03:00",
atualizado_em: "2026-01-25T10:40:00-03:00",
},
{
empreendedor: "Fernanda Almeida",
empreendimento: "Faz Bem Produtos Naturais",
documento: "87.654.210/0001-98",
email: "fernanda@fazbem.com",
telefone: "(41) 99777-6655",
faturamento: 5600.2,
peso_kg: 8.6,
criado_em: "2026-01-08T12:12:00-03:00",
atualizado_em: "2026-01-21T17:55:00-03:00",
},
{
empreendedor: "Gabriel Martins",
empreendimento: "Martins Tech Repair",
documento: "19.876.543/0001-76",
email: "suporte@martinstech.com",
telefone: "(19) 98888-9090",
faturamento: 7550,
peso_kg: 7.7,
criado_em: "2026-01-11T11:00:00-03:00",
atualizado_em: "2026-01-18T11:30:00-03:00",
},
{
empreendedor: "Helena Duarte",
empreendimento: "Ateliê Costura Criativa",
documento: "23.456.789/0001-65",
email: "helena@costuracriativa.com",
telefone: "(51) 98765-4433",
faturamento: 2700,
peso_kg: 2.5,
criado_em: "2026-01-07T08:00:00-03:00",
atualizado_em: "2026-01-16T14:10:00-03:00",
},
{
empreendedor: "Igor Santos",
empreendimento: "Santos Consultoria Financeira",
documento: "43.219.876/0001-54",
email: "igor@santosconsultoria.com",
telefone: "(31) 99332-1100",
faturamento: 12000,
peso_kg: 5.4,
criado_em: "2026-01-06T10:30:00-03:00",
atualizado_em: "2026-01-22T18:30:00-03:00",
},
{
empreendedor: "Jéssica Nunes",
empreendimento: "Nunes Eventos & Decoração",
documento: "09.876.543/0001-33",
email: "jessica@nunesdecora.com",
telefone: "(62) 99922-3344",
faturamento: 3300.1,
peso_kg: 4.1,
criado_em: "2026-01-04T13:30:00-03:00",
atualizado_em: "2026-01-26T09:20:00-03:00",
},
{
empreendedor: "Leonardo Prado",
empreendimento: "Prado Bike Courier",
documento: "72.345.098/0001-27",
email: "contato@pradobike.com",
telefone: "(47) 98444-6677",
faturamento: 4100,
peso_kg: 6.8,
criado_em: "2026-01-02T18:40:00-03:00",
atualizado_em: "2026-01-27T12:00:00-03:00",
},
{
empreendedor: "Marina Lopes",
empreendimento: "Lopes Design Digital",
documento: "56.789.012/0001-11",
email: "marina@lopesdesign.com",
telefone: "(27) 99911-2233",
faturamento: 2100,
peso_kg: 3.7,
criado_em: "2026-01-09T09:00:00-03:00",
atualizado_em: "2026-01-19T15:35:00-03:00",
},
{
empreendedor: "Nicolas Teixeira",
empreendimento: "QualiVida Fitness",
documento: "34.567.890/0001-02",
email: "nicolas@qualivida.com",
telefone: "(92) 99456-7788",
faturamento: 8600.9,
peso_kg: 11.2,
criado_em: "2026-01-12T19:15:00-03:00",
atualizado_em: "2026-01-29T10:50:00-03:00",
},
{
empreendedor: "Olívia Azevedo",
empreendimento: "Azevedo Pet Care",
documento: "88.901.234/0001-45",
email: "olivia@petcare.com",
telefone: "(16) 99788-6655",
faturamento: 1900.3,
peso_kg: 2.2,
criado_em: "2026-01-10T15:00:00-03:00",
atualizado_em: "2026-01-14T16:00:00-03:00",
},
{
empreendedor: "Paulo Henrique",
empreendimento: "Henrique Soluções Elétricas",
documento: "44.556.778/0001-90",
email: "paulo@solucoeseletricas.com",
telefone: "(13) 98810-2020",
faturamento: 50000,
peso_kg: 17.9,
criado_em: "2026-01-13T10:10:00-03:00",
atualizado_em: "2026-01-24T21:00:00-03:00",
},
{
empreendedor: "Renata Souza",
empreendimento: "Souza Traduções Especializadas",
documento: "11.223.344/0001-08",
email: "renata@souzatraducoes.com",
telefone: "(24) 99661-7788",
faturamento: 6400,
peso_kg: 9.9,
criado_em: "2026-01-08T07:00:00-03:00",
atualizado_em: "2026-01-28T09:05:00-03:00",
},
{
empreendedor: "Tiago Moura",
empreendimento: "Moura Agro Sustentável",
documento: "78.912.345/0001-67",
email: "tiago@mouraagro.com",
telefone: "(68) 99999-4545",
faturamento: 7200,
peso_kg: 13.5,
criado_em: "2026-01-03T12:00:00-03:00",
atualizado_em: "2026-01-23T12:45:00-03:00",
},
{
empreendedor: "Viviane Castro",
empreendimento: "Castro Arte & Cerâmica",
documento: "32.165.498/0001-87",
email: "viviane@castroarte.com",
telefone: "(81) 98787-1212",
faturamento: 2800,
peso_kg: 4.6,
criado_em: "2026-01-01T09:00:00-03:00",
atualizado_em: "2026-01-17T09:30:00-03:00",
},
])
// Incrementamos a chave para forçar o EliTabela a recarregar a consulta.
// (Como o componente não expõe um método público de refresh)
const versaoTabelaOk = ref(0) const versaoTabelaOk = ref(0)
const mostrarModalCadastro = ref(false)
const salvando = ref(false)
const novoCadastro = ref({
empreendedor: "",
empreendimento: "",
documento: "",
email: "",
telefone: "",
faturamento: 0,
peso_kg: 0,
})
const erroCadastro = ref<string | undefined>(undefined)
// Armazena a função de atualização da tabela atual (vinda da ação do cabeçalho)
let atualizarTabelaCallback: (() => Promise<void>) | undefined
// A ação do cabeçalho recebe { atualizarConsulta, editarLista, ... }
// biome-ignore lint/suspicious/noExplicitAny: playground // biome-ignore lint/suspicious/noExplicitAny: playground
function adicionarLinha(params?: any) { function abrirModalCadastro(params?: any) {
if (params) console.log("Adicionar Linha, parametros:", params) if (params?.atualizarConsulta) {
const proximo = linhasPadrao.value.length + 1 atualizarTabelaCallback = params.atualizarConsulta
}
linhasPadrao.value.unshift({ novoCadastro.value = {
empreendedor: `Novo Empreendedor ${proximo}`, empreendedor: "",
empreendimento: `Novo Empreendimento ${proximo}`, empreendimento: "",
documento: "00.000.000/0000-00", documento: "",
email: `novo${proximo}@exemplo.com`, email: "",
telefone: "(00) 90000-0000", telefone: "",
faturamento: 0, faturamento: 0,
peso_kg: 0, peso_kg: 0,
criado_em: new Date().toISOString(),
atualizado_em: new Date().toISOString(),
})
versaoTabelaOk.value++
}
const filtrarPorBusca = (linhas: Linha[], texto?: string) => {
const termo = texto?.trim().toLowerCase()
if (!termo) {
return [...linhas]
} }
erroCadastro.value = undefined
return linhas.filter((linha) => { mostrarModalCadastro.value = true
const campos = [linha.empreendedor, linha.empreendimento]
return campos.some((valor) => valor.toLowerCase().includes(termo))
})
} }
const compararOperador = ( async function salvarNovoCadastro() {
operador: string, salvando.value = true
// biome-ignore lint/suspicious/noExplicitAny: playground erroCadastro.value = undefined
valorLinha: any, try {
// biome-ignore lint/suspicious/noExplicitAny: playground const resposta = await api_criar(novoCadastro.value)
valorFiltro: any, if (resposta.eErro) {
): boolean => { erroCadastro.value = resposta.mensagem
switch (operador) { return
case "=":
return valorLinha == valorFiltro
case "!=":
return valorLinha != valorFiltro
case ">":
return Number(valorLinha) > Number(valorFiltro)
case ">=":
return Number(valorLinha) >= Number(valorFiltro)
case "<":
return Number(valorLinha) < Number(valorFiltro)
case "<=":
return Number(valorLinha) <= Number(valorFiltro)
case "like": {
const a = String(valorLinha ?? "").toLowerCase()
const b = String(valorFiltro ?? "").toLowerCase()
return a.includes(b)
} }
case "in": {
const arr = Array.isArray(valorFiltro) // PADRÃO RECOMENDADO:
? valorFiltro // Se temos o callback de atualização, usamos ele para recarregar os dados na tabela
: String(valorFiltro ?? "") // sem precisar remontar o componente (sem alterar key).
.split(",") if (atualizarTabelaCallback) {
.map((s) => s.trim()) await atualizarTabelaCallback()
.filter(Boolean) } else {
return arr.includes(String(valorLinha)) // Fallback (caso não tenha vindo pela ação da tabela): força re-render
versaoTabelaOk.value++
} }
case "isNull":
return ( mostrarModalCadastro.value = false
valorLinha === null || valorLinha === undefined || valorLinha === "" } catch (e) {
) erroCadastro.value = String(e)
default: } finally {
return true salvando.value = false
} }
} }
const filtrarPorFiltrosAvancados = ( function removerCadastro(linha: Linha) {
linhas: Linha[], // Exemplo de uso do api_deletar
filtros?: tipoFiltro[], // Não temos um ID único confiável além das propriedades, vamos usar empreendedor como chave neste exemplo simples
) => { if (confirm(`Tem certeza que deseja remover ${linha.empreendedor}?`)) {
const lista = [...linhas] api_deletar("empreendedor", linha.empreendedor).then(() => {
if (!filtros?.length) return lista versaoTabelaOk.value++
// biome-ignore lint/suspicious/noExplicitAny: playground
return lista.filter((linha: any) => {
return filtros.every((f) => {
// biome-ignore lint/suspicious/noExplicitAny: playground
const vLinha = linha?.[String((f as any).coluna)]
return compararOperador(
// biome-ignore lint/suspicious/noExplicitAny: playground
String((f as any).operador),
vLinha,
// biome-ignore lint/suspicious/noExplicitAny: playground
(f as any).valor,
)
}) })
}) }
}
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: tipoEliTabelaConsulta<Linha> = { const tabelaOk: tipoEliTabelaConsulta<Linha> = {
nome: "Exemplo", nome: "ExemploPlaygroundData",
registros_por_consulta: 10, registros_por_consulta: 10,
mostrarCaixaDeBusca: true, mostrarCaixaDeBusca: true,
acoesTabela: [ acoesTabela: [
@ -429,18 +180,14 @@ export default defineComponent({
icone: Plus, icone: Plus,
cor: "#16a34a", cor: "#16a34a",
rotulo: "Novo (Superior)", rotulo: "Novo (Superior)",
acao: adicionarLinha, acao: abrirModalCadastro,
}, },
{ {
posicao: "inferior", posicao: "inferior",
icone: Plus, icone: Plus,
cor: "#2563eb", cor: "#2563eb",
rotulo: "Novo (Inferior)", rotulo: "Novo (Inferior)",
// biome-ignore lint/suspicious/noExplicitAny: playground acao: abrirModalCadastro,
acao: (params: any) => {
console.log("Ação inferior clicada com params:", params)
adicionarLinha(params)
},
}, },
], ],
@ -572,45 +319,34 @@ export default defineComponent({
}, },
], ],
consulta: async (parametrosConsulta) => { consulta: async (parametrosConsulta) => {
// Agora a EliTabela envia paginação/ordenação/busca OU filtros avançados para a consulta. try {
// (busca tem prioridade; quando existe texto_busca, filtros não vêm no payload) const resposta = await api_ler(parametrosConsulta)
return {
const limite = Math.max(1, Number(parametrosConsulta?.limit ?? 10)) cod: codigosResposta.sucesso,
const offset = Math.max(0, Number(parametrosConsulta?.offSet ?? 0)) eCerto: true,
eErro: false,
// 1) filtra (busca OU filtro avançado) mensagem: undefined,
const base = [...linhasPadrao.value] valor: {
const filtradas = parametrosConsulta?.texto_busca quantidade: resposta.total,
? filtrarPorBusca(base, parametrosConsulta.texto_busca) valores: resposta.dados,
: filtrarPorFiltrosAvancados( },
base, }
// biome-ignore lint/suspicious/noExplicitAny: playground } catch (error) {
(parametrosConsulta as any)?.filtros, return {
) cod: codigosResposta.erroConhecido,
eCerto: false,
// 2) ordena eErro: true,
const ordenadas = ordenarLinhas(filtradas, parametrosConsulta) mensagem: String(error),
valor: undefined,
// 3) pagina }
const valores = ordenadas.slice(offset, offset + limite)
return {
cod: codigosResposta.sucesso,
eCerto: true,
eErro: false,
mensagem: undefined,
valor: {
quantidade: ordenadas.length,
valores,
},
} }
}, },
} }
const tabelaVazia: tipoEliTabelaConsulta<Linha> = { const tabelaVazia: tipoEliTabelaConsulta<Linha> = {
nome: "Exemplo", nome: "Exemplo Vazio",
registros_por_consulta: tabelaOk.registros_por_consulta, registros_por_consulta: 10,
mostrarCaixaDeBusca: tabelaOk.mostrarCaixaDeBusca, mostrarCaixaDeBusca: true,
colunas: tabelaOk.colunas, colunas: tabelaOk.colunas,
consulta: async (_parametrosConsulta) => { consulta: async (_parametrosConsulta) => {
return { return {
@ -645,7 +381,17 @@ export default defineComponent({
}, },
} }
return { tabelaOk, tabelaVazia, tabelaErro, versaoTabelaOk } return {
tabelaOk,
tabelaVazia,
tabelaErro,
versaoTabelaOk,
mostrarModalCadastro,
salvando,
novoCadastro,
salvarNovoCadastro,
erroCadastro,
}
}, },
}) })
</script> </script>