zent/lib/datetimepicker/SplitDateRangePicker.js

一套前端设计语言和基于React的实现

'use strict';

Object.defineProperty(exports, "__esModule", {
  value: true
});

var _extends2 = require('babel-runtime/helpers/extends');

var _extends3 = _interopRequireDefault(_extends2);

var _objectWithoutProperties2 = require('babel-runtime/helpers/objectWithoutProperties');

var _objectWithoutProperties3 = _interopRequireDefault(_objectWithoutProperties2);

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

var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);

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

var _createClass3 = _interopRequireDefault(_createClass2);

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

var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);

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

var _inherits3 = _interopRequireDefault(_inherits2);

var _react = require('react');

var _react2 = _interopRequireDefault(_react);

var _classnames = require('classnames');

var _classnames2 = _interopRequireDefault(_classnames);

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

var _propTypes2 = _interopRequireDefault(_propTypes);

var _constants = require('./constants/');

var _DatePicker = require('./DatePicker');

var _DatePicker2 = _interopRequireDefault(_DatePicker);

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

// type
var START = 'start';
var END = 'end';

var _ref3 = _react2['default'].createElement(
  'span',
  { className: 'picker-seperator' },
  '\u81F3'
);

var SplitDateRangePicker = function (_ref) {
  (0, _inherits3['default'])(SplitDateRangePicker, _ref);

  function SplitDateRangePicker() {
    var _ref2;

    var _temp, _this, _ret;

    (0, _classCallCheck3['default'])(this, SplitDateRangePicker);

    for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
      args[_key] = arguments[_key];
    }

    return _ret = (_temp = (_this = (0, _possibleConstructorReturn3['default'])(this, (_ref2 = SplitDateRangePicker.__proto__ || Object.getPrototypeOf(SplitDateRangePicker)).call.apply(_ref2, [this].concat(args))), _this), _this.onChange = function (type) {
      return function (val) {
        var _this$props = _this.props,
            onChange = _this$props.onChange,
            value = _this$props.value;

        var ret = value ? value.slice() : [];

        if (type === START) {
          ret.length === 2 ? ret.splice(0, 1, val) : ret.splice(0, 1, val, '');
        } else {
          ret.length === 0 ? ret.splice(1, 1, '', val) : ret.splice(1, 1, val);
        }
        onChange(ret);
      };
    }, _temp), (0, _possibleConstructorReturn3['default'])(_this, _ret);
  }

  (0, _createClass3['default'])(SplitDateRangePicker, [{
    key: 'renderPicker',
    value: function renderPicker() {
      var props = this.props;

      var value = props.value,
          placeholder = props.placeholder,
          className = props.className,
          _onClose = props.onClose,
          _onOpen = props.onOpen,
          _onClick = props.onClick,
          openPanel = props.openPanel,
          onChange = props.onChange,
          _disabledDate = props.disabledDate,
          defaultTime = props.defaultTime,
          pickerProps = (0, _objectWithoutProperties3['default'])(props, ['value', 'placeholder', 'className', 'onClose', 'onOpen', 'onClick', 'openPanel', 'onChange', 'disabledDate', 'defaultTime']);

      var rangePicker = void 0;

      var pickerCls = (0, _classnames2['default'])('range-picker2');

      rangePicker = _react2['default'].createElement(
        'div',
        { className: pickerCls },
        _react2['default'].createElement(_DatePicker2['default'], (0, _extends3['default'])({}, pickerProps, {
          openPanel: openPanel[0],
          placeholder: placeholder[0],
          max: value[1] || pickerProps.max,
          defaultTime: defaultTime[0],
          value: value[0],
          onClick: function onClick(val) {
            return _onClick && _onClick(val, START);
          },
          onOpen: function onOpen() {
            return _onOpen && _onOpen(START);
          },
          onClose: function onClose() {
            return _onClose && _onClose(START);
          },
          onChange: this.onChange(START),
          disabledDate: function disabledDate(val) {
            return _disabledDate(val, START);
          }
        })),
        _ref3,
        _react2['default'].createElement(_DatePicker2['default'], (0, _extends3['default'])({}, pickerProps, {
          openPanel: openPanel[1],
          placeholder: placeholder[1],
          min: value[0] || pickerProps.min,
          defaultTime: defaultTime[1],
          value: value[1],
          onClick: function onClick(val) {
            return _onClick && _onClick(val, END);
          },
          onOpen: function onOpen() {
            return _onOpen && _onOpen(END);
          },
          onClose: function onClose() {
            return _onClose && _onClose(END);
          },
          onChange: this.onChange(END),
          disabledDate: function disabledDate(val) {
            return _disabledDate(val, END);
          }
        }))
      );

      return rangePicker;
    }
  }, {
    key: 'render',
    value: function render() {
      var props = this.props;
      var prefixCls = props.prefix + '-datetime-picker ' + props.className;

      return _react2['default'].createElement(
        'div',
        { className: prefixCls },
        this.renderPicker()
      );
    }
  }]);
  return SplitDateRangePicker;
}(_react.PureComponent || _react.Component);

SplitDateRangePicker.PropTypes = (0, _extends3['default'])({}, _constants.commonPropTypes, {
  showTime: _propTypes2['default'].bool,
  placeholder: _propTypes2['default'].array,
  defaultTime: _propTypes2['default'].arrayOf(_propTypes2['default'].string)
});
SplitDateRangePicker.defaultProps = (0, _extends3['default'])({}, _constants.commonProps, {
  placeholder: ['开始日期', '结束日期'],
  format: 'YYYY-MM-DD',
  value: [],
  openPanel: [],
  defaultTime: ['00:00:00', '00:00:00']
});
exports['default'] = SplitDateRangePicker;