{% extends 'base.html.twig' %}
{% block searchform_container %}{% endblock %}
{% block title %}
    Categorías de gastos
{% endblock %}

{% block body %}

<div class="box box-primary">

    <div class="box-header with-border">

        <h3 class="box-title">
            <i class="fa fa-folder"></i>
            Categorías de gastos
        </h3>

        <div class="box-tools pull-right">

            <a href="{{ path('gastos_index') }}" class="btn btn-default btn-sm">
                <i class="fa fa-arrow-left"></i>
                Volver a gastos
            </a>

            <a href="{{ path('gastos_categoria_nueva') }}" class="btn btn-primary btn-sm">
                <i class="fa fa-plus"></i>
                Nueva categoría
            </a>

        </div>

    </div>

    <div class="box-body">

        {% for message in app.flashes('success') %}

            <div class="alert alert-success">
                <button type="button" class="close" data-dismiss="alert">&times;</button>
                <i class="fa fa-check"></i>
                {{ message }}
            </div>

        {% endfor %}

        {% for message in app.flashes('error') %}

            <div class="alert alert-danger">
                <button type="button" class="close" data-dismiss="alert">&times;</button>
                <i class="fa fa-warning"></i>
                {{ message }}
            </div>

        {% endfor %}

        {% if categorias|length > 0 %}

            <div class="table-responsive">

                <table class="table table-bordered table-striped">

                    <thead>

                        <tr>
                            <th style="width: 60px;">#</th>
                            <th>Nombre</th>
                            <th>Descripción</th>
                            <th style="width: 100px;">Estado</th>
                            <th style="width: 150px;">Acciones</th>
                        </tr>

                    </thead>

                    <tbody>

                        {% for categoria in categorias %}

                            <tr>

                                <td>
                                    {{ categoria.id }}
                                </td>

                                <td>
                                    <strong>{{ categoria.nombre }}</strong>
                                </td>

                                <td>
                                    {% if categoria.descripcion %}
                                        {{ categoria.descripcion }}
                                    {% else %}
                                        -
                                    {% endif %}
                                </td>

                                <td>

                                    {% if categoria.activo %}

                                        <span class="label label-success">
                                            Activa
                                        </span>

                                    {% else %}

                                        <span class="label label-default">
                                            Inactiva
                                        </span>

                                    {% endif %}

                                </td>

                                <td>

                                    <a
                                        href="{{ path('gastos_categoria_editar', {'id': categoria.id}) }}"
                                        class="btn btn-primary btn-xs"
                                        title="Editar"
                                    >
                                        <i class="fa fa-edit"></i>
                                    </a>

                                    <form
                                        method="post"
                                        action="{{ path('gastos_categoria_eliminar', {'id': categoria.id}) 
}}"
                                        style="display:inline;"
                                        onsubmit="return confirm('¿Está seguro de eliminar esta 
categoría?');"
                                    >

                                        <button
                                            type="submit"
                                            class="btn btn-danger btn-xs"
                                            title="Eliminar"
                                        >
                                            <i class="fa fa-trash"></i>
                                        </button>

                                    </form>

                                </td>

                            </tr>

                        {% endfor %}

                    </tbody>

                </table>

            </div>

        {% else %}

            <div class="alert alert-info">

                <i class="fa fa-info-circle"></i>

                No existen categorías de gastos registradas.

                <br><br>

                <a
                    href="{{ path('gastos_categoria_nueva') }}"
                    class="btn btn-primary btn-sm"
                >
                    <i class="fa fa-plus"></i>
                    Crear primera categoría
                </a>

            </div>

        {% endif %}

    </div>

</div>

{% endblock %}