Answer the question
In order to leave comments, you need to log in
Vuetify - calendar with year only selection?
Hello.
There is a task to make a calendar in which only the year is available for selection.
The calendar has a "From" and "To" field, filtering occurs between dates.
At the moment I have a situation in which the first click on each of the fields gives the desired result, BUT if the year needs to be changed, I have a choice of month in one of the fields (arbitrarily).
- I suppose it's in this area, but I don't know how I can do better.
watch: {
menu_from (val) {
val && this.$nextTick(() => (this.$refs.picker.activePicker = 'YEAR'))
},
menu_to (val) {
val && this.$nextTick(() => (this.$refs.picker.activePicker = 'YEAR'))
},
},
computed: {
from_dateNom () {
return this.from_dateNomRaw ? moment(this.from_dateNomRaw).format('YYYY') : ''
},
to_dateNom () {
return this.to_dateNomRaw ? moment(this.to_dateNomRaw).format('YYYY') : ''
},
<template v-slot:activator="{ on, attrs }">
<v-text-field
class="from-date mr-1"
:value="from_dateNom"
label="От"
readonly
append-icon="mdi-calendar"
outlined
hide-details
clearable
v-bind="attrs"
v-on="on"
></v-text-field>
</template>
<v-date-picker
v-model="from_dateNomRaw"
no-title
:first-day-of-week="1"
:max="todayMix"
reactive
show-current
type="month"
ref="picker"
color="primary"
locale="ru"
@input="menu_from = false"
scrollable
>
</v-date-picker>
Answer the question
In order to leave comments, you need to log in
Didn't find what you were looking for?
Ask your questionAsk a Question
731 491 924 answers to any question