|
|
<!DOCTYPE html> |
|
|
<html lang="pt-BR"> |
|
|
<head> |
|
|
<meta charset="UTF-8" /> |
|
|
<meta name="viewport" content="width=device-width, initial-scale=1" /> |
|
|
<title>Simulador de Investimentos</title> |
|
|
<style> |
|
|
body { |
|
|
font-family: 'Segoe UI', sans-serif; |
|
|
background-color: #f4f6f9; |
|
|
color: #333; |
|
|
padding: 20px; |
|
|
margin: 0; |
|
|
} |
|
|
h1, h2 { |
|
|
text-align: center; |
|
|
color: #2c3e50; |
|
|
} |
|
|
form { |
|
|
background: #fff; |
|
|
max-width: 600px; |
|
|
margin: 0 auto 30px auto; |
|
|
padding: 30px; |
|
|
border-radius: 10px; |
|
|
box-shadow: 0 2px 10px rgba(0,0,0,0.1); |
|
|
} |
|
|
label { |
|
|
display: block; |
|
|
margin-bottom: 6px; |
|
|
font-weight: 600; |
|
|
color: #555; |
|
|
} |
|
|
input[type="number"] { |
|
|
width: 100%; |
|
|
padding: 10px; |
|
|
margin-bottom: 16px; |
|
|
border: 1px solid #ccc; |
|
|
border-radius: 5px; |
|
|
box-sizing: border-box; |
|
|
} |
|
|
button { |
|
|
width: 100%; |
|
|
padding: 12px; |
|
|
background: #007bff; |
|
|
color: white; |
|
|
border: none; |
|
|
font-size: 1em; |
|
|
border-radius: 5px; |
|
|
cursor: pointer; |
|
|
margin-top: 10px; |
|
|
transition: background 0.3s; |
|
|
} |
|
|
button:hover { |
|
|
background: #0056b3; |
|
|
} |
|
|
.grafico { |
|
|
text-align: center; |
|
|
margin-bottom: 40px; |
|
|
} |
|
|
table { |
|
|
width: 95%; |
|
|
margin: 20px auto; |
|
|
border-collapse: collapse; |
|
|
background: white; |
|
|
border-radius: 8px; |
|
|
overflow: hidden; |
|
|
box-shadow: 0 2px 8px rgba(0,0,0,0.05); |
|
|
} |
|
|
th, td { |
|
|
padding: 12px 15px; |
|
|
border: 1px solid #ddd; |
|
|
text-align: right; |
|
|
} |
|
|
th { |
|
|
background-color: #007bff; |
|
|
color: white; |
|
|
text-align: center; |
|
|
} |
|
|
tr:hover { |
|
|
background-color: #f1f1f1; |
|
|
} |
|
|
.resultado-destaque { |
|
|
max-width: 800px; |
|
|
margin: 30px auto; |
|
|
background: #e8f5e9; |
|
|
color: #2e7d32; |
|
|
padding: 20px; |
|
|
font-size: 1.2em; |
|
|
font-weight: bold; |
|
|
text-align: center; |
|
|
border-left: 6px solid #2e7d32; |
|
|
border-radius: 6px; |
|
|
} |
|
|
.botao-pdf { |
|
|
text-align: center; |
|
|
margin-top: 30px; |
|
|
} |
|
|
.botao-pdf form { |
|
|
display: inline-block; |
|
|
} |
|
|
@media print { |
|
|
form, .botao-pdf, button { |
|
|
display: none !important; |
|
|
} |
|
|
} |
|
|
</style> |
|
|
</head> |
|
|
<body> |
|
|
|
|
|
<h1>Simulador de Investimentos</h1> |
|
|
|
|
|
<form method="post" action="/"> |
|
|
<label for="capital">Capital Inicial (R$):</label> |
|
|
<input type="number" id="capital" name="capital" step="0.01" required value="{{ capital or 400000 }}"> |
|
|
|
|
|
<label for="studio_ret">Retorno Mensal do Studio (%):</label> |
|
|
<input type="number" id="studio_ret" name="studio_ret" step="0.01" required value="{{ studio_ret or 1 }}"> |
|
|
|
|
|
<label for="valorizacao">Valorização Anual do Imóvel (%):</label> |
|
|
<input type="number" id="valorizacao" name="valorizacao" step="0.01" required value="{{ valorizacao or 4 }}"> |
|
|
|
|
|
<label for="franquia_ret">Lucro Anual da Franquia (R$):</label> |
|
|
<input type="number" id="franquia_ret" name="franquia_ret" step="0.01" required value="{{ franquia_ret or 40000 }}"> |
|
|
|
|
|
<label for="acoes_ret">Retorno Anual em Ações (%):</label> |
|
|
<input type="number" id="acoes_ret" name="acoes_ret" step="0.01" required value="{{ acoes_ret or 11 }}"> |
|
|
|
|
|
<label for="renda_fixa">Retorno Anual Renda Fixa (%):</label> |
|
|
<input type="number" id="renda_fixa" name="renda_fixa" step="0.01" required value="{{ renda_fixa or 12 }}"> |
|
|
|
|
|
<label for="inflacao">Inflação Anual Esperada (%):</label> |
|
|
<input type="number" id="inflacao" name="inflacao" step="0.01" required value="{{ inflacao or 5 }}"> |
|
|
|
|
|
<button type="submit">Rodar Simulação</button> |
|
|
</form> |
|
|
|
|
|
{% if tabela %} |
|
|
<div class="grafico"> |
|
|
<h2>Gráfico Comparativo</h2> |
|
|
<img src="data:image/png;base64,{{ grafico }}" alt="Gráfico de Investimentos" /> |
|
|
</div> |
|
|
|
|
|
<div> |
|
|
{{ tabela | safe }} |
|
|
</div> |
|
|
|
|
|
<div class="resultado-destaque"> |
|
|
Investimento com maior retorno: <span style="color:#1b5e20;">{{ investimento_mais_valorizado }}</span><br> |
|
|
Valor final estimado: <span style="color:#1b5e20;">R$ {{ valor_mais_alto | round(2) | string | replace('.', ',') }}</span> |
|
|
</div> |
|
|
|
|
|
<div class="botao-pdf"> |
|
|
<form action="/download_pdf" method="post"> |
|
|
<input type="hidden" name="capital" value="{{ capital }}"> |
|
|
<input type="hidden" name="studio_ret" value="{{ studio_ret }}"> |
|
|
<input type="hidden" name="valorizacao" value="{{ valorizacao }}"> |
|
|
<input type="hidden" name="franquia_ret" value="{{ franquia_ret }}"> |
|
|
<input type="hidden" name="acoes_ret" value="{{ acoes_ret }}"> |
|
|
<input type="hidden" name="renda_fixa" value="{{ renda_fixa }}"> |
|
|
<input type="hidden" name="inflacao" value="{{ inflacao }}"> |
|
|
<button type="submit" style="background: #28a745;">Gerar PDF do Relatório</button> |
|
|
</form> |
|
|
</div> |
|
|
{% endif %} |
|
|
|
|
|
</body> |
|
|
</html> |
|
|
|
|
|
|
|
|
|
