EraDigital's picture
criar uma análise financeira completa de fluxo de caixa a partir dos dados colados do relatório. Considerar Novembro como mês de fechamento e destacar os pontos principais como Receitas totais, Despesas totais, resultado operacional, lucro líquido, margem de contribuição, etc. Detalhar a composição das despesas e receitas (incluir a divisão das receitas, Receitas de Trafego, de Web, de Serviços, etc) e informar o PLR. Inclui também uma análise com principais pontos de atenção e diretrizes. Incluir uma projeção do fluxo da caixa. Seguem dados: FLUXO DE CAIXA Realizado (R$) Realizado (R$) Realizado (R$) Realizado (R$) Realizado (R$) Realizado (R$) Realizado (R$) Realizado (R$) Realizado (R$) Realizado (R$) Realizado (R$) Previsto (R$) Realizado (R$)
2f61e46 verified
<!DOCTYPE html>
<html lang="pt-BR">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Análise Financeira - Fluxo de Caixa</title>
<link rel="icon" type="image/x-icon" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><text y='.9em' font-size='90'>💰</text></svg>">
<script src="https://cdn.tailwindcss.com"></script>
<script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
<link rel="stylesheet" href="style.css">
<script src="script.js"></script>
<script src="components/navbar.js"></script>
<script src="components/footer.js"></script>
</head>
<body class="bg-gray-50">
<!-- Navigation -->
<custom-navbar></custom-navbar>
<!-- Main Content -->
<main class="container mx-auto px-4 py-8 max-w-7xl">
<!-- Header Section -->
<div class="bg-white rounded-xl shadow-sm p-6 mb-6">
<div class="flex flex-col md:flex-row justify-between items-start md:items-center gap-4">
<div>
<h1 class="text-3xl font-bold text-gray-800 flex items-center gap-2">
<i data-feather="trending-up" class="w-8 h-8 text-blue-600"></i>
Análise Financeira Completa
</h1>
<p class="text-gray-600 mt-2">Período: Janeiro - Novembro 2025 | Mês de Fechamento: Novembro</p>
</div>
<div class="flex gap-2">
<button onclick="exportToPDF()" class="px-4 py-2 bg-blue-600 text-white rounded-lg hover:bg-blue-700 transition-colors flex items-center gap-2">
<i data-feather="download" class="w-4 h-4"></i>
Exportar PDF
</button>
<button onclick="refreshData()" class="px-4 py-2 bg-gray-200 text-gray-700 rounded-lg hover:bg-gray-300 transition-colors flex items-center gap-2">
<i data-feather="refresh-cw" class="w-4 h-4"></i>
Atualizar
</button>
</div>
</div>
</div>
<!-- KPI Cards -->
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6 mb-8">
<div class="bg-white rounded-xl shadow-sm p-6 border-l-4 border-green-500">
<div class="flex items-center justify-between">
<div>
<p class="text-gray-600 text-sm">Receitas Totais</p>
<p class="text-2xl font-bold text-gray-800" id="totalRevenues">R$ 0</p>
<p class="text-xs text-gray-500 mt-1">Período Acumulado</p>
</div>
<div class="bg-green-100 p-3 rounded-lg">
<i data-feather="dollar-sign" class="w-6 h-6 text-green-600"></i>
</div>
</div>
</div>
<div class="bg-white rounded-xl shadow-sm p-6 border-l-4 border-red-500">
<div class="flex items-center justify-between">
<div>
<p class="text-gray-600 text-sm">Despesas Totais</p>
<p class="text-2xl font-bold text-gray-800" id="totalExpenses">R$ 0</p>
<p class="text-xs text-gray-500 mt-1">Período Acumulado</p>
</div>
<div class="bg-red-100 p-3 rounded-lg">
<i data-feather="trending-down" class="w-6 h-6 text-red-600"></i>
</div>
</div>
</div>
<div class="bg-white rounded-xl shadow-sm p-6 border-l-4 border-blue-500">
<div class="flex items-center justify-between">
<div>
<p class="text-gray-600 text-sm">Lucro Operacional</p>
<p class="text-2xl font-bold text-gray-800" id="operationalProfit">R$ 0</p>
<p class="text-xs text-gray-500 mt-1">Média Mensal</p>
</div>
<div class="bg-blue-100 p-3 rounded-lg">
<i data-feather="bar-chart-2" class="w-6 h-6 text-blue-600"></i>
</div>
</div>
</div>
<div class="bg-white rounded-xl shadow-sm p-6 border-l-4 border-purple-500">
<div class="flex items-center justify-between">
<div>
<p class="text-gray-600 text-sm">Margem Contribuição</p>
<p class="text-2xl font-bold text-gray-800" id="contributionMargin">0%</p>
<p class="text-xs text-gray-500 mt-1">Média do Período</p>
</div>
<div class="bg-purple-100 p-3 rounded-lg">
<i data-feather="pie-chart" class="w-6 h-6 text-purple-600"></i>
</div>
</div>
</div>
</div>
<!-- Charts Section -->
<div class="grid grid-cols-1 lg:grid-cols-2 gap-6 mb-8">
<div class="bg-white rounded-xl shadow-sm p-6">
<h2 class="text-xl font-semibold text-gray-800 mb-4 flex items-center gap-2">
<i data-feather="bar-chart" class="w-5 h-5"></i>
Evolução Mensal de Receitas vs Despesas
</h2>
<canvas id="monthlyFlowChart"></canvas>
</div>
<div class="bg-white rounded-xl shadow-sm p-6">
<h2 class="text-xl font-semibold text-gray-800 mb-4 flex items-center gap-2">
<i data-feather="pie-chart" class="w-5 h-5"></i>
Composição das Receitas - Novembro
</h2>
<canvas id="revenueCompositionChart"></canvas>
</div>
</div>
<!-- Detailed Analysis Section -->
<div class="grid grid-cols-1 lg:grid-cols-3 gap-6 mb-8">
<div class="lg:col-span-2 bg-white rounded-xl shadow-sm p-6">
<h2 class="text-xl font-semibold text-gray-800 mb-4 flex items-center gap-2">
<i data-feather="file-text" class="w-5 h-5"></i>
Análise Detalhada - Novembro/2025
</h2>
<div class="space-y-4">
<div class="border-l-4 border-blue-500 pl-4">
<h3 class="font-semibold text-gray-700">Receitas Totais</h3>
<p class="text-2xl font-bold text-green-600">R$ 51.009</p>
<div class="mt-2 space-y-1 text-sm">
<div class="flex justify-between">
<span class="text-gray-600">• Receita de Tráfego:</span>
<span class="font-medium">R$ 37.828 (74.2%)</span>
</div>
<div class="flex justify-between">
<span class="text-gray-600">• Web Design:</span>
<span class="font-medium">R$ 9.165 (18.0%)</span>
</div>
<div class="flex justify-between">
<span class="text-gray-600">• Serviços:</span>
<span class="font-medium">R$ 2.627 (5.1%)</span>
</div>
<div class="flex justify-between">
<span class="text-gray-600">• Outras Receitas:</span>
<span class="font-medium">R$ 1.390 (2.7%)</span>
</div>
</div>
</div>
<div class="border-l-4 border-red-500 pl-4">
<h3 class="font-semibold text-gray-700">Despesas Totais</h3>
<p class="text-2xl font-bold text-red-600">R$ 52.617</p>
<div class="mt-2 space-y-1 text-sm">
<div class="flex justify-between">
<span class="text-gray-600">• PLR (Participação Lucros):</span>
<span class="font-medium">R$ 22.964 (43.6%)</span>
</div>
<div class="flex justify-between">
<span class="text-gray-600">• Salários e Encargos:</span>
<span class="font-medium">R$ 11.294 (21.5%)</span>
</div>
<div class="flex justify-between">
<span class="text-gray-600">• Custos Variáveis:</span>
<span class="font-medium">R$ 11.391 (21.7%)</span>
</div>
<div class="flex justify-between">
<span class="text-gray-600">• Demais Despesas:</span>
<span class="font-medium">R$ 6.968 (13.2%)</span>
</div>
</div>
</div>
<div class="border-l-4 border-purple-500 pl-4">
<h3 class="font-semibold text-gray-700">Indicadores Financeiros</h3>
<div class="grid grid-cols-2 gap-4 mt-2">
<div>
<p class="text-sm text-gray-600">Resultado Operacional</p>
<p class="text-xl font-bold text-blue-600">R$ 20.249</p>
</div>
<div>
<p class="text-sm text-gray-600">Lucro Líquido</p>
<p class="text-xl font-bold text-green-600">R$ -2.715</p>
</div>
<div>
<p class="text-sm text-gray-600">Margem Contribuição</p>
<p class="text-xl font-bold text-purple-600">75.4%</p>
</div>
<div>
<p class="text-sm text-gray-600">Saldo Final Caixa</p>
<p class="text-xl font-bold text-gray-700">R$ 27.611</p>
</div>
</div>
</div>
</div>
</div>
<div class="bg-white rounded-xl shadow-sm p-6">
<h2 class="text-xl font-semibold text-gray-800 mb-4 flex items-center gap-2">
<i data-feather="alert-triangle" class="w-5 h-5"></i>
Pontos de Atenção
</h2>
<div class="space-y-3">
<div class="flex items-start gap-2">
<i data-feather="alert-circle" class="w-5 h-5 text-yellow-500 mt-0.5"></i>
<div>
<p class="text-sm font-medium text-gray-700">PLR Elevado</p>
<p class="text-xs text-gray-600">PLR representa 43.6% das despesas de Novembro</p>
</div>
</div>
<div class="flex items-start gap-2">
<i data-feather="trending-down" class="w-5 h-5 text-red-500 mt-0.5"></i>
<div>
<p class="text-sm font-medium text-gray-700">Caixa em Queda</p>
<p class="text-xs text-gray-600">Saldo reduziu 52% desde Janeiro</p>
</div>
</div>
<div class="flex items-start gap-2">
<i data-feather="target" class="w-5 h-5 text-blue-500 mt-0.5"></i>
<div>
<p class="text-sm font-medium text-gray-700">Dependência Tráfego</p>
<p class="text-xs text-gray-600">74.2% das receitas vêm de tráfego</p>
</div>
</div>
<div class="flex items-start gap-2">
<i data-feather="arrow-up" class="w-5 h-5 text-green-500 mt-0.5"></i>
<div>
<p class="text-sm font-medium text-gray-700">Boa Margem</p>
<p class="text-xs text-gray-600">Margem de contribuição de 75.4% é saudável</p>
</div>
</div>
</div>
</div>
</div>
<!-- Cash Flow Projection -->
<div class="bg-white rounded-xl shadow-sm p-6 mb-8">
<h2 class="text-xl font-semibold text-gray-800 mb-4 flex items-center gap-2">
<i data-feather="activity" class="w-5 h-5"></i>
Projeção de Fluxo de Caixa - Próximos 6 Meses
</h2>
<canvas id="projectionChart"></canvas>
<div class="mt-6 p-4 bg-blue-50 rounded-lg">
<h3 class="font-semibold text-gray-700 mb-2">Diretrizes e Recomendações:</h3>
<ul class="space-y-2 text-sm text-gray-600">
<li class="flex items-start gap-2">
<i data-feather="check-circle" class="w-4 h-4 text-green-500 mt-0.5"></i>
<span>Reduzir PLR para máximo 30% do lucro operacional para melhorar fluxo</span>
</li>
<li class="flex items-start gap-2">
<i data-feather="check-circle" class="w-4 h-4 text-green-500 mt-0.5"></i>
<span>Diversificar fontes de receita para reduzir dependência de tráfego</span>
</li>
<li class="flex items-start gap-2">
<i data-feather="check-circle" class="w-4 h-4 text-green-500 mt-0.5"></i>
<span>Renegociar contratos de prestadores de serviço para reduzir custos variáveis</span>
</li>
<li class="flex items-start gap-2">
<i data-feather="check-circle" class="w-4 h-4 text-green-500 mt-0.5"></i>
<span>Implementar controle mais rigoroso de despesas administrativas</span>
</li>
<li class="flex items-start gap-2">
<i data-feather="check-circle" class="w-4 h-4 text-green-500 mt-0.5"></i>
<span>Manter reserva mínima de caixa equivalente a 2 meses de despesas fixas</span>
</li>
</ul>
</div>
</div>
<!-- Detailed Table -->
<div class="bg-white rounded-xl shadow-sm p-6">
<h2 class="text-xl font-semibold text-gray-800 mb-4 flex items-center gap-2">
<i data-feather="table" class="w-5 h-5"></i>
Resumo Mensal Consolidado
</h2>
<div class="overflow-x-auto">
<table class="w-full text-sm">
<thead>
<tr class="border-b-2 border-gray-200">
<th class="text-left py-2 px-3">Mês</th>
<th class="text-right py-2 px-3">Receitas</th>
<th class="text-right py-2 px-3">Despesas</th>
<th class="text-right py-2 px-3">Resultado</th>
<th class="text-right py-2 px-3">Saldo Caixa</th>
</tr>
</thead>
<tbody id="monthlyTable">
<!-- Table will be populated by JavaScript -->
</tbody>
</table>
</div>
</div>
</main>
<!-- Footer -->
<custom-footer></custom-footer>
<script>
feather.replace();
</script>
<script src="https://huggingface.co/deepsite/deepsite-badge.js"></script>
</body>
</html>