{% extends 'base.html.twig' %}

{% block title %} <strong>LISTADO DE CASOS ANULADOS </strong>{% endblock %}

{% block body %}                
                 
    <table class="table table-border table-hover table-sm">
        <thead class="thead-dark">
            <tr>                
                <th>Caso N°</th>
                <th>Fecha Creado</th>                
                <th>Cargó Usuario</th>                                
                <th>Anuló</th>                                
                <th>Motivo Anulación</th>
                <th>Fecha Anulado</th>                                
                <th>Cliente</th>                
                <th>Etapa</th>                
                <th>Aseguradora</th>
            </tr>
        </thead>
        <tbody>                       
            {% for caso in anulados.currentPageResults %}                                                    
                        <tr class="movRow">                                                
                            <td>
                                <a href="{{ path('caso_show_anulado', {'id': caso.id}) }}" target="_blank" class="btn btn-info"> 
                                       Ver {{ caso.numero }} 
                                    </a>
                            </td>
                            <td>{{ caso.createdAt | date('d/m/Y H:i') }}</td>
                            <td>
                                <span class="badge badge-info" style="background-color: #{{stringToHexa(caso.createdBy.__toString)}}"> 
                                    {{ caso.createdBy | upper }}                                    
                                </span> 
                            </td>
                            <td>
                                <span class="badge badge-info" style="background-color: #{{stringToHexa(caso.anuladoPor.__toString)}}"> 
                                    {{ caso.anuladoPor | upper }}                                    
                                </span>                                 
                            </td>
                            <td>
                                    {{ caso.anuladoMotivo }}                                                                    
                            </td>
                            <td>
                                {{ caso.anuladoFecha | date('d/m/Y H:i') }}
                            </td>
                            <td>
                                {{ caso.getClientesNombres }}
                            </td>
                            <td>
                                {% set etapaData = caso.etapa(0, 1) %}
                                {% if etapaData is not empty %}
                                <h3> <span class="badge" style="background-color: {{ etapaData.color }}; color: {{ etapaData.fontColor }} "> 
                                        {{ caso.etapa(1) }}                            
                                    </span></h3>
                                {% else %}
                                        {{ caso.etapa(1) }}                            
                                {% endif %}
                               
                            </td>
                            <td>
                                {% if caso.aseguradora %}
                                <span class="badge badge-info" style="background-color: #{{stringToHexa(caso.aseguradora.__toString)}}"> 
                                    {{ caso.aseguradora | upper }}                                    
                                </span> 
                                {% endif %}
                              
                            </td>
                            
                        </tr>                                         
            {% endfor %}    
        </tbody>
    </table>        
   
    {% if anulados.haveToPaginate %}
        <div class="pagerfanta mt-3">
            {{ pagerfanta(anulados, 'twitter_bootstrap4', {'next_message' : 'Siguiente', 'prev_message' : 'Anterior'}) }}
        </div>
    {% endif %}
{% endblock %}