
 <div class="container-fluid">
  <div class="row">
    <div class="col-lg-12">
      <div class="card shadow-lg p-3 mb-5 bg-white ">
        <div class="card-header"> <h2>Programación de la Produccion</h2> </div>
        <div class="card-body">
          <!-- COMIENZO DEL FORMULARIO -->
         <div >            
             <button id="btnCrear" class="btn btn-outline-success  btn-lg mt-8" type="submit"   onclick="window.location.href='/links/planificacion'"><i class='fas fa-plus-circle'  ></i> </button>
             <button id="btnCrear" class="btn btn-outline-danger   btn-lg mt-8" type="submit"   onclick="cerrar_ordenes()"><i class="fas fa-sign-out-alt"></i> </button> 
             
             <input type="hidden"  style="text-align:right;" class="form-control" placeholder="" name="id-orden" >    

               <table id="tabla123" class="display" style="width:100%">
                   <thead>
                          <tr>
                            <th></th>
                            <th >ID</th>  
                            <th class='text-center' ># Programación</th>
                            <th>Fecha I</th>
                            <th>Fecha F</th>
                            <th>Area</th>      
                            <th>Horas</th>    
                            <th> Acciones </th>                                                         
                          </tr>                     
                   </thead>
                  <tfoot>
                          <tr>
                            <th></th>
                            <th >ID</th>  
                            <th># Programación</th>
                            <th>Fecha I</th>
                            <th>Fecha F</th>
                            <th>Area</th>    
                            <th>Horas</th>      
                            <th > Acciones </th>                                                         
                          </tr>
                      </tfoot>                   
               </table>


            <div >





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

<script src= "/jquery/dist/jquery.js"  ></script> 

<script>
 function cerrar_ordenes() {
//****
        const swalWithBootstrapButtons = Swal.mixin({
            customClass: {
                confirmButton: 'btn btn-success',
                cancelButton: 'btn btn-danger'
            },
            buttonsStyling: false,
        })

    var  table = $('#tabla123').DataTable() ;
    var selectedRows = table.rows('.selected').data().length;

    if (selectedRows > 0) {
        swalWithBootstrapButtons.fire({
            title: 'Estas seguro de Cerrar las Ordenes Seleccionadas?',
            text: "",
            showCancelButton: true,
            confirmButtonText: 'OK',
            cancelButtonText: 'Cancel',
            reverseButtons: true
        }).then((result) => {
            if (result.value) {
                swalWithBootstrapButtons.fire(
                        'Finished',
                        'Success',
                        'success',
                    );   
                 ordenes_to_close();
            } else if (
                result.dismiss === Swal.DismissReason.cancel
            ) {
                swalWithBootstrapButtons.fire(
                    'Canceled',
                    'Proceso Cancelado',
                   'error'
                );
            }
        });
    } else {
      toastr.error('Debe seleccionar al menos una orden ', 'Cerrar Ordenes', {timeOut: 2000})
    }
//****
 }
//************************************
  function ordenes_to_close() {
    var  table = $('#tabla123').DataTable() ;
    var selectedRows = table.rows('.selected').data().length;
    var   rowData = table.rows( { selected: true } ).data().toArray();
    var cadena = ""
    for (i=0; i< selectedRows; i++ ) {
         if ( (i  + 1) < selectedRows) {
             cadena =  cadena + rowData[i]['id_plan']+ ',';
         }else {
           cadena = cadena + rowData[i]['id_plan']
         }
         table.row('.selected').remove().draw( false );
         
    }
   
    var url1 = "/links/cerrrar-ordenes/" + cadena;
         $.ajax({
            url: url1,
           type: "GET",
            dataType: "json",
            success: function (data) {
               $.each(data, function (i, item) {
                  for (i=0; i< selectedRows; i++ ) {
                      table.row('.selected').remove().draw( false );
                  }
                  toastr.success('Se Cerraron exitosamente ' + item.Ordenes_Cerradas + ' Ordenes' , 'Cerrar Ordenes', {timeOut: 8000})
               });
            },
            error: function (error) {
               console.log(`Error ${error}`);
            }   
         });
    
    //
  }
</script>

<script>

    $(document).ready(function() {   
          var url1 = "/links/lista-planesgeneral";

          $('#tabla123').DataTable({     
                  dom: 'Bfrtip',
                  responsive: true,
                  buttons: [
                       'excel', 'pdf'
                  ],
                  "ajax" : {
                  "url" : url1,
                  "dataSrc":"",
                  "type" : "GET"                  
              },
              "aaSorting": [[ 1, "desc" ]] ,
              "columns":[
                  {"defaultContent": '' },
                  {"data": "id_plan",  "title": "ID" },
                  {"data": "numerodeorden",  "title": "#Programación", className: "text-center" },
                  {"data": "Fecha_i",  "title":  "Fecha Inicial" },
			            {"data": "Fecha_f",  "title": "Fecha Final"  }, 
                  {"data": "el_departamento",  "title": "Area"  },
                  {"data": "horas_disponibles",  "title": "Horas"  },
                  {"defaultContent": "<div class='text-center'> <div class='btn-group'> <button class='btn btn-info btn-sm btnEditar'>Editar</button>  <button class='btn btn-warning btn-sm btnBloquear'>Mostrar</button>  </div> </div>", "width": "10%"}
             ],
             "columnDefs": [
             { 
                orderable: false,
                className: 'select-checkbox',
                targets:   0 }
             ],  
            select: {
                style:    'multi',
                selector: 'td:first-child'
            },                        
             pageLength : 10,
             lengthMenu: [[5, 10, 20, -1], [5, 10, 20, 'Todos']],
            "scrollY": 300,
            "scrollX": true,
            "scrollX": true,
            "scrollCollapse": true
              });



    });

              $("#tabla123").on('click', '#select', function (e) {
                  e.preventDefault();  
                  var currentRow = $(this).closest("tr");
                  
                  var data = $('#tabla123').DataTable().row(currentRow).data();
                  document.getElementsByName('id-orden')[0].value  =  data['Id_plan']
              });


</script>

<script>

    $(document).on("click", ".btnEditar", function(){		            
        opcion='editar';
        fila = $(this).closest("tr");	        
        id = parseInt(fila.find('td:eq(1)').text());
        window.location.href = "/links/edit-planificacion/" + id;
        
    })

    
    $(document).on("click", ".btnBloquear", function(){		            
        opcion='consumo';
        fila = $(this).closest("tr");	        
        id = parseInt(fila.find('td:eq(1)').text());
        window.location.href = "/links/show-programacion/" + id;
        
    })




</script>


</div>

