|
|
<!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> |
|
|
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" /> |
|
|
<style> |
|
|
body { padding: 20px; background: #f9f9f9; } |
|
|
.form-label { font-weight: 600; } |
|
|
.table-container { overflow-x: auto; } |
|
|
.analise { margin-top: 20px; padding: 20px; background: white; border-radius: 8px; box-shadow: 0 0 6px #ccc; } |
|
|
.grafico img { max-width: 100%; height: auto; border-radius: 8px; box-shadow: 0 0 6px #ccc; } |
|
|
</style> |
|
|
</head> |
|
|
<body> |
|
|
|
|
|
<div class="container"> |
|
|
<h1 class="mb-4">Simulador de Investimentos - 5 anos</h1> |
|
|
|
|
|
<form method="POST" class="row g-3"> |
|
|
<div class="col-md-4"> |
|
|
<label for="capital" class="form-label">Capital Inicial (R$)</label> |
|
|
<input type="number" step="0.01" min="0" name="capital" id="capital" class="form-control" required value="{{ capital or '' }}" /> |
|
|
</div> |
|
|
<div class="col-md-4"> |
|
|
<label for="studio_ret" class="form-label">Rendimento mensal Studio (%)</label> |
|
|
<input type="number" step="0.01" min="0" max="100" name="studio_ret" id="studio_ret" class="form-control" required value="{{ request.form.get('studio_ret', '') }}" /> |
|
|
</div> |
|
|
<div class="col-md-4"> |
|
|
<label for="valorizacao" class="form-label">Valorização anual Studio (%)</label> |
|
|
<input type="number" step="0.01" min="0" max="100" name="valorizacao" id="valorizacao" class="form-control" required value="{{ request.form.get('valorizacao', '') }}" /> |
|
|
</div> |
|
|
|
|
|
<div class="col-md-4"> |
|
|
<label for="franquia_ret" class="form-label">Rendimento anual Franquia (R$)</label> |
|
|
<input type="number" step="0.01" min="0" name="franquia_ret" id="franquia_ret" class="form-control" required value="{{ request.form.get('franquia_ret', '') }}" /> |
|
|
</div> |
|
|
<div class="col-md-4"> |
|
|
<label for="acoes_ret" class="form-label">Retorno anual Ações (%)</label> |
|
|
<input type="number" step="0.01" min="0" max="100" name="acoes_ret" id="acoes_ret" class="form-control" required value="{{ request.form.get('acoes_ret', '') }}" /> |
|
|
</div> |
|
|
<div class="col-md-4"> |
|
|
<label for="renda_fixa" class="form-label">Retorno anual Renda Fixa (%)</label> |
|
|
<input type="number" step="0.01" min="0" max="100" name="renda_fixa" id="renda_fixa" class="form-control" required value="{{ request.form.get('renda_fixa', '') }}" /> |
|
|
</div> |
|
|
|
|
|
<div class="col-md-4"> |
|
|
<label for="inflacao" class="form-label">Inflação anual (%)</label> |
|
|
<input type="number" step="0.01" min="0" max="100" name="inflacao" id="inflacao" class="form-control" required value="{{ request.form.get('inflacao', '') }}" /> |
|
|
</div> |
|
|
|
|
|
<div class="col-12"> |
|
|
<button type="submit" class="btn btn-primary">Calcular</button> |
|
|
</div> |
|
|
</form> |
|
|
|
|
|
{% if tabela %} |
|
|
<hr /> |
|
|
<h2 class="mt-4">Tabela de Projeções</h2> |
|
|
<div class="table-container"> |
|
|
{{ tabela | safe }} |
|
|
</div> |
|
|
{% endif %} |
|
|
|
|
|
{% if grafico %} |
|
|
<div class="grafico mt-4"> |
|
|
<h2>Gráfico de Projeção</h2> |
|
|
<img src="data:image/png;base64,{{ grafico }}" alt="Gráfico de Projeção" /> |
|
|
</div> |
|
|
{% endif %} |
|
|
|
|
|
{% if analise_final %} |
|
|
<div class="analise"> |
|
|
<h2>Análise da IA</h2> |
|
|
{{ analise_final | safe }} |
|
|
</div> |
|
|
{% endif %} |
|
|
</div> |
|
|
|
|
|
</body> |
|
|
</html> |
|
|
|