0

Estoy creando listado con el plug-in DataTable. Hasta el momento ahí todo bien. Uso php, js y mysql MVC introducir la descripción de la imagen aquí en ella se encuentra el registro Fecha Próxima etapa.

Busco poder agregar un mensaje de alerta en la columna de observaciones. donde si la Fecha Próxima etapa es mayor a la fecha actual, me avise que ya se paso "x" días y si es menor que faltan "x" días.

este es mi código con el cual listo mi tabla

<div class="col-md-12">
    <div class="box box-default box-solid">
        <div class="box-header with-border">
            <h3 class="box-title"> <b> CERDOS REPRODUCIDOS</b> </h3>

            <!-- /.box-tools -->
        </div>
            <!-- /.box-header -->
            <div class="box-body">
            <div class="form-group">
                <div class="col-lg-10">
                    <div class="input-group">
                        <input type="text" class="global_filter form-control" id="global_filter" placeholder="Ingresar dato a buscar">
                        <span class="input-group-addon"><i class="fa fa-search"></i></span>
                    </div><br>
                </div>
                <div class="col-lg-2">
                    <button class="btn btn-danger" style="width:100%" onclick="AbrirModalRegistroReproducidos()"><i class="glyphicon glyphicon-plus"></i>Nuevo Registro</button>
                </div>
            </div>
            <table id="listar_reproducidos" class="display responsive nowrap" style="width:100%">
                <thead>
                    <tr>
                        <th>#</th>
                        <th>Fecha de Registro</th>
                        <th>Tatuaje</th>
                        <th>Madre</th>
                        <th>Padre</th>
                        <th>Fecha de Nacimiento</th>
                        <th>Sexo</th>
                        <th>Peso Promedio KG</th>
                        <th>Peso Real KG</th>
                        <th>Etapa</th>
                        <th>Fecha Proxima Etapa</th>
                        <th>Moviento</th>
                        <th>Acci&oacute;n</th>
                        <th>Observaciones</th>
                    </tr>
                </thead>
                <tfoot>
                    <tr>
                        <th>#</th>
                        <th>Fecha de Registro</th>
                        <th>Tatuaje</th>
                        <th>Madre</th>
                        <th>Padre</th>
                        <th>Fecha de Nacimiento</th>
                        <th>Sexo</th>
                        <th>Peso Promedio KG</th>
                        <th>Peso Real KG</th>
                        <th>Etapa</th>
                        <th>Fecha Proxima Etapa</th>
                        <th>Moviento</th>
                        <th>Acci&oacute;n</th>
                        <th>Observaciones</th>
                    </tr>
                </tfoot>
            </table>
            </div>
            <!-- /.box-body -->
    </div>

</div>

y este mi js con el que traigo los datos de la BD

var table;
function listar_reproducidos(){
     table = $("#listar_reproducidos").DataTable({
       "ordering":true,   
       "bLengthChange":true,
       "searching": { "regex": false },
       "lengthMenu": [ [10, 25, 50, 100, -1], [10, 25, 50, 100, "All"] ],
       "pageLength": 10,
       "destroy":true,
       "async": false ,
       "processing": true,
       "ajax":{
           "url":"../controlador/reproducidos/controlador_reproducidos_listar.php",
           type:'POST'
       },
       "columns":[
           {"data":"posicion"},
           {"data":"cerp_fecharegistro"},
           {"data":"cerp_tatuaje"},
           {"data":"reproh_tatuaje"},
           {"data":"reprom_tatuaje"},
           {"data":"cerp_fechanacimiento"},
           {"data":"cerp_sexo",
           render: function (data, type, row ) {
               if(data=='M'){
                   return "MACHO";                   
               }else{
                   return "HEMBRA";                 
               }
           }
      },
           {"data":"cerp_pesopromedio"},
           {"data":"cerp_pesoreal"},
           {"data":"eta_nombre"},
           {"data":"cerp_fechafinaletapa"},
           {"data":"mov_nombre",
           render: function (data, type, row ) {
            if(data=='ACTIVO'){
                return "<span class='label label-success'>"+data+"</span>";                   
            }else{
              return "<span class='label label-danger'>"+data+"</span>";                 
            }
          }
        },
           {"defaultContent":"<button style='font-size:13px;' type='button' class='editar btn btn-primary'><i class='fa fa-edit'></i></button>&nbsp;"},
           {"defaultContent":""}
       ],

       "language":idioma_espanol,
       select: true
   });
   document.getElementById("listar_reproducidos_filter").style.display="none";
   $('input.global_filter').on( 'keyup click', function () {
        filterGlobal();
    } );
    $('input.column_filter').on( 'keyup click', function () {
        filterColumn( $(this).parents('tr').attr('data-column') );
    });

}

Muchas Gracias de ante mano y Bendiciones

2
  • ¿Y cuál es el problema en concreto?
    – A. Cedano
    el 11 mar. 2021 a las 9:07
  • Busco poder agregar un mensaje de alerta en la columna de observaciones. donde si la Fecha Próxima etapa es mayor a la fecha actual(hoy), me avise que ya se paso "x" días y si es menor que faltan "x" días. el 11 mar. 2021 a las 11:42

2 respuestas 2

1

Te indico como quedaría la parte de JavaScript, pruébalo a ver si te he entendido bien.

  var table;
  function listar_reproducidos(){
       table = $("#listar_reproducidos").DataTable({
         "ordering":true,   
         "bLengthChange":true,
         "searching": { "regex": false },
         "lengthMenu": [ [10, 25, 50, 100, -1], [10, 25, 50, 100, "All"] ],
         "pageLength": 10,
         "destroy":true,
         "async": false ,
         "processing": true,
         "ajax":{
             "url":"../controlador/reproducidos/controlador_reproducidos_listar.php",
             type:'POST'
         },
         "columns":[
             {"data":"posicion"},
             {"data":"cerp_fecharegistro"},
             {"data":"cerp_tatuaje"},
             {"data":"reproh_tatuaje"},
             {"data":"reprom_tatuaje"},
             {"data":"cerp_fechanacimiento"},
             {"data":"cerp_sexo",
             render: function (data, type, row ) {
                 if(data=='M'){
                     return "MACHO";                   
                 }else{
                     return "HEMBRA";                 
                 }
             }
        },
             {"data":"cerp_pesopromedio"},
             {"data":"cerp_pesoreal"},
             {"data":"eta_nombre"},
             {"data":"cerp_fechafinaletapa",
                         render: function (data, type, row ) {
                            var hoy = moment(new Date());
                            var fechafinaletapa = moment(new Date(data));
                            diasdiferencia = hoy.diff(fechafinaletapa, 'days');
                            return data;
                         }
             },
             {"data":"mov_nombre",
             render: function (data, type, row ) {
              if(data=='ACTIVO'){
                  return "<span class='label label-success'>"+data+"</span>";                   
              }else{
                return "<span class='label label-danger'>"+data+"</span>";                 
              }
            }
          },
             {"defaultContent":"<button style='font-size:13px;' type='button' class='editar btn btn-primary'><i class='fa fa-edit'></i></button>&nbsp;"},
             {"defaultContent":"",
                          render: function () {
                             if (diasdiferencia > 0) {
                                return "<span class='laquesea'>Te has pasado " + diasdiferencia + " días</span>";
                             }
                             if (diasdiferencia < 0) {
                                return "<span class='laquesea'>Te faltan " + Math.abs(diasdiferencia) + " días</span>";
                             }
                          }
             }
         ],

         "language":idioma_espanol,
         select: true
     });
     document.getElementById("listar_reproducidos_filter").style.display="none";
     $('input.global_filter').on( 'keyup click', function () {
          filterGlobal();
      } );
      $('input.column_filter').on( 'keyup click', function () {
          filterColumn( $(this).parents('tr').attr('data-column') );
      });
5
  • me calcula los días correctamente. pero ahora no me muestra la fecha próxima etapa. el 16 mar. 2021 a las 15:07
  • ya lo solucione, buscando en la documentación de Data Tables. solo tenia que retornar la data. el 16 mar. 2021 a las 15:14
  • Sorry, se me olvidó retornar la fecha, modifico el código para futuras consultas. Márcalo como contestado ;-)
    – DigiSoul
    el 16 mar. 2021 a las 15:16
  • Muchas Gracias por su ayuda. Realmente se le agradece mucho. el 16 mar. 2021 a las 15:16
  • A mandar, para eso es esta comunidad, suerte!!!
    – DigiSoul
    el 16 mar. 2021 a las 15:18
1

yo utilizo la librería moment.js para el manejo de fechas, formatos, agregar o quitar dias, meses, años, horas, segundos, etc... y muchas más funciones. La puedes descargar desde https://momentjs.com/ en dos versiones moment.js y moment-with-locales.js, la segunda tiene además herramientas para el formato internacional, pero para tu caso con la primera tienes suficiente. Utilizando esta librería el código sería algo así.

// Creamos objeto "hoy" con la fecha actual
var hoy = moment(new Date()); 
// Capturamos la fecha del campo "cerp_fechafinaletapa", como ya tiene un formato valido
// según la imágen de la tabla (YYYY-MM-DD), no has de formatearla.
var fechafinaletapa = moment(new Date(Valor_de_cerp_fechafinaletapa));
// Obtenemos variable con la diferencia de días
var diasdiferencia = hoy.diff(fechafinaletapa, 'days');

Con esto tendrías la diferencia de días, ahora solo tienes que crear un if donde vayas a poner el valor para "Observaciones" según la diferencia de días. Espero haberme explicado bien, un saludo.

1
  • Me puedes terminar de ayudar a crear el If por favor? el 12 mar. 2021 a las 5:43

Tu Respuesta

Al pulsar en “Publica tu respuesta”, muestras tu consentimiento a nuestros términos de servicio, política de privacidad y política de cookies

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.