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

<style>
    .ui-icon-closethick, .ui-corner-all a{ display: none;}
    #cargar{
       padding-left: 50%;
       padding-top: 400px;
        width: 1263px; 
        height: 601px; 
        z-index: 1001;
    background: #ccc/*{bgColorOverlay}*/ /*{bgImgUrlOverlay}*/ 50%/*{bgOverlayXPos}*/ 50%/*{bgOverlayYPos}*/ /*{bgOverlayRepeat}*/;
opacity: .3;}
</style>
	<script>
	$(function() {
            $('#cargar').css('height','2500px');
            $('#cargar').css('width','1500px');
            $('#cargar').text('CARGANDO');
            $('#cargar').css('top','0');
            $('#cargar').css('left','0');
            $('#cargar').css('display','');
            $('.ui-icon-closethick').css('display','none');
        $('#content_outmiddle').css('float','center');
        $('#content_outmiddle').css('width','100%');
            $("button").button();
            $('#ConstultasResolTecnicoMes').load('{{path('ConstultasResolTecnicoMes')}}');
            $('#grupos').change(function(){
                   year = $('#year').val();
                   grupos = $('#grupos').val();
                   mes = $('input[name=mesOfYear]:checked').val()
                   if(parseInt(mes)<parseInt(10)){
                     mes2 = '0'+mes;  
                   }else{
                     mes2 = mes;  
                       
                   }
                   $('#fecha').val(year+'-'+mes2)
                   $('.selecMes button').removeClass('ui-state-focus');
                    $('#'+mes).addClass('ui-state-focus');
                    //txtMes = $(this).text();
                    //$( ".txtMes p" ).text('Mes de '+txtMes);
                   
            $('#cargar').css('display','');
                    $('#ConstultasResolTecnicoMes').load('{{path('ConstultasResolTecnicoMes')}}',{$mes:mes, $year:year, $grupo: grupos});
                
            });
                 $('#year').change(function(){
                    var Meses =['Enero','Febrero','Marzo','Abril','Mayo','Junio','Julio','Agosto','Septiembre','Octubre','Noviembre','Diciembre'];
                    year = $('#year').val();
                    fecha = new Date();
                    year2 = fecha.getFullYear();
                if(year2 != year){
                    mes=12
                    txtMes = Meses[11];
                    $('.selecMes').removeClass('ui-state-disabled');
                    $('.selecMes').removeClass('ui-button-disabled');                    
                    $('.selecMes').removeAttr('disabled','disabled');                  
                    $('.selecMes').attr('aria-disabled','false');
                }else{
                    mes = fecha.getMonth()+1;
                    mtxtMes = Meses[fecha.getMonth()];
                    for(i=1;i<=12;i++){
                        if($('#'+i).val()> mes){
                            $('#'+i).addClass('ui-state-disabled');
                            $('#'+i).addClass('ui-button-disabled');
                            $('#'+i).attr('disabled','disabled');                   
                            $('#'+i).attr('aria-disabled','true');                           
                          }                    
                    }
                }   
                   if(parseInt(mes)<parseInt(10)){
                     mes2 = '0'+mes;  
                   }else{
                     mes2 = mes;  
                       
                   }
                   $('#fecha').val(year+'-'+mes2)
                
            $("button").button();              
                    $( ".txtMes p" ).text('Diario del mes de '+txtMes+' del año '+ year);
                   $('.selecMes button').removeClass('ui-state-focus');
                    $('#'+mes).addClass('ui-state-focus');
                    
            $('#cargar').css('display','');
                   grupos = $('#grupos').val();
                      $('#ConstultasResolTecnicoMes').load('{{path('ConstultasResolTecnicoMes')}}',{$mes:mes, $year:year, $grupo: grupos});
  
                })   
        $('.selecMes').buttonset();         
	});
        
                function verMes(mes, txtMes){
                    //mes=$(this).val();
                   year = $('#year').val();
                   grupos = $('#grupos').val();
                   if(parseInt(mes)<parseInt(10)){
                     mes2 = '0'+mes;  
                   }else{
                     mes2 = mes;  
                       
                   }
                   $('#fecha').val(year+'-'+mes2)
                   $('.selecMes button').removeClass('ui-state-focus');
                    $('#'+mes).addClass('ui-state-focus');
                    //txtMes = $(this).text();
                    //$( ".txtMes p" ).text('Mes de '+txtMes);
                   
            $('#cargar').css('display','');
                    $('#ConstultasResolTecnicoMes').load('{{path('ConstultasResolTecnicoMes')}}',{$mes:mes, $year:year, $grupo: grupos});
                };
	</script>

    <table align="center" class="selecMes">
                <tr>                
                {% set b = 1%}
                    {% for mes in meses%}
                    <td>
                        <label for="{{b}}">{{mes.mes}}</label>
                        <input type="radio" name="mesOfYear" class="selecMes" id="{{b}}" onclick="verMes({{b}}, '{{mes.mes}}')" name="mes" {%if (b>"now" | date("m"))%} disabled="disabled" {%endif%} {%if (b=="now" | date("m"))%} checked="checked" {%endif%}  value="{{b}}">
                            
                    </td>                
                {% set b = b +1%}
            {% endfor%}                        
                </tr>
                <tr>
                    <td colspan="3">Seleccione Grupo</td>
                    <td colspan="3">
                        <select id="grupos">
                            <option value="">{{'inbox.all' | trans}}</option>
                            {% for grupo in grupos %}
                            <option value="{{grupo.grupo}}">{{grupo.grupo}}</option>
                            {% endfor %}
                        </select>
                    </td>
                    <td colspan="2">{{'Seleccione Año' | trans}}</td>
                    <td colspan="3">
                        <select id="year">
                                    <option value="{{"now" | date("Y") - 1}}">{{"now" | date("Y") - 1}}</option>
                                    <option selected="selected" value="{{"now" | date("Y")}}">{{"now" | date("Y")}}</option>
                        </select> 
                    </td>
                </tr>

            </table>
        <br>  
        <div id="ConstultasResolTecnicoMes" style=" min-height: 400px;"></div>
{% endblock %}


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