{%block dashboard %}
<script>
  
    $(function(){
        $('#listaprocesos').html('<img class="loading" width="16" src="{{asset('loadings/spin.GIF')}}" />');

        $('#listaprocesos').load('{{path("ListaprocesosxProyecto",{'idproyectos':idproyectos})}}',{},function(){
            $(".loading").hide();
        });        

        $("#multiProcesos").click(function(){

            if ($("#multiProcesos").prop( "checked") == true)
                $("#idprocesos").attr({'multiple':true, size:30});
            else{
                $("#idprocesos").removeAttr('multiple size');
                $("#multiProcesos").prop( "checked", false );
            }
        });
    });
  
    $("#incluirProceso").click(function(){
      $(".error").remove();
      var campo = $("#nuevoproceso").val();
      var idprocesos =  $("#idprocesos").val();
      
      if ( ((campo == '') && ($("#idprocesos").val()=='0')) || ($("#idprocesos").val()=='') ) {
          $("#incluirProceso").focus().after("<span class='error'>Ingrese o Seleccione Proceso </span>");
          return false;
      }else{
          if (campo=='') campo='nada';
          $.ajax({
            type:"GET",
            async:true,
            url:"{{path('IncluirProceso',{'idproyectos':idproyectos})}}",
            data:{$idprocesos: idprocesos, $nuevo: campo}
          }).done(function(msj){
              $("#procesos").load("{{ path('procesos_proyectos',{'idproyectos':idproyectos})}}");
          });          
      }
    });
      
    $("#idprocesos").change(function(){
        $(".error").remove();
        var campo = $("#idprocesos").val();
        
        if (campo == '0'){
            $("#nuevo").show();
        }else{
            $("#nuevo").hide();            
        }
    });


</script> 

        <div class="col-lg-4 col-xs-12   main">
                <div class="form-group">
                        <label>Seleccione Proceso</label>
                        <select class="form-control" id="idprocesos">
                            <option value="">-- {{'site.select' | trans}} --</option>   
                            <option value="0">INCLUIR NUEVO</option>                            
                            {% for rol in procesos %}
                            <option value="{{ rol.idproceso }}">
                                {{ rol.proceso }}
                            </option>
                                {% endfor %}

                        </select>
                        <input type="checkbox" id="multiProcesos">Múltiples Procesos
                </div>
                <div id="nuevo" style="display: none" class="form-group">  
                    <label>Introduzca Proceso</label>                    
                    <input type="text" id="nuevoproceso"/>
                </div>
             <button class="btn btn-info" id="incluirProceso" >Incluir</button>
        </div>
                            
        <div class="col-lg-4 col-xs-12   main">
            <div class="form-group">
                    <label>Lista de Procesos Incluidos</label>
                    <div id="listaprocesos"  class=" table-bordered" style="   height: 150px;  overflow-y: scroll; "></div>
             </div>
        </div>                            
    <div class=" col-xs-12 col-lg-12 col-md-12" id="confiProyectos"></div>
{% endblock %}