{% extends '@TigrisBase/admin/layout.html.twig' %}

{% block title %}{{ 'menu.albums'|trans|parse_icons }}{% endblock %}
{% block main %}
<tigris-data-list route="app_admin_album_data" :init-filters="{search: ''}" v-slot="{entities, filters, countPerPage, order, loading, loadData, sort, begin, end, totalCount, pageCount}">
    {% embed '@TigrisBase/decorators/_card.html.twig' %}
    {% block body %}
        <form action="" method="GET" class="d-flex justify-content-between align-items-center">
            <div class="d-flex align-items-center">
                <div class="form-group ms-2">
                    <label class="form-label"><small>{{ 'user.search'|trans }}</small></label>
                    <div class="input-group ">
                        <span class="input-group-text">{{ '.icon-search'|parse_icons }}</span>
                        <input type="text" class="form-control" v-model="filters.search"/>
                    </div>
                </div>
            </div>

            <div>
                <div class="form-group">
                    <label><small>{{ 'results_per_page'|trans }}</small></label>
                    <item-count-select/>
                </div>
            </div>
        </form>
        {% endblock %}
        {% block table %}
            <table class="table table-striped">
                <thead>
                    <tr>
                        <th>{{ 'album.name'|trans }}</th>
                        <th>{{ 'album.author'|trans }}</th>
                        <th>{{ 'album.media_count'|trans }}</th>
                        <th>{{ 'actions'|trans }}</th>
                    </tr>
                </thead>

                 <tbody>
                    <tr v-for="entity in entities" :key="entity.id">
                        <td>${ entity.name }</td>
                        <td>${ entity.author.username }</td>
                        <td>${ entity.mediaCount }</td>
                        <td>
                            <button-action route="app_admin_album_resetdates" :route-params="{id: entity.id}" class="btn btn-secondary btn-sm" :modal="true" v-on:formsaved="loadData()">
                                {{ '.icon-calendar'|parse_icons }}
                            </button-action>
                        </td>
                    </tr>
                </tbody>
            </table>
        {% endblock %}
        {% block footer %}
            <div class="data-list-footer">
                <div>
                    <em>{{ 'data_count'|trans({'%begin%':'${begin}', '%end%':'${end}', '%total%':'${totalCount}'}) }}</em>
                </div>
                <pagination></pagination>
            </div>
        {% endblock %}
    {% endembed %}
</tigris-data-list>
{% endblock %}