dareway-rui/build/taglib/DatePicker/RcCalendar/calendar/CalendarHeader.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 _propTypes = _interopRequireDefault(require('prop-types'));

var _mapSelf = _interopRequireDefault(require('rc-util/lib/Children/mapSelf'));

var _MonthPanel = _interopRequireDefault(require('../month/MonthPanel'));

var _YearPanel = _interopRequireDefault(require('../year/YearPanel'));

var _DecadePanel = _interopRequireDefault(require('../decade/DecadePanel'));

function goMonth(direction) {
    var next = this.props.value.clone();
    next.add(direction, 'months');
    this.props.onValueChange(next);
}

function goYear(direction) {
    var next = this.props.value.clone();
    next.add(direction, 'years');
    this.props.onValueChange(next);
}

function showIf(condition, el) {
    return condition ? el : null;
}

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

        function CalendarHeader(_props) {
            var _this;

            (0, _classCallCheck2.default)(this, CalendarHeader);
            _this = (0, _possibleConstructorReturn2.default)(
                this,
                (0, _getPrototypeOf2.default)(CalendarHeader).call(this, _props)
            );
            (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), 'onMonthSelect', function(
                value
            ) {
                _this.props.onPanelChange(value, 'date');

                if (_this.props.onMonthSelect) {
                    _this.props.onMonthSelect(value);
                } else {
                    _this.props.onValueChange(value);
                }
            });
            (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), 'onYearSelect', function(value) {
                var referer = _this.state.yearPanelReferer;

                _this.setState({
                    yearPanelReferer: null
                });

                _this.props.onPanelChange(value, referer);

                _this.props.onValueChange(value);
            });
            (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), 'onDecadeSelect', function(
                value
            ) {
                _this.props.onPanelChange(value, 'year');

                _this.props.onValueChange(value);
            });
            (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), 'monthYearElement', function(
                showTimePicker
            ) {
                var props = _this.props;
                var prefixCls = props.prefixCls;
                var locale = props.locale;
                var value = props.value;
                var localeData = value.localeData();
                var monthBeforeYear = locale.monthBeforeYear;
                var selectClassName = ''.concat(prefixCls, '-').concat(monthBeforeYear ? 'my-select' : 'ym-select');
                var timeClassName = showTimePicker ? ' '.concat(prefixCls, '-time-status') : '';

                var year = _react.default.createElement(
                    'a',
                    {
                        className: ''.concat(prefixCls, '-year-select').concat(timeClassName),
                        role: 'button',
                        onClick: showTimePicker
                            ? null
                            : function() {
                                  return _this.showYearPanel('date');
                              },
                        title: showTimePicker ? null : locale.yearSelect
                    },
                    value.format(locale.yearFormat)
                );

                var month = _react.default.createElement(
                    'a',
                    {
                        className: ''.concat(prefixCls, '-month-select').concat(timeClassName),
                        role: 'button',
                        onClick: showTimePicker ? null : _this.showMonthPanel,
                        title: showTimePicker ? null : locale.monthSelect
                    },
                    locale.monthFormat ? value.format(locale.monthFormat) : localeData.monthsShort(value)
                );

                var day;

                if (showTimePicker) {
                    day = _react.default.createElement(
                        'a',
                        {
                            className: ''.concat(prefixCls, '-day-select').concat(timeClassName),
                            role: 'button'
                        },
                        value.format(locale.dayFormat)
                    );
                }

                var my = [];

                if (monthBeforeYear) {
                    my = [month, day, year];
                } else {
                    my = [year, month, day];
                }

                return _react.default.createElement(
                    'span',
                    {
                        className: selectClassName
                    },
                    (0, _mapSelf.default)(my)
                );
            });
            (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), 'showMonthPanel', function() {
                // null means that users' interaction doesn't change value
                _this.props.onPanelChange(null, 'month');
            });
            (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), 'showYearPanel', function(
                referer
            ) {
                _this.setState({
                    yearPanelReferer: referer
                });

                _this.props.onPanelChange(null, 'year');
            });
            (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), 'showDecadePanel', function() {
                _this.props.onPanelChange(null, 'decade');
            });
            _this.nextMonth = goMonth.bind((0, _assertThisInitialized2.default)(_this), 1);
            _this.previousMonth = goMonth.bind((0, _assertThisInitialized2.default)(_this), -1);
            _this.nextYear = goYear.bind((0, _assertThisInitialized2.default)(_this), 1);
            _this.previousYear = goYear.bind((0, _assertThisInitialized2.default)(_this), -1);
            _this.state = {
                yearPanelReferer: null
            };
            return _this;
        }

        (0, _createClass2.default)(CalendarHeader, [
            {
                key: 'render',
                value: function render() {
                    var _this2 = this;

                    var props = this.props;
                    var prefixCls = props.prefixCls,
                        locale = props.locale,
                        mode = props.mode,
                        value = props.value,
                        showTimePicker = props.showTimePicker,
                        enableNext = props.enableNext,
                        enablePrev = props.enablePrev,
                        disabledMonth = props.disabledMonth,
                        renderFooter = props.renderFooter;
                    var panel = null;

                    if (mode === 'month') {
                        panel = _react.default.createElement(_MonthPanel.default, {
                            locale: locale,
                            defaultValue: value,
                            rootPrefixCls: prefixCls,
                            onSelect: this.onMonthSelect,
                            onYearPanelShow: function onYearPanelShow() {
                                return _this2.showYearPanel('month');
                            },
                            disabledDate: disabledMonth,
                            cellRender: props.monthCellRender,
                            contentRender: props.monthCellContentRender,
                            renderFooter: renderFooter
                        });
                    }

                    if (mode === 'year') {
                        panel = _react.default.createElement(_YearPanel.default, {
                            locale: locale,
                            defaultValue: value,
                            rootPrefixCls: prefixCls,
                            onSelect: this.onYearSelect,
                            onDecadePanelShow: this.showDecadePanel,
                            renderFooter: renderFooter
                        });
                    }

                    if (mode === 'decade') {
                        panel = _react.default.createElement(_DecadePanel.default, {
                            locale: locale,
                            defaultValue: value,
                            rootPrefixCls: prefixCls,
                            onSelect: this.onDecadeSelect,
                            renderFooter: renderFooter
                        });
                    }

                    return _react.default.createElement(
                        'div',
                        {
                            className: ''.concat(prefixCls, '-header')
                        },
                        _react.default.createElement(
                            'div',
                            {
                                style: {
                                    position: 'relative'
                                }
                            },
                            showIf(
                                enablePrev && !showTimePicker,
                                _react.default.createElement('a', {
                                    className: ''.concat(prefixCls, '-prev-year-btn'),
                                    role: 'button',
                                    onClick: this.previousYear,
                                    title: locale.previousYear
                                })
                            ),
                            showIf(
                                enablePrev && !showTimePicker,
                                _react.default.createElement('a', {
                                    className: ''.concat(prefixCls, '-prev-month-btn'),
                                    role: 'button',
                                    onClick: this.previousMonth,
                                    title: locale.previousMonth
                                })
                            ),
                            this.monthYearElement(showTimePicker),
                            showIf(
                                enableNext && !showTimePicker,
                                _react.default.createElement('a', {
                                    className: ''.concat(prefixCls, '-next-month-btn'),
                                    onClick: this.nextMonth,
                                    title: locale.nextMonth
                                })
                            ),
                            showIf(
                                enableNext && !showTimePicker,
                                _react.default.createElement('a', {
                                    className: ''.concat(prefixCls, '-next-year-btn'),
                                    onClick: this.nextYear,
                                    title: locale.nextYear
                                })
                            )
                        ),
                        panel
                    );
                }
            }
        ]);
        return CalendarHeader;
    })(_react.default.Component);

exports.default = CalendarHeader;
(0, _defineProperty2.default)(CalendarHeader, 'propTypes', {
    prefixCls: _propTypes.default.string,
    value: _propTypes.default.object,
    onValueChange: _propTypes.default.func,
    showTimePicker: _propTypes.default.bool,
    onPanelChange: _propTypes.default.func,
    locale: _propTypes.default.object,
    enablePrev: _propTypes.default.any,
    enableNext: _propTypes.default.any,
    disabledMonth: _propTypes.default.func,
    renderFooter: _propTypes.default.func,
    onMonthSelect: _propTypes.default.func
});
(0, _defineProperty2.default)(CalendarHeader, 'defaultProps', {
    enableNext: 1,
    enablePrev: 1,
    onPanelChange: function onPanelChange() {},
    onValueChange: function onValueChange() {}
});

//@ sourceMappingURL=CalendarHeader.js.map