"use strict";

exports.__esModule = true;
exports.default = void 0;

var _react = _interopRequireWildcard(require("react"));

var _dayjs = _interopRequireDefault(require("dayjs"));

var _classnames = _interopRequireDefault(require("classnames"));

var _meetReactComponentOne = require("@alifd/meet-react-component-one");

var _view = _interopRequireDefault(require("../view"));

var _icon = _interopRequireDefault(require("../icon"));

var _button = _interopRequireDefault(require("../button"));

var _datePicker = require("../date-picker");

var _types = require("./types");

var _utils = require("./utils");

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }

function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }

function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }

var formatTitle = function (date, mode) {
  if (!date) {
    return '';
  }

  var year = date.getFullYear();
  var month = date.getMonth() + 1;

  if (mode === 'month' || mode === 'week') {
    return (0, _utils.formatNumber)(year) + "." + (0, _utils.formatNumber)(month);
  }

  return (0, _utils.formatNumber)(year);
};

var CalendarHeader = function (props) {
  var _classNames;

  var _props$prefix = props.prefix,
      prefix = _props$prefix === void 0 ? 'mt-' : _props$prefix,
      date = props.date,
      mode = props.mode,
      type = props.type,
      maxDate = props.maxDate,
      minDate = props.minDate,
      _props$enableYearPick = props.enableYearPicker,
      enableYearPickerProp = _props$enableYearPick === void 0 ? false : _props$enableYearPick,
      enableTimePicker = props.enableTimePicker,
      disabledDate = props.disabledDate,
      renderHeadLeft = props.renderHeadLeft,
      renderHeadRight = props.renderHeadRight,
      locale = props.locale,
      _props$onDateChange = props.onDateChange,
      onDateChange = _props$onDateChange === void 0 ? function () {} : _props$onDateChange,
      _props$onModeChange = props.onModeChange,
      onModeChange = _props$onModeChange === void 0 ? function () {} : _props$onModeChange,
      _props$onPickerShow = props.onPickerShow,
      onPickerShow = _props$onPickerShow === void 0 ? function () {} : _props$onPickerShow;

  var _useState = (0, _react.useState)(false),
      showPicker = _useState[0],
      setShowPicker = _useState[1];

  var enableYearPicker = type === _types.HeaderType.select || enableYearPickerProp;
  var datePickerProps = {
    value: date,
    disabledDate: disabledDate,
    onChange: function onChange(v) {
      var d = (0, _dayjs.default)(v);
      var y = d.get('year');
      var m = d.get('month');
      var newDate = (0, _dayjs.default)().year(y).month(m).date(1);
      onDateChange(newDate.toDate(), false, 'picker');
    }
  };
  var clsPrefix = prefix + "calendar";
  var clses = {
    picker: (0, _classnames.default)((_classNames = {}, _classNames[clsPrefix + "-header-picker"] = !enableTimePicker, _classNames[clsPrefix + "-header-picker--with-time"] = enableTimePicker, _classNames))
  };

  var togglePicker = function togglePicker() {
    if (!enableYearPicker) {
      return;
    }

    var nextState = !showPicker;
    setShowPicker(nextState);

    if (onPickerShow) {
      onPickerShow(nextState);
    }
  };

  return type === _types.HeaderType.select ? function renderSelectedHeader() {
    var _classNames2;

    var headPrefix = prefix + "calendar-header";
    return /*#__PURE__*/(0, _react.createElement)(_react.Fragment, null, /*#__PURE__*/(0, _react.createElement)(_view.default, {
      className: (0, _classnames.default)("" + headPrefix, headPrefix + "-select")
    }, /*#__PURE__*/(0, _react.createElement)(_view.default, {
      className: headPrefix + "-select-title-container " + headPrefix + "-select-title-container-" + mode,
      onClick: togglePicker
    }, /*#__PURE__*/(0, _react.createElement)(_meetReactComponentOne.Text, {
      className: (0, _classnames.default)(headPrefix + "-select-title", (_classNames2 = {}, _classNames2[headPrefix + "-select-title--highlight"] = showPicker, _classNames2))
    }, (0, _dayjs.default)(date).format(mode === 'year' ? 'YYYY' : 'YYYY.MM')), /*#__PURE__*/(0, _react.createElement)(_icon.default, {
      name: "arrow-down",
      size: "xs",
      className: showPicker ? prefix + "calendar-header-arrow-up" : prefix + "calendar-header-arrow"
    })), /*#__PURE__*/(0, _react.createElement)(_view.default, {
      className: headPrefix + "-select-button-container"
    }, /*#__PURE__*/(0, _react.createElement)(_button.default.Group, {
      size: "small"
    }, /*#__PURE__*/(0, _react.createElement)(_button.default, {
      disabled: enableYearPicker && showPicker,
      type: mode === 'month' ? 'primary' : 'normal',
      onClick: function onClick() {
        if (onModeChange) {
          onModeChange('month');
        }
      }
    }, locale && locale.month || '月'), /*#__PURE__*/(0, _react.createElement)(_button.default, {
      disabled: enableYearPicker && showPicker,
      type: mode === 'year' ? 'primary' : 'normal',
      onClick: function onClick() {
        if (onModeChange) {
          onModeChange('year');
        }
      }
    }, locale && locale.year || '年')))), showPicker ? /*#__PURE__*/(0, _react.createElement)(_datePicker.EmbedMonthPicker, _extends({
      className: clses.picker,
      validRange: [minDate, maxDate]
    }, datePickerProps)) : null);
  }() : function renderNormalHeader() {
    var _classNames5, _classNames6, _classNames7, _classNames8;

    var headPrefix = prefix + "calendar-header";
    var leftYearIcon = null;
    var rightYearIcon = null;

    if (!enableYearPickerProp) {
      var _classNames3, _classNames4;

      leftYearIcon = /*#__PURE__*/(0, _react.createElement)(_icon.default, {
        className: (0, _classnames.default)(headPrefix + "-normal-icon double", (_classNames3 = {}, _classNames3[headPrefix + "-normal-icon-disabled"] = showPicker, _classNames3)),
        name: "arrow-double-left",
        onClick: function onClick() {
          if (showPicker) {
            return;
          }

          if (onDateChange) {
            if (mode !== 'week') {
              onDateChange((0, _utils.updateYear)(date, false, maxDate, minDate), false, 'year');
            } else {
              onDateChange((0, _utils.updateMonth)(date, false, maxDate, minDate), false, 'month');
            }
          }
        }
      });
      rightYearIcon = /*#__PURE__*/(0, _react.createElement)(_icon.default, {
        className: (0, _classnames.default)(headPrefix + "-normal-icon double", (_classNames4 = {}, _classNames4[headPrefix + "-normal-icon-disabled"] = showPicker, _classNames4)),
        name: "arrow-double-right",
        onClick: function onClick() {
          if (showPicker) {
            return;
          }

          if (onDateChange) {
            if (mode !== 'week') {
              onDateChange((0, _utils.updateYear)(date, true, maxDate, minDate), true, 'year');
            } else {
              onDateChange((0, _utils.updateMonth)(date, true, maxDate, minDate), true, 'month');
            }
          }
        }
      });
    }

    if (renderHeadLeft) {
      leftYearIcon = renderHeadLeft();
    }

    if (renderHeadRight) {
      rightYearIcon = renderHeadRight();
    }

    return /*#__PURE__*/(0, _react.createElement)(_react.Fragment, null, /*#__PURE__*/(0, _react.createElement)(_view.default, {
      className: (0, _classnames.default)("" + headPrefix, headPrefix + "-normal", (_classNames5 = {}, _classNames5[headPrefix + "-normal--highlighted"] = showPicker, _classNames5))
    }, /*#__PURE__*/(0, _react.createElement)(_view.default, {
      className: headPrefix + "-normal-left-container"
    }, leftYearIcon, /*#__PURE__*/(0, _react.createElement)(_icon.default, {
      className: (0, _classnames.default)(headPrefix + "-normal-icon", (_classNames6 = {}, _classNames6[headPrefix + "-normal-icon-disabled"] = showPicker, _classNames6[headPrefix + "-normal-icon--only"] = !leftYearIcon, _classNames6)),
      name: "arrow-left",
      onClick: function onClick() {
        if (showPicker) {
          return;
        }

        if (onDateChange) {
          if (mode !== 'week') {
            onDateChange((0, _utils.updateMonth)(date, false, maxDate, minDate), false, 'month');
          } else {
            onDateChange((0, _utils.updateWeek)(date, false, maxDate, minDate), false, 'week');
          }
        }
      }
    })), /*#__PURE__*/(0, _react.createElement)(_view.default, {
      className: headPrefix + "-normal-title-text-wrapper",
      onClick: togglePicker
    }, /*#__PURE__*/(0, _react.createElement)(_meetReactComponentOne.Text, {
      className: (0, _classnames.default)(headPrefix + "-normal-title-text", (_classNames7 = {}, _classNames7[headPrefix + "-normal-title-text--highlighted"] = showPicker, _classNames7)),
      onClick: function onClick() {}
    }, showPicker ? formatTitle(date, mode) : formatTitle(date, mode)), enableYearPicker ? /*#__PURE__*/(0, _react.createElement)(_icon.default, {
      name: "arrow-down",
      size: "xs",
      className: showPicker ? prefix + "calendar-header-arrow-up" : prefix + "calendar-header-arrow"
    }) : null), /*#__PURE__*/(0, _react.createElement)(_view.default, {
      className: headPrefix + "-normal-right-container"
    }, /*#__PURE__*/(0, _react.createElement)(_icon.default, {
      className: (0, _classnames.default)(headPrefix + "-normal-icon", (_classNames8 = {}, _classNames8[headPrefix + "-normal-icon-disabled"] = showPicker, _classNames8[headPrefix + "-normal-icon--only"] = !rightYearIcon, _classNames8)),
      name: "arrow-right",
      onClick: function onClick() {
        if (showPicker) {
          return;
        }

        if (onDateChange) {
          if (mode !== 'week') {
            onDateChange((0, _utils.updateMonth)(date, true, maxDate, minDate), true, 'month');
          } else {
            onDateChange((0, _utils.updateWeek)(date, true, maxDate, minDate), true, 'week');
          }
        }
      }
    }), rightYearIcon)), showPicker ? /*#__PURE__*/(0, _react.createElement)(_react.Fragment, null, mode === 'year' ? /*#__PURE__*/(0, _react.createElement)(_datePicker.EmbedYearPicker, _extends({
      className: clses.picker,
      validRange: [minDate, maxDate]
    }, datePickerProps)) : /*#__PURE__*/(0, _react.createElement)(_datePicker.EmbedMonthPicker, _extends({
      className: clses.picker,
      validRange: [minDate, maxDate]
    }, datePickerProps))) : null);
  }();
};

var _default = CalendarHeader;
exports.default = _default;