{% extends "FactelBundle::Layout.html.twig" %}
{% block css %}
    <!-- DataTables CSS -->
    <link href="{{asset('recursos/bower_components/datatables-plugins/integration/bootstrap/3/dataTables.bootstrap.css')}}" rel="stylesheet">
    <!-- DataTables Responsive CSS -->
    <link href="{{asset('recursos/bower_components/datatables-responsive/css/dataTables.responsive.css')}}" rel="stylesheet">
    <link href="{{asset('garyavendanio/uikit/css/uikit.min.css')}}" rel="stylesheet">
{% endblock %}

{% block panel_title %}
<div class="uk-background-cover text-blue-500 h-44 w-full rounded-2xl uk-grid uk-grid-collapse uk-flex-between uk-flex-middle px-8" style="background-image: url( {{asset('recursos/img/bg-header.png')}} );">
    <div>
        <svg xmlns="http://www.w3.org/2000/svg" class="h-7 w-7" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
            <path stroke-linecap="round" stroke-linejoin="round" d="M12 8c-1.657 0-3 .895-3 2s1.343 2 3 2 3 .895 3 2-1.343 2-3 2m0-8c1.11 0 2.08.402 2.599 1M12 8V7m0 1v8m0 0v1m0-1c-1.11 0-2.08-.402-2.599-1M21 12a9 9 0 11-18 0 9 9 0 0118 0z" />
        </svg>
        <span class="text-xl">Carga Masiva Factura</span>
    </div>
    <div class="pull-right"></div>
</div>
{% endblock %}

{% block content %}
    {% for flashMessage in app.session.flashbag.get('notice') %}
        <div class="col-sm-12 alert alert-danger alert-dismissable">
            <button type="button" class="close" data-dismiss="alert">&times;</button>
            <h4><strong>Ha ocurrido un error!</strong></h4>
            <p>{{ flashMessage }}</p>
        </div>
    {% endfor %}
    {% for flashMessage in app.session.flashbag.get('confirm') %}
        <div class="col-sm-12 alert alert-success alert-dismissable">
            <button type="button" class="close" data-dismiss="alert">&times;</button>
            <p>{{ flashMessage }}</p>
        </div>
    {% endfor %}
    <div class="col-md-12">
        {{ form_start(form) }}
        {{ form_widget(form) }}
        {{ form_end(form) }}
    </div>
    <div class="dataTable_wrapper">
        <div class="table-responsive">  
            <table class="table table-striped table-bordered table-hover" id="data-table">
                <thead>
                    <tr>
                        <th class="font-light text-blue-500">Fecha Creaci&oacute;n</th>
                        <th class="font-light text-blue-500">Estado</th>
                        <th class="font-light text-blue-500">Inicio Procesamiento</th>
                        <th class="font-light text-blue-500">Fin Procesamiento</th>
                        <th class="font-light text-blue-500">Proceso Automatico</th>
                        <th class="font-light text-blue-500">Acciones</th>
                    </tr>
                </thead>
                <tbody>
                    {% for entity in entities %}
                        <tr>
                            <td>{{ entity.createdAt |date("m/d/Y H:i:s") }}</td>
                            <td>{{ entity.estado }}</td>
                            <td>{%if entity.inicioProcesamiento %}{{ entity.inicioProcesamiento |date("m/d/Y H:i:s") }}{%endif%}</td>
                            <td>{%if entity.finProcesamiento %}{{ entity.finProcesamiento |date("m/d/Y H:i:s") }}{%endif%}</td>
                            <td>{%if entity.procesoAutomatico %}SI{%else%}NO{% endif%}</td>
                            <td>
                                {% if entity.estado == 'CARGADO' %}
                                    {% if entity.procesoAutomatico == false %}
                                        <a href="{{ path('factura_procesar_masivo_auto', { 'id': entity.id }) }}" title="Proceso Automatico">
                                            <button class="btn btn-success link-boton">
                                                <i class="fa fa-rocket"></i>
                                            </button>
                                        </a>
                                    {%else%}
                                        <a href="{{ path('factura_procesar_masivo_auto', { 'id': entity.id }) }}" title="Quitar Proceso Automatico">
                                            <button class="btn bg-blue-500 text-blue-100 hover:bg-blue-100 hover:text-blue-600 link-boton">
                                                <svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
                                                    <path stroke-linecap="round" stroke-linejoin="round" d="M10.325 4.317c.426-1.756 2.924-1.756 3.35 0a1.724 1.724 0 002.573 1.066c1.543-.94 3.31.826 2.37 2.37a1.724 1.724 0 001.065 2.572c1.756.426 1.756 2.924 0 3.35a1.724 1.724 0 00-1.066 2.573c.94 1.543-.826 3.31-2.37 2.37a1.724 1.724 0 00-2.572 1.065c-.426 1.756-2.924 1.756-3.35 0a1.724 1.724 0 00-2.573-1.066c-1.543.94-3.31-.826-2.37-2.37a1.724 1.724 0 00-1.065-2.572c-1.756-.426-1.756-2.924 0-3.35a1.724 1.724 0 001.066-2.573c-.94-1.543.826-3.31 2.37-2.37.996.608 2.296.07 2.572-1.065z" />
                                                    <path stroke-linecap="round" stroke-linejoin="round" d="M15 12a3 3 0 11-6 0 3 3 0 016 0z" />
                                                </svg>
                                            </button>
                                        </a>
                                    {%endif%}
                                    
                                    <a href="{{ path('factura_procesar_masivo', { 'id': entity.id }) }}" title="Procesar">
                                        <button class="btn bg-blue-500 text-blue-100 hover:bg-blue-100 hover:text-blue-600 link-boton">
                                            <svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
                                                <path stroke-linecap="round" stroke-linejoin="round" d="M14.752 11.168l-3.197-2.132A1 1 0 0010 9.87v4.263a1 1 0 001.555.832l3.197-2.132a1 1 0 000-1.664z" />
                                                <path stroke-linecap="round" stroke-linejoin="round" d="M21 12a9 9 0 11-18 0 9 9 0 0118 0z" />
                                            </svg>
                                        </button>
                                    </a>
                                {% else %}
                                    <a href="{{ path('facturas_load_errors', { 'id': entity.id }) }}" title="Ver Errores">
                                        <button class="btn bg-blue-500 text-blue-100 hover:bg-blue-100 hover:text-blue-600 link-boton">
                                            <svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
                                                <path stroke-linecap="round" stroke-linejoin="round" d="M15 12a3 3 0 11-6 0 3 3 0 016 0z" />
                                                <path stroke-linecap="round" stroke-linejoin="round" d="M2.458 12C3.732 7.943 7.523 5 12 5c4.478 0 8.268 2.943 9.542 7-1.274 4.057-5.064 7-9.542 7-4.477 0-8.268-2.943-9.542-7z" />
                                            </svg>
                                        </button>
                                    </a>
                                {%endif%}
                            </td>
                        </tr>
                    {% endfor %}
                </tbody>
            </table>
            {% if errors is defined%}
                <ul class="list-group">
                    {% if errors|length > 0 %}
                        {% for error in errors %}
                            <li class="list-group-item list-group-item-danger">{{error}}</li>
                            {% endfor %}
                        {%else %}
                        <li class="list-group-item list-group-item-success">Archivo procesado sin errores</li>
                        {% endif %}
                </ul>
            {% endif %}
        </div>
    </div>
{% endblock %}
{% block javascript %}
<script src="{{asset('recursos/bower_components/datatables/media/js/jquery.dataTables.min.js')}}"></script>
<script src="{{asset('recursos/bower_components/datatables-plugins/integration/bootstrap/3/dataTables.bootstrap.min.js')}}"></script>
<script src="{{asset('recursos/js/script.js')}}"></script>
<script src="{{asset('garyavendanio/uikit/js/uikit.min.js')}}"></script>
<script src="{{asset('garyavendanio/uikit/js/uikit-icons.min.js')}}"></script>
{% endblock %}