1 | import { ElementUIComponent, ElementUIComponentSize, ElementUIHorizontalAlignment } from './component'
|
2 |
|
3 | export type DatePickerType = 'year' | 'month' | 'date' | 'datetime' | 'week' | 'datetimerange' | 'daterange' | 'dates'
|
4 | export type FirstDayOfWeek = 1 | 2 | 3 | 4 | 5 | 6 | 7
|
5 |
|
6 | export interface DisabledDateChecker {
|
7 | /**
|
8 | * Determine if `date` will be disabled in the picker
|
9 | *
|
10 | * @param date The date to check
|
11 | * @returns if `date` will be disabled in the picker
|
12 | */
|
13 | (date: Date): boolean
|
14 | }
|
15 |
|
16 | // Picked date range
|
17 | export interface DateRange {
|
18 | minDate: Date,
|
19 | maxDate: Date
|
20 | }
|
21 |
|
22 | export interface PickEventHandler {
|
23 | /**
|
24 | * Callback function that triggers when picks a date range
|
25 | *
|
26 | * @param dateRange The selected date range
|
27 | */
|
28 | (dateRange: DateRange): void
|
29 | }
|
30 |
|
31 | export interface ShortcutClickEventHandler {
|
32 | /**
|
33 | * Callback function that triggers when clicking on a shortcut.
|
34 | * You can change the picker value by emitting the pick event.
|
35 | * Example: `vm.$emit('pick', new Date())`
|
36 | */
|
37 | (vm: ElDatePicker): void
|
38 | }
|
39 |
|
40 | /** Shortcut options */
|
41 | export interface Shortcut {
|
42 | /** Title of the shortcut */
|
43 | text: string,
|
44 |
|
45 | /** Callback function that triggers when picks a date range */
|
46 | onClick?: ShortcutClickEventHandler
|
47 | }
|
48 |
|
49 | /** Options of el-date-picker */
|
50 | export interface DatePickerOptions {
|
51 | /** An object array to set shortcut options */
|
52 | shortcuts?: Shortcut[]
|
53 |
|
54 | /** A function determining if a date is disabled. */
|
55 | disabledDate?: DisabledDateChecker
|
56 |
|
57 | /** First day of week */
|
58 | firstDayOfWeek?: FirstDayOfWeek
|
59 |
|
60 | /** A callback that triggers when the seleted date is changed. Only for daterange and datetimerange. */
|
61 | onPick?: PickEventHandler
|
62 | }
|
63 |
|
64 | /** DatePicker Component */
|
65 | export declare class ElDatePicker extends ElementUIComponent {
|
66 | /** The value of the date picker */
|
67 | value: Date | string | Date[] | string[]
|
68 |
|
69 | /** Whether DatePicker is read only */
|
70 | readonly: boolean
|
71 |
|
72 | /** Whether DatePicker is disabled */
|
73 | disabled: boolean
|
74 |
|
75 | /** Size of Input */
|
76 | size: ElementUIComponentSize
|
77 |
|
78 | /** Whether the input is editable */
|
79 | editable: boolean
|
80 |
|
81 | /** Whether to show clear button */
|
82 | clearable: boolean
|
83 |
|
84 | /** Placeholder */
|
85 | placeholder: string
|
86 |
|
87 | /** Placeholder for the start date in range mode */
|
88 | startPlaceholder: string
|
89 |
|
90 | /** Placeholder for the end date in range mode */
|
91 | endPlaceholder: string
|
92 |
|
93 | /** Type of the picker */
|
94 | type: DatePickerType
|
95 |
|
96 | /** Format of the picker */
|
97 | format: string
|
98 |
|
99 | /** Alignment */
|
100 | align: ElementUIHorizontalAlignment
|
101 |
|
102 | /** Custom class name for DatePicker's dropdown */
|
103 | popperClass: string
|
104 |
|
105 | /** Additional options, check the table below */
|
106 | pickerOptions: DatePickerOptions
|
107 |
|
108 | /** Range separator */
|
109 | rangeSeparator: string
|
110 |
|
111 | /** Default date of the calendar */
|
112 | defaultValue: Date | number | string
|
113 |
|
114 | /** Format of binding value. If not specified, the binding value will be a Date object */
|
115 | valueFormat: string
|
116 |
|
117 | /** name for the inner native input */
|
118 | name: string
|
119 |
|
120 | /**
|
121 | * Focus the Input component
|
122 | */
|
123 | focus (): void
|
124 | }
|