refactor: remove unused authentication module and related dependencies; update package.json and bun.lock for improved dependency management; enhance access control UI with expanded resource management features

This commit is contained in:
2025-10-30 12:34:14 -03:00
parent 1058375a90
commit 2841a2349d
6 changed files with 101 additions and 1138 deletions

View File

@@ -28,7 +28,9 @@
);
let busca = $state("");
let filtroRole = $state("");
let expandido: Record<string, boolean> = $state({});
// Controla quais recursos estão expandidos (mostrando as ações) por perfil
// Formato: { "roleId-recurso": true/false }
let recursosExpandidos: Record<string, boolean> = $state({});
// Cache de permissões por role
let permissoesPorRole: Record<
@@ -45,6 +47,16 @@
permissoesPorRole[roleId] = dados;
}
function toggleRecurso(roleId: Id<"roles">, recurso: string) {
const key = `${roleId}-${recurso}`;
recursosExpandidos[key] = !recursosExpandidos[key];
}
function isRecursoExpandido(roleId: Id<"roles">, recurso: string) {
const key = `${roleId}-${recurso}`;
return recursosExpandidos[key] ?? false;
}
function mostrarMensagem(tipo: "success" | "error", texto: string) {
mensagem = { tipo, texto };
setTimeout(() => {
@@ -68,6 +80,17 @@
return rs;
});
// Carregar permissões para todos os perfis filtrados quando necessário
$effect(() => {
if (rolesFiltradas && catalogoQuery.data) {
for (const roleRow of rolesFiltradas) {
if (roleRow.nivel > 1) {
carregarPermissoesRole(roleRow._id);
}
}
}
});
async function toggleAcao(
roleId: Id<"roles">,
recurso: string,
@@ -420,6 +443,7 @@
{/if}
{#each rolesFiltradas as roleRow}
{@const roleId = roleRow._id}
<div class="card bg-base-100 shadow-xl mb-6">
<div class="card-body">
<div class="flex items-center justify-between mb-4 flex-wrap gap-4">
@@ -455,19 +479,6 @@
>
</p>
</div>
{#if roleRow.nivel > 1}
<button
class="btn btn-sm btn-outline"
onclick={async () => {
expandido[roleRow._id] = !expandido[roleRow._id];
if (expandido[roleRow._id])
await carregarPermissoesRole(roleRow._id);
}}
>
{expandido[roleRow._id] ? "Recolher" : "Expandir"}
</button>
{/if}
</div>
{#if roleRow.nivel <= 1}
@@ -493,48 +504,70 @@
</div>
</div>
</div>
{:else if expandido[roleRow._id]}
<div class="overflow-x-auto">
<table class="table table-zebra table-sm">
<thead class="bg-base-200">
<tr>
<th class="w-1/3">Recurso</th>
<th class="text-center">Ver</th>
<th class="text-center">Listar</th>
<th class="text-center">Criar</th>
<th class="text-center">Editar</th>
<th class="text-center">Excluir</th>
</tr>
</thead>
<tbody>
{#each catalogoQuery.data as item}
<tr class="hover">
<td>
<div class="flex flex-col">
<span class="font-semibold">{item.recurso}</span>
</div>
</td>
{#each ["ver", "listar", "criar", "editar", "excluir"] as ac}
<td class="text-center">
<input
type="checkbox"
class="checkbox checkbox-primary"
checked={isConcedida(roleRow._id, item.recurso, ac)}
disabled={salvando}
onchange={(e) =>
toggleAcao(
roleRow._id,
item.recurso,
ac,
e.currentTarget.checked
)}
/>
</td>
{/each}
</tr>
{/each}
</tbody>
</table>
{:else if catalogoQuery.data}
<div class="space-y-2">
{#each catalogoQuery.data as item}
{@const recursoExpandido = isRecursoExpandido(
roleId,
item.recurso
)}
<div class="border border-base-300 rounded-lg overflow-hidden">
<!-- Cabeçalho do recurso (clicável) -->
<button
type="button"
class="w-full px-4 py-3 bg-base-200 hover:bg-base-300 transition-colors flex items-center justify-between"
onclick={() => toggleRecurso(roleId, item.recurso)}
disabled={salvando}
>
<span class="font-semibold text-lg">{item.recurso}</span>
<svg
xmlns="http://www.w3.org/2000/svg"
class="h-5 w-5 transition-transform"
class:rotate-180={recursoExpandido}
fill="none"
viewBox="0 0 24 24"
stroke="currentColor"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
d="M19 9l-7 7-7-7"
/>
</svg>
</button>
<!-- Lista de ações (visível quando expandido) -->
{#if recursoExpandido}
<div class="px-4 py-3 bg-base-100 border-t border-base-300">
<div class="space-y-2">
{#each ["ver", "listar", "criar", "editar", "excluir"] as acao}
<label
class="flex items-center gap-3 cursor-pointer hover:bg-base-200 p-2 rounded transition-colors"
>
<input
type="checkbox"
class="checkbox checkbox-primary"
checked={isConcedida(roleId, item.recurso, acao)}
disabled={salvando}
onchange={(e) =>
toggleAcao(
roleId,
item.recurso,
acao,
e.currentTarget.checked
)}
/>
<span class="flex-1 capitalize font-medium"
>{acao}</span
>
</label>
{/each}
</div>
</div>
{/if}
</div>
{/each}
</div>
{/if}
</div>