Notice.js 4.4 KB

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