{% extends 'Backend/_layout.html.twig' %}

{% block page_title %}
<h3 class="page-title">{{ 'category' |trans({}, 'bo_surveycategory') }}
    <small>{{ 'list' |trans({}, 'bo_surveycategory') }}</small>
</h3>
{% endblock %}

{% block stylesheet %}
    <link href="{{ asset('backend/assets/global/plugins/datatables/datatables.css') }}" rel="stylesheet" type="text/css" />
    <link href="{{ asset('backend/assets/global/plugins/datatables/plugins/bootstrap/datatables.bootstrap.css') }}" rel="stylesheet" type="text/css" />
{% endblock %}

{% block content %}
    <div class="row">
        {{ include('/_widgets/flash_notifications.html.twig') }}

        <div class="col-md-12">
            <div class="portlet-body">
                <div class="table-toolbar">
                    <div class="row">
                        <div class="col-xs-12">
                            <div class="btn-group">
                                <a id="sample_editable_1_new" class="btn sbold green" href="{{ path('backend_category_new') }}">{{ 'add' |trans({}, 'bo_surveycategory') }}
                                    <i class="fa fa-plus"></i>
                                </a>
                            </div>
                        </div>
                    </div>
                </div>
                <table id="table" class="table table-striped table-bordered table-hover table-checkable order-column">
                    <thead>
                        <tr>
                            <th style="width:80px;">Id</th>
                            <th>{{ 'name' |trans({}, 'bo_surveycategory') }}</th>
                            <th>Actions</th>
                        </tr>
                    </thead>
                    <tbody>
                        {% for category in categories %}
                            <tr class="odd gradeX">
                                <td><a href="{{ path('backend_category_show', { 'id': category.id }) }}">{{ category.id }}</a></td>
                                <td>{{ category.name }}</td>
                                <td>
                                    <a href="{{ path('backend_category_show', { 'id': category.id }) }}" class="label label-success">{{ 'show_lowercase' |trans({}, 'bo_surveycategory') }}</a>
                                    <a href="{{ path('backend_category_edit', { 'id': category.id }) }}" class="label label-success">{{ 'edit' |trans({}, 'bo_surveycategory') }}</a>
                                </td>
                            </tr>
                        {% endfor %}
                    </tbody>
                </table>
            </div>
        </div>
    </div>
{% endblock %}

{% block javascript %}
    <script src="{{ asset('backend/assets/global/plugins/datatables/datatables.min.js') }}" type="text/javascript"></script>
    <script src="{{ asset('backend/assets/global/plugins/datatables/plugins/bootstrap/datatables.bootstrap.js') }}" type="text/javascript"></script>

    <script type="text/javascript">
        $(document).ready(function() {
            var table = $('#table').dataTable({
              "order": [[ 0, "desc" ]],
              "paginationType": "custom_bootstrap_number",
              "oLanguage": {
                "sSearch": "{{ 'search' |trans({}, 'bo_surveycategory') }}",
                "sLengthMenu": "{{ 'show' |trans({}, 'bo_surveycategory') }} _MENU_ {{ 'items' |trans({}, 'bo_surveycategory') }}",
              },
            });
        });
    </script>
{% endblock %}