Period Picker

El Period Picker es un componente de selección de periodos de tiempo que permite al usuario elegir intervalos específicos, como mes, quincena o semana. Este selector es ideal para aplicaciones que manejan información periódica, como reportes de nómina o métricas de rendimiento, ya que permite al usuario segmentar y analizar datos de acuerdo a sus necesidades temporales de forma rápida y precisa.

Playground

Period Picker

​

PeriodicidadMensualSemanalQuincenalPlaceholderMes por defecto

Label

Requerido

Disabled

Readonly

Vinculado a otro

Hint

Mensaje de error

Ruby

<%= f.label :start_period, "Period Picker" %>
<%= period_date_picker f,
 					:start_period,
					default_month: '01-01-2024'.to_date,
					period_type: :monthly %>

Lista de parámetros

Todos los named params son opcionales.

Ruby

Parámetro	Tipo	Tipo de dato	Detalle
form	Positional Param	Form de Simple Form	Formulario dentro del cual se encuentra el input.
name	Positional Param	String	Nombre que tendrá el input. Internamente se añade el namespace completo en base a la anidación del formulario en que se encuentra.
id	Named Param	String	ID del input. Si no se ingresa, se usa el name. Al igual que el name, automáticamente se añade el namespace.
placeholder	Named Param	String	Texto que se muestra en el input cuando no tiene valor.
period_type	Named Param	Symbol	Tipo de periodo a seleccionar. Puede ser :monthly, :semi_monthly o :weekly.
required	Named Param	Boolean	Indica si el campo es requerido o no.
value	Named Param	Date	Valor inicial del input.
disabled	Named Param	Boolean	Indica si el campo está deshabilitado o no.
read_only	Named Param	Boolean	Indica si el campo es de solo lectura
hint	Named Param	String	Texto de ayuda que se muestra debajo del input
error_message	Named Param	String	Mensaje de error que se muestra debajo del input
default_month	Named Param	Date	Mes por defecto en que se desplegará el calendario. Solo utilizado si es que no hay valor por defecto.
start_date	Named Param	Date	Fecha mínima que se puede seleccionar.
end_date	Named Param	Date	Fecha máxima que se puede seleccionar.
link_start_date	Named Param	String (Query Selector)	Query selector (#start_period por ejemplo) de un period picker que será el inicio de un rango (desde). Este se ingresa en el selector del fin de este rango (hasta). Con esta configuración, el selector "hasta" no podrá seleccionar fechas anteriores a la seleccionada en el selector "desde".
intercooler	Named Param	Hash	Hash con opciones para intercooler. (Todos los parámetros del tipo ic-*).
data	Named Param	Hash	Hash con los parámetros del tipo data-*.
**opts	Named Param {}	Hash	Todos los parámetros extra que se quieran pasar al input y no estén mencionados arriba.

Anatomía