{% extends "base.html.twig"%}
{% block titulo %} - <a href="{{path('projectInitial',{ 'idproyectos':idproyectos})}}">{{proyectos.proyecto}}</a> - <a href="{{path(modulo.path,{ 'idproyectos':idproyectos,'idmodule':idmodule})}}">{{modulo.modulo}}</a>{% endblock %}
 {% block menuTop %}
     <div class="col-lg-12 col-xs-12" >
         <div>

             {{ render(controller("PortalBundle:Default:topModule",{'idproyectos':idproyectos,'idmodule':idmodule})) }}

         </div>


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

{%block dashboard %}
    <style>

            .js-example-basic-single{
                width: 100%;
            }
            .js-example-basic-single .select2-arrow {
                background: white !important;
                background-image: none !important;
                border-left: none !important;
                margin-top: 5px !important;
            }
            .js-example-basic-single .select2-choice{
                display: block;
                width: 100%;
                height: 34px;
                padding: 6px 12px;
                font-size: 14px;
                line-height: 1.42857143;
                color: #555;
                background-color: #fff;
                background-image: none;
                border: 1px solid #ccc;
                border-radius: 4px;
                -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
                box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
                -webkit-transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;
                -o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
                transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
            }
            .js-example-basic-single .select2-choice:focus{
                border-color:#66afe9;
                outline:0;
                -webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6);
                box-shadow:inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6)
            }


        </style>
        <script>                
            $(function(){


                $("#horaIni, #horaFin").datetimepicker({

                    format: 'LT'
                });


                var myDate = new Date();
                //alert(myDate);
                //alert(myDate);
//myDate.setMonth(myDate.getMonth() + 1);
                myDate.setDate(myDate.getDate() -11);
                if (myDate.getDay() == 0) {
                    myDate.setDate(myDate.getDate() - 10);
                }
                if (myDate.getDay() == 6) {
                    myDate.setDate(myDate.getDate() - 9);
                }
                myDate.setHours(0);
                myDate.setMinutes(0);
                myDate.setSeconds(0);
                var nowDate = new Date();
                var today = new Date(nowDate.getFullYear(), nowDate.getMonth(), nowDate.getDate(), 0, 0, 0, 0);
                var FromEndDate = new Date();
                FromEndDate.setDate(FromEndDate.getDate());
                FromEndDate.setHours(23);
                FromEndDate.setMinutes(59);
                FromEndDate.setSeconds(59);


                $('.datetimepicker1').datetimepicker({
                    minDate: myDate,
                    maxDate: today});


                $("#centroMtto").change(function () {
                    centro = $(this).val();
                    $.ajax({
                        type: 'POST',
                        url:"{{ path('cargarSitiosCentro',{'idproyectos':idproyectos}) }}",
                        data: { $centro:centro }
                    }).done(function (json) {

                        obj = JSON.parse(json);
                        row = "<option></option>";

                        for(i=0;i< obj.length; i++){
                            row += "<option value='"+obj[i].idsitio+"'>"+obj[i].sitio+"</option>";

                        }


                        $("#idSitio").text('');
                        $("#idSitio").empty();
                        $("#idSitio").append(row);
                    });
                });

                $(".js-example-basic-single").select2({
                    placeholder: "Elegir...",
                    allowClear: true
                });
                $(".cerrarTicket").click(function () {
                    idticket = $(this).attr('idticket');
                    $("#cerrarTicket").attr('idticket', idticket);
                    $("#alertModal").modal('show');


                });
                $("#cerrarTicket").click(function () {
                    idticket = $(this).attr('idticket');
                    $("#cargar").css('display','block');
                    $.ajax({
                        type: "POST",
                        url: "{{ path('cerrarTTBitacora',{'idproyectos':idproyectos}) }}",
                        data:{ $idticket:idticket }
                    }).done(function (msj) {
                        if (msj=='bien') {
                            location.reload();
                        }
                    });

                });

                $("#crearTicket").click(function () {
                    var campo = new Object();
                    if($("#ttRef").val()==""){
                        alert("El campo TT REF es obligatorio");
                        return false;
                    }

                    if($("#idtipoProceso").val()==""){
                        alert("Debe Seleccionar tipo de actividad");
                        return false;
                    }
                    campo.ttRef = $("#ttRef").val();
                    campo.idtipoProceso = $("#idtipoProceso").val();
                    campo.idSitio =$("#idSitio").val();
                    campo.obs =$("#obs").val();
                    fecha = $("#fecha").val();
                    horaIni = $("#horaIni").val();
                    horaFin = $("#horaFin").val();
                    $('#cargar').css('display', '');
                    $.ajax({
                        type: "POST",
                        async: true,
                        url: "{{path('newTTBitacora',{'idproyectos':idproyectos, 'idmodule':idmodule,'idsubmodulo': idsubmodulo})}}",
                        data: {$campo: campo, $fecha: fecha, $horaIni: horaIni, $horaFin: horaFin}
                    }).done(function (msj) {
                            alert('Se creo el ticket con exito');


                            location.href = "{{path('ticketDetalle',{'idproyectos':idproyectos, 'idticket':'nuevo'})}}?ticket=" + msj;

                    });

                });

                $("#nombreSitio").autocomplete({
                    minLength: 1,
                    //source: window.availableTags2,
                    source: function( request, response ) {  //alert(request.term);
                        var matcher = new RegExp( "^" + $.ui.autocomplete.escapeRegex( request.term ), "i" );
                        response( $.grep( window.availableTags2, function( item ){
                            return matcher.test( item.label );
                        }) );
                    },
                    focus: function (event, ui) {
                        $("#nombreSitio").val(ui.item.label);
                        /* $( "#codigoSitio" ).val( ui.item.sitio );
                         $( "#regionSitio" ).val( ui.item.region );
                         $( "#dptoSitio" ).val( ui.item.dpto );
                         $( "#direSitio" ).val( ui.item.direc );
                         $( "#localidadSitio" ).val( ui.item.local );
                         $( "#categoriaSitio" ).val( ui.item.catego );
                         $( "#idsitioInsert" ).val( ui.item.value );*/
                        return false;
                    },
                    select: function (event, ui) { //alert('campo seleccionado')
                        $("#nombreSitio").val('');
                        $("#idsitioCodi option").removeAttr('selected');
                        $("#idsitioNom option").removeAttr('selected');
                        $("#idregion option").removeAttr('selected');
                        $("#idestado option").removeAttr('selected');
                        $("#idsitioNom option[value='"+ui.item.value+"']").attr('selected','selected');
                        $("#idsitioCodi option[value='"+ui.item.value+"']").attr('selected','selected');
                        $("#idregion option[value='"+ui.item.region+"']").attr('selected','selected');
                        $("#idestado option[value='"+ui.item.dpto+"']").attr('selected','selected');
                        $("#checkboxSitio" + ui.item.value).attr('checked', 'true');
                        $("#checkboxNomSitio" + ui.item.value).attr('checked', 'true');
                        /*$( "#nombreSitio" ).val( ui.item.label );
                         $( "#codigoSitio" ).val( ui.item.sitio );
                         $( "#regionSitio" ).val( ui.item.region );
                         $( "#dptoSitio" ).val( ui.item.dpto );
                         $( "#direSitio" ).val( ui.item.direc );
                         $( "#localidadSitio" ).val( ui.item.local );
                         $( "#categoriaSitio" ).val( ui.item.catego );
                         $( "#idsitioInsert" ).val( ui.item.value );*/
                        //ADD INPUT DEFINIDO EN ETIQUETAS QUE REQUIEREN INFO DEL SITIO
                        $("#text153").val(ui.item.label); // NOMBRE DEL SITIO
                        getSitiosByProyecto({{idproyectos}},1, ui.item.value); //CONSULTAR SITIOS ASOCIADOS AL SITIO PRINCIPAL

                        return false;
                    }
                });
            });

            function getSitiosByProyecto(idproyecto,idTipoSitio, idSitioP){

                $('#select150').empty();
                $("#text151,#text152").val("");
                $.getJSON("{{path('sitiosProyectoByPrincipal')}}", {idproyectos: idproyecto, idTipoSitio:idTipoSitio,idSitioP:idSitioP}, function (data) {
                    $('#select150').append($('<option>', {
                        value: "",
                        text : "Seleccione..."
                    }));
                    $.each(data, function (i, item) {
                        $('#select150').append($('<option>', {
                            value: item.idsitio,
                            text : item.codigo
                        }));
                    });
                });
            }
            </script>
    {% if turno == true %}


           <center> <h1 style="font-size: 24px; color: red">Turno asignado: {{ turno.turno }}
                   <br>
                   <br>
                   hora Inicio: {{ turno.horaInicio }}
                   <br><br>hora Fin: {{ turno.horaFin }}</h1></center>
                        <form action="{{ path('newTTBitacora',{'idproyectos':idproyectos, 'idmodule':idmodule, 'idsubmodulo':idsubmodulo}) }}" method="POST">
                                    <div class="col-lg-12" style="margin-top: 10px;">
                                        <div class="col-lg-3 col-lg-offset-3 table-bordered" style=" padding: 5px; color: #002561; font-weight: bold">
                                            <h2 style="font-weight: bold;">CREAR TICKET DE BITACORA</h2>
                                        </div>
                                        <div class="col-lg-6 col-lg-offset-3 table-bordered" style=" padding: 25px;">
                                            <div class="row">
                                                <div class="form-group">
                                                    <label>TT REF.</label>
                                                    <input class="form-control" name="campo[ttRef]" id="ttRef" maxlength="20" required="">
                                                </div>

                                            </div>
                                            <div class="row">
                                                <div class="form-group">
                                                    <label>{{'ticketDetail.email.tipo' | trans | upper}}</label>
                                                    <select class="js-example-basic-single" name="campo[idtipoProceso]" id="idtipoProceso">
                                                        <option></option>
                                                        {% for tipo in tipoProcesos %}
                                                            <option value="{{ tipo.idtipoProceso }}">{{ tipo.tipoProceso }}</option>
                                                        {% endfor %}
                                                    </select>
                                                </div>

                                            </div>
                                            <div class="row">
                                                <div class="form-group">
                                                    <label>SITIO</label>
                                                    <select  name="campo[idSitio]" id="idSitio" class="js-example-basic-single">
                                                        <option></option>
                                                        {%  for sitio in sitios %}
                                                        <option value="{{ sitio.idsitio }}">{{ sitio.sitio }}</option>
                                                        {% endfor %}
                                                    </select>
                                                </div>

                                            </div>
                                            <div class="row">
                                                <div class="form-group">
                                                    <label>FECHA</label>
                                                    <div class='input-group date datetimepicker1' >
                                                        <input id="fecha" type='text' class="form-control" data-date-format="YYYY-MM-DD" />
                            <span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span>
                            </span>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="row">
                                                <div class="form-group">
                                                    <label>HORA INICIO</label>

                                                    <div class='input-group date'   >
                                                        <input  type='text'  id="horaIni" onkeypress= "return noDatos(event, this.value)" class="form-control"  data-date-format="HH:mm" value="00:00" />
                                                            <span class="input-group-addon"><span class="glyphicon glyphicon-time"></span>
                                                            </span>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="row">
                                                <div class="form-group">
                                                    <label>HORA FIN</label>

                                                    <div class='input-group date'   >
                                                        <input  type='text'  id="horaFin" onkeypress= "return noDatos(event, this.value)" class="form-control"  data-date-format="HH:mm" value="00:00" />
                                                            <span class="input-group-addon"><span class="glyphicon glyphicon-time"></span>
                                                            </span>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="row">
                                                <div class="form-group">
                                                    <label>DESCRIPCION</label>
                                                    <textarea class="form-control" name="campo[obs]" id="obs"></textarea>
                                                </div>

                                            </div>
                                            <div class="block-center text-center">
                                                <button class="btn btn-info" type="button"  id="crearTicket">CREAR</button>
                                                <a href="{{path('controlCasosIni',{'idproyectos':idproyectos, 'idmodule':idmodule})}}">
                                                    <button type="button" class="btn btn-default btn-lg">{{'ticket.create.cancel' | trans}}</button>
                                                </a>
                                            </div>
                                        </div>
                                    </div>

                        </form>


        {% else %}

            <center>

                <div class="modal-dialog" role="document">
                    <div class="modal-content">
                        <div class="modal-header  btn-danger">
                            <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                            <h4 class="modal-title" id="exampleModalLabel">{{'dialog.alerta' | trans}}</h4>
                        </div>
                        <div class="modal-body"  style="padding: 20px;">
                            <h1>DEBE TENER UN TURNO ASIGNADO COMUNIQUESE CON EL SUPERVISOR</h1>
                        </div>
                    </div>
                </div>
            </center>
    {% endif %}

    <div class="modal fade" id="alertModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel">
            <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header  btn-info">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                    <h4 class="modal-title" id="exampleModalLabel">{{'dialog.alerta' | trans}}</h4>
                </div>
                <div class="modal-body">
                    <h1 class="title">ESTA SEGURO DE CERRAR EL TICKET?</h1>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-primary" data-dismiss="modal" idticket="" id="cerrarTicket">{{'ticketDetail.status.continue' | trans}}</button>
                    <button type="button" class="btn btn-default" data-dismiss="modal">{{'ticketDetail.status.cancel' | trans}}</button>
                </div>
            </div>
        </div>
    </div>

{%endblock %}