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:
@@ -2,7 +2,22 @@
|
||||
import { goto } from "$app/navigation";
|
||||
import { useQuery } from "convex-svelte";
|
||||
import { api } from "@sgse-app/backend/convex/_generated/api";
|
||||
import { Users, UserPlus, ClipboardList, Trash2, BarChart3, Calendar, FileText, BadgeCheck, Plus, List, ChevronRight, CheckCircle2, Info, ArrowRight } from "lucide-svelte";
|
||||
import {
|
||||
Users,
|
||||
UserPlus,
|
||||
ClipboardList,
|
||||
Trash2,
|
||||
BarChart3,
|
||||
Calendar,
|
||||
FileText,
|
||||
BadgeCheck,
|
||||
Plus,
|
||||
List,
|
||||
ChevronRight,
|
||||
CheckCircle2,
|
||||
Info,
|
||||
ArrowRight,
|
||||
} from "lucide-svelte";
|
||||
import type { Component } from "svelte";
|
||||
|
||||
// Buscar estatísticas para exibir nos cards
|
||||
@@ -119,46 +134,61 @@
|
||||
<!-- Estatísticas Rápidas -->
|
||||
{#if statsQuery.data}
|
||||
<div class="grid grid-cols-1 md:grid-cols-4 gap-4 mb-8">
|
||||
<div class="stats shadow-lg bg-gradient-to-br from-primary/10 to-primary/20">
|
||||
<div
|
||||
class="stats shadow-lg bg-linear-to-br from-primary/10 to-primary/20"
|
||||
>
|
||||
<div class="stat">
|
||||
<div class="stat-figure text-primary">
|
||||
<Users class="h-8 w-8" strokeWidth={2} />
|
||||
</div>
|
||||
<div class="stat-title">Total</div>
|
||||
<div class="stat-value text-primary">{statsQuery.data.totalFuncionarios}</div>
|
||||
<div class="stat-value text-primary">
|
||||
{statsQuery.data.totalFuncionarios}
|
||||
</div>
|
||||
<div class="stat-desc">Funcionários cadastrados</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="stats shadow-lg bg-gradient-to-br from-success/10 to-success/20">
|
||||
<div
|
||||
class="stats shadow-lg bg-linear-to-br from-success/10 to-success/20"
|
||||
>
|
||||
<div class="stat">
|
||||
<div class="stat-figure text-success">
|
||||
<CheckCircle2 class="h-8 w-8" strokeWidth={2} />
|
||||
</div>
|
||||
<div class="stat-title">Ativos</div>
|
||||
<div class="stat-value text-success">{statsQuery.data.funcionariosAtivos}</div>
|
||||
<div class="stat-value text-success">
|
||||
{statsQuery.data.funcionariosAtivos}
|
||||
</div>
|
||||
<div class="stat-desc">Funcionários ativos</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="stats shadow-lg bg-gradient-to-br from-secondary/10 to-secondary/20">
|
||||
<div
|
||||
class="stats shadow-lg bg-linear-to-br from-secondary/10 to-secondary/20"
|
||||
>
|
||||
<div class="stat">
|
||||
<div class="stat-figure text-secondary">
|
||||
<BadgeCheck class="h-8 w-8" strokeWidth={2} />
|
||||
</div>
|
||||
<div class="stat-title">Símbolos</div>
|
||||
<div class="stat-value text-secondary">{statsQuery.data.totalSimbolos}</div>
|
||||
<div class="stat-value text-secondary">
|
||||
{statsQuery.data.totalSimbolos}
|
||||
</div>
|
||||
<div class="stat-desc">Cargos e funções</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="stats shadow-lg bg-gradient-to-br from-accent/10 to-accent/20">
|
||||
<div class="stats shadow-lg bg-linear-to-br from-accent/10 to-accent/20">
|
||||
<div class="stat">
|
||||
<div class="stat-figure text-accent">
|
||||
<BarChart3 class="h-8 w-8" strokeWidth={2} />
|
||||
</div>
|
||||
<div class="stat-title">CC / FG</div>
|
||||
<div class="stat-value text-accent">{statsQuery.data.cargoComissionado} / {statsQuery.data.funcaoGratificada}</div>
|
||||
<div class="stat-value text-accent">
|
||||
{statsQuery.data.cargoComissionado} / {statsQuery.data
|
||||
.funcaoGratificada}
|
||||
</div>
|
||||
<div class="stat-desc">Distribuição</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -168,12 +198,18 @@
|
||||
<!-- Menu de Opções -->
|
||||
<div class="space-y-8">
|
||||
{#each menuItems as categoria}
|
||||
<div class="card bg-base-100 shadow-xl hover:shadow-2xl transition-all duration-300">
|
||||
<div
|
||||
class="card bg-base-100 shadow-xl hover:shadow-2xl transition-all duration-300"
|
||||
>
|
||||
<div class="card-body">
|
||||
<!-- Cabeçalho da Categoria -->
|
||||
<div class="flex items-start gap-6 mb-6">
|
||||
<div class="p-4 {categoria.bgIcon} rounded-2xl">
|
||||
<svelte:component this={categoria.Icon} class="h-12 w-12 {categoria.accentColor}" strokeWidth={2} />
|
||||
<svelte:component
|
||||
this={categoria.Icon}
|
||||
class="h-12 w-12 {categoria.accentColor}"
|
||||
strokeWidth={2}
|
||||
/>
|
||||
</div>
|
||||
<div class="flex-1">
|
||||
<h2 class="card-title text-2xl mb-2 {categoria.accentColor}">
|
||||
@@ -188,15 +224,17 @@
|
||||
{#each categoria.opcoes as opcao}
|
||||
<a
|
||||
href={opcao.href}
|
||||
class="group relative overflow-hidden rounded-xl border-2 border-base-300 bg-gradient-to-br {categoria.gradient} p-6 hover:border-primary hover:shadow-lg transition-all duration-300 transform hover:-translate-y-1"
|
||||
class="group relative overflow-hidden rounded-xl border-2 border-base-300 bg-linear-to-br {categoria.gradient} p-6 hover:border-primary hover:shadow-lg transition-all duration-300 transform hover:-translate-y-1"
|
||||
>
|
||||
<div class="flex flex-col h-full">
|
||||
<div class="flex items-start justify-between mb-4">
|
||||
<div class="p-3 bg-base-100 rounded-lg group-hover:bg-primary group-hover:text-white transition-colors duration-300">
|
||||
<svelte:component
|
||||
this={opcao.Icon}
|
||||
class="h-5 w-5 {categoria.accentColor} group-hover:text-white transition-colors duration-300"
|
||||
strokeWidth={2}
|
||||
<div
|
||||
class="p-3 bg-base-100 rounded-lg group-hover:bg-primary group-hover:text-white transition-colors duration-300"
|
||||
>
|
||||
<svelte:component
|
||||
this={opcao.Icon}
|
||||
class="h-5 w-5 {categoria.accentColor} group-hover:text-white transition-colors duration-300"
|
||||
strokeWidth={2}
|
||||
/>
|
||||
</div>
|
||||
<ChevronRight
|
||||
@@ -204,7 +242,9 @@
|
||||
strokeWidth={2}
|
||||
/>
|
||||
</div>
|
||||
<h3 class="text-lg font-bold text-base-content mb-2 group-hover:text-primary transition-colors duration-300">
|
||||
<h3
|
||||
class="text-lg font-bold text-base-content mb-2 group-hover:text-primary transition-colors duration-300"
|
||||
>
|
||||
{opcao.nome}
|
||||
</h3>
|
||||
<p class="text-sm text-base-content/70 flex-1">
|
||||
@@ -225,7 +265,9 @@
|
||||
<div>
|
||||
<h3 class="font-bold">Precisa de ajuda?</h3>
|
||||
<div class="text-sm">
|
||||
Entre em contato com o suporte técnico ou consulte a documentação do sistema para mais informações sobre as funcionalidades de Recursos Humanos.
|
||||
Entre em contato com o suporte técnico ou consulte a documentação do
|
||||
sistema para mais informações sobre as funcionalidades de Recursos
|
||||
Humanos.
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user