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';
var _jsxFileName = 'src/notice/NoticeItem.jsx';
/**
 * NoticeItem.jsx
 *
 * @Author: jruif
 * @Date: 2018/1/17 上午9:48
 */

import React, { Fragment } from 'react';
import PropTypes from 'prop-types';
import classNames from 'classnames';
import Icon from '../icon';
import Button from '../button';
import { iconTypeObj } from '../modal';

/**
 * NoticeItem
 * */

var NoticeItem = function (_React$PureComponent) {
    _inherits(NoticeItem, _React$PureComponent);

    function NoticeItem() {
        var _ref;

        var _temp, _this, _ret;

        _classCallCheck(this, NoticeItem);

        for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
            args[_key] = arguments[_key];
        }

        return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_ref = NoticeItem.__proto__ || Object.getPrototypeOf(NoticeItem)).call.apply(_ref, [this].concat(args))), _this), _this.startTimeout = function () {
            var duration = _this.props.duration;

            if (duration > 0) {
                _this.timer = setTimeout(function () {
                    _this.triggerClose(true);
                }, duration);
            }
        }, _this.clearTimeouts = function () {
            clearTimeout(_this.timer);
        }, _this.triggerClose = function (didOvertime) {
            var onClose = _this.props.onClose;

            onClose && onClose(didOvertime);
            _this.clearTimeouts();
        }, _this.handleMouseEnter = function (e) {
            _this.clearTimeouts();
        }, _this.handleMouseLeave = function (e) {
            _this.startTimeout();
        }, _temp), _possibleConstructorReturn(_this, _ret);
    }

    _createClass(NoticeItem, [{
        key: 'componentDidMount',
        value: function componentDidMount() {
            this.startTimeout();
        }

        //componentDidUpdate(prevProps) {
        //    if (prevProps.duration <= 0 && this.props.duration > 0) {
        //        this.startTimeout();
        //    } else if (prevProps.duration > 0 && this.props.duration <= 0) {
        //        this.clearTimeouts();
        //    }
        //}

    }, {
        key: 'componentWillUnmount',
        value: function componentWillUnmount() {
            this.clearTimeouts();
        }

        /**
         * @param didOvertime {boolean} 是否超时
         * */

    }, {
        key: 'render',
        value: function render() {
            var _classNames,
                _this2 = this;

            var _props = this.props,
                prefixCls = _props.prefixCls,
                className = _props.className,
                content = _props.content,
                iconType = _props.iconType,
                type = _props.type,
                btnTxt = _props.btnTxt,
                btnOnClick = _props.btnOnClick,
                actionBtn = _props.actionBtn,
                mini = _props.mini,
                style = _props.style,
                showClose = _props.showClose;

            var classes = classNames(prefixCls, (_classNames = {}, _defineProperty(_classNames, prefixCls + '-' + type, type), _defineProperty(_classNames, prefixCls + '-mini', mini), _classNames), className);
            var icon = void 0;
            if (type && type !== 'none') {
                icon = iconType || iconTypeObj[type];
            }
            return React.createElement(
                'div',
                {
                    className: classes,
                    onMouseEnter: this.handleMouseEnter,
                    onMouseLeave: this.handleMouseLeave,
                    style: style, __source: {
                        fileName: _jsxFileName,
                        lineNumber: 149
                    },
                    __self: this
                },
                React.createElement(
                    'div',
                    { className: prefixCls + '-content', __source: {
                            fileName: _jsxFileName,
                            lineNumber: 154
                        },
                        __self: this
                    },
                    icon && React.createElement(Icon, { type: icon, className: prefixCls + '-icon', __source: {
                            fileName: _jsxFileName,
                            lineNumber: 155
                        },
                        __self: this
                    }),
                    React.createElement(
                        'div',
                        { className: prefixCls + '-body', __source: {
                                fileName: _jsxFileName,
                                lineNumber: 156
                            },
                            __self: this
                        },
                        React.isValidElement(content) ? content : React.createElement(
                            'p',
                            {
                                __source: {
                                    fileName: _jsxFileName,
                                    lineNumber: 157
                                },
                                __self: this
                            },
                            content
                        )
                    ),
                    React.createElement(
                        'div',
                        { className: prefixCls + '-action', __source: {
                                fileName: _jsxFileName,
                                lineNumber: 159
                            },
                            __self: this
                        },
                        actionBtn ? React.cloneElement(actionBtn, {
                            className: classNames(prefixCls + '-btn', actionBtn.classNames),
                            size: 'small',
                            shape: 'none'
                        }) : btnTxt ? React.createElement(
                            Button,
                            {
                                className: classNames(prefixCls + '-btn'),
                                size: 'small',
                                shape: 'none',
                                onClick: btnOnClick, __source: {
                                    fileName: _jsxFileName,
                                    lineNumber: 167
                                },
                                __self: this
                            },
                            btnTxt
                        ) : null,
                        showClose ? React.createElement(
                            Fragment,
                            {
                                __source: {
                                    fileName: _jsxFileName,
                                    lineNumber: 176
                                },
                                __self: this
                            },
                            React.createElement(
                                'span',
                                { className: prefixCls + '-separate', __source: {
                                        fileName: _jsxFileName,
                                        lineNumber: 177
                                    },
                                    __self: this
                                },
                                '|'
                            ),
                            React.createElement(Button, {
                                className: classNames(prefixCls + '-cancel'),
                                icon: 'cancel-1',
                                size: 'small',
                                shape: 'none',
                                onClick: function onClick() {
                                    return _this2.triggerClose(true);
                                },
                                __source: {
                                    fileName: _jsxFileName,
                                    lineNumber: 178
                                },
                                __self: this
                            })
                        ) : null
                    )
                )
            );
        }
    }]);

    return NoticeItem;
}(React.PureComponent);

NoticeItem.displayName = 'NeatUI.NoticeItem';
NoticeItem.propTypes = {
    /**
     * 默认 5 秒后自动关闭，配置为 0 时则不自动关闭
     * */
    duration: PropTypes.number,
    /**
     * 需要显示的内容，接受的类型是PropTypes.node，即下列类型均可渲染: numbers, strings, elements 或一个 array
     * */
    content: PropTypes.node.isRequired,
    /**
     * 自定义行为按钮，必须为react元素
     * */
    actionBtn: PropTypes.element,
    /**
     * 自定义按钮内容
     * */
    btnTxt: PropTypes.node,
    /**
     * 自定义按钮点击事件
     * */
    btnOnClick: PropTypes.func,
    /**
     * 关闭时回调
     * */
    onClose: PropTypes.func,
    /**
     * 类型
     * */
    type: PropTypes.oneOf(['info', 'error', 'warning', 'success', 'none']),
    /**
     * 简约风格
     * */
    mini: PropTypes.bool,
    /**
     * 是否显示close按钮
     * */
    showClose: PropTypes.bool,
    /**
     * icon类型, 同Icon
     * */
    iconType: PropTypes.string,
    /**
     * key 唯一标志，自动生成不需要手动设置
     * */
    itemID: PropTypes.string.isRequired
};
NoticeItem.defaultProps = {
    duration: 5000,
    prefixCls: 'ne-noticeItem',
    type: 'none',
    mini: false,
    showClose: true
};


export default NoticeItem;