+19
-3
lines changedFilter options
+19
-3
lines changed Original file line number Diff line number Diff line change
@@ -7,7 +7,6 @@
7 7
<page-container centered :title="$t('pages.datepicker.title')">
8 8
<div class="page-container-section">
9 9
<p>Datepickers use a dialog window and provide a simple way to select a single value from a pre-determined set. The component can have disabled dates and it's really easy to use.</p>
10 -
<note-block alert>The datepicker dialog is disabled in Firefox, because it have a built-in Datepicker on desktop.</note-block>
11 10
</div>
12 11 13 12
<div class="page-container-section">
@@ -65,6 +64,12 @@
65 64
type: 'Boolean',
66 65
description: 'Disable the on focus event. Will open only if the user clicks on the icon.',
67 66
defaults: 'true'
67 +
},
68 +
{
69 +
name: 'md-override-native',
70 +
type: 'Boolean',
71 +
description: 'Override native browser pickers by changing type of input to text.',
72 +
defaults: 'true'
68 73
}
69 74
]
70 75
}
@@ -1,7 +1,7 @@
1 1
<template>
2 2
<md-field class="md-datepicker">
3 3
<md-date-icon class="md-date-icon" @click.native="toggleDialog" />
4 -
<md-input type="date" 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" v-model="modelDate" @focus.native="onFocus" pattern="[0-9]{4}-[0-9]{2}-[0-9]{2}" />
5 5 6 6
<slot />
7 7
@@ -40,13 +40,24 @@
40 40
mdOpenOnFocus: {
41 41
type: Boolean,
42 42
default: true
43 +
},
44 +
mdOverrideNative: {
45 +
type: Boolean,
46 +
default: true
43 47
}
44 48
},
45 49
data: () => ({
46 50
showDialog: false,
47 51
modelDate: null,
48 52
selectedDate: null
49 53
}),
54 +
computed: {
55 +
type () {
56 +
return this.mdOverrideNative
57 +
? 'text'
58 +
: 'date'
59 +
}
60 +
},
50 61
watch: {
51 62
selectedDate (selectedDate) {
52 63
if (selectedDate) {
@@ -71,7 +82,7 @@
71 82
},
72 83
methods: {
73 84
toggleDialog () {
74 -
if (!isFirefox) {
85 +
if (!isFirefox || this.mdOverrideNative) {
75 86
this.showDialog = !this.showDialog
76 87
} else {
77 88
this.$refs.input.$el.click()
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