+19
-1
lines changedFilter options
+19
-1
lines changed Original file line number Diff line number Diff line change
@@ -84,6 +84,12 @@
84 84
type: 'Boolean',
85 85
description: 'Override native browser pickers by changing type of input to text.',
86 86
defaults: 'true'
87 +
},
88 +
{
89 +
name: 'md-debounce',
90 +
type: 'Number',
91 +
description: 'Debounces the conversion of plaintext into a date object. Set to a longer time if your users type slowly, or shorter if your users type really fast.',
92 +
defaults: 1000
87 93
}
88 94
]
89 95
},
@@ -1,7 +1,7 @@
1 1
<template>
2 2
<md-field :class="['md-datepicker', { 'md-native': !this.mdOverrideNative }]" md-clearable>
3 3
<md-date-icon class="md-date-icon" @click.native="toggleDialog" />
4 -
<md-input :type="type" ref="input" v-model="modelDate" @focus.native="onFocus" pattern="[0-9]{4}-[0-9]{2}-[0-9]{2}" />
4 +
<md-input :type="type" ref="input" :value="modelDate" @input="onInput" @focus.native="onFocus" pattern="[0-9]{4}-[0-9]{2}-[0-9]{2}" />
5 5 6 6
<slot />
7 7
@@ -28,6 +28,7 @@
28 28
import MdOverlay from 'components/MdOverlay/MdOverlay'
29 29
import MdDatepickerDialog from './MdDatepickerDialog'
30 30
import MdDateIcon from 'core/icons/MdDateIcon'
31 +
import MdDebounce from 'core/utils/MdDebounce'
31 32
import MdField from 'components/MdField/MdField'
32 33
import MdInput from 'components/MdField/MdInput/MdInput'
33 34
@@ -54,6 +55,10 @@
54 55
mdImmediately: {
55 56
type: Boolean,
56 57
default: false
58 +
},
59 +
MdDebounce: {
60 +
type: Number,
61 +
default: 1000
57 62
}
58 63
},
59 64
data: () => ({
@@ -93,6 +98,12 @@
93 98
}
94 99
},
95 100
methods: {
101 +
onInput(value) {
102 +
const parsedDate = parse(value)
103 +
if (isValid(parsedDate)) {
104 +
this.selectedDate = parsedDate
105 +
}
106 +
},
96 107
toggleDialog () {
97 108
if (!isFirefox || this.mdOverrideNative) {
98 109
this.showDialog = !this.showDialog
@@ -126,6 +137,7 @@
126 137
}
127 138
},
128 139
created () {
140 +
this.onInput = MdDebounce(this.onInput, this.MdDebounce)
129 141
this.modelDate = this.dateToHTMLString(this.value)
130 142
this.selectedDate = this.value
131 143
}
You can’t perform that action at this time.
RetroSearch is an open source project built by @garambo | Open a GitHub Issue
Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo
HTML:
3.2
| Encoding:
UTF-8
| Version:
0.7.4