2022-09-06 12:03:37 +00:00
|
|
|
<template>
|
2024-02-11 08:10:29 +00:00
|
|
|
<div role="alert" aria-live="assertive" aria-atomic="true" :class="cx('root')" v-bind="ptmi('root')">
|
2023-04-18 09:31:46 +00:00
|
|
|
<slot name="icon">
|
2023-05-25 14:15:19 +00:00
|
|
|
<component :is="icon ? 'span' : iconComponent" :class="cx('icon')" v-bind="ptm('icon')"></component>
|
2023-04-07 18:49:14 +00:00
|
|
|
</slot>
|
2024-05-09 15:35:57 +00:00
|
|
|
<div v-if="$slots.default" :class="cx('text')" v-bind="ptm('text')">
|
|
|
|
<slot></slot>
|
|
|
|
</div>
|
2022-09-06 12:03:37 +00:00
|
|
|
</div>
|
|
|
|
</template>
|
|
|
|
|
|
|
|
<script>
|
2023-04-18 12:53:43 +00:00
|
|
|
import CheckIcon from 'primevue/icons/check';
|
|
|
|
import ExclamationTriangleIcon from 'primevue/icons/exclamationtriangle';
|
|
|
|
import InfoCircleIcon from 'primevue/icons/infocircle';
|
|
|
|
import TimesCircleIcon from 'primevue/icons/timescircle';
|
2023-11-27 10:58:45 +00:00
|
|
|
import BaseInlineMessage from './BaseInlineMessage.vue';
|
2023-04-14 08:03:50 +00:00
|
|
|
|
2022-09-06 12:03:37 +00:00
|
|
|
export default {
|
|
|
|
name: 'InlineMessage',
|
2023-05-25 14:15:19 +00:00
|
|
|
extends: BaseInlineMessage,
|
2024-02-11 08:10:29 +00:00
|
|
|
inheritAttrs: false,
|
2022-09-06 12:03:37 +00:00
|
|
|
timeout: null,
|
|
|
|
data() {
|
|
|
|
return {
|
|
|
|
visible: true
|
2022-09-14 11:26:01 +00:00
|
|
|
};
|
2022-09-06 12:03:37 +00:00
|
|
|
},
|
|
|
|
mounted() {
|
|
|
|
if (!this.sticky) {
|
|
|
|
setTimeout(() => {
|
|
|
|
this.visible = false;
|
|
|
|
}, this.life);
|
|
|
|
}
|
|
|
|
},
|
|
|
|
computed: {
|
2023-04-07 18:49:14 +00:00
|
|
|
iconComponent() {
|
|
|
|
return {
|
|
|
|
info: InfoCircleIcon,
|
|
|
|
success: CheckIcon,
|
|
|
|
warn: ExclamationTriangleIcon,
|
|
|
|
error: TimesCircleIcon
|
|
|
|
}[this.severity];
|
2022-09-06 12:03:37 +00:00
|
|
|
}
|
|
|
|
}
|
2022-09-14 11:26:01 +00:00
|
|
|
};
|
2022-09-06 12:03:37 +00:00
|
|
|
</script>
|