vertumnus
/
primevue-mirror
mirror of https://github.com/primefaces/primevue.git
1
0
Fork 0
Code Packages Releases Activity

Merge pull request #6324 from avramz/fix/date-picker-show-other-months 

fix: DatePicker: fix showOtherMonths behavior so it doesn't show oth…
pull/6372/head
Tuğçe Küçükoğlu 2024-09-10 11:35:12 +03:00 committed by GitHub
parent 466b4106aa 87c1ba43c1
commit ba744ca571
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 29 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
packages/primevue/src/datepicker/DatePicker.spec.js
View File

@ -76,4 +76,26 @@ describe('DatePicker.vue', () => {
expect(wrapper.find('.p-datepicker-decade').exists()).toBe(true); expect(wrapper.find('.p-datepicker-decade').exists()).toBe(true);
expect(wrapper.find('.p-datepicker-decade').text()).toBe('1980 - 1989'); expect(wrapper.find('.p-datepicker-decade').text()).toBe('1980 - 1989');
}); });
it('should not show other months when showOtherMonths is false', async () => {
const dateOne = new Date();
dateOne.setFullYear(1988, 5, 15);
await wrapper.setProps({ modelValue: dateOne, showOtherMonths: false });
const input = wrapper.find('.p-datepicker-input');
await input.trigger('focus');
expect(wrapper.find('.p-datepicker-other-month span').exists()).toBe(false);
await input.trigger('blur');
await wrapper.setProps({ showOtherMonths: true });
await input.trigger('focus');
expect(wrapper.find('.p-datepicker-other-month span').exists()).toBe(true);
});
}); });

17
packages/primevue/src/datepicker/DatePicker.vue
View File

@ -78,7 +78,7 @@
<div :class="cx('header')" v-bind="ptm('header')"> <div :class="cx('header')" v-bind="ptm('header')">
<slot name="header"></slot> <slot name="header"></slot>
<Button <Button
v-show="showOtherMonths ? groupIndex === 0 : false" v-show="groupIndex === 0"
:ref="previousButtonRef" :ref="previousButtonRef"
:class="cx('pcPrevButton')" :class="cx('pcPrevButton')"
:disabled="disabled" :disabled="disabled"
@ -158,7 +158,7 @@
</span> </span>
</div> </div>
<Button <Button
v-show="showOtherMonths ? (numberOfMonths === 1 ? true : groupIndex === numberOfMonths - 1) : false" v-show="numberOfMonths === 1 ? true : groupIndex === numberOfMonths - 1"
:ref="nextButtonRef" :ref="nextButtonRef"
:class="cx('pcNextButton')" :class="cx('pcNextButton')"
:disabled="disabled" :disabled="disabled"
@ -223,6 +223,7 @@
data-pc-group-section="tablebodycell" data-pc-group-section="tablebodycell"
> >
<span <span
v-if="showOtherMonths || !date.otherMonth"
v-ripple v-ripple
:class="cx('day', { date })" :class="cx('day', { date })"
@click="onDateSelect($event, date)" @click="onDateSelect($event, date)"
@ -906,16 +907,12 @@ export default {
this.overlay = null; this.overlay = null;
}, },
onPrevButtonClick(event) { onPrevButtonClick(event) {
if (this.showOtherMonths) { this.navigationState = { backward: true, button: true };
this.navigationState = { backward: true, button: true }; this.navBackward(event);
this.navBackward(event);
}
}, },
onNextButtonClick(event) { onNextButtonClick(event) {
if (this.showOtherMonths) { this.navigationState = { backward: false, button: true };
this.navigationState = { backward: false, button: true }; this.navForward(event);
this.navForward(event);
}
}, },
navBackward(event) { navBackward(event) {
event.preventDefault(); event.preventDefault();