mirror of
https://github.com/tenrok/vue2-datepicker.git
synced 2026-06-24 04:30:36 +03:00
add month year type
This commit is contained in:
+1
-1
@@ -43,7 +43,7 @@ new Vue({ // eslint-disable-line
|
|||||||
},
|
},
|
||||||
render (h) {
|
render (h) {
|
||||||
const example1 = {
|
const example1 = {
|
||||||
'base': '<date-picker v-model="value1" lang="en" :not-before="new Date()"></date-picker>',
|
'base': '<date-picker v-model="value1" lang="en" :not-before="new Date()" type="month"></date-picker>',
|
||||||
'range': '<date-picker v-model="value2" range ></date-picker>'
|
'range': '<date-picker v-model="value2" range ></date-picker>'
|
||||||
}
|
}
|
||||||
const example2 = {
|
const example2 = {
|
||||||
|
|||||||
Generated
+2838
-2838
File diff suppressed because it is too large
Load Diff
+20
-3
@@ -92,7 +92,7 @@ export default {
|
|||||||
// below user set
|
// below user set
|
||||||
type: {
|
type: {
|
||||||
type: String,
|
type: String,
|
||||||
default: 'date' // ['date', 'datetime']
|
default: 'date' // ['date', 'datetime'] zendy added 'month', 'year'
|
||||||
},
|
},
|
||||||
firstDayOfWeek: {
|
firstDayOfWeek: {
|
||||||
default: 7,
|
default: 7,
|
||||||
@@ -135,7 +135,7 @@ export default {
|
|||||||
const calendarMonth = now.getMonth()
|
const calendarMonth = now.getMonth()
|
||||||
const firstYear = Math.floor(calendarYear / 10) * 10
|
const firstYear = Math.floor(calendarYear / 10) * 10
|
||||||
return {
|
return {
|
||||||
panel: 'DATE',
|
panel: 'MONTH',
|
||||||
dates: [],
|
dates: [],
|
||||||
calendarMonth,
|
calendarMonth,
|
||||||
calendarYear,
|
calendarYear,
|
||||||
@@ -176,6 +176,7 @@ export default {
|
|||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
handelPanelChange (panel) {
|
handelPanelChange (panel) {
|
||||||
|
console.log('panel changed')
|
||||||
if (panel === 'YEAR') {
|
if (panel === 'YEAR') {
|
||||||
this.firstYear = Math.floor(this.calendarYear / 10) * 10
|
this.firstYear = Math.floor(this.calendarYear / 10) * 10
|
||||||
} else if (panel === 'TIME') {
|
} else if (panel === 'TIME') {
|
||||||
@@ -187,7 +188,14 @@ export default {
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
init () {
|
init () {
|
||||||
this.panel = 'DATE'
|
if (this.type.toLowerCase() == 'month') {
|
||||||
|
this.panel = 'MONTH'
|
||||||
|
} else if (this.type.toLowerCase() == 'year') {
|
||||||
|
this.panel = 'YEAR'
|
||||||
|
} else {
|
||||||
|
this.panel = 'DATE'
|
||||||
|
}
|
||||||
|
|
||||||
this.updateNow(this.value)
|
this.updateNow(this.value)
|
||||||
},
|
},
|
||||||
// 根据value更新日历
|
// 根据value更新日历
|
||||||
@@ -248,10 +256,18 @@ export default {
|
|||||||
},
|
},
|
||||||
selectYear (year) {
|
selectYear (year) {
|
||||||
this.changeCalendarYear(year)
|
this.changeCalendarYear(year)
|
||||||
|
if (this.type.toLowerCase() === 'year') {
|
||||||
|
return this.selectDate(this.now)
|
||||||
|
}
|
||||||
this.showPanelMonth()
|
this.showPanelMonth()
|
||||||
},
|
},
|
||||||
selectMonth (month) {
|
selectMonth (month) {
|
||||||
this.changeCalendarMonth(month)
|
this.changeCalendarMonth(month)
|
||||||
|
|
||||||
|
if (this.type.toLowerCase() === 'month') {
|
||||||
|
return this.selectDate(this.now)
|
||||||
|
}
|
||||||
|
|
||||||
this.showPanelDate()
|
this.showPanelDate()
|
||||||
},
|
},
|
||||||
selectTime (time) {
|
selectTime (time) {
|
||||||
@@ -291,6 +307,7 @@ export default {
|
|||||||
this.firstYear = this.firstYear + flag * 10
|
this.firstYear = this.firstYear + flag * 10
|
||||||
},
|
},
|
||||||
showPanelDate () {
|
showPanelDate () {
|
||||||
|
console.log('date')
|
||||||
this.panel = 'DATE'
|
this.panel = 'DATE'
|
||||||
},
|
},
|
||||||
showPanelYear () {
|
showPanelYear () {
|
||||||
|
|||||||
Reference in New Issue
Block a user