{% extends "layout.html" %}
{% block content %}

<h1>Přehled importovaných dávek</h1>

<table id="batch_list" class="table table-striped table-hovered table-hover">
    <thead class="thead-dark">
        <tr>
            <th>Číslo</th>
            <th>Importováno</th>
            <th>Odběrné místo</th>
            <th>Odstranit</th>
        </tr>
    </thead>
    <tbody>
        {% for batch in batches %}
        <tr>
            <td><a href="{{ url_for('batch.batch_detail', id=batch.id) }}">{{ batch.id}}</a></td>
            <td data-sort="{{ batch.imported_at }}">{{ batch.imported_at|format_time}}</td>
            <td>{{ batch.donation_center.title or "Jinde"}}</td>
            <td>
                {% with form=delete_batch_form %}
                <form id="deleteBatchForm" action="{{ url_for('batch.delete_batch') }}" method="POST"
                    class="form-inline" role="form">
                    <div class="form-group">
                        {{ form.csrf_token }}
                        {{ form.batch_id(value=batch.id) }}
                        <input type="submit" class="btn btn-sm btn-danger" value="🗑">
                    </div>
                </form>
                {% endwith %}
            </td>
        </tr>
        {% endfor %}
    </tbody>
</table>

{% endblock %}

{% block js %}
<script type="text/javascript">
    $(document).ready(function () {
        $.fn.dataTable.ext.order.intl('cs-CZ');

        $('#batch_list').DataTable({
            stateSave: true,
            stateDuration: -1, // -1 means session storage in the current browser window
            language: {
                url: '//cdn.datatables.net/plug-ins/1.10.21/i18n/Czech.json'
            },
            lengthMenu: [
                [10, 25, 50, 100, -1],
                [10, 25, 50, 100, 'Všechny']
            ],
        });
    });
</script>
{% endblock %}