datepicker-nash-travel

Installation

npm i -S @d.blizen/datepicker-nash-travel

Usage

import { Datepicker, Timepicker, DatetimePicker, DateRangePicker } from '@d.blizen/datepicker-nash-travel';

// Global register
Vue.component('datepicker', Datepicker);
Vue.component('timepicker', Timepicker);
Vue.component('datetime-picker', DatetimePicker);
Vue.component('date-range-picker', DateRangePicker);

// Local register
new Vue({
  components:{ Datepicker, Timepicker, DatetimePicker, DateRangePicker }
})

when you want to set this module as external while you are developing another module, you should import it like this:

import * as VueDatepicker  from '@d.blizen/datepicker-nash-travel'

Props

Common

Name	Type	DefaultValue	Description
id	[String, Number]	none
value	[String, Number]	none
placeholder	String	请选择
min	String	none	Min
max	String	none	Max
canEdit	Boolean	true	If it can be changed
inputStyle	Object	none	Style of input tag
popperProps	Object	defaultPopperProps	Props of module @livelybone/vue-popper
scrollbarProps	Object	{ isMobile: false, maxHeight: 200 }	Props of scrollbar, see vue-scrollbar-live

const defaultPopperProps = {
  arrowPosition: 'start',
  arrowOffsetScaling: 1,
  popperOptions: {
    placement: 'bottom-start',
    positionFixed: true,
    // more options in https://popper.js.org
  },
}

Datepicker

Name	Type	DefaultValue	Description
dayStr	Array	['日', '一', '二', '三', '四', '五', '六']	Used to set day name
multiple	Boolean	false
type	String	date	Options: [year,month,date]
firstDayOfWeek	Number	0	Used to set the first day of week. Options: [0, 1, 2, 3, 4, 5, 6]
btnStr	String	确定	Used to set text of button

Timepicker

Name	Type	DefaultValue	Description
type	String	second	Options: [hour,minute,second]
timeStr	Array	['时', '分', '秒']	Used to set time name
btnStr	String	确定	Used to set text of button

DatetimePicker

Name	Type	DefaultValue	Description
dayStr	Array	['日', '一', '二', '三', '四', '五', '六']	Used to set day name
timeStr	Array	['时', '分', '秒']	Used to set time name
btnStr	String	确定	Used to set text of button
firstDayOfWeek	Number	0	Used to set the first day of week. Options: [0, 1, 2, 3, 4, 5, 6]
timeType	String	second	Options: [hour,minute,second]

DateRangePicker

Name	Type	DefaultValue	Description
value	Array	[null, null]	Used to set day name
dayStr	Array	['日', '一', '二', '三', '四', '五', '六']	Used to set day name
btnStr	String	确定	Used to set text of button
firstDayOfWeek	Number	0	Used to set the first day of week. Options: [0, 1, 2, 3, 4, 5, 6]
secondPlaceholder	String	请选择结束
rangeSeparator	String	至

Events

Name	EmittedData	Description
input	String