{# src/Ericsson/IndicadoresBundle/Resources/views/Hello/index.html.twig #}
 {% extends '::base.html.twig' %}
{% block title %}KPI's Outage{% endblock %}
{% block body %}

<style>
	.column { width: 100%; padding-bottom: 100px; }
	.portlet { margin: 0 1em 1em 0; }
	.portlet-header { margin: 0.3em; padding-bottom: 4px; padding-left: 0.2em; }
	.portlet-header .ui-icon { float: right; }
	.portlet-content { padding: 0.4em; }
	.ui-sortable-placeholder { border: 1px dotted black; visibility: visible !important; height: 50px !important; }
	.ui-sortable-placeholder * { visibility: hidden; }
        #outageCrudo{background: #002561; border: 1px solid #666; padding: 1px 1px 1px 1px;}
.jqplot-point-label
{
    font-size:10px;
    color:#000000;
    background: #cccccc;
}
#content_outmiddle{
    float: center;
    width: 100%;
}
.filaImpar{background: #ffffff;}
.filaPar{background: #EEEEEE;}
	</style>
	<script>
	$(function() {
            $('#outageCrudo').css('color','white');
            $("button").button();
             $('#outageCrudo').addClass('ui-state-focus');
            $( "#dialog-message" ).dialog({
                autoOpen: false,
                modal: true,
                resizable:false
            });
            $('.incidencia td').click(function(){
                id =$(this).parent().attr('id');
                url = '{{path('ingresarSecOutage')}}?id='+id;
                window.open(url,'_blank','width=1200px, height=450px,left=5,top=5, resizable=1,scrollbars=1');
                window.addInfo = function (id) {
                    if(id=='si'){
                        location.reload();
                    }            
                }
            })
	});
	</script>

<div class="contenido">
    <table align="center" class="ui-widget ui-widget-content" width="95%" style="margin:auto;">
    <tr class="ui-widget-header ">
        <td>#</td>
        <td>OT</td>
        <td>Incidencia</td>
        <td>idSitio</td>
        <td>idSitio2</td>
        <td>titulo</td>
        <td>Duracion GSM</td>
        <td>SEC GSM</td>
        <td>Duracion UMTS</td>
        <td>SEC UMTS</td>
        <td>{{'monitor.etiqueta.fechaF' | trans}}</td>
        <td>{{'monitor.etiqueta.fechaI' | trans}}</td>
        <td>Duración</td>
        <td>Clasificación</td>
        <td>{{'ticketDetail.email.tipo' | trans}}</td>
    </tr>
    {% set a = 1%}
    {% set classe = 'filaImpar'%}
{% for consulta in consultas%}
    <tr class="{{classe}} incidencia" id="{{consulta.incidencia}}">
        <td>{{a}}</td>
        <td>{{consulta.ot}}</td>
        <td>{{consulta.incidencia}}</td>
        <td>{{consulta.idSitio}}</td>
        <td>{{consulta.idSitio2}}</td>
        <td>{{consulta.titulo}}</td>
        <td>{{consulta.duraGsm}}</td>
        <td>{{consulta.secGsm}}</td>
        <td>{{consulta.duraUmts}}</td>
        <td>{{consulta.secUmts}}</td>
        <td>{{consulta.fechaFin}}</td>
        <td>{{consulta.fechaIni}}</td>
        <td>{{consulta.duracion}}</td>
        <td>{{consulta.clasif}}</td>
        <td>{{consulta.tipo}}</td>
       
    </tr>
 {%if classe == 'filaImpar'%}
         {% set classe = 'filaPar'%}
        {%else%}
        {% set classe = 'filaImpar'%}
        {%endif%}
    {% set a = a +1%}
{%endfor%}
</table>
</div>
        
 <div id="dialog-message" title="Alerta"></div>
{% endblock %}


    {% block menuTop%}
        {% render "PortalBundle:Default:menuTopOutage"  %}
    {%endblock%}
    {% block menuleft %}
    {%endblock%}
    
    {% block menuRight %}
    {%endblock%}