index.js 2.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899
  1. import baseComponent from '../helpers/baseComponent'
  2. import classNames from '../helpers/classNames'
  3. const defaults = {
  4. prefixCls: 'wux-notification',
  5. classNames: 'wux-animate--slideInDown',
  6. image: '',
  7. title: '',
  8. text: '',
  9. duration: 3000,
  10. data: '',
  11. onClick() {},
  12. onClose() {},
  13. }
  14. let _notification = null
  15. baseComponent({
  16. useFunc: true,
  17. data: defaults,
  18. computed: {
  19. classes() {
  20. const { prefixCls } = this.data
  21. const wrap = classNames(prefixCls)
  22. const content = `${prefixCls}__content`
  23. const hd = `${prefixCls}__hd`
  24. const image = `${prefixCls}__image`
  25. const bd = `${prefixCls}__bd`
  26. const title = `${prefixCls}__title`
  27. const text = `${prefixCls}__text`
  28. const ft = `${prefixCls}__ft`
  29. return {
  30. wrap,
  31. content,
  32. hd,
  33. image,
  34. bd,
  35. title,
  36. text,
  37. ft,
  38. }
  39. },
  40. },
  41. methods: {
  42. /**
  43. * 隐藏
  44. */
  45. hide() {
  46. this.$$setData({ in: false })
  47. if (typeof this.fns.onClose === 'function') {
  48. this.fns.onClose(this.data.data)
  49. }
  50. },
  51. /**
  52. * 显示
  53. */
  54. show(opts = {}) {
  55. const closePromise = new Promise((resolve) => {
  56. const options = this.$$mergeOptionsAndBindMethods(Object.assign({}, defaults, opts))
  57. const callback = () => {
  58. this.hide()
  59. return resolve(true)
  60. }
  61. this.$$setData({ in: true, ...options })
  62. if (_notification) {
  63. clearTimeout(_notification.timeout)
  64. _notification = null
  65. }
  66. _notification = {
  67. hide: this.hide,
  68. }
  69. _notification.timeout = setTimeout(callback, options.duration)
  70. })
  71. const result = () => {
  72. if (_notification) {
  73. _notification.hide.call(this)
  74. }
  75. }
  76. result.then = (resolve, reject) => closePromise.then(resolve, reject)
  77. result.promise = closePromise
  78. return result
  79. },
  80. /**
  81. * 点击事件
  82. */
  83. onClick() {
  84. if (typeof this.fns.onClick === 'function') {
  85. this.fns.onClick(this.data.data)
  86. }
  87. },
  88. },
  89. })