DateTimeTabsSelectorComponent

This component allows you to create a datetime component in what you can especify even more the datetime that you want to insert. It depends on DateComponent, DateTimeComponent, DateTimePickerComponent.

Example

DateTimeTabsSelectorComponent

<date-time-tabs-selector-component
  active-operator="activeOperator"
  editable="editable"
  show-clear-button="showClearButton"
  show-today-button="showTodayButton"
  validation-mode="validationMode"
  hide-validation="hideValidation"
  locale="locale"
>
  <slot name="input-label" />
  <slot name="custom-tabs" />
</date-time-tabs-selector-component>

Props

NameDescriptionTypeRequiredDefault
valueInner value of the componentfalseMon Apr 10 2023 10:02:43 GMT-0400 (Cuba Daylight Time)
activeOperatorAllows you to indicate the active operator in the componentStringfalse"date"
minDateAllows you to indicate the selectable min dateeslint-disable-next-line vue/require-default-propDatefalse-
maxDateAllows you to indicate the selectable max dateeslint-disable-next-line vue/require-default-propDatefalse-
horizontalAllows you to indicate if the component will be horizontal or notBooleanfalsefalse
appendToBodySame as append-to-body in Buefy b-datepickerBooleanfalsetrue
editableAllows you to indicate if the date is editableBooleanfalsetrue
showClearButtonAllows you to indicate if the clear bottom will be displayed or notBooleanfalsetrue
showTodayButtonAllows you to indicate if the today button will be displayed or notBooleanfalsetrue
dateTimeFormatAllows you to indicate the format of the returned datetimeStringfalse"DD/MM/YYYY hh:mm A"
validationModeValidation mode to ValidationProviderStringfalse"eager"
hideValidationAllows you to indicate if show validation or notBooleanfalsefalse
localeLocale string {en, es ...} for display language on componentStringfalse"en"

Events

Event NameDescriptionParameters
input--
operatorUpdated--
clearedOutValues--

Slots

NameDescriptionDefault Slot Content
input-label--
custom-tabs--