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/timePicker/TimePicker.jsx';
/**
 * TimePicker.jsx
 *
 * @Author: apple
 * @Date: 2018/3/1 01:02
 */

import React from 'react';
import PropTypes from 'prop-types';
import Tooltip from '../tooltip';
import Icon from '../icon';
import Input from '../input';
import TimeOptions from './TimeOptions';
import dateValid from '../util/dateValid';

/**
 * TimeOptions
 * */
var regExpRule = '^(?:[01]?\\d|2[0-3])(?::[0-5]?\\d){2}$';
/**
 * TimePicker
 * */

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

    function TimePicker(props, context) {
        _classCallCheck(this, TimePicker);

        var _this = _possibleConstructorReturn(this, (TimePicker.__proto__ || Object.getPrototypeOf(TimePicker)).call(this, props, context));

        _this.onActive = function (bool, type) {
            if (type) {
                _this.setState(_defineProperty({}, type, bool));
            } else {
                _this.setState({
                    onActive: bool
                });
            }
        };

        _this.handleInput = function (element) {
            var onChange = _this.props.onChange;

            var value = element.target.value;
            _this.setState({
                value: value
            });
            if (dateValid(value, regExpRule)) {
                var timeArray = value.split(':');
                timeArray = timeArray.map(function (item) {
                    var time = item;
                    if (item.length === 1) {
                        time = '0' + item;
                    }
                    return time;
                });
                onChange && onChange(timeArray.join(':'));
            }
        };

        _this.handleDialog = function (bool) {
            _this.setState({
                onOpen: bool
            });
        };

        _this.onChange = function (value) {
            var onChange = _this.props.onChange;

            _this.setState({
                value: value
            });
            onChange && onChange(value);
        };

        var defaultValue = _this.props.defaultValue;


        _this.state = {
            datePanel: true,
            value: defaultValue,
            onOpen: false
        };
        return _this;
    }

    _createClass(TimePicker, [{
        key: 'render',
        value: function render() {
            var _this2 = this;

            var _props = this.props,
                clearInfo = _props.clearInfo,
                disabled = _props.disabled,
                inputClass = _props.inputClass,
                inputPrefix = _props.inputPrefix,
                inputSize = _props.inputSize,
                prefixCls = _props.prefixCls,
                readOnly = _props.readOnly,
                disabledHours = _props.disabledHours,
                disabledMinutes = _props.disabledMinutes,
                disabledSeconds = _props.disabledSeconds;
            var _state = this.state,
                onActive = _state.onActive,
                value = _state.value,
                onOpen = _state.onOpen;

            var clearBtn = function clearBtn(dateItemType) {
                if (clearInfo) {
                    var bool = onActive;
                    return bool && React.createElement(Icon, {
                        onClick: function onClick(e) {
                            return _this2.clearDateInfo(e, dateItemType);
                        },
                        style: { position: 'absolute', right: 0, color: '#ddd' },
                        type: 'cancel-o',
                        __source: {
                            fileName: _jsxFileName,
                            lineNumber: 137
                        },
                        __self: _this2
                    });
                }
            };
            return React.createElement(
                Tooltip,
                {
                    trigger: 'click',
                    position: 'bottomLeft',
                    onOpen: function onOpen() {
                        return _this2.handleDialog(true);
                    },
                    onClose: function onClose() {
                        return _this2.handleDialog(false);
                    },
                    content: React.createElement(
                        'div',
                        {
                            className: prefixCls + '-input',
                            onMouseEnter: function onMouseEnter() {
                                return _this2.onActive(true);
                            },
                            onMouseLeave: function onMouseLeave() {
                                return _this2.onActive(false);
                            }, __source: {
                                fileName: _jsxFileName,
                                lineNumber: 153
                            },
                            __self: this
                        },
                        React.createElement(Input, {
                            defaultValue: value,
                            disabled: disabled,
                            readOnly: readOnly,
                            style: { flex: 1 },
                            className: inputClass,
                            prefix: inputPrefix,
                            size: inputSize,
                            onChange: this.handleInput,
                            __source: {
                                fileName: _jsxFileName,
                                lineNumber: 157
                            },
                            __self: this
                        }),
                        clearBtn()
                    ), __source: {
                        fileName: _jsxFileName,
                        lineNumber: 147
                    },
                    __self: this
                },
                React.createElement(TimeOptions, {
                    defaultValue: value,
                    onOpen: onOpen,
                    onChange: this.onChange,
                    disabledHours: disabledHours,
                    disabledMinutes: disabledMinutes,
                    disabledSeconds: disabledSeconds,
                    __source: {
                        fileName: _jsxFileName,
                        lineNumber: 170
                    },
                    __self: this
                })
            );
        }
    }]);

    return TimePicker;
}(React.PureComponent);

TimePicker.propTypes = {
    /**
     * 更新时间回调函数
     * @params time: 所选时间
     * @return
     * */
    onChange: PropTypes.func,
    /**
     * 类名前缀
     * */
    prefixCls: PropTypes.string,
    /**
     * 是否只读
     * */
    readOnly: PropTypes.bool,
    /**
     * 禁用小时
     * @return true为禁用 false为不禁用
     * */
    disabledHours: PropTypes.func,
    /**
     * 禁用分钟
     * @params selectHour:当前所选小时
     * @return true为禁用 false为不禁用
     * */
    disabledMinutes: PropTypes.func,
    /**
     * 禁用秒
     * @params selectHour:当前所选小时, selectMinute:当前所选分钟
     * @return true为禁用 false为不禁用
     * */
    disabledSeconds: PropTypes.func
};
TimePicker.defaultProps = {
    prefixCls: 'ne-timePicker',
    readOnly: false
};


export default TimePicker;