{% import "helpers.html.twig" as helpers %}

{% extends '@Admin/base.html.twig' %}

{% block title %}
    {{ '_LIST_CATEGORY_'|trans({},'admin') }}
    <a href="{{ path('new_category') }}" class="btn btn-primary btn-sm">{{ '_CREATE_CATEGORY_'|trans({},'admin') }}</a>
{% endblock %}

{% block body %}
    <form class="form-inline">
        <div class="form-group">
            <label class="control-label" for="status">{{ '_NAME_'|trans({},'admin') }}</label>
            <input type="name" name="name" class="form-control">
        </div>
        <div class="form-group">
            <label class="control-label" for="status">{{ '_STATUS_'|trans({},'admin') }}</label>
            <select id="status" name="status" class="form-control">
                <option value="" selected="selected">الكل</option>
                <option value="1">مشغل</option>
                <option value="2">معطل</option>
            </select>
        </div>
        <div class="form-group">
            <button type="submit" class="btn btn-primary">{{ '_SEARCH_'|trans({},'admin') }}</button>
        </div>
    </form>
    <div class="table-responsive">
        <table id="mytable" class="table table-bordred table-striped">
            <thead>
            <tr>
                <th>Id</th>
                <th>{{ '_NAME_'|trans({},'admin') }}</th>
                <th>{{ '_TYPE_'|trans({},'admin') }}</th>
                <th>{{ '_STATUS_'|trans({},'admin') }}</th>
                <th>{{ '_EDIT_'|trans({},'admin') }}</th>
            </tr>
            </thead>
            <tbody>
            {% for category in categories %}
            <tr>
                <td>{{ category.id }}</td>
                <td><a href="{{ category.getUrl('https://elfann.com/') }}">{{ category.getName() }}</a></td>
                <td>
                    <span class="flag flag-{{ category.displayStatus() }}" title="{{ category.displayStatus() }}"></span>
                </td>
                <td>
                    {{ category.type }}
                </td>
                <td><a class="btn btn-primary btn-xs" data-title="Edit" href="{{ path('edit_category',{'id':category.id}) }}" ><span class="glyphicon glyphicon-pencil"></span></a>
                </td>
            </tr>
                {% for childCategory in category.childs %}
                <tr class="childRow">
                    <td>{{ childCategory.id }}</td>
                    <td class="childCategory"><span>{{ category.getName() }} &#187;</span> <a href="{{ category.getUrl('https://elfann.com/') }}">{{ childCategory.getName() }}</a></td>
                    <td>
                        <span class="flag flag-{{ childCategory.displayStatus() }}" title="{{ childCategory.displayStatus() }}"></span>
                    </td>
                    <td>
                        {{ childCategory.type }}
                    </td>
                    <td><a class="btn btn-primary btn-xs" data-title="Edit" href="{{ path('edit_category',{'id':childCategory.id}) }}" ><span class="glyphicon glyphicon-pencil"></span></a>
                    </td>
                </tr>
                {% endfor %}
            {% endfor %}
            </tbody>
        </table>
    </div>
<style>
    .childCategory span{
        color: #afafaf;
    }
</style>
{% endblock %}