SESP/sgse-app
2
0
Fork 0
Code Issues 3 Pull Requests 1 Actions Packages Projects Releases Wiki Activity

feat: replace SVG icons with Lucide components in various dashboard pages for improved consistency and maintainability

Browse Source
This commit is contained in:
deyvisonwanderley
2025-12-04 15:34:24 -03:00
parent 88f25dc6ab
commit eb7f3507d3
14 changed files with 151 additions and 1248 deletions
Download Patch File Download Diff File Expand all files Collapse all files

148
apps/web/src/routes/(dashboard)/recursos-humanos/simbolos/+page.svelte
View File

@@ -4,6 +4,7 @@
import type { Id } from '@sgse-app/backend/convex/_generated/dataModel';
import { onMount } from 'svelte';
import { resolve } from '$app/paths';
import { Award, Plus, CheckCircle, XCircle, Filter, X, MoreVertical, Edit, Trash2, AlertTriangle } from 'lucide-svelte';
const client = useConvexClient();
let isLoading = true;
@@ -92,20 +93,7 @@
<div class="flex flex-col items-start justify-between gap-4 sm:flex-row sm:items-center">
<div class="flex items-center gap-4">
<div class="rounded-xl bg-green-500/20 p-3">
<svg
xmlns="http://www.w3.org/2000/svg"
class="h-8 w-8 text-green-600"
fill="none"
viewBox="0 0 24 24"
stroke="currentColor"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
d="M9 12l2 2 4-4M7.835 4.697a3.42 3.42 0 001.946-.806 3.42 3.42 0 014.438 0 3.42 3.42 0 001.946.806 3.42 3.42 0 013.138 3.138 3.42 3.42 0 00.806 1.946 3.42 3.42 0 010 4.438 3.42 3.42 0 00-.806 1.946 3.42 3.42 0 01-3.138 3.138 3.42 3.42 0 00-1.946.806 3.42 3.42 0 01-4.438 0 3.42 3.42 0 00-1.946-.806 3.42 3.42 0 01-3.138-3.138 3.42 3.42 0 00-.806-1.946 3.42 3.42 0 010-4.438 3.42 3.42 0 00.806-1.946 3.42 3.42 0 013.138-3.138z"
/>
</svg>
<Award class="h-8 w-8 text-green-600" strokeWidth={2} />
</div>
<div>
<h1 class="text-primary text-3xl font-bold">Símbolos Cadastrados</h1>
@@ -113,18 +101,7 @@
</div>
</div>
<a href={resolve('/recursos-humanos/simbolos/cadastro')} class="btn btn-primary btn-lg gap-2">
<svg
xmlns="http://www.w3.org/2000/svg"
class="h-5 w-5"
viewBox="0 0 20 20"
fill="currentColor"
>
<path
fill-rule="evenodd"
d="M10 3a1 1 0 011 1v5h5a1 1 0 110 2h-5v5a1 1 0 11-2 0v-5H4a1 1 0 110-2h5V4a1 1 0 011-1z"
clip-rule="evenodd"
/>
</svg>
<Plus class="h-5 w-5" strokeWidth={2} />
Novo Símbolo
</a>
</div>
@@ -137,28 +114,11 @@
class:alert-success={notice.kind === 'success'}
class:alert-error={notice.kind === 'error'}
>
<svg
xmlns="http://www.w3.org/2000/svg"
class="h-6 w-6 shrink-0 stroke-current"
fill="none"
viewBox="0 0 24 24"
>
{#if notice.kind === 'success'}
<path
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z"
/>
{:else}
<path
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
d="M10 14l2-2m0 0l2-2m-2 2l-2-2m2 2l2 2m7-2a9 9 0 11-18 0 9 9 0 0118 0z"
/>
{/if}
</svg>
{#if notice.kind === 'success'}
<CheckCircle class="h-6 w-6 shrink-0 stroke-current" strokeWidth={2} />
{:else}
<XCircle class="h-6 w-6 shrink-0 stroke-current" strokeWidth={2} />
{/if}
<span>{notice.text}</span>
</div>
{/if}
@@ -167,20 +127,7 @@
<div class="card bg-base-100 mb-6 shadow-xl">
<div class="card-body">
<h2 class="card-title mb-4 text-lg">
<svg
xmlns="http://www.w3.org/2000/svg"
class="h-5 w-5"
fill="none"
viewBox="0 0 24 24"
stroke="currentColor"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
d="M3 4a1 1 0 011-1h16a1 1 0 011 1v2.586a1 1 0 01-.293.707l-6.414 6.414a1 1 0 00-.293.707V17l-4 4v-6.586a1 1 0 00-.293-.707L3.293 7.293A1 1 0 013 6.586V4z"
/>
</svg>
<Filter class="h-5 w-5" strokeWidth={2} />
Filtros de Pesquisa
</h2>
<div class="grid grid-cols-1 gap-4 md:grid-cols-3">
@@ -231,20 +178,7 @@
filtroDescricao = '';
}}
>
<svg
xmlns="http://www.w3.org/2000/svg"
class="h-4 w-4"
fill="none"
viewBox="0 0 24 24"
stroke="currentColor"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
d="M6 18L18 6M6 6l12 12"
/>
</svg>
<X class="h-4 w-4" strokeWidth={2} />
Limpar Filtros
</button>
</div>
@@ -305,32 +239,14 @@
class="btn btn-sm"
onclick={() => toggleMenu(simbolo._id)}
>
<svg
xmlns="http://www.w3.org/2000/svg"
class="h-5 w-5"
viewBox="0 0 20 20"
fill="currentColor"
>
<path
d="M10 6a2 2 0 110-4 2 2 0 010 4zM10 12a2 2 0 110-4 2 2 0 010 4zM10 18a2 2 0 110-4 2 2 0 010 4z"
/>
</svg>
<MoreVertical class="h-5 w-5" strokeWidth={2} />
</button>
<ul
class="dropdown-content menu bg-base-100 rounded-box border-base-300 z-10 w-52 border p-2 shadow-lg"
>
<li>
<a href={resolve(`/recursos-humanos/simbolos/${simbolo._id}/editar`)}>
<svg
xmlns="http://www.w3.org/2000/svg"
class="h-4 w-4"
viewBox="0 0 20 20"
fill="currentColor"
>
<path
d="M13.586 3.586a2 2 0 112.828 2.828l-.793.793-2.828-2.828.793-.793zM11.379 5.793L3 14.172V17h2.828l8.38-8.379-2.83-2.828z"
/>
</svg>
<Edit class="h-4 w-4" strokeWidth={2} />
Editar
</a>
</li>
@@ -340,18 +256,7 @@
onclick={() => openDeleteModal(simbolo._id, simbolo.nome)}
class="text-error"
>
<svg
xmlns="http://www.w3.org/2000/svg"
class="h-4 w-4"
viewBox="0 0 20 20"
fill="currentColor"
>
<path
fill-rule="evenodd"
d="M9 2a1 1 0 00-.894.553L7.382 4H4a1 1 0 000 2v10a2 2 0 002 2h8a2 2 0 002-2V6a1 1 0 100-2h-3.382l-.724-1.447A1 1 0 0011 2H9zM7 8a1 1 0 012 0v6a1 1 0 11-2 0V8zm5-1a1 1 0 00-1 1v6a1 1 0 102 0V8a1 1 0 00-1-1z"
clip-rule="evenodd"
/>
</svg>
<Trash2 class="h-4 w-4" strokeWidth={2} />
Excluir
</button>
</li>
@@ -386,19 +291,7 @@
<div class="modal-box">
<h3 class="mb-4 text-lg font-bold">Confirmar Exclusão</h3>
<div class="alert alert-warning mb-4">
<svg
xmlns="http://www.w3.org/2000/svg"
class="h-6 w-6 shrink-0 stroke-current"
fill="none"
viewBox="0 0 24 24"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z"
/>
</svg>
<AlertTriangle class="h-6 w-6 shrink-0 stroke-current" strokeWidth={2} />
<span>Esta ação não pode ser desfeita!</span>
</div>
{#if simboloToDelete}
@@ -421,18 +314,7 @@
<span class="loading loading-spinner loading-sm"></span>
Excluindo...
{:else}
<svg
xmlns="http://www.w3.org/2000/svg"
class="h-5 w-5"
viewBox="0 0 20 20"
fill="currentColor"
>
<path
fill-rule="evenodd"
d="M9 2a1 1 0 00-.894.553L7.382 4H4a1 1 0 000 2v10a2 2 0 002 2h8a2 2 0 002-2V6a1 1 0 100-2h-3.382l-.724-1.447A1 1 0 0011 2H9zM7 8a1 1 0 012 0v6a1 1 0 11-2 0V8zm5-1a1 1 0 00-1 1v6a1 1 0 102 0V8a1 1 0 00-1-1z"
clip-rule="evenodd"
/>
</svg>
<Trash2 class="h-5 w-5" strokeWidth={2} />
Confirmar Exclusão
{/if}
</button>

87
apps/web/src/routes/(dashboard)/recursos-humanos/simbolos/cadastro/+page.svelte
View File

@@ -6,6 +6,7 @@
import { goto } from '$app/navigation';
import type { SimboloTipo } from '@sgse-app/backend/convex/schema';
import { resolve } from '$app/paths';
import { Award, CheckCircle, XCircle, Info, ArrowLeft, Save } from 'lucide-svelte';
const client = useConvexClient();
@@ -116,20 +117,7 @@
<div class="mb-6">
<div class="mb-2 flex items-center gap-4">
<div class="rounded-xl bg-green-500/20 p-3">
<svg
xmlns="http://www.w3.org/2000/svg"
class="h-8 w-8 text-green-600"
fill="none"
viewBox="0 0 24 24"
stroke="currentColor"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
d="M9 12l2 2 4-4M7.835 4.697a3.42 3.42 0 001.946-.806 3.42 3.42 0 014.438 0 3.42 3.42 0 001.946.806 3.42 3.42 0 013.138 3.138 3.42 3.42 0 00.806 1.946 3.42 3.42 0 010 4.438 3.42 3.42 0 00-.806 1.946 3.42 3.42 0 01-3.138 3.138 3.42 3.42 0 00-1.946.806 3.42 3.42 0 01-4.438 0 3.42 3.42 0 00-1.946-.806 3.42 3.42 0 01-3.138-3.138 3.42 3.42 0 00-.806-1.946 3.42 3.42 0 010-4.438 3.42 3.42 0 00.806-1.946 3.42 3.42 0 013.138-3.138z"
/>
</svg>
<Award class="h-8 w-8 text-green-600" strokeWidth={2} />
</div>
<div>
<h1 class="text-primary text-3xl font-bold">Cadastro de Símbolo</h1>
@@ -147,28 +135,11 @@
class:alert-success={notice.kind === 'success'}
class:alert-error={notice.kind === 'error'}
>
<svg
xmlns="http://www.w3.org/2000/svg"
class="h-6 w-6 shrink-0 stroke-current"
fill="none"
viewBox="0 0 24 24"
>
{#if notice.kind === 'success'}
<path
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z"
/>
{:else}
<path
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
d="M10 14l2-2m0 0l2-2m-2 2l-2-2m2 2l2 2m7-2a9 9 0 11-18 0 9 9 0 0118 0z"
/>
{/if}
</svg>
{#if notice.kind === 'success'}
<CheckCircle class="h-6 w-6 shrink-0 stroke-current" strokeWidth={2} />
{:else}
<XCircle class="h-6 w-6 shrink-0 stroke-current" strokeWidth={2} />
{/if}
<span>{notice.text}</span>
</div>
{/if}
@@ -393,19 +364,7 @@
<!-- Preview do Total -->
{#if getTotalPreview()}
<div class="alert alert-info shadow-lg">
<svg
xmlns="http://www.w3.org/2000/svg"
fill="none"
viewBox="0 0 24 24"
class="h-6 w-6 shrink-0 stroke-current"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"
></path>
</svg>
<Info class="h-6 w-6 shrink-0 stroke-current" strokeWidth={2} />
<div>
<h3 class="font-bold">Valor Total Calculado</h3>
<div class="mt-1 text-2xl font-bold">R$ {getTotalPreview()}</div>
@@ -478,20 +437,7 @@
disabled={isSubmitting}
onclick={() => goto(resolve('/recursos-humanos/simbolos'))}
>
<svg
xmlns="http://www.w3.org/2000/svg"
class="h-5 w-5"
fill="none"
viewBox="0 0 24 24"
stroke="currentColor"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
d="M6 18L18 6M6 6l12 12"
/>
</svg>
<ArrowLeft class="h-5 w-5" strokeWidth={2} />
Cancelar
</button>
<button
@@ -503,20 +449,7 @@
<span class="loading loading-spinner"></span>
Cadastrando...
{:else}
<svg
xmlns="http://www.w3.org/2000/svg"
class="h-5 w-5"
fill="none"
viewBox="0 0 24 24"
stroke="currentColor"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
d="M5 13l4 4L19 7"
/>
</svg>
<Save class="h-5 w-5" strokeWidth={2} />
Cadastrar Símbolo
{/if}
</button>