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

{% block stylesheets %}
    <link rel="stylesheet" href="{{ asset('css/templateOneBlock.css')}}">
{% endblock %}
{% block dashboard %}

    <script>
        $(function(){
            $('#content_outmiddle').css('float','center');
            $('#content_outmiddle').css('width','100%');
            $('input').button();
            $('#zona').change(function(){

                semana = parseInt($('#semana22').val());
                zona = $(this).val();
                $('#cargar').css('display','block');

                $('#consultaConsolidadoMes').load("{{path('consultaConsolidadoMes')}}",{$mes :semana, $years : {{years}}, $zona:zona});

            });
            $('#consolidadoMes').css('color','white');
            $('#consolidadoMes').addClass('ui-state-focus');
            $('#RHorario, #'+{{semanaAct}}).addClass('ui-state-focus');
            $('#{{"now"|date("m")|number_format(0)}}').addClass('ui-state-hover');

            zona = $('#zona').val();
            $('#consultaConsolidadoMes').load("{{path('consultaConsolidadoMes')}}",{ $mes : '{{"now"|date("m")|number_format(0)}}', $years : '{{years}}', $zona:zona} );

            $('#year').change(function(){
                //alert('entro');
                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','block');
                $('#consultaConsolidadoMes').load("{{path('consultaConsolidadoMes')}}",{ $mes : mes, $years : year, $zona:zona} );

            })
            $('button').button();

        })
        function verMes(mes, txtMes){
            //mes=$(this).val();
            year = $('#year').val();
            zona = $('#zona').val();
            if(parseInt(mes)<parseInt(10)){
                mes2 = '0'+mes;
            }else{
                mes2 = mes;

            }
            $('#fecha').val(year+'-'+mes2);
            $('#semana22').val(mes2);
            $('.selecMes button').removeClass('ui-state-hover');
            $('#'+mes).addClass('ui-state-hover');
            //txtMes = $(this).text();
            $("#cargar" ).css('display','block');
            $('#consultaConsolidadoMes').load("{{path('consultaConsolidadoMes')}}",{ $mes : mes, $years : year, $zona:zona} );
        };
    </script>
    <style>
        #consolidadoMes{background: #002561; border: 1px solid #666; padding: 1px 1px 1px 1px;}
        .selecMes{ margin: auto;}
    </style>
    <br>
    <div class="row">
        <div class="col-lg-4"><p></p></div>
        <div class="col-lg-4">
            <form action="" method="post">
                <div class="input-group text-center">
                    <span class="input-group-addon" style="background: white">Seleccione año:</span>
                    <select class="form-control input-sm" id="year" name="year">
                        <option selected="selected" value="{{"now" | date("Y")}}">{{"now" | date("Y")}}</option>
                        <option value="{{"now" | date("Y")-1}}">{{"now" | date("Y")-1}}</option>
                        <option value="{{"now" | date("Y")-2}}">{{"now" | date("Y")-2}}</option>
                    </select>
                </div>
            </form>
        </div>
        <div class="col-lg-4"><p></p></div>
        <br><br><br>
        <div class="col-lg-12 text-center">
            <table align="center" class="selecMes">
            {% set b = 1%}
            {% for mes in meses%}
                <td>
                    <button type="button" class="selecMes" id="{{b}}" onclick="verMes({{b}}, '{{mes.mes}}')" name="mes" {%if (b>"now" | date("m"))%} disabled="disabled" {%endif%}   value="{{b}}">
                        <label>{{mes.mes}}</label></button>
                </td>
                {% set b = b +1%}
            {% endfor%}
            </table>
        </div>
    </div>

    <!--
    <table align="center" class="selecMes">
        <tr>
            <td colspan="12" style="text-align:center;">

                <form action="" method="post">
                    <div class="input-group text-center">
                        <span class="input-group-addon" style="background: white">Seleccione año:</span>
                        <select class="form-control input-sm" id="years" name="years">
                            <option selected="selected" value="{{"now" | date("Y")}}">{{"now" | date("Y")}}</option>
                            <option value="{{"now" | date("Y")-1}}">{{"now" | date("Y")-1}}</option>
                            <option value="{{"now" | date("Y")-2}}">{{"now" | date("Y")-2}}</option>
                        </select>
                        <div class="input-group-addon" style="background: white"><i class="fa fa-search" style="cursor: pointer" onclick="btnDownloadConsolidado()"></i></div>
                    </div>
                </form>

            </td>
        </tr>
        <tr>
            {% set b = 1%}
            {% for mes in meses%}
                <td>
                    <button type="button" class="selecMes" id="{{b}}" onclick="verMes({{b}}, '{{mes.mes}}')" name="mes" {%if (b>"now" | date("m"))%} disabled="disabled" {%endif%}   value="{{b}}">
                        <label>{{mes.mes}}</label></button>
                </td>
                {% set b = b +1%}
            {% endfor%}
        </tr>
        <tr>
            <td colspan="12" style=" text-align: center;">
                <br>
                <b>Seleccione Zona:</b>
                <select id="zona">
                    <option value="CO_BOGOTA">BOGOTA</option>
                    <option value="CO_ORIENTE">ORIENTE</option>
                    <option value="CO_SUROCCIDENTE">SUROCCIDENTE</option>
                </select>
                <input type="hidden" id="semana22" value="{{semanaAct}}">
            </td>
        </tr>
    </table>
-->
    <br>
    <br>
    <div id="consultaConsolidadoMes"></div>
    <br>




{% endblock %}