notify.js 1.2 KB

123456789101112131415161718192021222324252627282930313233343536373839
  1. export function notify(vue, opts) {
  2. let {
  3. caption = null,
  4. captionColor = 'black',
  5. color = 'positive',
  6. icon = '',
  7. iconColor = 'white',
  8. message = '',
  9. messageColor = 'black',
  10. } = opts;
  11. caption = (caption ? `<div style="font-size: 120%; color: ${captionColor}"><b>${caption}</b></div><br>` : '');
  12. return vue.$q.notify({
  13. position: 'top-right',
  14. color,
  15. textColor: iconColor,
  16. icon,
  17. actions: [{icon: 'la la-times notify-button-icon', color: 'black'}],
  18. html: true,
  19. message:
  20. `<div style="max-width: 350px;">
  21. ${caption}
  22. <div style="color: ${messageColor}; overflow-wrap: break-word; word-wrap: break-word;">${message}</div>
  23. </div>`
  24. });
  25. }
  26. export function success(vue, message, caption) {
  27. notify(vue, {color: 'positive', icon: 'la la-check-circle', message, caption});
  28. }
  29. export function error(vue, message, caption) {
  30. notify(vue, {color: 'negative', icon: 'la la-exclamation-circle', messageColor: 'yellow', message, caption});
  31. }
  32. export function info(vue, message, caption) {
  33. notify(vue, {color: 'info', icon: 'la la-bell', message, caption});
  34. }