feat: ajusta colunas, alinhamento e densidade da tabela de clientes

This commit is contained in:
Gustavo
2026-08-20 13:35:05 -03:00
parent 9b7210d41c
commit 48d17d15b5
3 changed files with 56 additions and 14 deletions
+25
View File
@@ -271,6 +271,31 @@ a.botao:hover { border-color: var(--cor-acento); color: var(--cor-acento); }
.botao-toggle-log:hover { border-color: var(--cor-acento); color: var(--cor-acento); }
.secao-log-conteudo { padding-top: 4px; }
.table-clientes { table-layout: fixed; }
.table-clientes th.col-codigo, .table-clientes td.col-codigo,
.table-clientes th.col-cnpj, .table-clientes td.col-cnpj,
.table-clientes th.col-status, .table-clientes td.col-status {
text-align: center;
}
.table-clientes th.col-acoes, .table-clientes td.col-acoes { text-align: right; }
.table-clientes td.col-codigo, .table-clientes td.col-cnpj {
font-variant-numeric: tabular-nums;
}
.table-clientes td.col-cnpj { white-space: nowrap; }
.table-clientes col.col-codigo { width: 90px; }
.table-clientes col.col-razao, .table-clientes col.col-fantasia { width: 27%; }
.table-clientes col.col-cnpj { width: 160px; }
.table-clientes col.col-status { width: 70px; }
.table-clientes col.col-acoes { width: 230px; }
.table-clientes th, .table-clientes td { padding: 7px 14px; }
.botao.botao-tabela { margin-top: 0; padding: 7px 12px; font-size: 0.875rem; vertical-align: middle; }
.table-clientes td.col-acoes { white-space: nowrap; }
@media (prefers-reduced-motion: reduce) {
*, *::before, *::after { transition: none !important; }
}
+22 -14
View File
@@ -26,27 +26,35 @@
{% set busca_qs = ('&busca=' + (busca | urlencode)) if busca else '' %}
{% set qs_base = ('&ordenar_por=' + ordenar_por + '&direcao=' + direcao + '&por_pagina=' + (por_pagina | string) + '&status=' + status + busca_qs) | safe %}
<div class="tabela-wrap">
<table>
<table class="table-clientes">
<colgroup>
<col class="col-codigo">
<col class="col-razao">
<col class="col-fantasia">
<col class="col-cnpj">
<col class="col-status">
<col class="col-acoes">
</colgroup>
<tr>
{% set colunas_tabela = [("codigo", "Código"), ("razao", "Razão"), ("fantasia", "Fantasia"), ("cnpj", "CNPJ")] %}
{% for campo, rotulo in colunas_tabela %}
{% set colunas_tabela = [("codigo", "Código", "col-codigo"), ("razao", "Razão", "col-razao"), ("fantasia", "Fantasia", "col-fantasia"), ("cnpj", "CNPJ", "col-cnpj")] %}
{% for campo, rotulo, classe_coluna in colunas_tabela %}
{% set nova_direcao = "desc" if (ordenar_por == campo and direcao == "asc") else "asc" %}
<th>
<th class="{{ classe_coluna }}">
<a href="/clientes?ordenar_por={{ campo }}&direcao={{ nova_direcao }}&pagina=1&por_pagina={{ por_pagina }}&status={{ status }}{{ busca_qs }}">
{{ rotulo }}{% if ordenar_por == campo %}{{ " ▲" if direcao == "asc" else " ▼" }}{% endif %}
</a>
</th>
{% endfor %}
<th>Status</th>
<th></th>
<th class="col-status">Status</th>
<th class="col-acoes"></th>
</tr>
{% for c in clientes %}
<tr>
<td>{{ c.CODIGO }}</td>
<td>{{ c.RAZAO }}</td>
<td>{{ c.FANTASIA }}</td>
<td>{{ c.CNPJ }}</td>
<td>
<td class="col-codigo">{{ c.CODIGO }}</td>
<td class="col-razao">{{ c.RAZAO }}</td>
<td class="col-fantasia">{{ c.FANTASIA }}</td>
<td class="col-cnpj">{{ c.CNPJ }}</td>
<td class="col-status">
<form method="post" action="/clientes/{{ c.ID }}/alternar-ativo" style="display:inline">
<input type="hidden" name="csrf_token" value="{{ csrf_token }}">
<input type="hidden" name="redirecionar_para" value="{{ redirecionar_para }}">
@@ -60,9 +68,9 @@
</button>
</form>
</td>
<td>
<a class="botao" href="/clientes/{{ c.ID }}">Abrir</a>
<button type="button" class="botao botao-gerar-chave" data-codigo="{{ c.CODIGO }}" onclick="gerarChaveReativacao(this)">Gerar chave</button>
<td class="col-acoes">
<a class="botao botao-tabela" href="/clientes/{{ c.ID }}">Abrir</a>
<button type="button" class="botao botao-tabela botao-gerar-chave" data-codigo="{{ c.CODIGO }}" onclick="gerarChaveReativacao(this)">Gerar chave</button>
<span class="chave-feedback" aria-live="polite"></span>
</td>
</tr>