0

Estoy trabajando con fullCalendar para realizar la toma de vacaciones cabe decir que soy nueva en esto, necesito seleccionar los días de vacaciones que yo quiera, una ves seleccionados hacer click en el botón "listar información", esta me trae solo la ultima fecha que seleccione 2020/11/12 y yo quiero como resultado la suma total de los días que seleccione ejemplo: "5" días:

introducir la descripción de la imagen aquí

Espero que alguien me pueda ayudar.

1 respuesta 1

0

¡Hola! Espero que hayas logrado resolver tu problema, de no ser así te dejo una forma para poder logralo. Dentro del callback select tienes que hacer el cálculo de los días seleccionados y luego almacenar el cálculo en una variable global para poder hacer uso luego al hacer clic en el botón Listar.

Primero declaras la variable global en cero, de preferencia antes de iniciar el calendario:

let diasSeleccionados = 0;

var calendarEl = document.getElementById('calendar');

var calendar = new FullCalendar.Calendar(calendarEl, {
  // ...
});

Luego en el callback de select haces el cálculo de la siguiente forma:

diasSeleccionados = ((new Date(info.endStr).getTime()) - (new Date(info.startStr).getTime())) / (1000 * 3600 * 24);

Recuerda que estás trabajando com milisegundos, es por eso que requieres de la multiplicación y división para poder obtener el tiempo en terminos de días.

Una forma más sencilla sería utilizar utilizar la función diff de MomentJS:

diasSeleccionados = Number(moment(info.endStr).diff(moment(info.startStr), 'days'));

Luego en la función del botón puedes hacer uso de diasSeleccionados en cualquier momento, pues es una variable global.

// ...
customButtons: {
  listar: {
    text: 'Listar',
    click: function() {
      alert(`Días seleccionados: ${diasSeleccionados}`);
      diasSeleccionados = 0;
    }
  }
}
// ...

Puedes regresar el valor a 0 una vez hayas procesado la información para evitar problemas.

Te comparto el codepen en donde puedes ver el código completo, no lo inserto aquí debido a que los CSS de FullCalendar dan problemas (no se cargan) y sin ellos no se tiene el comportamiento deseado.

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

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