mirror of
https://github.com/primefaces/primevue.git
synced 2025-05-09 00:42:36 +00:00
Refactor #3965 - Refactor on Dialog
This commit is contained in:
parent
18662adebd
commit
3014b22550
2 changed files with 32 additions and 47 deletions
|
@ -1,8 +1,8 @@
|
|||
<template>
|
||||
<Portal :appendTo="appendTo">
|
||||
<div v-if="containerVisible" :ref="maskRef" :class="cx('mask')" @click="onMaskClick" v-bind="ptm('mask')">
|
||||
<div v-if="containerVisible" :ref="maskRef" :class="cx('mask')" :style="sx('mask', true, { position })" @click="onMaskClick" v-bind="ptm('mask')">
|
||||
<transition name="p-dialog" @before-enter="onBeforeEnter" @enter="onEnter" @before-leave="onBeforeLeave" @leave="onLeave" @after-leave="onAfterLeave" appear>
|
||||
<div v-if="visible" :ref="containerRef" v-focustrap="{ disabled: !modal }" :class="cx('root')" role="dialog" :aria-labelledby="ariaLabelledById" :aria-modal="modal" v-bind="{ ...$attrs, ...ptm('root') }">
|
||||
<div v-if="visible" :ref="containerRef" v-focustrap="{ disabled: !modal }" :class="cx('root')" :style="sx('root')" role="dialog" :aria-labelledby="ariaLabelledById" :aria-modal="modal" v-bind="{ ...$attrs, ...ptm('root') }">
|
||||
<div v-if="showHeader" :ref="headerContainerRef" :class="cx('header')" @mousedown="initDrag" v-bind="ptm('header')">
|
||||
<slot name="header">
|
||||
<span v-if="header" :id="ariaLabelledById" :class="cx('headerTitle')" v-bind="ptm('headerTitle')">{{ header }}</span>
|
||||
|
@ -10,7 +10,7 @@
|
|||
<div :class="cx('headerIcons')" v-bind="ptm('headerIcons')">
|
||||
<button v-if="maximizable" :ref="maximizableRef" v-ripple :autofocus="focusableMax" :class="cx('maximizableButton')" @click="maximize" type="button" :tabindex="maximizable ? '0' : '-1'" v-bind="ptm('maximizableButton')">
|
||||
<slot name="maximizeicon" :maximized="maximized">
|
||||
<component :is="maximizeIconComponent" :class="cx('maximizableIcon')" v-bind="ptm('maximizableIcon')" />
|
||||
<component :is="maximizeIconComponent" :class="[cx('maximizableIcon'), maximized ? minimizeIcon : maximizeIcon]" v-bind="ptm('maximizableIcon')" />
|
||||
</slot>
|
||||
</button>
|
||||
<button
|
||||
|
@ -25,7 +25,7 @@
|
|||
v-bind="{ ...closeButtonProps, ...ptm('closeButton') }"
|
||||
>
|
||||
<slot name="closeicon">
|
||||
<component :is="closeIcon ? 'span' : 'TimesIcon'" :class="cx('closeButtonIcon')" v-bind="ptm('closeButtonIcon')"></component>
|
||||
<component :is="closeIcon ? 'span' : 'TimesIcon'" :class="[cx('closeButtonIcon'), closeIcon]" v-bind="ptm('closeButtonIcon')"></component>
|
||||
</slot>
|
||||
</button>
|
||||
</div>
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue