{% macro inputPeriodo(dataInicial, dataFinal, emptyTable) %}
    
    <div class="row">
        <div class="col-md-3">
            <div class="form-group">
                <label for="dataInicial" class=" required ">Data inicial</label>
                <div id="container-data-inicial">
                    <div class="input-group date">
                        <input name="filtros[dataInicial]" id="dataInicial" required="required" {% if emptyTable %} disabled {% endif %} type="text" class="form-control" onkeyup="vData(this)" value="{{ dataInicial }}" onchange="vData(this)" {{ block('widget_attributes') }}>
                        <span class="input-group-addon"><i class="glyphicon glyphicon-calendar"></i></span>
                    </div>
                </div>
                
            </div>
        </div>
        <div class="col-md-3 col-lg-offset-1">
            <div class="form-group" id="dataFinalGroup">
                <label for="dataFinal" class=" required ">Data final</label>
                <div id="container-data-inicial">
                    <div class="input-group date">
                        <input name="filtros[dataFinal]" id="dataFinal" required="required" type="text" {% if emptyTable %} disabled {% endif %} class="form-control" onkeyup="vData(this)" value="{{ dataFinal }}" onchange="vData(this)" {{ block('widget_attributes') }}>
                        <span class="input-group-addon"><i class="glyphicon glyphicon-calendar"></i></span>
                    </div>
                </div>
                <div class="alert alert-danger" role="alert" id="dataFinalError" style="display: none; padding: 5px; font-size: 12px;">A data final deve ser maior que a data inicial.</div>
            </div>
        </div>
    </div>  
            
            
    <script>
        $(document).ready(function(){
                
                $('.input-group.date').datepicker({
                    format: "mm/yyyy",
                    language: "pt-BR",
                    orientation: "top left",
                    autoclose: true,
                    todayHighlight: true,
                    minViewMode: 1
                });
                
                $("#dataInicial,#dataFinal").keydown(function(event){
                    // Obtém a data/hora atual
                    var data = new Date();

                    // Guarda cada pedaço em uma variável
                    var dia     = data.getDate();           // 1-31
                    var mes     = data.getMonth();          // 0-11 (zero=janeiro)
                    var ano    = data.getFullYear();       // 4 dígitos

                    // Formata a data e a hora
                    var str_data = (dia < 10)?"0"+dia:dia;
                    mes = mes + 1;
                    mes = (mes < 10)?"0"+mes:mes;
                    str_data += '/' + (mes) + '/' + ano;

                    var regExp = new RegExp("[0-9]{2}\/[0-9]{2}\/[0-9]{4}");
                    if(event.keyCode == 13 && !regExp.test($(this).val())){
                        $(this).val(str_data);
                    }
                    if(event.keyCode == 40 && !event.ctrlKey){
                        $(this).next().click();
                        return false;
                    }
                });
                
                
                $('#dataInicial').change(validaPeriodo);
                $('#dataFinal').change(validaPeriodo);

        });
        
        
        function validaPeriodo(){
            $('#dataFinalGroup').removeClass("has-error");
            $('#dataFinalError').hide();
             
            var datInicio = $('#dataInicial').val().split('/');
            
            if (datInicio.length === 2) {
                datInicio = parseInt(datInicio[1] + datInicio[0] + 1, 10);
            } else {
                datInicio = parseInt(datInicio[2] + datInicio[1] + datInicio[0], 10);
            }

            var datFim = $('#dataFinal').val().split('/');
            
            if (datFim.length === 2) {
                datFim = parseInt(datFim[1] + datFim[0] + 1, 10);
            } else {
                datFim = parseInt(datFim[2] + datFim[1] + datFim[0], 10);
            }

            if( datInicio > datFim ){
                $('#dataFinalGroup').addClass("has-error");
                $('#dataFinalError').show();
                return false;
            }

            return true;
        }
          
    </script>
{% endmacro %}

{% macro inputLista(lista, label, name) %}

    <div class="control-group span4">
        <label for="filtros[{{ name }}]" class="control-label">{{ label }}</label>
        <div class="controls">
            <select data-placeholder=" " style="width:280px;" multiple class="chzn-select" id="filtros[{{ name }}]" name="filtros[{{ name }}][]">
              <option value=""></option>
              {% for l in lista %}
                  <option value="{{ l.id ~ ',' ~ l.__toString()}}">{{ l.__toString() }}</option>
              {% endfor %}
            </select>
            <span class="help-inline"></span>
        </div>
    </div>
    
    <script>
        $(document).ready(function(){
{#            $(".chzn-select").chosen({no_results_text: "Nenhum resultado encontrado para"});#}
        });
    </script>
    
{% endmacro %}
    
    
{% macro inputLista2(lista, label, name, chave) %}

    <div class="control-group span4">
        <label for="filtros[{{ name }}]" class="control-label">{{ label }}</label>
        <div class="controls">
            {%if name == 'unidade'%}            
            <div class="ui-widget">
                <input id="text_{{name}}" />  
            </div>  
            {%endif%}
            <select data-placeholder=" " style="width:280px; {%if name == 'unidade'%}{%endif%}" multiple class="chzn-select" id="{{ name }}" name="filtros[{{ name }}][]">
              <option value=""></option>
              {% for l in lista %}
                  <option value="{{ l.id ~ ',' ~ l[chave]}}">{{ l[chave] }}</option>
              {% endfor %}
            </select>
            <span class="help-inline"></span>
        </div>
    </div>
    
    <script>
        $(document).ready(function(){
{#            $(".chzn-select").chosen({no_results_text: "Nenhum resultado encontrado para"});#}
        });
    </script>
    
{% endmacro %}    
    
    
{% macro inputListaFiltro(lista, label, name, chave) %}

    <div class="control-group span6">
        <label for="filtros[{{ chave }}]" class="control-label">{{ label }}</label>
        <div class="controls">
            
            {%if chave == 'codUnidadeProdutiva'%}            
            <div class="ui-widget">
                <input id="text_{{chave}}" />  
            </div>  
            {%endif%}
            <select data-placeholder=" " style="width:100%;" multiple class="chzn-select" id="{{ chave }}" name="filtros[{{ chave }}][]">
              <option value=""></option>
              {% for l in lista %}
                  <option value="{{ chave~':'~l['id'] }}">{{ l[name] }}</option>
              {% endfor %}
            </select>
            <span class="help-inline"></span>
        </div>
    </div>
    
    <script>
        $(document).ready(function(){
{#            $(".chzn-select").chosen({no_results_text: "Nenhum resultado encontrado para"});#}
        });
    </script>
    
{% endmacro %}    
    
{% macro inputData(label, id, value) %}
    <div class="control-group span3">
        <label for="{{id}}" class=" required control-label">{{label}}</label>
        <div class="controls">
            <input name="{{id}}" id="{{id}}" required="required" pattern="[0-9]{2}/[0-9]{2}/[0-9]{4}" autocomplete="off" class="input-small" value="{{ value }}" title="dd/mm/aaaa"  type="text" {{ block('widget_attributes') }}  />
        </div>
    </div>    
    
    <script>
        $(document).ready(function(){
                $("#{{id}}").datepicker({
                    showOn: "button",
                    buttonText: 'Calendário',
                    buttonImage: "{{ asset('bundles/propesq/images/calendar.png') }}",
                    buttonImageOnly: true,
                    "regional" : "pt-BR"   
                });
                
                $("#{{id}}").mask("99/99/9999");
        });
    </script>
{% endmacro %}