117 lines
3.5 KiB
JavaScript
117 lines
3.5 KiB
JavaScript
import _defineProperty from 'babel-runtime/helpers/defineProperty';
|
|
import _classCallCheck from 'babel-runtime/helpers/classCallCheck';
|
|
import _createClass from 'babel-runtime/helpers/createClass';
|
|
import _possibleConstructorReturn from 'babel-runtime/helpers/possibleConstructorReturn';
|
|
import _inherits from 'babel-runtime/helpers/inherits';
|
|
import React, { Component } from 'react';
|
|
import classNames from 'classnames';
|
|
import PropTypes from 'prop-types';
|
|
|
|
var Notice = function (_Component) {
|
|
_inherits(Notice, _Component);
|
|
|
|
function Notice() {
|
|
var _ref;
|
|
|
|
var _temp, _this, _ret;
|
|
|
|
_classCallCheck(this, Notice);
|
|
|
|
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
|
|
args[_key] = arguments[_key];
|
|
}
|
|
|
|
return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_ref = Notice.__proto__ || Object.getPrototypeOf(Notice)).call.apply(_ref, [this].concat(args))), _this), _this.close = function (e) {
|
|
if (e) {
|
|
e.stopPropagation();
|
|
}
|
|
_this.clearCloseTimer();
|
|
_this.props.onClose();
|
|
}, _this.startCloseTimer = function () {
|
|
if (_this.props.duration) {
|
|
_this.closeTimer = setTimeout(function () {
|
|
_this.close();
|
|
}, _this.props.duration * 1000);
|
|
}
|
|
}, _this.clearCloseTimer = function () {
|
|
if (_this.closeTimer) {
|
|
clearTimeout(_this.closeTimer);
|
|
_this.closeTimer = null;
|
|
}
|
|
}, _temp), _possibleConstructorReturn(_this, _ret);
|
|
}
|
|
|
|
_createClass(Notice, [{
|
|
key: 'componentDidMount',
|
|
value: function componentDidMount() {
|
|
this.startCloseTimer();
|
|
}
|
|
}, {
|
|
key: 'componentDidUpdate',
|
|
value: function componentDidUpdate(prevProps) {
|
|
if (this.props.duration !== prevProps.duration || this.props.update) {
|
|
this.restartCloseTimer();
|
|
}
|
|
}
|
|
}, {
|
|
key: 'componentWillUnmount',
|
|
value: function componentWillUnmount() {
|
|
this.clearCloseTimer();
|
|
}
|
|
}, {
|
|
key: 'restartCloseTimer',
|
|
value: function restartCloseTimer() {
|
|
this.clearCloseTimer();
|
|
this.startCloseTimer();
|
|
}
|
|
}, {
|
|
key: 'render',
|
|
value: function render() {
|
|
var _className;
|
|
|
|
var props = this.props;
|
|
var componentClass = props.prefixCls + '-notice';
|
|
var className = (_className = {}, _defineProperty(_className, '' + componentClass, 1), _defineProperty(_className, componentClass + '-closable', props.closable), _defineProperty(_className, props.className, !!props.className), _className);
|
|
return React.createElement(
|
|
'div',
|
|
{
|
|
className: classNames(className),
|
|
style: props.style,
|
|
onMouseEnter: this.clearCloseTimer,
|
|
onMouseLeave: this.startCloseTimer,
|
|
onClick: props.onClick
|
|
},
|
|
React.createElement(
|
|
'div',
|
|
{ className: componentClass + '-content' },
|
|
props.children
|
|
),
|
|
props.closable ? React.createElement(
|
|
'a',
|
|
{ tabIndex: '0', onClick: this.close, className: componentClass + '-close' },
|
|
props.closeIcon || React.createElement('span', { className: componentClass + '-close-x' })
|
|
) : null
|
|
);
|
|
}
|
|
}]);
|
|
|
|
return Notice;
|
|
}(Component);
|
|
|
|
Notice.propTypes = {
|
|
duration: PropTypes.number,
|
|
onClose: PropTypes.func,
|
|
children: PropTypes.any,
|
|
update: PropTypes.bool,
|
|
closeIcon: PropTypes.node
|
|
};
|
|
Notice.defaultProps = {
|
|
onEnd: function onEnd() {},
|
|
onClose: function onClose() {},
|
|
|
|
duration: 1.5,
|
|
style: {
|
|
right: '50%'
|
|
}
|
|
};
|
|
export default Notice; |