{% extends 'base.html' %}
{% block content %}
FILTERED DATES
<br>

<form method="post" action="/yearlyonline">
    <br>
    <div class="form-row" style="border: 1px solid black">
        <div class="form-group col-md-4">
            <label for="cars">Conto</label>
            <select id="cars" name="conto" class="form-control">
                    <option value="all">all</option>
                    <option value="EC">EC</option>
                    <option value="Siri&Radu">Siri&Radu</option>
                    <option value="N26">N26</option>
                    <option value="DeutscheBank">DeutscheBank</option>
            </select>
        </div>
        <div class="form-group col-md-4">
            <label>Monthly</label>
            <select id="ffff" name="month" class="form-control">
                    <option value="month">month</option>
                    <option value="January">January</option>
                    <option value="February">February</option>
                    <option value="March">March</option>
                    <option value="April">April</option>
                    <option value="June">June</option>
                    <option value="July">July</option>
                    <option value="August">August</option>
                    <option value="September">September</option>
                    <option value="October">October</option>
                    <option value="November">November</option>
                    <option value="December">December</option>
            </select>
        </div>
        <div class="form-group col-md-4">
            <label>Year</label>
            <select id="year" name="year" class="form-control">
                    <option value="2026">2026</option>
                    <option value="2025">2025</option>
                    <option value="2024">2024</option>
                    <option value="2023">2023</option>
                    <option value="2022">2022</option>
                    <option value="2021">2021</option>
                    <option value="2020">2020</option>
            </select>
        </div>
        <div class="form-group col-md-4">
            <label>Year before</label>
            <input value=1 name="year_before" type="checkbox">
        </div>
        <button type="submit" class="btn btn-primary">set</button>
    </div>
    <br>
</form>
<br>
<div class="container text-center" style="border: 1px solid black">
    <div class="row">
        <div class="col">
        Conto: {{conto}}
        </div>
        <div class="col">
        year: {{year}}
        </div>
        <div class="col">
        month: {{month}}
        </div>

    </div>
</div>
<br>
<div class="container text-center" style="border: 1px solid black">
    <div class="row">
            <div class="col">
                EXPENSES:
            </div>
    </div>
    <br>
    <div class="row">
            <div class="col">
                <a href="/yearlyonline_detiled/planned_expenses/{{year}}/{{month}}/{{conto}}">Planned</a>
            </div>
            <div class="col">
                <a href="/yearlyonline_detiled/real_expenses/{{year}}/{{month}}/{{conto}}">Real</a>
            </div>
            <div class="col">
                <a href="/yearlyonline_detiled/expenses_year_before/{{year}}/{{month}}/{{conto}}">Year {{year - 1}}</a>
            </div>
    </div>
    <div class="row">
            <div class="col">
                Total: {{tot_val_of_planned_expenses}}
            </div>
            <div class="col">
                Total: {{tot_val_of_real_expenses}}
            </div>
            <div class="col">
                Total: {{tot_val_of_real_expenses_year_before}}
            </div>
    </div>
    <div class="row">
            <div class="col">
                Average: {{planned_expenses_average}}
            </div>
            <div class="col">
                Average: {{average_val_of_real_expenses}}
            </div>
            <div class="col">
                Average: {{average_val_of_real_expenses_year_before}}
            </div>
    </div>
</div>
<br>
<div class="container text-center" style="border: 1px solid black">
    <div class="row">
            <div class="col">
                INCOME:
            </div>
    </div>
    <br>
    <div class="row">
            <div class="col">
                <a href="/yearlyonline_detiled/planned_income/{{year}}/{{month}}/{{conto}}">Planned</a>
            </div>
            <div class="col">
                <a href="/yearlyonline_detiled/real_income/{{year}}/{{month}}/{{conto}}">Real</a>
            </div>
            <div class="col">
                <a href="/yearlyonline_detiled/income_year_before/{{year}}/{{month}}/{{conto}}">Year {{year - 1}}</a>
            </div>
    </div>
    <div class="row">
            <div class="col">
                Total: {{tot_val_of_planned_income}}
            </div>
            <div class="col">
                Total: {{tot_val_of_real_income}}
            </div>
            <div class="col">
                Total: {{tot_val_of_real_income_year_before}}
            </div>
    </div>
    <div class="row">
            <div class="col">
                Average: {{average_val_of_planned_income}}
            </div>
            <div class="col">
                Average: {{average_val_of_real_income}}
            </div>
            <div class="col">
                Average: {{average_val_of_real_income_year_before}}
            </div>
    </div>
</div>
<br>

{% endblock %}