@ttk/component/es/dateRangeDatePicker/index.js

ttk组件库

import { _ as _extends } from '../extends-b1af4ff7.js';
import { _ as _defineProperty } from '../defineProperty-847730aa.js';
import { _ as _inherits, a as _getPrototypeOf, b as _possibleConstructorReturn, c as _classCallCheck, d as _createClass } from '../getPrototypeOf-b95655c5.js';
import React__default, { PureComponent } from 'react';
import { DatePicker } from 'antd';
import classNames from 'classnames';
import moment from 'moment';
import { date } from '@ttk/utils';
import '../_commonjsHelpers-471920d6.js';

function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }

function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var transformMomentDate = date.transformMomentDate;

var DateRangeDatePicker = /*#__PURE__*/function (_PureComponent) {
  _inherits(DateRangeDatePicker, _PureComponent);

  var _super = _createSuper(DateRangeDatePicker);

  function DateRangeDatePicker(props) {
    var _this;

    _classCallCheck(this, DateRangeDatePicker);

    _this = _super.call(this, props);

    _this.transformDateToNum = function (date) {
      if (!date) {
        return 0;
      }

      var time = date;

      if (typeof date == 'string') {
        try {
          time = transformMomentDate(date);
        } catch (err) {
          time = moment();
        }
      }

      return time.format('YYYYMMDD'); //  return parseInt(`${time.year()}${time.month() < 10 ? `0${time.month()}` : `${time.month()}`}${time.date() < 10 ? `0${time.date()}` : `${time.date()}`}`);
    };

    _this.dateWindowChange = function (type, status) {
      if (type == 'next') {
        _this.setState({
          visible: status
        });
      }

      if (type == 'next' && status == false) {
        // 采用异步是因为datePicker的onchange事件晚于onOpenChange触发
        setTimeout(function () {
          _this.update();
        }, 0);
      }
    };

    _this.dateChange = function (type, value) {
      var _this$setState;

      // 针对setstate设置this.state是异步的，因为update需要取值
      _this.state[type] = value;

      _this.setState((_this$setState = {}, _defineProperty(_this$setState, type, value), _defineProperty(_this$setState, "visible", type == 'nextValue' ? false : true), _this$setState));

      if (type == 'preValue') {
        var preNum = _this.transformDateToNum(value);

        var nextValue = _this.state.nextValue;

        var nextNum = _this.transformDateToNum(nextValue);

        if (nextNum < preNum) {
          _this.setState({
            nextValue: value
          });
        }
      }
    };

    _this.nextClick = function () {
      _this.setState({
        visible: true
      });
    };

    _this.update = function () {
      var _this$state = _this.state,
          preValue = _this$state.preValue,
          nextValue = _this$state.nextValue;

      if (_this.props.onChange) {
        _this.props.onChange([preValue, nextValue]);
      }

      if (_this.props.onPanelChange) {
        _this.props.onPanelChange([preValue, nextValue]);
      }
    };

    _this.disabledStartDate = function (currentValue) {
      var startEnableDate = _this.props.startEnableDate;
      var nextValue = _this.state.nextValue;

      if (!nextValue && !startEnableDate) {
        return false;
      }

      if (!startEnableDate) {
        //return this.transformDateToNum(nextValue) < this.transformDateToNum(currentValue)||
        // return this.transformDateToNum(moment()) < this.transformDateToNum(currentValue)
        return false;
      } else {
        return _this.transformDateToNum(currentValue) < _this.transformDateToNum(startEnableDate); //|| this.transformDateToNum(currentValue) > moment().format('YYYYMMDD')
      }
    };

    _this.disabledEndDate = function (currentValue) {
      var endEnableDate = _this.props.endEnableDate;
      var preValue = _this.state.preValue;

      if (!preValue && !endEnableDate) {
        return false;
      }

      if (!endEnableDate) {
        // endEnableDate = moment();
        return _this.transformDateToNum(preValue) > _this.transformDateToNum(currentValue);
      } else {
        return _this.transformDateToNum(preValue) > _this.transformDateToNum(currentValue) || _this.transformDateToNum(currentValue) > _this.transformDateToNum(endEnableDate);
      }
    };

    _this.state = {
      preValue: props.value && props.value[0] ? props.value[0] : null,
      nextValue: props.value && props.value[1] ? props.value[1] : null,
      visible: false
    };
    return _this;
  }

  _createClass(DateRangeDatePicker, [{
    key: "componentWillReceiveProps",
    value: function componentWillReceiveProps(nextProps) {
      this.setState({
        preValue: nextProps.value && nextProps.value[0] ? nextProps.value[0] : null,
        nextValue: nextProps.value && nextProps.value[1] ? nextProps.value[1] : null
      });
    } //年月日

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

      var _this$state2 = this.state,
          preValue = _this$state2.preValue,
          nextValue = _this$state2.nextValue,
          visible = _this$state2.visible;
      var props = this.props;
      var className = classNames(_defineProperty({
        'mk-dateRangeDatePicker': true
      }, props.className, !!props.className));
      return /*#__PURE__*/React__default.createElement("div", {
        className: className
      }, /*#__PURE__*/React__default.createElement(DatePicker, _extends({}, props, {
        showToday: false,
        disabledDate: props.disabledStartDate ? props.disabledStartDate : this.disabledStartDate,
        value: preValue,
        onOpenChange: function onOpenChange(status) {
          return _this2.dateWindowChange('pre', status);
        },
        onChange: function onChange(value) {
          return _this2.dateChange('preValue', value);
        }
      })), /*#__PURE__*/React__default.createElement("span", {
        style: {
          padding: '0 3px',
          lineHeight: '30px'
        }
      }, "-"), /*#__PURE__*/React__default.createElement(DatePicker, _extends({}, props, {
        showToday: false,
        disabledDate: props.disabledEndDate ? props.disabledEndDate : this.disabledEndDate,
        onClick: this.nextClick,
        value: nextValue,
        open: visible,
        onOpenChange: function onOpenChange(status) {
          return _this2.dateWindowChange('next', status);
        },
        onChange: function onChange(value) {
          return _this2.dateChange('nextValue', value);
        }
      })));
    }
  }]);

  return DateRangeDatePicker;
}(PureComponent);

export { DateRangeDatePicker as default };