sgse-app/apps/web/src/lib/components/ModelosDeclaracoes.svelte

<script lang="ts">
	import { modelosDeclaracoes } from '$lib/utils/modelosDeclaracoes';
	import {
		gerarDeclaracaoAcumulacaoCargo,
		gerarDeclaracaoDependentesIR,
		gerarDeclaracaoIdoneidade,
		gerarTermoNepotismo,
		gerarTermoOpcaoRemuneracao,
		downloadBlob
	} from '$lib/utils/declaracoesGenerator';
	import { FileText, Info } from 'lucide-svelte';

	interface Props {
		funcionario?: any;
		showPreencherButton?: boolean;
	}

	let { funcionario, showPreencherButton = false }: Props = $props();
	let generating = $state(false);

	function baixarModelo(arquivoUrl: string, nomeModelo: string) {
		const link = document.createElement('a');
		link.href = arquivoUrl;
		link.download = nomeModelo + '.pdf';
		link.target = '_blank';
		document.body.appendChild(link);
		link.click();
		document.body.removeChild(link);
	}

	async function gerarPreenchido(modeloId: string) {
		if (!funcionario) {
			alert('Dados do funcionário não disponíveis');
			return;
		}

		try {
			generating = true;
			let blob: Blob;
			let nomeArquivo: string;

			switch (modeloId) {
				case 'acumulacao_cargo':
					blob = await gerarDeclaracaoAcumulacaoCargo(funcionario);
					nomeArquivo = `Declaracao_Acumulacao_Cargo_${funcionario.nome.replace(/ /g, '_')}_${Date.now()}.pdf`;
					break;

				case 'dependentes_ir':
					blob = await gerarDeclaracaoDependentesIR(funcionario);
					nomeArquivo = `Declaracao_Dependentes_IR_${funcionario.nome.replace(/ /g, '_')}_${Date.now()}.pdf`;
					break;

				case 'idoneidade':
					blob = await gerarDeclaracaoIdoneidade(funcionario);
					nomeArquivo = `Declaracao_Idoneidade_${funcionario.nome.replace(/ /g, '_')}_${Date.now()}.pdf`;
					break;

				case 'nepotismo':
					blob = await gerarTermoNepotismo(funcionario);
					nomeArquivo = `Termo_Nepotismo_${funcionario.nome.replace(/ /g, '_')}_${Date.now()}.pdf`;
					break;

				case 'opcao_remuneracao':
					blob = await gerarTermoOpcaoRemuneracao(funcionario);
					nomeArquivo = `Termo_Opcao_Remuneracao_${funcionario.nome.replace(/ /g, '_')}_${Date.now()}.pdf`;
					break;

				default:
					alert('Modelo não encontrado');
					return;
			}

			downloadBlob(blob, nomeArquivo);
		} catch (error) {
			console.error('Erro ao gerar declaração:', error);
			alert('Erro ao gerar declaração preenchida');
		} finally {
			generating = false;
		}
	}
</script>

<div class="card bg-base-100 shadow-xl">
	<div class="card-body">
		<h2 class="card-title border-b pb-3 text-xl">
			<FileText class="h-5 w-5" strokeWidth={2} />
			Modelos de Declarações
		</h2>

		<div class="alert alert-info mb-4 shadow-sm">
			<Info class="h-5 w-5 shrink-0 stroke-current" strokeWidth={2} />
			<div class="text-sm">
				<p class="font-semibold">Baixe os modelos, preencha, assine e faça upload no sistema</p>
				<p class="mt-1 text-xs opacity-80">
					Estes documentos são necessários para completar o cadastro do funcionário
				</p>
			</div>
		</div>

		<div class="grid grid-cols-1 gap-4 md:grid-cols-2 lg:grid-cols-3">
			{#each modelosDeclaracoes as modelo}
				<div class="card bg-base-200 shadow-sm transition-shadow hover:shadow-md">
					<div class="card-body p-4">
						<div class="flex items-start gap-3">
							<!-- Ícone PDF -->
							<div
								class="bg-error/10 flex h-12 w-12 shrink-0 items-center justify-center rounded-lg"
							>
								<svg
									xmlns="http://www.w3.org/2000/svg"
									class="text-error h-6 w-6"
									fill="none"
									viewBox="0 0 24 24"
									stroke="currentColor"
								>
									<path
										stroke-linecap="round"
										stroke-linejoin="round"
										stroke-width="2"
										d="M7 21h10a2 2 0 002-2V9.414a1 1 0 00-.293-.707l-5.414-5.414A1 1 0 0012.586 3H7a2 2 0 00-2 2v14a2 2 0 002 2z"
									/>
								</svg>
							</div>

							<!-- Conteúdo -->
							<div class="min-w-0 flex-1">
								<h3 class="mb-1 line-clamp-2 text-sm font-semibold">
									{modelo.nome}
								</h3>
								<p class="text-base-content/70 mb-3 line-clamp-2 text-xs">
									{modelo.descricao}
								</p>

								<!-- Ações -->
								<div class="flex flex-col gap-2">
									<button
										type="button"
										class="btn btn-primary btn-xs gap-1"
										onclick={() => baixarModelo(modelo.arquivo, modelo.nome)}
									>
										<svg
											xmlns="http://www.w3.org/2000/svg"
											class="h-3 w-3"
											fill="none"
											viewBox="0 0 24 24"
											stroke="currentColor"
										>
											<path
												stroke-linecap="round"
												stroke-linejoin="round"
												stroke-width="2"
												d="M4 16v1a3 3 0 003 3h10a3 3 0 003-3v-1m-4-4l-4 4m0 0l-4-4m4 4V4"
											/>
										</svg>
										Baixar Modelo
									</button>

									{#if showPreencherButton && modelo.podePreencherAutomaticamente && funcionario}
										<button
											type="button"
											class="btn btn-outline btn-xs gap-1"
											onclick={() => gerarPreenchido(modelo.id)}
											disabled={generating}
										>
											{#if generating}
												<span class="loading loading-spinner loading-xs"></span>
												Gerando...
											{:else}
												<svg
													xmlns="http://www.w3.org/2000/svg"
													class="h-3 w-3"
													fill="none"
													viewBox="0 0 24 24"
													stroke="currentColor"
												>
													<path
														stroke-linecap="round"
														stroke-linejoin="round"
														stroke-width="2"
														d="M11 5H6a2 2 0 00-2 2v11a2 2 0 002 2h11a2 2 0 002-2v-5m-1.414-9.414a2 2 0 112.828 2.828L11.828 15H9v-2.828l8.586-8.586z"
													/>
												</svg>
												Gerar Preenchido
											{/if}
										</button>
									{/if}
								</div>
							</div>
						</div>
					</div>
				</div>
			{/each}
		</div>

		<div class="text-base-content/60 mt-4 text-center text-xs">
			<p>
				💡 Dica: Após preencher e assinar os documentos, faça upload na seção "Documentação Anexa"
			</p>
		</div>
	</div>
</div>