Update #3965 - Updates on Dialog components
parent
28d1c876e9
commit
5c47976d98
|
@ -6,9 +6,7 @@ const classes = {
|
||||||
icon: ({ instance }) => ['p-confirm-dialog-icon', instance.confirmation ? instance.confirmation.icon : null],
|
icon: ({ instance }) => ['p-confirm-dialog-icon', instance.confirmation ? instance.confirmation.icon : null],
|
||||||
message: 'p-confirm-dialog-message',
|
message: 'p-confirm-dialog-message',
|
||||||
rejectButton: ({ instance }) => ['p-confirm-dialog-reject', instance.confirmation ? instance.confirmation.rejectClass || 'p-button-text' : null],
|
rejectButton: ({ instance }) => ['p-confirm-dialog-reject', instance.confirmation ? instance.confirmation.rejectClass || 'p-button-text' : null],
|
||||||
rejectButtonIcon: ({ context }) => [context && context.icon, context && context.iconClass],
|
acceptButton: ({ instance }) => ['p-confirm-dialog-accept', instance.confirmation ? instance.confirmation.acceptClass : null]
|
||||||
acceptButton: ({ instance }) => ['p-confirm-dialog-accept', instance.confirmation ? instance.confirmation.acceptClass : null],
|
|
||||||
acceptButtonIcon: ({ context }) => [context && context.icon, context && context.iconClass]
|
|
||||||
};
|
};
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
|
|
|
@ -26,14 +26,14 @@
|
||||||
<CDButton :label="rejectLabel" :class="cx('rejectButton')" iconPos="left" @click="reject()" :autofocus="autoFocusReject" :pt="ptm('rejectButton')">
|
<CDButton :label="rejectLabel" :class="cx('rejectButton')" iconPos="left" @click="reject()" :autofocus="autoFocusReject" :pt="ptm('rejectButton')">
|
||||||
<template #icon="iconProps">
|
<template #icon="iconProps">
|
||||||
<slot name="rejecticon">
|
<slot name="rejecticon">
|
||||||
<span :class="cx('rejectButtonIcon', getCXOptions(rejectIcon, iconProps))" v-bind="ptm('rejectButton')['icon']" />
|
<span :class="[rejectIcon, iconProps.class]" v-bind="ptm('rejectButton')['icon']" />
|
||||||
</slot>
|
</slot>
|
||||||
</template>
|
</template>
|
||||||
</CDButton>
|
</CDButton>
|
||||||
<CDButton :label="acceptLabel" :class="cx('acceptButton')" iconPos="left" @click="accept()" :autofocus="autoFocusAccept" :pt="ptm('acceptButton')">
|
<CDButton :label="acceptLabel" :class="cx('acceptButton')" iconPos="left" @click="accept()" :autofocus="autoFocusAccept" :pt="ptm('acceptButton')">
|
||||||
<template #icon="iconProps">
|
<template #icon="iconProps">
|
||||||
<slot name="accepticon">
|
<slot name="accepticon">
|
||||||
<span :class="cx('acceptButtonIcon', getCXOptions(acceptIcon, iconProps))" v-bind="ptm('acceptButton')['icon']" />
|
<span :class="[acceptIcon, iconProps.class]" v-bind="ptm('acceptButton')['icon']" />
|
||||||
</slot>
|
</slot>
|
||||||
</template>
|
</template>
|
||||||
</CDButton>
|
</CDButton>
|
||||||
|
|
|
@ -87,9 +87,7 @@ const classes = {
|
||||||
message: 'p-confirm-popup-message',
|
message: 'p-confirm-popup-message',
|
||||||
footer: 'p-confirm-popup-footer',
|
footer: 'p-confirm-popup-footer',
|
||||||
rejectButton: ({ instance }) => ['p-confirm-dialog-reject', instance.confirmation ? instance.confirmation.rejectClass || 'p-button-text' : null],
|
rejectButton: ({ instance }) => ['p-confirm-dialog-reject', instance.confirmation ? instance.confirmation.rejectClass || 'p-button-text' : null],
|
||||||
rejectButtonIcon: ({ context }) => [context && context.icon, context && context.iconClass],
|
acceptButton: ({ instance }) => ['p-confirm-dialog-accept', instance.confirmation ? instance.confirmation.acceptClass : null]
|
||||||
acceptButton: ({ instance }) => ['p-confirm-dialog-accept', instance.confirmation ? instance.confirmation.acceptClass : null],
|
|
||||||
acceptButtonIcon: ({ context }) => [context && context.icon, context && context.iconClass]
|
|
||||||
};
|
};
|
||||||
|
|
||||||
const { load: loadStyle } = useStyle(styles, { id: 'primevue_confirmPopup_style', manual: true });
|
const { load: loadStyle } = useStyle(styles, { id: 'primevue_confirmPopup_style', manual: true });
|
||||||
|
|
|
@ -16,14 +16,14 @@
|
||||||
<CPButton :label="rejectLabel" @click="reject()" @keydown="onRejectKeydown" :autofocus="autoFocusReject" :class="cx('rejectButton')" :pt="ptm('rejectButton')">
|
<CPButton :label="rejectLabel" @click="reject()" @keydown="onRejectKeydown" :autofocus="autoFocusReject" :class="cx('rejectButton')" :pt="ptm('rejectButton')">
|
||||||
<template #icon="iconProps">
|
<template #icon="iconProps">
|
||||||
<slot name="rejecticon">
|
<slot name="rejecticon">
|
||||||
<span :class="cx('rejectButtonIcon', getCXOptions(rejectIcon, iconProps))" v-bind="ptm('rejectButton')['icon']" />
|
<span :class="[rejectIcon, iconProps.class]" v-bind="ptm('rejectButton')['icon']" />
|
||||||
</slot>
|
</slot>
|
||||||
</template>
|
</template>
|
||||||
</CPButton>
|
</CPButton>
|
||||||
<CPButton :label="acceptLabel" @click="accept()" @keydown="onAcceptKeydown" :autofocus="autoFocusAccept" :class="cx('acceptButton')" :pt="ptm('acceptButton')">
|
<CPButton :label="acceptLabel" @click="accept()" @keydown="onAcceptKeydown" :autofocus="autoFocusAccept" :class="cx('acceptButton')" :pt="ptm('acceptButton')">
|
||||||
<template #icon="iconProps">
|
<template #icon="iconProps">
|
||||||
<slot name="accepticon">
|
<slot name="accepticon">
|
||||||
<span :class="cx('acceptButtonIcon', getCXOptions(acceptIcon, iconProps))" v-bind="ptm('acceptButton')['icon']" />
|
<span :class="[acceptIcon, iconProps.class]" v-bind="ptm('acceptButton')['icon']" />
|
||||||
</slot>
|
</slot>
|
||||||
</template>
|
</template>
|
||||||
</CPButton>
|
</CPButton>
|
||||||
|
|
|
@ -199,7 +199,7 @@ const classes = {
|
||||||
maximizableIcon: ({ props, instance }) => `p-dialog-header-maximize-icon ${instance.maximized ? props.minimizeIcon : props.maximizeIcon}`,
|
maximizableIcon: ({ props, instance }) => `p-dialog-header-maximize-icon ${instance.maximized ? props.minimizeIcon : props.maximizeIcon}`,
|
||||||
closeButton: 'p-dialog-header-icon p-dialog-header-close p-link',
|
closeButton: 'p-dialog-header-icon p-dialog-header-close p-link',
|
||||||
closeButtonIcon: ({ props }) => ['p-dialog-header-close-icon', props.closeIcon],
|
closeButtonIcon: ({ props }) => ['p-dialog-header-close-icon', props.closeIcon],
|
||||||
content: ({ props }) => ['p-dialog-content', props.contentClass],
|
content: 'p-dialog-content',
|
||||||
footer: 'p-dialog-footer'
|
footer: 'p-dialog-footer'
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
|
@ -30,7 +30,7 @@
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div :ref="contentRef" :class="cx('content')" :style="contentStyle" v-bind="{ ...contentProps, ...ptm('content') }">
|
<div :ref="contentRef" :class="[cx('content'), contentClass]" :style="contentStyle" v-bind="{ ...contentProps, ...ptm('content') }">
|
||||||
<slot></slot>
|
<slot></slot>
|
||||||
</div>
|
</div>
|
||||||
<div v-if="footer || $slots.footer" :ref="footerContainerRef" :class="cx('footer')" v-bind="ptm('footer')">
|
<div v-if="footer || $slots.footer" :ref="footerContainerRef" :class="cx('footer')" v-bind="ptm('footer')">
|
||||||
|
|
Loading…
Reference in New Issue