feat: replace SVG icons with Lucide components in the Central de Chamados page for improved consistency and maintainability
This commit is contained in:
@@ -7,6 +7,7 @@
|
||||
import { useConvexWithAuth } from '$lib/hooks/useConvexWithAuth';
|
||||
import SlaChart from '$lib/components/chamados/SlaChart.svelte';
|
||||
import { resolve } from '$app/paths';
|
||||
import { MessageSquare, BarChart3, FileText, Clock, User, Info, MessageCircle, UserPlus } from 'lucide-svelte';
|
||||
|
||||
type Ticket = Doc<'tickets'>;
|
||||
type Usuario = Doc<'usuarios'>;
|
||||
@@ -701,20 +702,7 @@
|
||||
<div class="mb-6">
|
||||
<div class="mb-2 flex items-center gap-4">
|
||||
<div class="bg-info/20 rounded-xl p-3">
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
class="text-info h-8 w-8"
|
||||
fill="none"
|
||||
viewBox="0 0 24 24"
|
||||
stroke="currentColor"
|
||||
>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
d="M8 10h.01M12 10h.01M16 10h.01M9 16H5a2 2 0 01-2-2V6a2 2 0 012-2h14a2 2 0 012 2v8a2 2 0 01-2 2h-5l-5 5v-5z"
|
||||
/>
|
||||
</svg>
|
||||
<MessageSquare class="text-info h-8 w-8" strokeWidth={2} />
|
||||
</div>
|
||||
<div>
|
||||
<h1 class="text-primary text-3xl font-bold">Central de Chamados</h1>
|
||||
@@ -731,60 +719,21 @@
|
||||
class="tab flex items-center gap-2 {abaAtiva === 'dashboard' ? 'tab-active' : ''}"
|
||||
onclick={() => (abaAtiva = 'dashboard')}
|
||||
>
|
||||
<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="M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z"
|
||||
/>
|
||||
</svg>
|
||||
<BarChart3 class="h-5 w-5" strokeWidth={2} />
|
||||
<span class="font-medium">Dashboard</span>
|
||||
</button>
|
||||
<button
|
||||
class="tab flex items-center gap-2 {abaAtiva === 'chamados' ? 'tab-active' : ''}"
|
||||
onclick={() => (abaAtiva = 'chamados')}
|
||||
>
|
||||
<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="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"
|
||||
/>
|
||||
</svg>
|
||||
<FileText class="h-5 w-5" strokeWidth={2} />
|
||||
<span class="font-medium">Painel de Chamados</span>
|
||||
</button>
|
||||
<button
|
||||
class="tab flex items-center gap-2 {abaAtiva === 'sla' ? 'tab-active' : ''}"
|
||||
onclick={() => (abaAtiva = 'sla')}
|
||||
>
|
||||
<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="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z"
|
||||
/>
|
||||
</svg>
|
||||
<Clock class="h-5 w-5" strokeWidth={2} />
|
||||
<span class="font-medium">Configurações SLA</span>
|
||||
</button>
|
||||
</div>
|
||||
@@ -1005,20 +954,7 @@
|
||||
class="border-base-300 bg-base-100/50 rounded-3xl border-2 border-dashed p-12 text-center shadow-lg"
|
||||
>
|
||||
<div class="mx-auto max-w-md">
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
class="text-base-content/30 mx-auto mb-4 h-16 w-16"
|
||||
fill="none"
|
||||
viewBox="0 0 24 24"
|
||||
stroke="currentColor"
|
||||
>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"
|
||||
/>
|
||||
</svg>
|
||||
<FileText class="text-base-content/30 mx-auto mb-4 h-16 w-16" strokeWidth={2} />
|
||||
<h3 class="text-base-content mb-2 text-xl font-semibold">Nenhum chamado selecionado</h3>
|
||||
<p class="text-base-content/60 text-sm">
|
||||
Selecione um chamado na tabela acima para visualizar detalhes e realizar ações.
|
||||
@@ -1047,39 +983,13 @@
|
||||
</h2>
|
||||
<div class="text-base-content/70 flex flex-wrap items-center gap-4 text-sm">
|
||||
<div class="flex items-center gap-2">
|
||||
<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="M16 7a4 4 0 11-8 0 4 4 0 018 0zM12 14a7 7 0 00-7 7h14a7 7 0 00-7-7z"
|
||||
/>
|
||||
</svg>
|
||||
<User class="h-4 w-4" strokeWidth={2} />
|
||||
<span class="font-semibold">Solicitante:</span>
|
||||
<span>{detalheSelecionado.solicitanteNome}</span>
|
||||
</div>
|
||||
{#if detalheSelecionado.prazoConclusao}
|
||||
<div class="flex items-center gap-2">
|
||||
<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="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z"
|
||||
/>
|
||||
</svg>
|
||||
<Clock class="h-4 w-4" strokeWidth={2} />
|
||||
<span class="font-semibold">Prazo:</span>
|
||||
<span>{prazoRestante(detalheSelecionado.prazoConclusao) ?? '--'}</span>
|
||||
</div>
|
||||
@@ -1094,20 +1004,7 @@
|
||||
<!-- Detalhes do Chamado -->
|
||||
<div class="border-primary/20 bg-base-100/90 rounded-3xl border-2 p-6 shadow-lg">
|
||||
<div class="mb-4 flex items-center gap-2">
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
class="text-primary h-5 w-5"
|
||||
fill="none"
|
||||
viewBox="0 0 24 24"
|
||||
stroke="currentColor"
|
||||
>
|
||||
<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"
|
||||
/>
|
||||
</svg>
|
||||
<Info class="text-primary h-5 w-5" strokeWidth={2} />
|
||||
<h3 class="text-base-content text-lg font-semibold">Detalhes do chamado</h3>
|
||||
</div>
|
||||
<div class="space-y-4">
|
||||
@@ -1141,20 +1038,7 @@
|
||||
<!-- Responder Chamado -->
|
||||
<div class="border-primary/20 bg-base-100/90 rounded-3xl border-2 p-6 shadow-lg">
|
||||
<div class="mb-4 flex items-center gap-2">
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
class="text-primary h-5 w-5"
|
||||
fill="none"
|
||||
viewBox="0 0 24 24"
|
||||
stroke="currentColor"
|
||||
>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
d="M8 12h.01M12 12h.01M16 12h.01M21 12c0 4.418-4.03 8-9 8a9.863 9.863 0 01-4.255-.949L3 20l1.395-3.72C3.512 15.042 3 13.574 3 12c0-4.418 4.03-8 9-8s9 3.582 9 8z"
|
||||
/>
|
||||
</svg>
|
||||
<MessageCircle class="text-primary h-5 w-5" strokeWidth={2} />
|
||||
<h3 class="text-base-content text-lg font-semibold">Responder chamado</h3>
|
||||
</div>
|
||||
<div class="space-y-4">
|
||||
@@ -1244,20 +1128,7 @@
|
||||
<!-- Atribuir Responsável -->
|
||||
<div class="border-primary/20 bg-base-100/90 rounded-3xl border-2 p-6 shadow-lg">
|
||||
<div class="mb-4 flex items-center gap-2">
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
class="text-primary h-5 w-5"
|
||||
fill="none"
|
||||
viewBox="0 0 24 24"
|
||||
stroke="currentColor"
|
||||
>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
d="M18 9v3m0 0v3m0-3h3m-3 0h-3m-2-5a4 4 0 11-8 0 4 4 0 018 0zM3 20a6 6 0 0112 0v1H3v-1z"
|
||||
/>
|
||||
</svg>
|
||||
<UserPlus class="text-primary h-5 w-5" strokeWidth={2} />
|
||||
<h3 class="text-base-content text-lg font-semibold">Atribuir responsável</h3>
|
||||
</div>
|
||||
<div class="space-y-3">
|
||||
|
||||
Reference in New Issue
Block a user