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

{% block title %}{{ (transPrefix ~ '.list')|trans }}{% endblock %}
{% block main %}
<tigris-data-list route="{{ routePrefix }}_data" :init-filters='{"search":"", "type":"all"}' update-route="tigris_reaction_admin_comment_changepart" v-slot="{loadData, entities, filters, totalCount, begin, end, sort, updateEntity}">
{% embed '@TigrisBase/decorators/_card.html.twig' with {'class': ''} %}
    {% block body %}
    <div class="d-flex justify-space-between">
        <div>
            
        </div>

        <div class="form-group ms-auto ms-auto">
            <label><small>{{ 'results_per_page'|trans }}</small></label>
            <item-count-select></item-count-select>
        </div>
    </div>
    {% endblock %}
    {% block table %}
    <table class="table table-striped" :class="{loading: loading}">
        <thead>
            <tr>
                <th>{{ 'reaction.comment.user'|trans }}</th>
                <th>{{ 'reaction.comment.comment'|trans }}</th>
                <th>{{ 'reaction.comment.element'|trans }}</th>
                <th><sort-item label="{{ 'reaction.comment.created_at'|trans }}" value="createdAt" v-on:change="sort"></sort-item></th>
                <th>{{ 'reaction.comment.public'|trans }}</th>
                <th>{{ 'actions'|trans }}</th>
            </tr>
        </thead>
        <tbody>
            <tr v-for="entity in entities" :key="entity.id">
                <td>
                    <span v-if="entity.user !== null">${ entity.user.username }</span>
                    <span v-else>${ entity.username }</span>
                </td>
                <td>
                    ${ $filters.truncate(entity.content, 80) }
                </td>
                <td>
                    ${ entity.entityTitle }
                </td>
                <td>
                    ${ $filters.formatDate(entity.createdAt) }
                </td>
                <td class="text-light" :class="{'bg-success': entity.public, 'bg-warning': !entity.public}">
                    <div class="form-check form-switch">
                        <input 
                            type="checkbox" 
                            v-model="entity.public" 
                            v-on:change="updateEntity()" 
                            class="form-check-input" 
                            :id="'public-' + entity.id"
                        >
                        <label class="form-check-label" :for="'public-' + entity.id">
                            <small v-if="!entity.public">{{ 'no'|trans }}</small>
                            <small v-if="entity.public">{{ 'yes'|trans }}</small>
                        </label>
                    </div>
                
                </td>
                <td>
                    <div class="btn-group btn-group-sm">
                        <button-action route="tigris_reaction_admin_comment_show" type="light" :route-params="{id:entity.id}" :modal="true">{{ '.icon-eye'|parse_icons }}</button-action>
                        <button-action v-on:formsaved="loadData()" route="tigris_reaction_admin_comment_edit" :route-params="{id:entity.id}" type="light" :modal="true">{{ '.icon-pencil'|parse_icons }}</button-action>
                        <button-action v-on:formsaved="loadData()" route="tigris_reaction_admin_comment_delete" :route-params="{id:entity.id}" type="danger" :modal="true">{{ '.icon-trash'|parse_icons }}</button-action>
                    </div>
                </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 %}