Cómo crear un selector de franjas horarias en un calendario de Salesforce
Salesforce te da un selector de fecha y un campo de hora. No te da una cuadrícula de franjas para elegir. Esto es lo que hace falta para un selector de franjas horarias de verdad en Salesforce, y cómo tenerlo sin desarrollarlo.
Un selector de franjas horarias es una interfaz concreta: un calendario en el que eliges un día y, debajo, una cuadrícula con ese día dividido en intervalos reservables, con los ocupados claramente no disponibles. Todo el mundo lo reconoce, porque lo usan todas las webs de reservas. Salesforce no trae ninguno.
Lo que Salesforce te da de serie
Un campo Fecha/hora estándar se muestra como un campo de fecha más un desplegable de hora. Es un control de formulario y no sabe qué más está reservado. Nada impide que un usuario elija una franja que ya está ocupada, porque el campo no sabe que existen otros registros. Esa comprobación llega después, en una regla de validación o en un flujo, cuando el usuario ya ha hecho su elección.
Ahí está el hueco. Un selector de franjas horarias consulta los registros existentes antes de que el usuario elija, y solo ofrece lo que está libre.
Lo que tiene que hacer un selector de franjas de verdad
| Requisito | Campos estándar | Con MultiDatePick |
|---|---|---|
| Dividir el día en intervalos | No existe el concepto de intervalo | Cualquier intervalo (lo habitual: 15, 30 o 60 minutos) |
| Conocer la jornada laboral | Cualquier hora es válida | Hora más temprana y más tardía, o el horario comercial de cada recurso |
| Mostrar lo ocupado | No se muestra nada | Las reservas existentes dibujadas en la cuadrícula |
| Varias personas por franja | No se puede expresar | Capacidad con un indicador en vivo de reservas frente a capacidad |
| Horas distintas en días distintos | Un campo, un valor | Allow Different Times Per Date (Permitir horas distintas) |
| Evitar un solapamiento al guardar | Solo con lógica personalizada | Conflict Behavior (Comportamiento ante conflictos): bloquear, omitir o permitir |
Por qué desarrollarlo tú mismo cuesta más de lo que parece
Dibujarlo es lo fácil. Estas son las partes que nadie estima:
Consultar las reservas
De forma eficiente, sin superar los límites del gobernador cuando alguien abre una vista de dos meses.
Cálculo de solapamientos
Se complica en cuanto las reservas pueden tener duraciones distintas.
Zonas horarias
La zona horaria del usuario y la del registro no siempre coinciden.
Condiciones de carrera
Dos personas mirando la misma franja libre en el mismo momento.
Seguridad a nivel de campo
El componente tiene que respetar lo que el usuario puede ver.
Accesibilidad
Una cuadrícula de divs en los que se puede hacer clic no se puede recorrer con el teclado por defecto.
La accesibilidad es lo que más cuidado exige. Una cuadrícula de franjas necesita semántica de cuadrícula ARIA correcta, navegación con las flechas y un estado que se transmita con algo más que el color. Es lo que la mayoría de los desarrollos internos se saltan, y lo que pregunta una revisión de compras.
Agrupar las franjas para que se puedan leer de un vistazo
Una jornada de 9:00 a 17:00 en intervalos de 15 minutos son 32 franjas. En una lista plana, eso es un muro. Agruparlas por periodo (mañana, tarde, noche) lo convierte en tres bloques cortos. Es lo que más ayuda cuando quien elige es un cliente desde el móvil.
Cuando no necesitas el calendario
A veces la fecha ya está implícita. En la página de registro de una cita que ya tiene fecha, un calendario mensual sobra. Time Grid Only (Solo cuadrícula de horarios) quita el calendario y muestra solo la cuadrícula de franjas de esa fecha, tomada de un campo del registro o indicada directamente.
Los ajustes que forman el selector
Cada uno es un campo del asistente de configuración. Nada de esto necesita código.
| Ajuste | Función | Nombre de API |
|---|---|---|
| Intervalo de tiempo en minutos (Time Slot Interval) | La duración de cada franja. Cualquier número de minutos. | timeInterval |
| Hora mínima / Hora máxima (Earliest Time / Latest Time) | El intervalo del día que cubre la cuadrícula en el componente Dates & Times. | minTime, maxTime |
| Campo de inicio / fin del horario comercial (Business Hours Start / End Field) | El horario laboral de cada recurso en el componente Booking. | businessHoursStartField |
| Campo de capacidad (Capacity Field) | Cuántas reservas admite un recurso por franja. | capacityField |
| Agrupar franjas horarias por periodo (Group Time Slots by Period) | Secciones de Mañana, Tarde y Noche. | groupTimeSlotsByPeriod |
| Comportamiento ante conflictos (Conflict Behavior) | Bloquear, omitir o permitir un solapamiento al guardar. | conflictBehavior |
| Solo cuadrícula de horarios (Time Grid Only) | Solo la cuadrícula de franjas, para una fecha implícita. | timeGridOnly |
Preguntas frecuentes
¿Qué es un selector de franjas horarias?
Un calendario en el que eliges un día y, debajo, una cuadrícula que divide ese día en intervalos reservables. Las franjas ya ocupadas aparecen como no disponibles, así que solo se eligen horas libres.
¿Tiene Salesforce un selector de franjas horarias?
No para tus propios objetos. Un campo Fecha/hora estándar es un campo de fecha más un desplegable de hora, y no ve los demás registros. MultiDatePick añade un selector de franjas horarias que lee las reservas existentes al cargar el calendario y solo ofrece lo que está libre.
¿Las franjas pueden durar lo que yo quiera?
Sí. El intervalo puede ser cualquier número de minutos. Lo habitual son 15, 30 o 60 minutos, y una franja de entrevista de 45 minutos funciona igual.
¿Necesito Apex o un desarrollador para añadir un selector de franjas horarias?
No. El asistente de configuración genera la configuración, y el componente se coloca en una página de registro, una página de aplicación, un sitio de Experience Cloud o un flujo de pantalla (Screen Flow) rellenando Config Name (Nombre de configuración). No hay que escribir código.
Tu selector de franjas horarias de Salesforce, listo para configurar
Elige una franja libre en la demo en vivo y después sigue Primeros pasos para tener uno en tu organización.
- US$20/usuario/mes, todas las funciones
- Prueba gratis de 30 días, sin tarjeta
- 100 % nativo de Salesforce
- Sin Apex
- Próximamente en Salesforce AppExchange