{% extends 'base.html.twig' %}
{% block subreport_title %}| Resumen Chat{% endblock %}


{% block page_content %}
    <style>
        th { font-size: 12px; }
        td { font-size: 12px; }
        th { font-size: 12px; }
        td { font-size: 12px; }
        .table-cell-edit{
            background-color: #e9f0f3;
            text-align: center;
        }
        .table-cell-edit1{
            background-color: #ecf3e9;
            text-align: center;

        }
        .box .box-header {
            padding: 10px !important;
        }
        div.dataTables_wrapper {
            /*width: 800px;*/
            margin: 0 auto;
        }

    </style>

    {% include 'Filtros/filtroPeriodo.html.twig' %}

    <div class="clearfix"></div>
    <div class="box-header with-border">

        <div class="col-lg-12">
            <div class="form-horizontal pull-right">
                <div class="input-group">
                    <label for="reservationtime" class="col-md-3 control-label">Intervalo de Fechas</label>
                    <div class="col-md-6">
                        <input type="text" class="form-control pull-right" id="reservationtime">
                    </div>
                    <div class="col-xs-3">
                        <button class="btn btn-success btn-xs" type="button" id="aplicar" >VER</button>
                    </div>
                </div>
            </div>
        </div>

    </div>

    <div class="col-md-12 col-sm-12 col-xs-12">

        <table id="hojaasist" class="table table-striped table-bordered  nowrap" cellspacing="0" width="100%">
                <thead>
                <tr>
                    <th>COD. EMPLEADO</th>
                    <th>NOMBRES/APELLIDO</th>
                    <th>FECHA</th>
                    <th>ENTRADA</th>
                    <th>SALIDA</th>
                    <th>HRS. JORNADA</th>
                    <th>RESPONSABLE</th>
                </tr>
                </thead>
        </table>
    </div>

<script>

    $(document).ready(function() {
        $("[data-toogle='tooltip']").tooltip({"delay": 0, "track": true, "fade": 250});

        var startDate = $('#reservationtime').data('daterangepicker').startDate.format('YYYY-MM-DD');
        var endDate = $('#reservationtime').data('daterangepicker').endDate.format('YYYY-MM-DD');

        var nomuser = document.getElementById("nomuser").innerHTML;
        var puesto = document.getElementById("cargo").innerHTML;
        var rut = document.getElementById("rut").innerHTML;
        var email = document.getElementById("email").innerHTML;
        var sucursal = document.getElementById("sucursal").innerHTML;
        var depto = document.getElementById("depto").innerHTML;

        drawTable(startDate,endDate);


        function drawTable(start,end) {

            var oTable = $('#hojaasist').DataTable({
                processing: true,
                serverSide: true,
                dom: 'Bt',
                buttons: [
                        {
                        text: 'Exportar PDF',
                        extend: 'pdfHtml5',
                        filename: 'Turnos PLaneados',
                        orientation: 'landscape', //portrait
                        pageSize: 'letter', //A3 , A5 , A6 , legal , letter
                        exportOptions: {
                            columns: ':visible',
                            search: 'applied',
                            order: 'applied'
                        },
                        customize: function (doc, page, pages) {
                            var colHead = [];
                            var now = new Date();
                            var jsDate = now.getDate() + '-' + (now.getMonth() + 1) + '-' + now.getFullYear();
                            {% include 'js/logo_ideal.js' %}
                            var elements = document.getElementsByClassName("total");
                            headDefinition = {
                                columns: [
                                    {
                                        image: logo,
                                        width: 60,
                                        margin: [35,10]

                                    },
                                    {
                                        alignment: 'center',
                                        italics: true,
                                        text: 'Turnos Planeados',
                                        fontSize: 18,
                                        margin: [35,10]

                                    },
                                    {
                                        stack: [
                                            {
                                                alignment: 'left',
                                                italics: true,
                                                text: nomuser,
                                                fontSize: 10,
                                                margin: [35,15]
                                            },
                                            {
                                                alignment: 'left',
                                                italics: true,
                                                text: sucursal,
                                                fontSize: 8,
                                                margin: [35,0]
                                            },
                                            {
                                                alignment: 'left',
                                                italics: true,
                                                text: depto,
                                                fontSize: 8,
                                                margin: [35,0]
                                            },

                                            {
                                                alignment: 'left',
                                                italics: true,
                                                text: puesto,
                                                fontSize: 8,
                                                margin: [35,0]
                                            },
                                            {
                                                alignment: 'left',
                                                italics: true,
                                                text: rut,
                                                fontSize: 8,
                                                margin: [35,0]
                                            },
                                            {
                                                alignment: 'left',
                                                italics: true,
                                                text: email,
                                                fontSize: 8,
                                                margin: [35,20]
                                            }

                                        ]
                                    }
                                ]};
                            doc['header']= headDefinition;

                            doc.content.splice(0, 1);
                            doc.pageMargins = [35,85];

                            doc.defaultStyle.fontSize = 9;
                            doc.styles.tableHeader.fontSize = 10;
                            doc.styles.tableHeader.headerRows = 2;
                            doc.styles.subheader = { fonsize: 10};

                            doc['footer'] = (function (page, pages) {
                                return {
                                    columns: [
                                        {
                                            alignment: 'left',
                                            text: ['Creado el: ', {text: jsDate.toString()}]
                                        },
                                        {
                                            alignment: 'right',
                                            text: ['Pag. ', {text: page.toString()}, ' de ', {text: pages.toString()}]
                                        }
                                    ],
                                    margin: 40
                                }
                            });
                            var objLayout = {};
                            objLayout['hLineWidth'] = function (i) {
                                return .5;
                            };
                            objLayout['vLineWidth'] = function (i) {
                                return .5;
                            };
                            objLayout['hLineColor'] = function (i) {
                                return '#aaa';
                            };
                            objLayout['vLineColor'] = function (i) {
                                return '#aaa';
                            };
                            objLayout['paddingLeft'] = function (i) {
                                return 4;
                            };
                            objLayout['paddingRight'] = function (i) {
                                return 4;
                            };
                            doc.content[0].layout = objLayout;
                        }
                    },

                    {
                        extend: 'excelHtml5',
                        filename: 'Turnos Planeados' + moment().format('YYYYMMDD'),
                        exportOptions: {
                            modifier: {
                                search: 'applied',
                                order: 'applied',
                                columns: ':visible',
                            }
                        },
                        autoFilter: true,
                    },
                ],
                language: {
                    "lengthMenu": "Ver _MENU_ Registros",
                    "zeroRecords": "No se encontraron datos",
                    "info": "Mostrando pagina: _PAGE_ de _PAGES_",
                    "infoEmpty": "Ningun registro disponible",
                    "infoFiltered": "(filtrado de _MAX_ registros totales)",
                    "search": "Buscar",
                    "processing": "Procesando",//"<span class='glyphicon glyphicon-refresh glyphicon-refresh-animate'></span>",
                    "paginate": {
                        "first": "Primera",
                        "last": "Ultima",
                        "next": "Siguiente",
                        "previous": "Anterior"
                    }
                },
                contentType: "application/json",
                destroy: true,
                order: [1, 'asc'],
                ajax: ({
                    url: '{{ url("turnosTable") }}',
                    type: "POST",
                    data: {
                        startdate: start,
                        enddate: end
                    },
                }),
                scrollY: 500,
                scrollX: true,
                scroller: true,
                scrollCollapse: true,
            });
        }

        $('#aplicar').on('click', function () {

            var startDate = $('#reservationtime').data('daterangepicker').startDate.format('YYYY-MM-DD');
            var endDate = $('#reservationtime').data('daterangepicker').endDate.format('YYYY-MM-DD');
            drawTable(startDate,endDate);

        });

    } );
</script>
{% endblock page_content%}