| 1 |
<div class="cx-vui-notices"> |
| 2 |
<transition-group name="cx-vui-notices" tag="div"> |
| 3 |
<div |
| 4 |
v-for="( item, itemID ) in stack" |
| 5 |
:class="[ |
| 6 |
'cx-vui-notice', |
| 7 |
'cx-vui-notice--' + item.type, |
| 8 |
]" |
| 9 |
:key="'item-' + itemID" |
| 10 |
> |
| 11 |
<div |
| 12 |
:class="[ |
| 13 |
'cx-vui-notice__icon', |
| 14 |
'cx-vui-notice__icon--' + item.type, |
| 15 |
]" |
| 16 |
v-html="getIcon( item.type )" |
| 17 |
></div> |
| 18 |
<div class="cx-vui-notice__content"> |
| 19 |
<div |
| 20 |
class="cx-vui-notice__title" |
| 21 |
v-if="item.title" |
| 22 |
v-html="item.title" |
| 23 |
></div> |
| 24 |
<div |
| 25 |
class="cx-vui-notice__message" |
| 26 |
v-if="item.message" |
| 27 |
v-html="item.message" |
| 28 |
></div> |
| 29 |
</div> |
| 30 |
<div |
| 31 |
class="cx-vui-notice__close" |
| 32 |
@click="destroyItem( itemID )" |
| 33 |
> |
| 34 |
<svg viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M16 1.61074L9.61074 8L16 14.3893L14.3893 16L8 9.61074L1.61074 16L0 14.3893L6.38926 8L0 1.61074L1.61074 0L8 6.38926L14.3893 0L16 1.61074Z"/></svg> |
| 35 |
</div> |
| 36 |
</div> |
| 37 |
</transition-group> |
| 38 |
</div> |
