{% extends "base.html" %}

{% block navbar_start %}
<div class="navbar-item">{{ gettext("Register consumption") }}</div>
{% endblock %}

{% block content %}
<div class="section has-text-centered">
    <div class="columns">
        <div class="column"></div>
        <div class="column is-6">
            <h1 class="title">
                {{ gettext("Register consumption") }}
            </h1>
            <br>
            <div class="content">
                {% if form.general_errors %}
                <ul>
                  {% for error in form.general_errors %}
                  <li>{{ error }}</li>
                  {% endfor %}
                </ul>
                {% endif %}
                <form method="post">
                    <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
                    <div class="field">
                        <label class="label">{{ gettext("Plan ID") }}</label>
                        <div class="control">
                          <input
                            class="input"
                            id="plan_id"
                            name="plan_id"
                            placeholder="{{ gettext('Plan ID') }}"
                            type="text"
                            value="{{ form.plan_id_value }}"
                            required
                            >
                        </div>
                        {% if form.plan_id_errors %}
                        <ul>
                          {% for error in form.plan_id_errors %}
                          <li>{{ error }}</li>
                          {% endfor %}
                        </ul>
                        {% endif %}
                    </div>
                    <div class="field">
                        <label class="label">{{ gettext("Amount") }}</label>
                        <div class="control">
                          <input
                            class="input"
                            id="amount"
                            name="amount"
                            placeholder="{{ gettext('Amount') }}"
                            type="text"
                            value="{{ form.amount_value }}"
                            required
                            >
                        </div>
                        {% if form.amount_errors %}
                        <ul>
                          {% for error in form.amount_errors %}
                          <li>{{ error }}</li>
                          {% endfor %}
                        </ul>
                        {% endif %}
                    </div>
                    <div class="field">
                        <div class="control">
                            <button class="button is-primary" type="submit">{{ gettext("Register") }}</button>
                        </div>
                    </div>
                </form>
            </div>
        </div>
        <div class="column"></div>
    </div>
</div>

{% endblock %}