dareway-rui/build/taglib/DatePicker/RcCalendar/date/DateInput.js

'use strict';

var _interopRequireDefault = require('@babel/runtime/helpers/interopRequireDefault');

Object.defineProperty(exports, '__esModule', {
    value: true
});
exports.default = void 0;

var _classCallCheck2 = _interopRequireDefault(require('@babel/runtime/helpers/classCallCheck'));

var _createClass2 = _interopRequireDefault(require('@babel/runtime/helpers/createClass'));

var _possibleConstructorReturn2 = _interopRequireDefault(require('@babel/runtime/helpers/possibleConstructorReturn'));

var _getPrototypeOf2 = _interopRequireDefault(require('@babel/runtime/helpers/getPrototypeOf'));

var _assertThisInitialized2 = _interopRequireDefault(require('@babel/runtime/helpers/assertThisInitialized'));

var _inherits2 = _interopRequireDefault(require('@babel/runtime/helpers/inherits'));

var _defineProperty2 = _interopRequireDefault(require('@babel/runtime/helpers/defineProperty'));

var _react = _interopRequireDefault(require('react'));

var _reactDom = _interopRequireDefault(require('react-dom'));

var _propTypes = _interopRequireDefault(require('prop-types'));

var _KeyCode = _interopRequireDefault(require('rc-util/lib/KeyCode'));

var _reactLifecyclesCompat = require('react-lifecycles-compat');

var _moment = _interopRequireDefault(require('moment'));

var _util = require('../util');

var cachedSelectionStart;
var cachedSelectionEnd;
var dateInputInstance;

var DateInput =
    /*#__PURE__*/
    (function(_React$Component) {
        (0, _inherits2.default)(DateInput, _React$Component);

        function DateInput(props) {
            var _this;

            (0, _classCallCheck2.default)(this, DateInput);
            _this = (0, _possibleConstructorReturn2.default)(
                this,
                (0, _getPrototypeOf2.default)(DateInput).call(this, props)
            );
            (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), 'onClear', function() {
                _this.setState({
                    str: ''
                });

                _this.props.onClear(null);
            });
            (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), 'onInputChange', function(
                event
            ) {
                var str = event.target.value;
                var _this$props = _this.props,
                    disabledDate = _this$props.disabledDate,
                    format = _this$props.format,
                    onChange = _this$props.onChange,
                    selectedValue = _this$props.selectedValue; // 没有内容，合法并直接退出

                if (!str) {
                    onChange(null);

                    _this.setState({
                        invalid: false,
                        str: str
                    });

                    return;
                } // 不合法直接退出

                var parsed = (0, _moment.default)(str, format, true);

                if (!parsed.isValid()) {
                    _this.setState({
                        invalid: true,
                        str: str
                    });

                    return;
                }

                var value = _this.props.value.clone();

                value
                    .year(parsed.year())
                    .month(parsed.month())
                    .date(parsed.date())
                    .hour(parsed.hour())
                    .minute(parsed.minute())
                    .second(parsed.second());

                if (!value || (disabledDate && disabledDate(value))) {
                    _this.setState({
                        invalid: true,
                        str: str
                    });

                    return;
                }

                if (selectedValue !== value || (selectedValue && value && !selectedValue.isSame(value))) {
                    _this.setState({
                        invalid: false,
                        str: str
                    });

                    onChange(value);
                }
            });
            (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), 'onFocus', function() {
                _this.setState({
                    hasFocus: true
                });
            });
            (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), 'onBlur', function() {
                _this.setState(function(prevState, prevProps) {
                    return {
                        hasFocus: false,
                        str: (0, _util.formatDate)(prevProps.value, prevProps.format)
                    };
                });
            });
            (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), 'onKeyDown', function(_ref) {
                var keyCode = _ref.keyCode;
                var _this$props2 = _this.props,
                    onSelect = _this$props2.onSelect,
                    value = _this$props2.value,
                    disabledDate = _this$props2.disabledDate;

                if (keyCode === _KeyCode.default.ENTER && onSelect) {
                    var validateDate = !disabledDate || !disabledDate(value);

                    if (validateDate) {
                        onSelect(value.clone());
                    }
                }
            });
            (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), 'getRootDOMNode', function() {
                return _reactDom.default.findDOMNode((0, _assertThisInitialized2.default)(_this));
            });
            (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), 'focus', function() {
                if (dateInputInstance) {
                    // dateInputInstance.focus();
                }
            });
            (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), 'saveDateInput', function(
                dateInput
            ) {
                dateInputInstance = dateInput;
            });
            var _selectedValue = props.selectedValue;
            _this.state = {
                str: (0, _util.formatDate)(_selectedValue, _this.props.format),
                invalid: false,
                hasFocus: false
            };
            return _this;
        }

        (0, _createClass2.default)(
            DateInput,
            [
                {
                    key: 'componentDidUpdate',
                    value: function componentDidUpdate() {
                        if (
                            dateInputInstance &&
                            this.state.hasFocus &&
                            !this.state.invalid &&
                            !(cachedSelectionStart === 0 && cachedSelectionEnd === 0)
                        ) {
                            dateInputInstance.setSelectionRange(cachedSelectionStart, cachedSelectionEnd);
                        }
                    }
                },
                {
                    key: 'render',
                    value: function render() {
                        var props = this.props;
                        var _this$state = this.state,
                            invalid = _this$state.invalid,
                            str = _this$state.str;
                        var locale = props.locale,
                            prefixCls = props.prefixCls,
                            placeholder = props.placeholder,
                            clearIcon = props.clearIcon;
                        var invalidClass = invalid ? ''.concat(prefixCls, '-input-invalid') : '';
                        return _react.default.createElement(
                            'div',
                            {
                                className: ''.concat(prefixCls, '-input-wrap')
                            },
                            _react.default.createElement(
                                'div',
                                {
                                    className: ''.concat(prefixCls, '-date-input-wrap')
                                },
                                _react.default.createElement('input', {
                                    ref: this.saveDateInput,
                                    className: ''.concat(prefixCls, '-input ').concat(invalidClass),
                                    value: str,
                                    disabled: props.disabled,
                                    placeholder: placeholder,
                                    onChange: this.onInputChange,
                                    onKeyDown: this.onKeyDown,
                                    onFocus: this.onFocus,
                                    onBlur: this.onBlur
                                })
                            ),
                            props.showClear
                                ? _react.default.createElement(
                                      'a',
                                      {
                                          role: 'button',
                                          title: locale.clear,
                                          onClick: this.onClear
                                      },
                                      clearIcon ||
                                          _react.default.createElement('span', {
                                              className: ''.concat(prefixCls, '-clear-btn')
                                          })
                                  )
                                : null
                        );
                    }
                }
            ],
            [
                {
                    key: 'getDerivedStateFromProps',
                    value: function getDerivedStateFromProps(nextProps, state) {
                        var newState = {};

                        if (dateInputInstance) {
                            cachedSelectionStart = dateInputInstance.selectionStart;
                            cachedSelectionEnd = dateInputInstance.selectionEnd;
                        } // when popup show, click body will call this, bug!

                        var selectedValue = nextProps.selectedValue;

                        if (!state.hasFocus) {
                            newState = {
                                str: (0, _util.formatDate)(selectedValue, nextProps.format),
                                invalid: false
                            };
                        }

                        return newState;
                    }
                },
                {
                    key: 'getInstance',
                    value: function getInstance() {
                        return dateInputInstance;
                    }
                }
            ]
        );
        return DateInput;
    })(_react.default.Component);

(0, _defineProperty2.default)(DateInput, 'propTypes', {
    prefixCls: _propTypes.default.string,
    timePicker: _propTypes.default.object,
    value: _propTypes.default.object,
    disabledTime: _propTypes.default.any,
    format: _propTypes.default.oneOfType([
        _propTypes.default.string,
        _propTypes.default.arrayOf(_propTypes.default.string)
    ]),
    locale: _propTypes.default.object,
    disabledDate: _propTypes.default.func,
    onChange: _propTypes.default.func,
    onClear: _propTypes.default.func,
    placeholder: _propTypes.default.string,
    onSelect: _propTypes.default.func,
    selectedValue: _propTypes.default.object,
    clearIcon: _propTypes.default.node
});
(0, _reactLifecyclesCompat.polyfill)(DateInput);
var _default = DateInput;
exports.default = _default;

//@ sourceMappingURL=DateInput.js.map