| <!DOCTYPE html> |
| <html lang="pt-BR"> |
| <head> |
| <meta charset="UTF-8"> |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> |
| <title>Relatório Negociações PGFN | MVICENTE ADVOCACIA</title> |
| <script src="https://cdn.tailwindcss.com"></script> |
| <script src="https://cdnjs.cloudflare.com/ajax/libs/html2pdf.js/0.10.1/html2pdf.bundle.min.js"></script> |
| <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"> |
| <style> |
| @media print { |
| body * { |
| visibility: hidden; |
| } |
| #report-content, #report-content * { |
| visibility: visible; |
| } |
| #report-content { |
| position: absolute; |
| left: 0; |
| top: 0; |
| width: 100%; |
| margin: 0; |
| padding: 0; |
| } |
| .no-print { |
| display: none !important; |
| } |
| } |
| |
| |
| ::-webkit-scrollbar { |
| width: 8px; |
| height: 8px; |
| } |
| ::-webkit-scrollbar-track { |
| background: #f1f1f1; |
| } |
| ::-webkit-scrollbar-thumb { |
| background: #888; |
| border-radius: 4px; |
| } |
| ::-webkit-scrollbar-thumb:hover { |
| background: #555; |
| } |
| |
| |
| @keyframes fadeIn { |
| from { opacity: 0; transform: translateY(10px); } |
| to { opacity: 1; transform: translateY(0); } |
| } |
| |
| .animate-fade-in { |
| animation: fadeIn 0.5s ease-out forwards; |
| } |
| |
| |
| .card-hover:hover { |
| transform: translateY(-5px); |
| box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1); |
| } |
| |
| |
| .status-badge { |
| @apply inline-flex items-center px-3 py-1 rounded-full text-xs font-medium; |
| } |
| .status-awaiting { |
| @apply bg-yellow-100 text-yellow-800; |
| } |
| .status-due { |
| @apply bg-blue-100 text-blue-800; |
| } |
| .status-paid { |
| @apply bg-green-100 text-green-800; |
| } |
| |
| |
| .section-divider { |
| @apply relative my-8; |
| } |
| .section-divider:after { |
| content: ""; |
| @apply absolute left-0 right-0 bottom-0 h-px bg-gradient-to-r from-transparent via-blue-200 to-transparent; |
| } |
| |
| |
| .table-container { |
| @apply overflow-x-auto rounded-xl border border-gray-200; |
| } |
| table { |
| @apply min-w-full divide-y divide-gray-200; |
| } |
| th { |
| @apply px-6 py-3 bg-gray-50 text-left text-xs font-semibold text-gray-600 uppercase tracking-wider; |
| } |
| td { |
| @apply px-6 py-4 whitespace-nowrap text-sm text-gray-700; |
| } |
| tr:nth-child(even) { |
| @apply bg-gray-50; |
| } |
| tr:hover { |
| @apply bg-blue-50; |
| } |
| |
| |
| .btn { |
| @apply inline-flex items-center px-4 py-2 rounded-lg font-medium transition-all duration-200; |
| } |
| .btn-primary { |
| @apply bg-blue-600 text-white hover:bg-blue-700 shadow-md; |
| } |
| .btn-secondary { |
| @apply bg-gray-100 text-gray-700 hover:bg-gray-200; |
| } |
| </style> |
| </head> |
| <body class="bg-gray-50 font-sans antialiased"> |
| |
| <div class="fixed bottom-6 right-6 space-y-3 z-50 no-print"> |
| <button id="print-btn" class="btn btn-primary shadow-lg flex items-center"> |
| <i class="fas fa-print mr-2"></i> Imprimir |
| </button> |
| <button id="download-btn" class="btn btn-primary shadow-lg flex items-center"> |
| <i class="fas fa-download mr-2"></i> PDF |
| </button> |
| </div> |
|
|
| <div class="container mx-auto px-4 py-8 max-w-6xl"> |
| <div class="bg-white rounded-2xl shadow-xl overflow-hidden mb-8 animate-fade-in" id="report-content"> |
| |
| <div class="bg-gradient-to-r from-blue-700 to-blue-600 text-white p-8"> |
| <div class="flex flex-col md:flex-row justify-between items-start md:items-center"> |
| <div class="mb-4 md:mb-0"> |
| <div class="flex items-center"> |
| <div class="bg-white/20 p-2 rounded-lg mr-4"> |
| <i class="fas fa-file-invoice text-2xl"></i> |
| </div> |
| <div> |
| <h1 class="text-3xl font-bold">Relatório de Negociações PGFN</h1> |
| <p class="text-blue-100 opacity-90">MVICENTE ADVOCACIA</p> |
| </div> |
| </div> |
| </div> |
| <div class="text-right"> |
| <div class="bg-white/10 p-3 rounded-lg inline-block"> |
| <p class="text-sm text-blue-100">Gerado em: <span id="current-date" class="font-medium">30/05/2025 - 14:30</span></p> |
| </div> |
| </div> |
| </div> |
| </div> |
|
|
| |
| <div class="p-6 border-b border-gray-200"> |
| <div class="flex flex-col md:flex-row justify-between items-start md:items-center gap-4"> |
| <div> |
| <h2 class="text-2xl font-bold text-gray-800">BALUARTE EXTINTORES</h2> |
| <div class="flex items-center mt-1"> |
| <span class="text-gray-600 mr-4">42.954.300/0001-50</span> |
| <span class="text-gray-600"><i class="fas fa-calendar-alt mr-1"></i> Desde: 15/03/2010</span> |
| </div> |
| </div> |
| <div class="flex flex-col items-end"> |
| <span class="status-badge status-awaiting mb-2"> |
| <i class="fas fa-clock mr-1"></i> AGUARDANDO PAGAMENTO |
| </span> |
| <div class="text-sm text-gray-600"> |
| <span class="font-medium">Nº Negociação:</span> 12877926 |
| </div> |
| </div> |
| </div> |
| </div> |
|
|
| |
| <div class="p-6 md:p-8"> |
| |
| <div class="mb-10"> |
| <div class="flex items-center mb-6"> |
| <div class="bg-blue-100 p-2 rounded-lg mr-3"> |
| <i class="fas fa-info-circle text-blue-600"></i> |
| </div> |
| <h3 class="text-xl font-bold text-gray-800">Informações Gerais</h3> |
| </div> |
| |
| <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6"> |
| <div class="bg-gray-50 p-5 rounded-xl border border-gray-200 card-hover transition-all duration-200"> |
| <h4 class="text-sm font-semibold text-gray-500 mb-3">TIPO DE NEGOCIAÇÃO</h4> |
| <p class="text-lg font-medium text-gray-800">Parcelamento</p> |
| <p class="text-sm text-gray-600 mt-1">Modalidade: 0005 - PARCELAMENTO SEM GARANTIA</p> |
| </div> |
| |
| <div class="bg-gray-50 p-5 rounded-xl border border-gray-200 card-hover transition-all duration-200"> |
| <h4 class="text-sm font-semibold text-gray-500 mb-3">DETALHES TEMPORAIS</h4> |
| <div class="space-y-1"> |
| <p class="text-sm text-gray-700"><span class="font-medium">Adesão:</span> 29/05/2025 - 18:33</p> |
| <p class="text-sm text-gray-700"><span class="font-medium">Consolidação:</span> 29/05/2025</p> |
| <p class="text-sm text-gray-700"><span class="font-medium">Situação:</span> 29/05/2025</p> |
| </div> |
| </div> |
| |
| <div class="bg-gray-50 p-5 rounded-xl border border-gray-200 card-hover transition-all duration-200"> |
| <h4 class="text-sm font-semibold text-gray-500 mb-3">CONFIGURAÇÕES</h4> |
| <div class="space-y-1"> |
| <p class="text-sm text-gray-700"><span class="font-medium">Prestações:</span> 60 parcelas</p> |
| <p class="text-sm text-gray-700"><span class="font-medium">Débito automático:</span> Não</p> |
| <p class="text-sm text-gray-700"><span class="font-medium">Recibo:</span> 00000000000000000000</p> |
| </div> |
| </div> |
| </div> |
| </div> |
|
|
| |
| <div class="mb-10"> |
| <div class="flex items-center mb-6"> |
| <div class="bg-blue-100 p-2 rounded-lg mr-3"> |
| <i class="fas fa-chart-pie text-blue-600"></i> |
| </div> |
| <h3 class="text-xl font-bold text-gray-800">Resumo Financeiro</h3> |
| </div> |
| |
| <div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-4"> |
| <div class="bg-gradient-to-br from-blue-50 to-blue-100 p-5 rounded-xl border border-blue-200 card-hover transition-all duration-200"> |
| <div class="flex items-center justify-between"> |
| <div> |
| <p class="text-sm font-medium text-blue-600">PRINCIPAL</p> |
| <p class="text-2xl font-bold text-blue-800 mt-1">R$ 73.039,65</p> |
| </div> |
| <div class="bg-blue-100 p-2 rounded-lg"> |
| <i class="fas fa-file-invoice-dollar text-blue-600"></i> |
| </div> |
| </div> |
| </div> |
| |
| <div class="bg-gradient-to-br from-yellow-50 to-yellow-100 p-5 rounded-xl border border-yellow-200 card-hover transition-all duration-200"> |
| <div class="flex items-center justify-between"> |
| <div> |
| <p class="text-sm font-medium text-yellow-600">MULTA</p> |
| <p class="text-2xl font-bold text-yellow-800 mt-1">R$ 14.607,93</p> |
| </div> |
| <div class="bg-yellow-100 p-2 rounded-lg"> |
| <i class="fas fa-exclamation-triangle text-yellow-600"></i> |
| </div> |
| </div> |
| </div> |
| |
| <div class="bg-gradient-to-br from-purple-50 to-purple-100 p-5 rounded-xl border border-purple-200 card-hover transition-all duration-200"> |
| <div class="flex items-center justify-between"> |
| <div> |
| <p class="text-sm font-medium text-purple-600">JUROS</p> |
| <p class="text-2xl font-bold text-purple-800 mt-1">R$ 5.937,50</p> |
| </div> |
| <div class="bg-purple-100 p-2 rounded-lg"> |
| <i class="fas fa-percentage text-purple-600"></i> |
| </div> |
| </div> |
| </div> |
| |
| <div class="bg-gradient-to-br from-green-50 to-green-100 p-5 rounded-xl border border-green-200 card-hover transition-all duration-200"> |
| <div class="flex items-center justify-between"> |
| <div> |
| <p class="text-sm font-medium text-green-600">VALOR CONSOLIDADO</p> |
| <p class="text-2xl font-bold text-green-800 mt-1">R$ 102.943,58</p> |
| </div> |
| <div class="bg-green-100 p-2 rounded-lg"> |
| <i class="fas fa-hand-holding-usd text-green-600"></i> |
| </div> |
| </div> |
| </div> |
| </div> |
| </div> |
|
|
| |
| <div class="mb-10"> |
| <div class="flex items-center justify-between mb-6"> |
| <div class="flex items-center"> |
| <div class="bg-blue-100 p-2 rounded-lg mr-3"> |
| <i class="fas fa-file-invoice-dollar text-blue-600"></i> |
| </div> |
| <h3 class="text-xl font-bold text-gray-800">Débitos Incluídos</h3> |
| </div> |
| <span class="text-sm text-gray-500">1 débito encontrado</span> |
| </div> |
| |
| <div class="table-container"> |
| <table class="min-w-full"> |
| <thead> |
| <tr> |
| <th class="pl-8">Item</th> |
| <th>Código Receita</th> |
| <th>Incluído em</th> |
| <th>Principal</th> |
| <th>Multa</th> |
| <th>Juros</th> |
| <th>Encargos</th> |
| <th class="pr-8">Total</th> |
| </tr> |
| </thead> |
| <tbody> |
| <tr> |
| <td class="pl-8">1</td> |
| <td>1507</td> |
| <td>29/05/2025 - 18:33</td> |
| <td class="font-medium">R$ 73.039,65</td> |
| <td>R$ 14.607,93</td> |
| <td>R$ 5.937,50</td> |
| <td>R$ 9.358,50</td> |
| <td class="pr-8 font-bold text-blue-600">R$ 102.943,58</td> |
| </tr> |
| </tbody> |
| </table> |
| </div> |
| </div> |
|
|
| |
| <div class="mb-10"> |
| <div class="flex items-center mb-6"> |
| <div class="bg-blue-100 p-2 rounded-lg mr-3"> |
| <i class="fas fa-calculator text-blue-600"></i> |
| </div> |
| <h3 class="text-xl font-bold text-gray-800">Demonstrativo de Consolidação</h3> |
| </div> |
| |
| <div class="table-container mb-6"> |
| <table class="min-w-full"> |
| <thead> |
| <tr> |
| <th class="pl-8">Demonstrativo</th> |
| <th>Principal</th> |
| <th>Multa</th> |
| <th>Juros</th> |
| <th>Encargos</th> |
| <th class="pr-8">Total</th> |
| </tr> |
| </thead> |
| <tbody> |
| <tr> |
| <td class="pl-8">Total sem reduções (A)</td> |
| <td>R$ 73.039,65</td> |
| <td>R$ 14.607,93</td> |
| <td>R$ 5.937,50</td> |
| <td>R$ 9.358,50</td> |
| <td class="pr-8">R$ 102.943,58</td> |
| </tr> |
| <tr> |
| <td class="pl-8">Valor da entrada (s/ Redução)</td> |
| <td>R$ 0,00</td> |
| <td>R$ 0,00</td> |
| <td>R$ 0,00</td> |
| <td>R$ 0,00</td> |
| <td class="pr-8">R$ 0,00</td> |
| </tr> |
| <tr> |
| <td class="pl-8">Descontos previstos em lei (B)</td> |
| <td>R$ 0,00</td> |
| <td>R$ 0,00</td> |
| <td>R$ 0,00</td> |
| <td>R$ 0,00</td> |
| <td class="pr-8">R$ 0,00</td> |
| </tr> |
| <tr> |
| <td class="pl-8">Utilização de créditos (C)</td> |
| <td>R$ 0,00</td> |
| <td>R$ 0,00</td> |
| <td>R$ 0,00</td> |
| <td>R$ 0,00</td> |
| <td class="pr-8">R$ 0,00</td> |
| </tr> |
| <tr class="bg-blue-50"> |
| <td class="pl-8 font-semibold">Total com reduções (A - C - B)</td> |
| <td class="font-semibold">R$ 73.039,65</td> |
| <td class="font-semibold">R$ 14.607,93</td> |
| <td class="font-semibold">R$ 5.937,50</td> |
| <td class="font-semibold">R$ 9.358,50</td> |
| <td class="pr-8 font-semibold text-blue-600">R$ 102.943,58</td> |
| </tr> |
| </tbody> |
| </table |
| </html> |
