{% extends 'base.html.twig' %}

{% block title %}Transactions{% endblock %}




{% block body %}
    {{ form_start(filters) }}

    <div class="d-flex flex-column flex-lg-row justify-content-between align-items-lg-end">


        <div class="form-group">

            {{ form_label(filters.trnType) }}

            {{ form_widget(filters.trnType) }}

        </div>

        <div class="form-group">

            {{ form_label(filters.startDate) }}

            {{ form_widget(filters.startDate) }}

        </div>

        <div class="form-group">

            {{ form_label(filters.endDate) }}

            {{ form_widget(filters.endDate) }}

        </div>

        <div class="form-group d-flex">

            <button class="btn btn-light mr-3">Filter</button>


            <a data-toggle="tooltip" title="Clear" href="{{ path(app.request.get('_route'),app.request.attributes.get('_route_params')) }}"
               class="btn btn-icon btn-secondary"><i class="la la-trash"></i></a>

            <div class="ml-5">

{#                                    <a class="btn btn-outline-info" data-toggle="tooltip" title="Export Excel"#}
{#                                       href="{{ path('transactions_export',app.request.query.all()) }}">#}

{#                                        <i class="fas fa-file-excel"></i>#}

{#                                    </a>#}

            </div>

        </div>

    </div>

    {{ form_end(filters) }}




    {% include 'transactions/_partials/trn-table.html.twig' %}



{% endblock %}

{% block js %}

    <script src="{{ asset('assets/js/bootstrap-datepicker.js') }}"></script>

    <script type="text/javascript">
        $('#trn_filter_startDate').datepicker({format: 'yyyy-mm-dd'});
        $('#trn_filter_endDate').datepicker({format: 'yyyy-mm-dd'});
    </script>


{% endblock %}