refactor: clean up Svelte components and improve code readability

- Refactored multiple Svelte components to enhance code clarity and maintainability.
- Standardized formatting and indentation across various files for consistency.
- Improved error handling messages in the AprovarAusencias component for better user feedback.
- Updated class names in the UI components to align with the new design system.
- Removed unnecessary whitespace and comments to streamline the codebase.
This commit is contained in:
2025-11-08 10:11:40 -03:00
parent 28107b4050
commit 01138b3e1c
24 changed files with 4655 additions and 1927 deletions

View File

@@ -25,7 +25,7 @@
let salvando = $state(false);
let mensagem = $state<{ tipo: "success" | "error"; texto: string } | null>(
null
null,
);
let busca = $state("");
let filtroRole = $state("");
@@ -51,7 +51,7 @@
if (permissoesPorRole[roleId]) return;
const dados = await client.query(
api.permissoesAcoes.listarPermissoesAcoesPorRole,
{ roleId }
{ roleId },
);
permissoesPorRole[roleId] = dados;
}
@@ -76,14 +76,13 @@
const rolesFiltradas = $derived.by(() => {
if (!rolesQuery.data) return [];
let rs = rolesQuery.data; // Removed explicit type annotation
if (filtroRole)
rs = rs.filter((r) => r._id === (filtroRole)); // Removed as any
if (filtroRole) rs = rs.filter((r) => r._id === filtroRole); // Removed as any
if (busca.trim()) {
const b = busca.toLowerCase();
rs = rs.filter(
(r) =>
r.descricao.toLowerCase().includes(b) ||
r.nome.toLowerCase().includes(b)
r.nome.toLowerCase().includes(b),
);
}
return rs;
@@ -104,7 +103,7 @@
roleId: Id<"roles">,
recurso: string,
acao: string,
conceder: boolean
conceder: boolean,
) {
try {
salvando = true;
@@ -129,8 +128,10 @@
];
}
mostrarMensagem("success", "Permissão atualizada com sucesso!");
} catch (error: unknown) { // Changed to unknown
const message = error instanceof Error ? error.message : "Erro ao atualizar permissão";
} catch (error: unknown) {
// Changed to unknown
const message =
error instanceof Error ? error.message : "Erro ao atualizar permissão";
mostrarMensagem("error", message);
} finally {
salvando = false;
@@ -182,7 +183,8 @@
descricaoNovoPerfil = "";
nivelNovoPerfil = 3;
fecharModalGerenciarPerfis();
if (rolesQuery.refetch) { // Verificação para garantir que refetch existe
if (rolesQuery.refetch) {
// Verificação para garantir que refetch existe
rolesQuery.refetch(); // Atualiza a lista de perfis
}
} else {
@@ -212,7 +214,8 @@
if (result.sucesso) {
mostrarMensagem("success", "Perfil atualizado com sucesso!");
fecharModalGerenciarPerfis();
if (rolesQuery.refetch) { // Verificação para garantir que refetch existe
if (rolesQuery.refetch) {
// Verificação para garantir que refetch existe
rolesQuery.refetch(); // Atualiza a lista de perfis
}
} else {
@@ -225,7 +228,6 @@
processando = false;
}
}
</script>
<ProtectedRoute allowedRoles={["ti_master", "admin"]} maxLevel={1}>
@@ -285,10 +287,7 @@
Configure as permissões de acesso aos menus do sistema por função
</p>
</div>
<button
class="btn btn-primary gap-2"
onclick={abrirModalCriarPerfil}
>
<button class="btn btn-primary gap-2" onclick={abrirModalCriarPerfil}>
<svg
xmlns="http://www.w3.org/2000/svg"
class="h-5 w-5"
@@ -632,7 +631,7 @@
{#each catalogoQuery.data as item}
{@const recursoExpandido = isRecursoExpandido(
roleId,
item.recurso
item.recurso,
)}
<div class="border border-base-300 rounded-lg overflow-hidden">
<!-- Cabeçalho do recurso (clicável) -->
@@ -678,7 +677,7 @@
roleId,
item.recurso,
acao,
e.currentTarget.checked
e.currentTarget.checked,
)}
/>
<span class="flex-1 capitalize font-medium"
@@ -701,143 +700,149 @@
<!-- Modal Gerenciar Perfis -->
{#if modalGerenciarPerfisAberto}
<dialog class="modal modal-open">
<div
class="modal-box max-w-4xl w-full overflow-hidden border border-base-200/60 bg-base-200/40 p-0 shadow-2xl"
>
<div
class="relative bg-gradient-to-r from-primary via-primary/90 to-secondary/80 px-8 py-6 text-base-100"
class="modal-box max-w-4xl w-full overflow-hidden border border-base-200/60 bg-base-200/40 p-0 shadow-2xl"
>
<button
type="button"
class="btn btn-sm btn-circle btn-ghost absolute right-4 top-4 text-base-100/80 hover:text-base-100"
onclick={fecharModalGerenciarPerfis}
aria-label="Fechar modal"
>
</button>
<h3 class="text-3xl font-black tracking-tight">Gerenciar Perfis de Acesso</h3>
<p class="mt-2 max-w-2xl text-sm text-base-100/80 md:text-base">
{perfilSendoEditado
? "Atualize as informações do perfil selecionado para manter a governança de acesso alinhada com as diretrizes do sistema."
: "Crie um novo perfil de acesso definindo nome, descrição e nível hierárquico conforme os padrões adotados pela Secretaria."}
</p>
</div>
<div class="bg-base-100 px-8 py-6">
<section
class="space-y-6 rounded-2xl border border-base-200/60 bg-base-100 p-6 shadow-sm"
>
<div
class="flex flex-col gap-3 sm:flex-row sm:items-start sm:justify-between"
>
<div class="space-y-1">
<h4 class="text-xl font-semibold text-base-content">
{perfilSendoEditado ? "Editar Perfil" : "Criar Novo Perfil"}
</h4>
<p class="text-sm text-base-content/70">
{perfilSendoEditado
? "Os campos bloqueados indicam atributos padronizados do sistema. Ajuste apenas o que estiver disponível."
: "Preencha as informações com atenção para garantir que o novo perfil siga o padrão institucional."}
</p>
</div>
{#if perfilSendoEditado}
<span
class="badge badge-outline badge-primary badge-lg self-start flex flex-col items-center gap-1 px-5 py-3 text-center"
>
<span class="text-[11px] font-semibold uppercase tracking-[0.32em] text-primary">
Nível atual
</span>
<span class="text-2xl font-bold leading-none text-primary">
{perfilSendoEditado.nivel}
</span>
</span>
{/if}
</div>
<div class="grid gap-6 md:grid-cols-2">
<div class="form-control md:col-span-2">
<label class="label" for="nome-perfil-input">
<span class="label-text">Nome do Perfil *</span>
</label>
<input
id="nome-perfil-input"
type="text"
bind:value={nomeNovoPerfil}
class="input input-bordered input-primary"
placeholder="Ex: RH, Financeiro, Gestor"
disabled={perfilSendoEditado !== null && !perfilSendoEditado.customizado}
/>
</div>
<div class="form-control md:col-span-2">
<label class="label" for="descricao-perfil-input">
<span class="label-text">Descrição</span>
</label>
<textarea
id="descricao-perfil-input"
bind:value={descricaoNovoPerfil}
class="textarea textarea-bordered textarea-primary min-h-[120px]"
placeholder="Breve descrição das responsabilidades e limites de atuação deste perfil."
></textarea>
</div>
<div class="form-control max-w-xs">
<label class="label" for="nivel-perfil-input">
<span class="label-text">Nível de Acesso (0-5) *</span>
</label>
<input
id="nivel-perfil-input"
type="number"
bind:value={nivelNovoPerfil}
min="0"
max="5"
class="input input-bordered input-secondary"
disabled={perfilSendoEditado !== null && !perfilSendoEditado.customizado}
/>
</div>
</div>
</section>
<div
class="mt-8 flex flex-col-reverse gap-3 sm:flex-row sm:items-center sm:justify-between"
class="relative bg-linear-to-r from-primary via-primary/90 to-secondary/80 px-8 py-6 text-base-100"
>
<p class="text-sm text-base-content/60">
Campos marcados com * são obrigatórios.
<button
type="button"
class="btn btn-sm btn-circle btn-ghost absolute right-4 top-4 text-base-100/80 hover:text-base-100"
onclick={fecharModalGerenciarPerfis}
aria-label="Fechar modal"
>
</button>
<h3 class="text-3xl font-black tracking-tight">
Gerenciar Perfis de Acesso
</h3>
<p class="mt-2 max-w-2xl text-sm text-base-100/80 md:text-base">
{perfilSendoEditado
? "Atualize as informações do perfil selecionado para manter a governança de acesso alinhada com as diretrizes do sistema."
: "Crie um novo perfil de acesso definindo nome, descrição e nível hierárquico conforme os padrões adotados pela Secretaria."}
</p>
<div class="flex flex-wrap gap-3">
<button
type="button"
class="btn btn-ghost"
onclick={fecharModalGerenciarPerfis}
disabled={processando}
</div>
<div class="bg-base-100 px-8 py-6">
<section
class="space-y-6 rounded-2xl border border-base-200/60 bg-base-100 p-6 shadow-sm"
>
<div
class="flex flex-col gap-3 sm:flex-row sm:items-start sm:justify-between"
>
Cancelar
</button>
<button
type="button"
class="btn btn-primary"
disabled={!nomeNovoPerfil.trim() || processando}
onclick={perfilSendoEditado ? editarPerfil : criarNovoPerfil}
>
{#if processando}
<span class="loading loading-spinner"></span>
Processando...
{:else}
{perfilSendoEditado ? "Salvar Alterações" : "Criar Perfil"}
<div class="space-y-1">
<h4 class="text-xl font-semibold text-base-content">
{perfilSendoEditado ? "Editar Perfil" : "Criar Novo Perfil"}
</h4>
<p class="text-sm text-base-content/70">
{perfilSendoEditado
? "Os campos bloqueados indicam atributos padronizados do sistema. Ajuste apenas o que estiver disponível."
: "Preencha as informações com atenção para garantir que o novo perfil siga o padrão institucional."}
</p>
</div>
{#if perfilSendoEditado}
<span
class="badge badge-outline badge-primary badge-lg self-start flex flex-col items-center gap-1 px-5 py-3 text-center"
>
<span
class="text-[11px] font-semibold uppercase tracking-[0.32em] text-primary"
>
Nível atual
</span>
<span class="text-2xl font-bold leading-none text-primary">
{perfilSendoEditado.nivel}
</span>
</span>
{/if}
</button>
</div>
<div class="grid gap-6 md:grid-cols-2">
<div class="form-control md:col-span-2">
<label class="label" for="nome-perfil-input">
<span class="label-text">Nome do Perfil *</span>
</label>
<input
id="nome-perfil-input"
type="text"
bind:value={nomeNovoPerfil}
class="input input-bordered input-primary"
placeholder="Ex: RH, Financeiro, Gestor"
disabled={perfilSendoEditado !== null &&
!perfilSendoEditado.customizado}
/>
</div>
<div class="form-control md:col-span-2">
<label class="label" for="descricao-perfil-input">
<span class="label-text">Descrição</span>
</label>
<textarea
id="descricao-perfil-input"
bind:value={descricaoNovoPerfil}
class="textarea textarea-bordered textarea-primary min-h-[120px]"
placeholder="Breve descrição das responsabilidades e limites de atuação deste perfil."
></textarea>
</div>
<div class="form-control max-w-xs">
<label class="label" for="nivel-perfil-input">
<span class="label-text">Nível de Acesso (0-5) *</span>
</label>
<input
id="nivel-perfil-input"
type="number"
bind:value={nivelNovoPerfil}
min="0"
max="5"
class="input input-bordered input-secondary"
disabled={perfilSendoEditado !== null &&
!perfilSendoEditado.customizado}
/>
</div>
</div>
</section>
<div
class="mt-8 flex flex-col-reverse gap-3 sm:flex-row sm:items-center sm:justify-between"
>
<p class="text-sm text-base-content/60">
Campos marcados com * são obrigatórios.
</p>
<div class="flex flex-wrap gap-3">
<button
type="button"
class="btn btn-ghost"
onclick={fecharModalGerenciarPerfis}
disabled={processando}
>
Cancelar
</button>
<button
type="button"
class="btn btn-primary"
disabled={!nomeNovoPerfil.trim() || processando}
onclick={perfilSendoEditado ? editarPerfil : criarNovoPerfil}
>
{#if processando}
<span class="loading loading-spinner"></span>
Processando...
{:else}
{perfilSendoEditado ? "Salvar Alterações" : "Criar Perfil"}
{/if}
</button>
</div>
</div>
</div>
</div>
</div>
<form method="dialog" class="modal-backdrop">
<button
type="button"
onclick={fecharModalGerenciarPerfis}
aria-label="Fechar modal"
>Fechar</button>
aria-label="Fechar modal">Fechar</button
>
</form>
</dialog>
{/if}