Fixed #729 - BUG: Calendar navigation (next, prev month) inside DataTable or OverlayPanel not working
parent
e55f0701de
commit
a6bbdfbd53
|
@ -70,6 +70,7 @@ export default {
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
documentEditListener: null,
|
documentEditListener: null,
|
||||||
|
selfClick: false,
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
d_editing: this.editing
|
d_editing: this.editing
|
||||||
|
@ -112,9 +113,10 @@ export default {
|
||||||
bindDocumentEditListener() {
|
bindDocumentEditListener() {
|
||||||
if (!this.documentEditListener) {
|
if (!this.documentEditListener) {
|
||||||
this.documentEditListener = (event) => {
|
this.documentEditListener = (event) => {
|
||||||
if (this.isOutsideClicked(event)) {
|
if (this.isOutsideClicked()) {
|
||||||
this.completeEdit(event, 'outside');
|
this.completeEdit(event, 'outside');
|
||||||
}
|
}
|
||||||
|
this.selfClick = false;
|
||||||
};
|
};
|
||||||
|
|
||||||
document.addEventListener('click', this.documentEditListener);
|
document.addEventListener('click', this.documentEditListener);
|
||||||
|
@ -124,20 +126,25 @@ export default {
|
||||||
if (this.documentEditListener) {
|
if (this.documentEditListener) {
|
||||||
document.removeEventListener('click', this.documentEditListener);
|
document.removeEventListener('click', this.documentEditListener);
|
||||||
this.documentEditListener = null;
|
this.documentEditListener = null;
|
||||||
|
this.selfClick = false;
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
switchCellToViewMode() {
|
switchCellToViewMode() {
|
||||||
this.d_editing = false;
|
this.d_editing = false;
|
||||||
this.unbindDocumentEditListener();
|
this.unbindDocumentEditListener();
|
||||||
},
|
},
|
||||||
isOutsideClicked(event) {
|
isOutsideClicked() {
|
||||||
return !this.$el.contains(event.target) && !this.$el.isSameNode(event.target);
|
return !this.selfClick;
|
||||||
},
|
},
|
||||||
onClick(event) {
|
onClick(event) {
|
||||||
if (this.editMode === 'cell' && this.isEditable() && !this.d_editing) {
|
if (this.editMode === 'cell' && this.isEditable()) {
|
||||||
this.d_editing = true;
|
this.selfClick = true;
|
||||||
this.bindDocumentEditListener();
|
|
||||||
this.$emit('cell-edit-init', {originalEvent: event, data: this.rowData, field: this.column.props?.field, index: this.index});
|
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) {
|
completeEdit(event, type) {
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
<template>
|
<template>
|
||||||
<transition name="p-overlaypanel" @enter="onEnter" @leave="onLeave">
|
<transition name="p-overlaypanel" @enter="onEnter" @leave="onLeave">
|
||||||
<div class="p-overlaypanel p-component" v-if="visible" :ref="containerRef">
|
<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>
|
<slot></slot>
|
||||||
</div>
|
</div>
|
||||||
<button class="p-overlaypanel-close p-link" @click="hide" v-if="showCloseIcon" :aria-label="ariaCloseLabel" type="button" v-ripple>
|
<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
|
visible: false
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
selfClick: false,
|
||||||
target: null,
|
target: null,
|
||||||
outsideClickListener: null,
|
outsideClickListener: null,
|
||||||
scrollHandler: null,
|
scrollHandler: null,
|
||||||
|
@ -81,6 +82,9 @@ export default {
|
||||||
hide() {
|
hide() {
|
||||||
this.visible = false;
|
this.visible = false;
|
||||||
},
|
},
|
||||||
|
onContentClick() {
|
||||||
|
this.selfClick = true;
|
||||||
|
},
|
||||||
onEnter() {
|
onEnter() {
|
||||||
this.appendContainer();
|
this.appendContainer();
|
||||||
this.alignOverlay();
|
this.alignOverlay();
|
||||||
|
@ -119,9 +123,10 @@ export default {
|
||||||
bindOutsideClickListener() {
|
bindOutsideClickListener() {
|
||||||
if (!this.outsideClickListener) {
|
if (!this.outsideClickListener) {
|
||||||
this.outsideClickListener = (event) => {
|
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.visible = false;
|
||||||
}
|
}
|
||||||
|
this.selfClick = false;
|
||||||
};
|
};
|
||||||
document.addEventListener('click', this.outsideClickListener);
|
document.addEventListener('click', this.outsideClickListener);
|
||||||
}
|
}
|
||||||
|
@ -130,6 +135,7 @@ export default {
|
||||||
if (this.outsideClickListener) {
|
if (this.outsideClickListener) {
|
||||||
document.removeEventListener('click', this.outsideClickListener);
|
document.removeEventListener('click', this.outsideClickListener);
|
||||||
this.outsideClickListener = null;
|
this.outsideClickListener = null;
|
||||||
|
this.selfClick = false;
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
bindScrollListener() {
|
bindScrollListener() {
|
||||||
|
|
Loading…
Reference in New Issue