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

{% block body %}



    {% set showAllStaff = false %}


    {% set inputAusencia = true %}
    {% set inputResumen = false %}
    {% set inputRegister = true %}
    {% set inputEmpty = true %}
    {% set inputHorary = true %}

    <div class="">
        <div class="col-xs-12 col-md-12 sonata-filters-box" >
            <div class="box box-primary">
                <div class="box-body">

                    <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
                       <h1> Fichajes Empleados</h1>
                    </div>
                    <div class="clearfix"></div>
                    <form action="" class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
                                <input type="hidden" name="showAllStaff"  value="{{ showAllStaff }}">
                                 <input type="hidden" name="empty"  value="{{ inputEmpty }}">
                                 <input type="hidden" name="register"  value="{{  inputRegister}}">
                                <input type="hidden" name="ausencia"  value="{{ inputAusencia }}">
                                <input type="hidden" name="resumen" value="{{ inputResumen }}">
                               <input type="hidden" name="horary" value="{{ inputHorary }}">
                        <div class="col-md-3" >
                            <a  class=" btn btn-success" href="{{ path('report_checks_staff',{'token': staff[0].uuid,'range': 'last-month','empty': inputEmpty, 'register': inputRegister, 'ausencia': inputAusencia, 'resumen': inputResumen})}}" target=""><i class="fa fa-report" aria-hidden="true"></i> El mes de {{  "now"|date|date_modify("-1 month")|date("M")  }}</a>
                        </div>
                            <div class="col-md-8" id="sandbox-container">

                            <div class="input-daterange input-group" id="datepicker">
                                <span class="input-group-addon">DE</span>
                                <input type="date" class="input-md form-control" name="start" value="{{ start|date("Y-m-d") }}">
                                <span class="input-group-addon">A</span>
                                <input type="date" class="input-md form-control" name="end"  value="{{ end|date("Y-m-d") }}">
                            </div>
                        </div>

                        <div class="col-md-1 right">
                            <input type="submit" class="btn btn-success pull-right" value="Aplicar">
                        </div>
                    </form>


                </div>
            </div>
        </div>

    </div>





    <div class="">

        <div class="col-xs-12 col-md-12 col-lg-12">
            <div class="box box-success">
                <div class="box-body">
                    {#
                      <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12  ">
                          <h2>Descargar conjunta de PDF's</h2>
                          <div class="col-xs-12 col-sm-4 col-md-3 col-lg-2" >
                              <a  class=" btn btn-success btn-info btn-lg btn-bloc col-xs-12 col-sm-12 col-md-12 col-lg-12 " href="{{ path('make-pdf',{'start':start|date('Y-m-d'),'end':end|date('Y-m-d'),'ausencia':inputAusencia,'resumen':inputResumen,'register':inputRegister,'empty':inputEmpty})}}" target="_blank"><i class="fa fa-report" aria-hidden="true"></i>Todos</a>
                          </div>
                      </div>
                      <br>
                     #}
                    <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12  ">
                        {% for empleado in staff %}

                            {% if
                            ( (empleado.start_date is empty and empleado.end_date is empty)
                            or (empleado.start_date is not empty and empleado.end_date is empty     and empleado.start_date|date('U') > start|date('U') )
                            or (empleado.start_date is empty     and empleado.end_date is not empty and empleado.end_date|date('U') < end|date('U') )
                            or (empleado.start_date is not empty and empleado.end_date is not empty and start|date('U') <= empleado.end_date|date('U') and end|date('U') >= empleado.start_date|date('U') )
                            or showAllStaff)
                            %}
                                <a   style="margin: 1rem;" target="_blank" class="btn btn-info " href="{{ path('make-pdf',{'uuid':empleado.uuid,'start':start|date('Y-m-d'),'end':end|date('Y-m-d'),'ausencia':inputAusencia,'resumen':inputResumen,'register':inputRegister,'empty':inputEmpty})}}" target="_parent">
                                    <i class="fa fa-print" aria-hidden="true">
                                    </i> Descarga Documento PDF de {{  empleado.fullname|title }}
                                </a>

                            {% endif %}

                        {% endfor %}


                        <a href="{{ path('check_staff_logout',{'token': token}) }}" class="btn btn-danger">Salir</a>
                    </div>



                </div>
            </div>
        </div>
    </div>


{% endblock %}






{% block stylesheets %}
    <style>
        html {
            background-color: white !important;
            background-image: url() !important;
        }
    </style>

    {{ parent() }}
    <link id="bsdp-css" href="{{asset('/css/bootstrap-year-calendar.min.css')  }}"   rel="stylesheet">
    <link id="bsdp-css" href="{{asset('/css/bootstrap-datepicker3.min.css')  }}"   rel="stylesheet">
    <style>
        .d-inline{
            display: inline-block;
            margin-right: 1rem;
            margin-top: 1rem;
        }
    </style>


{% endblock %}



{% block javascripts %}

    {{ parent()|replace({'/bundles/sonataadmin/vendor/jqueryui/ui/minified/jquery-ui.min.js':'','/bundles/sonataadmin/vendor/jqueryui/ui/minified/i18n/jquery-ui-i18n.min.js':''})|raw }}

    <script src="{{ asset('/js/locales/bootstrap-datepicker.es.min.js') }}"></script>
    <script src="{{ asset('/js/lodash.min.js') }}"></script>

    <script>
        $(function() {
            $('#sandbox-container .input-daterange').datepicker({
                endDate: "Now",
                language: "es",
                daysOfWeekDisabled: "{{ dias_semana_no_laborales }}",
                daysOfWeekHighlighted: "{{ dias_semana_destacar }}",
                calendarWeeks: true,
                autoclose: true,
                todayHighlight: true,
                format: "dd-mm-yyyy"
            });



            $(".item-date").on('click',function(){
                var id = $(this).attr('id');

                $(this).find('.col-item-horary').toggleClass('hidden-xs')

                $('#'+id+'-details').toggleClass('hidden');
                $('#'+id+'-icon').toggleClass('fa-plus-circle').toggleClass('fa-minus-circle');
            });


            $(".check-action").on('click', function(e){
                e.preventDefault();
                e.stopPropagation();
                $('#remoteAction').modal('show').find('.modal-content').load($(this).attr('href'));
            });
            $( document ).on('click',".check-action-delete",function(e){
                e.preventDefault();
                e.stopPropagation();

                if(confirm($(this).attr('data-confim')) == true){
                    $.get( $(this).attr('href'),function( response ) {
                        if(response.success){
                            window.location.reload();
                        }else{
                            console.log(response)
                        }

                    });
                }

            })

            $( document ).on('click','.check-action-submit',function(event){
                event.preventDefault(); //prevent default action
                var post_url = $("#CheckJsonCheckForm").attr("action"); //get form action url
                var form_data = $("#CheckJsonCheckForm").serialize(); //Encode form elements for submission
                $('#loading').show();
                $.post( post_url, form_data, function( response ) {



                    $('#loading').hide();
                    if(response.success){
                        window.location.reload();
                        console.log(response)
                    }else{
                        console.log(response)
                    }
                    //
                });
            });
        })

    </script>



{% endblock %}