Fixed #524 - Can't close MultiSelect or Select when inside Dialog component

pull/548/head
Cagatay Civici 2020-10-10 15:22:24 +03:00
parent 1d370005da
commit ea3c291cac
2 changed files with 6 additions and 5 deletions

View File

@ -1,7 +1,7 @@
<template> <template>
<div :ref="maskRef" :class="maskClass" v-if="containerVisible" @click="onMaskClick"> <div :ref="maskRef" :class="maskClass" v-if="containerVisible" @click="onMaskClick">
<transition name="p-dialog" @before-enter="onBeforeEnter" @enter="onEnter" @before-leave="onBeforeLeave" @leave="onLeave" @after-leave="onAfterLeave" appear> <transition name="p-dialog" @before-enter="onBeforeEnter" @enter="onEnter" @before-leave="onBeforeLeave" @leave="onLeave" @after-leave="onAfterLeave" appear>
<div :ref="containerRef" :class="dialogClass" v-if="visible" v-bind="$attrs" role="dialog" :aria-labelledby="ariaLabelledById" :aria-modal="modal" @click.stop> <div :ref="containerRef" :class="dialogClass" v-if="visible" v-bind="$attrs" role="dialog" :aria-labelledby="ariaLabelledById" :aria-modal="modal">
<div class="p-dialog-header" v-if="showHeader"> <div class="p-dialog-header" v-if="showHeader">
<slot name="header"> <slot name="header">
<span :id="ariaLabelledById" class="p-dialog-title" v-if="header">{{header}}</span> <span :id="ariaLabelledById" class="p-dialog-title" v-if="header">{{header}}</span>
@ -115,8 +115,8 @@ export default {
this.containerVisible = false; this.containerVisible = false;
this.unbindDocumentState(); this.unbindDocumentState();
}, },
onMaskClick() { onMaskClick(event) {
if (this.modal && this.closable && this.dismissableMask) { if (this.dismissableMask && this.closable && this.modal && this.mask === event.target) {
this.close(); this.close();
} }
}, },

View File

@ -165,8 +165,9 @@ export default {
onHeaderCheckboxBlur() { onHeaderCheckboxBlur() {
this.headerCheckboxFocused = false; this.headerCheckboxFocused = false;
}, },
onClick() { onClick(event) {
if (!this.disabled && (!this.overlay || !this.overlay.contains(event.target))) { if (!this.disabled && (!this.overlay || !this.overlay.contains(event.target)) && !DomHandler.hasClass(event.target, 'p-multiselect-close')) {
DomHandler.hasClass(event.target, 'p-multiselect-close');
if (this.overlayVisible) if (this.overlayVisible)
this.hide(); this.hide();
else else