2
0
mirror of https://github.com/tenrok/vue2-datepicker.git synced 2026-06-22 08:00:36 +03:00

feat: add prop default-value for calendar default date (#94)

This commit is contained in:
mxie
2019-02-12 13:34:35 +08:00
parent 3bcedf5d88
commit 4ff6945f0c
4 changed files with 29 additions and 6 deletions
+1
View File
@@ -95,6 +95,7 @@ export default {
| placeholder | input placeholder text | `string` | — | | placeholder | input placeholder text | `string` | — |
| width | input size | `string`\|`number` | 210 | | width | input size | `string`\|`number` | 210 |
| append-to-body | append the popup to body | `boolean` | false | | append-to-body | append the popup to body | `boolean` | false |
| default-value | default date of the calendar | `Date` | new Date() |
| popupStyle | popup style(override the top, left style) | `object` | — | | popupStyle | popup style(override the top, left style) | `object` | — |
| not-before | Disable all dates before new Date(not-before) | `string`\|`Date` | ''| | not-before | Disable all dates before new Date(not-before) | `string`\|`Date` | ''|
| not-after | Disable all dates after new Date(not-after) | `string`\|`Date`| '' | | not-after | Disable all dates after new Date(not-after) | `string`\|`Date`| '' |
+1
View File
@@ -95,6 +95,7 @@ export default {
| placeholder | 输入框placeholder | `string` | — | | placeholder | 输入框placeholder | `string` | — |
| width | 设置宽度 | `string`\|`number` | 210 | | width | 设置宽度 | `string`\|`number` | 210 |
| append-to-body | 弹出层元素插入body下面 | `boolean` | false | | append-to-body | 弹出层元素插入body下面 | `boolean` | false |
| default-value | 日历的默认值 | `Date` | new Date() |
| popupStyle | 弹出层的样式(可以覆盖left,top样式) | `object` | — | | popupStyle | 弹出层的样式(可以覆盖left,top样式) | `object` | — |
| not-before | 禁止选择这个时间之前的时间 | `string`\|`Date` | ''| | not-before | 禁止选择这个时间之前的时间 | `string`\|`Date` | ''|
| not-after | 禁止选择这个时间之前=后的时间 | `string`\|`Date`| '' | | not-after | 禁止选择这个时间之前=后的时间 | `string`\|`Date`| '' |
+15 -6
View File
@@ -107,6 +107,11 @@ export default {
default: 'YYYY-MM-DD' default: 'YYYY-MM-DD'
}, },
// below user set // below user set
defaultValue: {
validator: function (val) {
return isValidDate(val)
}
},
firstDayOfWeek: { firstDayOfWeek: {
default: 7, default: 7,
type: Number, type: Number,
@@ -143,7 +148,7 @@ export default {
} }
}, },
data () { data () {
const now = new Date() const now = this.getNow(this.value)
const calendarYear = now.getFullYear() const calendarYear = now.getFullYear()
const calendarMonth = now.getMonth() const calendarMonth = now.getMonth()
const firstYear = Math.floor(calendarYear / 10) * 10 const firstYear = Math.floor(calendarYear / 10) * 10
@@ -235,13 +240,17 @@ export default {
this.updateNow(this.value) this.updateNow(this.value)
} }
}, },
getNow (value) {
return value ? new Date(value) : (
(this.defaultValue && isValidDate(this.defaultValue)) ? new Date(this.defaultValue) : new Date()
)
},
// 根据value更新日历 // 根据value更新日历
updateNow (value) { updateNow (value) {
const now = value ? new Date(value) : new Date() const oldNow = this.now
const oldNow = new Date(this.now) this.now = this.getNow(value)
this.now = now if (this.visible && this.now !== oldNow) {
if (this.visible) { this.dispatch('DatePicker', 'calendar-change', [new Date(this.now), new Date(oldNow)])
this.dispatch('DatePicker', 'calendar-change', [now, oldNow])
} }
}, },
getCriticalTime (value) { getCriticalTime (value) {
+12
View File
@@ -380,6 +380,18 @@ describe('datepicker', () => {
}) })
describe('calendar-panel', () => { describe('calendar-panel', () => {
it('prop: defaultValue', () => {
wrapper = mount(CalendarPanel, {
propsData: {
value: null,
defaultValue: '2018-10-01'
}
})
const vm = wrapper.vm
expect(vm.calendarYear).toBe(2018)
expect(vm.calendarMonth).toBe(9)
})
it('click: prev/next month', () => { it('click: prev/next month', () => {
wrapper = mount(CalendarPanel) wrapper = mount(CalendarPanel)