feat: implement sub-steps management in workflow editor

- Added functionality for creating, updating, and deleting sub-steps within the workflow editor.
- Introduced a modal for adding new sub-steps, including fields for name and description.
- Enhanced the UI to display sub-steps with status indicators and options for updating their status.
- Updated navigation links to reflect changes in the workflow structure, ensuring consistency across the application.
- Refactored related components to accommodate the new sub-steps feature, improving overall workflow management.
This commit is contained in:
2025-11-25 14:14:43 -03:00
parent f8d9c17f63
commit 6128c20da0
12 changed files with 3503 additions and 88 deletions

View File

@@ -1,7 +1,8 @@
<script lang="ts">
import { FileText, ClipboardCopy, Building2, Workflow } from 'lucide-svelte';
import { FileText, ClipboardCopy, Building2, Workflow, ChevronRight } from 'lucide-svelte';
import { resolve } from '$app/paths';
import ProtectedRoute from '$lib/components/ProtectedRoute.svelte';
import type { Component } from 'svelte';
</script>
<ProtectedRoute>
@@ -16,7 +17,16 @@
</ul>
</div>
<div class="grid gap-4 md:grid-cols-3">
<!-- Cabeçalho -->
<div class="mb-8">
<h1 class="text-4xl font-bold text-primary mb-2">Licitações</h1>
<p class="text-lg text-base-content/70">
Gerencie empresas, contratos e processos licitatórios
</p>
</div>
<!-- Cards Principais -->
<div class="grid gap-4 md:grid-cols-3 mb-8">
<a
href={resolve('/licitacoes/empresas')}
class="card bg-base-100 border-base-200 hover:border-primary border shadow-md transition-shadow hover:shadow-lg"
@@ -74,23 +84,87 @@
<p class="text-base-content/60 text-sm">Em breve: gestão de documentos e editais.</p>
</div>
</div>
</div>
<a
href={resolve('/fluxos')}
class="card bg-base-100 border-base-200 hover:border-secondary border shadow-md transition-shadow hover:shadow-lg"
>
<div class="card-body">
<div class="mb-2 flex items-center gap-3">
<div class="bg-secondary/10 rounded-lg p-2">
<Workflow class="text-secondary h-6 w-6" strokeWidth={2} />
</div>
<h4 class="font-semibold">Fluxos de Trabalho</h4>
<!-- Seção Fluxos -->
<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 bg-secondary/20 rounded-2xl">
<Workflow class="h-12 w-12 text-secondary" strokeWidth={2} />
</div>
<div class="flex-1">
<h2 class="card-title text-2xl mb-2 text-secondary">
Fluxos de Trabalho
</h2>
<p class="text-base-content/70">Gerencie templates e fluxos de trabalho para contratos e processos</p>
</div>
<p class="text-base-content/70 text-sm">
Gerencie templates e instâncias de fluxos de trabalho para contratos e processos.
</p>
</div>
</a>
<!-- Grid de Opções -->
<div class="grid grid-cols-1 md:grid-cols-2 gap-4">
<a
href={resolve('/licitacoes/fluxos')}
class="group relative overflow-hidden rounded-xl border-2 border-base-300 bg-linear-to-br from-secondary/10 to-secondary/20 p-6 hover:border-secondary 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-secondary group-hover:text-white transition-colors duration-300"
>
<Workflow
class="h-5 w-5 text-secondary group-hover:text-white transition-colors duration-300"
strokeWidth={2}
/>
</div>
<ChevronRight
class="h-5 w-5 text-base-content/30 group-hover:text-secondary transition-colors duration-300"
strokeWidth={2}
/>
</div>
<h3
class="text-lg font-bold text-base-content mb-2 group-hover:text-secondary transition-colors duration-300"
>
Meus Fluxos
</h3>
<p class="text-sm text-base-content/70 flex-1">
Visualize e gerencie os fluxos de trabalho em execução
</p>
</div>
</a>
<a
href={resolve('/fluxos')}
class="group relative overflow-hidden rounded-xl border-2 border-base-300 bg-linear-to-br from-secondary/10 to-secondary/20 p-6 hover:border-secondary 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-secondary group-hover:text-white transition-colors duration-300"
>
<FileText
class="h-5 w-5 text-secondary group-hover:text-white transition-colors duration-300"
strokeWidth={2}
/>
</div>
<ChevronRight
class="h-5 w-5 text-base-content/30 group-hover:text-secondary transition-colors duration-300"
strokeWidth={2}
/>
</div>
<h3
class="text-lg font-bold text-base-content mb-2 group-hover:text-secondary transition-colors duration-300"
>
Templates
</h3>
<p class="text-sm text-base-content/70 flex-1">
Crie e edite templates de fluxos de trabalho
</p>
</div>
</a>
</div>
</div>
</div>
</main>
</ProtectedRoute>