{% extends "navbar.html" %}
{% block content %}
<div class="container-fluid flex-grow-1">
    <h1 class="h3 mb-2 text-gray-800">Transaction</h1>
    <div class="card shadow mb-4">
        <div class="card-body">
            <div class="table-responsive">
                <form action="{{ url_for('transactions.upload') }}" method="POST" enctype="multipart/form-data">
                {{ form.hidden_tag()}}
                {{ form.csrf_token }}
                {% include 'includes/display_flash_message.html' %}
                <table class="table table-bordered" width="100%" cellspacing="0" id="table">
                  <tbody>
                    <tr>
                        <td>File</td>
                        <td>
                            {%- if form.upload.errors -%}
                            <div class="form-group has-error">
                                <label class="control-label" for="inputError">{{ form.upload.errors[0] }}</label>
                                {{ form.upload }}
                            </div>
                            {%- else -%}
                                {{ form.upload }}
                            {%- endif -%}
                        </td>
                    </tr>
                    {# disable defining bank account when importing
                       transactions for now. This should be
                       re-enabled once CSV is supported but for now
                       Im going to only support OFX. }
                    <tr>
                        <td>Bank Account</td>
                        <td>
                        {%- if form.bankaccount.errors -%}
                            <div class="form-group has-error">
                                <label class="control-label" for="inputError">{{ form.bankaccount.errors[0] }}</label>
                                <select id="bankaccount" name="bankaccount" class="form-control">
                                {% for choice in form.bankaccount.choices %}
                                <option value="{{ choice.0 }}">{{choice.1}}</option>
                                {% endfor %}
                                </select>
                            </div>
                        {%- else -%}
                            <select id="bankaccount" name="bankaccount" class="form-control">
                            {% for choice in form.bankaccount.choices %}
                            <option value="{{ choice.0 }}">{{choice.1}}</option>
                            {% endfor %}
                            </select>
                        {%- endif -%}
                      </td>
                    </tr>
                    {#}
                  </tbody>
                </table>
                <div class="input-group btn-block" style="padding-top:10px;">
                    <div class="pull-left" style="padding-right:5px;">
                        <input type="submit" class="btn btn-primary" value="Import">
                    </div>
                </div>
                </form>
                </div>
            </div>
        </div>
    </div>
</div>
{% endblock %}