Fixed #729 - BUG: Calendar navigation (next, prev month) inside DataTable or OverlayPanel not working

pull/800/head
Cagatay Civici 2020-12-09 18:49:41 +03:00
parent e55f0701de
commit a6bbdfbd53
2 changed files with 22 additions and 9 deletions

View File

@ -70,6 +70,7 @@ export default {
}
},
documentEditListener: null,
selfClick: false,
data() {
return {
d_editing: this.editing
@ -112,9 +113,10 @@ export default {
bindDocumentEditListener() {
if (!this.documentEditListener) {
this.documentEditListener = (event) => {
if (this.isOutsideClicked(event)) {
if (this.isOutsideClicked()) {
this.completeEdit(event, 'outside');
}
this.selfClick = false;
};
document.addEventListener('click', this.documentEditListener);
@ -124,20 +126,25 @@ export default {
if (this.documentEditListener) {
document.removeEventListener('click', this.documentEditListener);
this.documentEditListener = null;
this.selfClick = false;
}
},
switchCellToViewMode() {
this.d_editing = false;
this.unbindDocumentEditListener();
},
isOutsideClicked(event) {
return !this.$el.contains(event.target) && !this.$el.isSameNode(event.target);
isOutsideClicked() {
return !this.selfClick;
},
onClick(event) {
if (this.editMode === 'cell' && this.isEditable() && !this.d_editing) {
this.d_editing = true;
this.bindDocumentEditListener();
this.$emit('cell-edit-init', {originalEvent: event, data: this.rowData, field: this.column.props?.field, index: this.index});
if (this.editMode === 'cell' && this.isEditable()) {
this.selfClick = true;
if (!this.d_editing) {
this.d_editing = true;
this.bindDocumentEditListener();
this.$emit('cell-edit-init', {originalEvent: event, data: this.rowData, field: this.column.props?.field, index: this.index});
}
}
},
completeEdit(event, type) {

View File

@ -1,7 +1,7 @@
<template>
<transition name="p-overlaypanel" @enter="onEnter" @leave="onLeave">
<div class="p-overlaypanel p-component" v-if="visible" :ref="containerRef">
<div class="p-overlaypanel-content">
<div class="p-overlaypanel-content" @click="onContentClick">
<slot></slot>
</div>
<button class="p-overlaypanel-close p-link" @click="hide" v-if="showCloseIcon" :aria-label="ariaCloseLabel" type="button" v-ripple>
@ -48,6 +48,7 @@ export default {
visible: false
}
},
selfClick: false,
target: null,
outsideClickListener: null,
scrollHandler: null,
@ -81,6 +82,9 @@ export default {
hide() {
this.visible = false;
},
onContentClick() {
this.selfClick = true;
},
onEnter() {
this.appendContainer();
this.alignOverlay();
@ -119,9 +123,10 @@ export default {
bindOutsideClickListener() {
if (!this.outsideClickListener) {
this.outsideClickListener = (event) => {
if (this.visible && this.container && !this.container.contains(event.target) && !this.isTargetClicked(event)) {
if (this.visible && !this.selfClick && !this.isTargetClicked(event)) {
this.visible = false;
}
this.selfClick = false;
};
document.addEventListener('click', this.outsideClickListener);
}
@ -130,6 +135,7 @@ export default {
if (this.outsideClickListener) {
document.removeEventListener('click', this.outsideClickListener);
this.outsideClickListener = null;
this.selfClick = false;
}
},
bindScrollListener() {