zp-bee/lib/bee-date-picker/my.js

zp-bee，是一款基于 Dumi，由 React + TypeScript 开发的组件库 🎉。

"use strict";

var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");

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

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

var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));

require("antd/es/select/style");

var _select = _interopRequireDefault(require("antd/es/select"));

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

var _CaretDownFilled = _interopRequireDefault(require("@ant-design/icons/CaretDownFilled"));

var _datePicker = _interopRequireDefault(require("./datePicker"));

var Option = _select.default.Option;

var BeeTypePicker = function BeeTypePicker(props, ref) {
  var typeOptions = props.typeOptions,
      defaultType = props.defaultType,
      onTypeDateSelect = props.onTypeDateSelect,
      dateOptions = props.dateOptions;

  var _useState = (0, _react.useState)(defaultType),
      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
      timeType = _useState2[0],
      setTimeType = _useState2[1];

  var dateTypeRef = (0, _react.useRef)({
    timeType: defaultType,
    dateRange: dateOptions[2].dateRange
  });
  var dateRef = (0, _react.useRef)();
  (0, _react.useImperativeHandle)(ref, function () {
    return {
      handleReset: handleReset,
      timeType: timeType
    };
  }, [timeType]);

  var handleReset = function handleReset() {
    var _a;

    dateTypeRef.current = {
      timeType: defaultType,
      dateRange: dateOptions[2].dateRange
    };
    setTimeType(defaultType);
    (_a = dateRef.current) === null || _a === void 0 ? void 0 : _a.handleResetDate();
  };

  var onDateChange = (0, _react.useCallback)(function (value) {
    dateTypeRef.current = Object.assign(Object.assign({}, dateTypeRef.current), {
      dateRange: value
    });
    var _dateTypeRef$current = dateTypeRef.current,
        timeType = _dateTypeRef$current.timeType,
        dateRange = _dateTypeRef$current.dateRange;
    onTypeDateSelect(timeType, dateRange);
  }, []);
  var onTypeChange = (0, _react.useCallback)(function (value) {
    dateTypeRef.current = Object.assign(Object.assign({}, dateTypeRef.current), {
      timeType: value
    });
    setTimeType(value);
    var _dateTypeRef$current2 = dateTypeRef.current,
        timeType = _dateTypeRef$current2.timeType,
        dateRange = _dateTypeRef$current2.dateRange;
    onTypeDateSelect(timeType, dateRange);
  }, []);
  return /*#__PURE__*/_react.default.createElement("div", {
    className: "bee-type-picker"
  }, /*#__PURE__*/_react.default.createElement(_select.default, {
    className: "mr-10",
    style: {
      width: 96
    },
    suffixIcon: /*#__PURE__*/_react.default.createElement(_CaretDownFilled.default, null),
    value: timeType,
    onChange: onTypeChange
  }, typeOptions.map(function (item) {
    return /*#__PURE__*/_react.default.createElement(Option, {
      key: item.type,
      value: item.type
    }, item.name);
  })), /*#__PURE__*/_react.default.createElement(_datePicker.default, {
    ref: dateRef,
    defaultSelectedIndex: 2,
    dateOptions: dateOptions,
    onDateSelect: onDateChange,
    allowClear: true
  }));
};

var BeeTypePickerRef = /*#__PURE__*/(0, _react.forwardRef)(BeeTypePicker);
BeeTypePickerRef.defaultOptions = _datePicker.default.defaultOptions;
BeeTypePickerRef.BeeBaseDatePicker = _datePicker.default;
var _default = BeeTypePickerRef;
exports.default = _default;