Notice.js 4.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124
  1. "use strict";
  2. var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
  3. Object.defineProperty(exports, "__esModule", {
  4. value: true
  5. });
  6. exports.default = void 0;
  7. var _vue = require("vue");
  8. var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
  9. var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
  10. var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
  11. var _classNames2 = _interopRequireDefault(require("../_util/classNames"));
  12. var _default2 = (0, _vue.defineComponent)({
  13. name: 'Notice',
  14. inheritAttrs: false,
  15. props: ['prefixCls', 'duration', 'updateMark', 'noticeKey', 'closeIcon', 'closable', 'props', 'onClick', 'onClose', 'holder', 'visible'],
  16. setup: function setup(props, _ref) {
  17. var attrs = _ref.attrs,
  18. slots = _ref.slots;
  19. var closeTimer;
  20. var isUnMounted = false;
  21. var duration = (0, _vue.computed)(function () {
  22. return props.duration === undefined ? 4.5 : props.duration;
  23. });
  24. var startCloseTimer = function startCloseTimer() {
  25. if (duration.value && !isUnMounted) {
  26. closeTimer = setTimeout(function () {
  27. close();
  28. }, duration.value * 1000);
  29. }
  30. };
  31. var clearCloseTimer = function clearCloseTimer() {
  32. if (closeTimer) {
  33. clearTimeout(closeTimer);
  34. closeTimer = null;
  35. }
  36. };
  37. var close = function close(e) {
  38. if (e) {
  39. e.stopPropagation();
  40. }
  41. clearCloseTimer();
  42. var onClose = props.onClose,
  43. noticeKey = props.noticeKey;
  44. if (onClose) {
  45. onClose(noticeKey);
  46. }
  47. };
  48. var restartCloseTimer = function restartCloseTimer() {
  49. clearCloseTimer();
  50. startCloseTimer();
  51. };
  52. (0, _vue.onMounted)(function () {
  53. startCloseTimer();
  54. });
  55. (0, _vue.onUnmounted)(function () {
  56. isUnMounted = true;
  57. clearCloseTimer();
  58. });
  59. (0, _vue.watch)([duration, function () {
  60. return props.updateMark;
  61. }, function () {
  62. return props.visible;
  63. }], function (_ref2, _ref3) {
  64. var _ref4 = (0, _slicedToArray2.default)(_ref2, 3),
  65. preDuration = _ref4[0],
  66. preUpdateMark = _ref4[1],
  67. preVisible = _ref4[2];
  68. var _ref5 = (0, _slicedToArray2.default)(_ref3, 3),
  69. newDuration = _ref5[0],
  70. newUpdateMark = _ref5[1],
  71. newVisible = _ref5[2];
  72. if (preDuration !== newDuration || preUpdateMark !== newUpdateMark || preVisible !== newVisible && newVisible) {
  73. restartCloseTimer();
  74. }
  75. }, {
  76. flush: 'post'
  77. });
  78. return function () {
  79. var _slots$closeIcon, _slots$default;
  80. var prefixCls = props.prefixCls,
  81. closable = props.closable,
  82. _props$closeIcon = props.closeIcon,
  83. closeIcon = _props$closeIcon === void 0 ? (_slots$closeIcon = slots.closeIcon) === null || _slots$closeIcon === void 0 ? void 0 : _slots$closeIcon.call(slots) : _props$closeIcon,
  84. onClick = props.onClick,
  85. holder = props.holder;
  86. var className = attrs.class,
  87. style = attrs.style;
  88. var componentClass = "".concat(prefixCls, "-notice");
  89. var dataOrAriaAttributeProps = Object.keys(attrs).reduce(function (acc, key) {
  90. if (key.substr(0, 5) === 'data-' || key.substr(0, 5) === 'aria-' || key === 'role') {
  91. acc[key] = attrs[key];
  92. }
  93. return acc;
  94. }, {});
  95. var node = (0, _vue.createVNode)("div", (0, _objectSpread2.default)({
  96. "class": (0, _classNames2.default)(componentClass, className, (0, _defineProperty2.default)({}, "".concat(componentClass, "-closable"), closable)),
  97. "style": style,
  98. "onMouseenter": clearCloseTimer,
  99. "onMouseleave": startCloseTimer,
  100. "onClick": onClick
  101. }, dataOrAriaAttributeProps), [(0, _vue.createVNode)("div", {
  102. "class": "".concat(componentClass, "-content")
  103. }, [(_slots$default = slots.default) === null || _slots$default === void 0 ? void 0 : _slots$default.call(slots)]), closable ? (0, _vue.createVNode)("a", {
  104. "tabindex": 0,
  105. "onClick": close,
  106. "class": "".concat(componentClass, "-close")
  107. }, [closeIcon || (0, _vue.createVNode)("span", {
  108. "class": "".concat(componentClass, "-close-x")
  109. }, null)]) : null]);
  110. if (holder) {
  111. return (0, _vue.createVNode)(_vue.Teleport, {
  112. "to": holder
  113. }, {
  114. default: function _default() {
  115. return node;
  116. }
  117. });
  118. }
  119. return node;
  120. };
  121. }
  122. });
  123. exports.default = _default2;