@chaoswise/ui 2.3.0 → 2.3.2

package/lib/CWRangePicker/index.js

@@ -41,10 +41,10 @@ import Refresh from "./Refresh";
 import CalendarSvg from "./assets/Calendar";
 import LiveSvg from "./assets/live";
 import RecoverSvg from "./assets/Recover";
-import { regroupDataSourceFn, echoInputValue, getUnit, judgeType, getChangeUnitDate, isInvalidDate, range, funcValueChangeArrayValue, getCorrectValue, getHistoryInfo, getFinalDateOption, getTruthDateCount, isAfterDate } from "./utils";
+import { regroupDataSourceFn, echoInputValue, getUnit, judgeType, getChangeUnitDate, isInvalidDate, range, funcValueChangeArrayValue, getCorrectValue, getHistoryInfo, getFinalDateOption, getTruthDateCount, isAfterDate, isSameDate } from "./utils";
+import _ from "lodash";
 import moment from "moment";
 import "./index.less";
-// const { RangePicker } = DatePicker;
 var CWRangePicker = /*#__PURE__*/forwardRef(function (props, ref) {
   var defaultValue = props.defaultValue,
     value = props.value,
@@ -53,6 +53,8 @@ var CWRangePicker = /*#__PURE__*/forwardRef(function (props, ref) {
     classNameWrapper = props.classNameWrapper,
     _props$onChange = props.onChange,
     _onChange = _props$onChange === void 0 ? function () {} : _props$onChange,
+    _props$onInitChange = props.onInitChange,
+    _onInitChange = _props$onInitChange === void 0 ? function () {} : _props$onInitChange,
     _props$growSize = props.growSize,
     growSize = _props$growSize === void 0 ? 3 : _props$growSize,
     _props$tipTooltipOpti = props.tipTooltipOption,
@@ -68,8 +70,7 @@ var CWRangePicker = /*#__PURE__*/forwardRef(function (props, ref) {
     inputPrefixIcon = props.inputPrefixIcon,
     _props$format = props.format,
     format = _props$format === void 0 ? "YYYY/MM/DD HH:mm:ss" : _props$format,
-    _props$forceRenderTit = props.forceRenderTitle,
-    forceRenderTitle = _props$forceRenderTit === void 0 ? false : _props$forceRenderTit,
+    forceRenderTitle = props.forceRenderTitle,
     open = props.open;
   var _ConfigProvider$useLo = _ConfigProvider.useLocale(),
     _ConfigProvider$useLo2 = _ConfigProvider$useLo.locale,
@@ -81,8 +82,7 @@ var CWRangePicker = /*#__PURE__*/forwardRef(function (props, ref) {
     onAutoRefreshChange = _refreshOption$onAuto2 === void 0 ? function () {} : _refreshOption$onAuto2,
     _refreshOption$delay = refreshOption.delay,
     delay = _refreshOption$delay === void 0 ? 5000 : _refreshOption$delay,
-    _refreshOption$openAu = refreshOption.openAutoRefresh,
-    openAutoRefresh = _refreshOption$openAu === void 0 ? true : _refreshOption$openAu;
+    openAutoRefresh = refreshOption.openAutoRefresh;
   var _menuOption$showCalen = menuOption.showCalendar,
     showCalendar = _menuOption$showCalen === void 0 ? true : _menuOption$showCalen,
     _menuOption$exceedSho = menuOption.exceedShowInMore,
@@ -151,6 +151,7 @@ var CWRangePicker = /*#__PURE__*/forwardRef(function (props, ref) {
   // 定时器计数
   var timeRef = useRef(null);
   var isInputRef = useRef(false); // 标记，输入框非默认值，输入内容
+  var isClickAutoRefresh = useRef(false); // 标记 点击自动刷新按钮
   // 输入框处理聚焦失焦
   var inputRef = useRef(null);
   // 含有刷新组件暴露的方法
@@ -177,11 +178,27 @@ var CWRangePicker = /*#__PURE__*/forwardRef(function (props, ref) {
     var _dateValue = dateValue,
       values = _dateValue.value;
     var _judgeType = judgeType(dateValue),
-      _judgeType2 = _slicedToArray(_judgeType, 1),
-      isRule = _judgeType2[0];
+      _judgeType2 = _slicedToArray(_judgeType, 2),
+      isRule = _judgeType2[0],
+      captureUnit = _judgeType2[1];
     if (!isRule && !values) {
       setIsAutoRefresh(true);
     }
+    var initValue = dateValue;
+    if (isRule) {
+      initValue = _objectSpread(_objectSpread({}, initValue), {}, {
+        isRecently: true,
+        value: getChangeUnitDate(captureUnit[0], captureUnit[1]),
+        number: captureUnit[0],
+        unit: captureUnit[1] === "mo" ? "M" : captureUnit[1]
+      });
+    } else if (values) {
+      initValue = _objectSpread(_objectSpread({}, initValue), {}, {
+        isRecently: false,
+        value: funcValueChangeArrayValue(values)
+      });
+    }
+    _onInitChange(initValue);
     setDateValue(dateValue);
   }, []);
   useEffect(function () {
@@ -191,31 +208,52 @@ var CWRangePicker = /*#__PURE__*/forwardRef(function (props, ref) {
       setRecordDateValue(defaultValue);
     }
   }, [defaultValue, value]);
+  var enableAutoRefresh = useMemo(function () {
+    return openAutoRefresh !== undefined ? openAutoRefresh : isAutoRefresh;
+  }, [openAutoRefresh, isAutoRefresh]);
   // 输入框回显
   useEffect(function () {
-    setInputValue(echoInputValue(recordDateValue, isFocus, locale, format, forceRenderTitle, isAutoRefresh));
-  }, [recordDateValue, isFocus, locale, format, forceRenderTitle, isAutoRefresh]);
+    setInputValue(echoInputValue(recordDateValue, isFocus, locale, format, forceRenderTitle, enableAutoRefresh));
+  }, [recordDateValue, isFocus, locale, format, forceRenderTitle, enableAutoRefresh]);
   useEffect(function () {
     var _judgeType3 = judgeType(recordDateValue),
       _judgeType4 = _slicedToArray(_judgeType3, 1),
       isRule = _judgeType4[0];
     var isHasDate = !isRule && !recordDateValue.value ? false : true;
     if (isHasDate) {
-      setIsAutoRefresh(function (pre) {
-        if (recordDateValue.isRecently || isRule) {
-          if (!pre) {
+      if (openAutoRefresh !== undefined) {
+        if (!isRule) {
+          if (openAutoRefresh) {
+            onAutoRefreshChange(false);
+          }
+        } else {
+          if (isRule && isClickAutoRefresh.current) {
+            onAutoRefreshChange(true);
+          }
+        }
+        isClickAutoRefresh.current = false;
+      } else {
+        if (isRule) {
+          if (!isAutoRefresh) {
             onAutoRefreshChange(true);
           }
-          return true;
         } else {
-          if (pre) {
+          if (isAutoRefresh) {
             onAutoRefreshChange(false);
           }
+        }
+      }
+      setIsAutoRefresh(function (pre) {
+        if (isRule) {
+          return true;
+        } else {
           return false;
         }
       });
+    } else {
+      isClickAutoRefresh.current = false;
     }
-  }, [recordDateValue]);
+  }, [recordDateValue, isAutoRefresh, openAutoRefresh]);
   useEffect(function () {
     var values = recordDateValue.value;
     var _judgeType5 = judgeType(recordDateValue),
@@ -223,19 +261,19 @@ var CWRangePicker = /*#__PURE__*/forwardRef(function (props, ref) {
       isRule = _judgeType6[0],
       captureUnit = _judgeType6[1],
       recordUnit = _judgeType6[2];
-    if (isAutoRefresh && isRule && openAutoRefresh) {
+    if (enableAutoRefresh && isRule) {
       timeRef.current = setInterval(function () {
         var newValue = _objectSpread(_objectSpread({}, recordDateValue), {}, {
           timeDomain: recordUnit,
           number: captureUnit[0],
-          unit: captureUnit[1],
+          unit: captureUnit[1] === "mo" ? "M" : captureUnit[1],
           value: getChangeUnitDate(captureUnit[0], captureUnit[1]),
           isRecently: true
         });
         onAutoRefresh(newValue);
       }, delay);
     }
-    if (isAutoRefresh && !isRule && !values && openAutoRefresh) {
+    if (enableAutoRefresh && !isRule && !values) {
       timeRef.current = setInterval(function () {
         onAutoRefresh(recordDateValue);
       }, delay);
@@ -243,7 +281,7 @@ var CWRangePicker = /*#__PURE__*/forwardRef(function (props, ref) {
     return function () {
       clearInterval(timeRef.current);
     };
-  }, [isAutoRefresh, recordDateValue, delay, openAutoRefresh]);
+  }, [enableAutoRefresh, recordDateValue, delay]);
   // 点击空白处日历切换
   useEffect(function () {
     document.addEventListener("click", clickBody);
@@ -252,16 +290,29 @@ var CWRangePicker = /*#__PURE__*/forwardRef(function (props, ref) {
     };
   }, []);
   // 日期是否存在
-  var isHasDate = useMemo(function () {
-    // 不符合最近时间格式和没有日期数据返回false
-    var values = recordDateValue.value;
-    var _judgeType7 = judgeType(recordDateValue),
-      _judgeType8 = _slicedToArray(_judgeType7, 1),
-      isRule = _judgeType8[0];
-    values = funcValueChangeArrayValue(values);
-    if (!isRule && !values) return false;
-    return true;
-  }, [recordDateValue]);
+  var _useMemo = useMemo(function () {
+      // 不符合最近时间格式和没有日期数据返回false
+      var values = recordDateValue.value;
+      var _judgeType7 = judgeType(recordDateValue),
+        _judgeType8 = _slicedToArray(_judgeType7, 2),
+        isRule = _judgeType8[0],
+        captureUnit = _judgeType8[1];
+      values = funcValueChangeArrayValue(values);
+      var isHasDate = true;
+      var isRightDisabled = false;
+      if (isRule) {
+        isRightDisabled = true;
+        values = getChangeUnitDate(captureUnit[0], captureUnit[1]);
+      }
+      if (!isRule && !values) {
+        isHasDate = false;
+      }
+      return [isHasDate, values, isRightDisabled];
+    }, [recordDateValue]),
+    _useMemo2 = _slicedToArray(_useMemo, 3),
+    isHasDate = _useMemo2[0],
+    _defaultValue = _useMemo2[1],
+    isRightDisabled = _useMemo2[2];
   // 重组数据源
   var regroupDataSource = useMemo(function () {
     if (exceedShowInMore) {
@@ -292,17 +343,6 @@ var CWRangePicker = /*#__PURE__*/forwardRef(function (props, ref) {
       value: funcValueChangeArrayValue(values)
     });
     returnValue = getCorrectValue(returnValue, key);
-    var _judgeType9 = judgeType(returnValue),
-      _judgeType10 = _slicedToArray(_judgeType9, 1),
-      isRule = _judgeType10[0];
-    if (!isRule && !returnValue.value) {
-      setIsAutoRefresh(function (pre) {
-        if (!pre) {
-          onAutoRefreshChange(true);
-        }
-        return true;
-      });
-    }
     _onChange(returnValue);
     if (!value) {
       setRecordDateValue(returnValue);
@@ -353,9 +393,9 @@ var CWRangePicker = /*#__PURE__*/forwardRef(function (props, ref) {
       e.target.select();
     }, 100);
   };
-  // 输入框失去焦点
-  var onInputBlur = function onInputBlur(e) {
-    isInputRef.current = false;
+  // 输入框按下Enter
+  var onPressEnter = function onPressEnter(e) {
+    onInputBlur();
   };
   // 外部获取ref停止自动刷新
   var onStop = function onStop() {
@@ -368,8 +408,8 @@ var CWRangePicker = /*#__PURE__*/forwardRef(function (props, ref) {
     var _refreshRef$current4, _refreshRef$current5;
     ((_refreshRef$current4 = refreshRef.current) === null || _refreshRef$current4 === void 0 ? void 0 : _refreshRef$current4.onAutoRefresh) && ((_refreshRef$current5 = refreshRef.current) === null || _refreshRef$current5 === void 0 ? void 0 : _refreshRef$current5.onAutoRefresh());
   };
-  // 输入框回车按下
-  var onPressEnter = function onPressEnter(e) {
+  // 输入框失去焦点
+  var onInputBlur = function onInputBlur(e) {
     if (!isInputRef.current) return;
     var _getUnit = getUnit(inputValue),
       isRule = _getUnit.isRule,
@@ -381,9 +421,7 @@ var CWRangePicker = /*#__PURE__*/forwardRef(function (props, ref) {
       }, inputValue);
       var isInvalidDate_ = isInvalidDate(returnValue.value);
       if (!isInvalidDate_) {
-        var _inputRef$current;
         // message.success(localeObj["fit-the-input-format"]);
-        (_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 ? void 0 : _inputRef$current.blur();
         _onChange(returnValue);
         setIsFocus(false);
         var _getHistoryInfo = getHistoryInfo(returnValue, historyList, locale, format),
@@ -406,11 +444,9 @@ var CWRangePicker = /*#__PURE__*/forwardRef(function (props, ref) {
       var _dateValue2 = finalDateOption.dateValue;
       var dateCount = getTruthDateCount(_dateValue2);
       if (dateCount === 2) {
-        var _inputRef$current2;
         var _returnValue = getCorrectValue({
           value: _dateValue2
         });
-        (_inputRef$current2 = inputRef.current) === null || _inputRef$current2 === void 0 ? void 0 : _inputRef$current2.blur();
         _onChange(_returnValue);
         setIsFocus(false);
         var _getHistoryInfo3 = getHistoryInfo(_returnValue, historyList, locale, format),
@@ -438,7 +474,8 @@ var CWRangePicker = /*#__PURE__*/forwardRef(function (props, ref) {
     value: value,
     isAutoRefresh: isAutoRefresh,
     setIsAutoRefresh: setIsAutoRefresh,
-    refreshOption: refreshOption
+    refreshOption: refreshOption,
+    enableAutoRefresh: enableAutoRefresh
   };
   var dropdownMenuProps = _objectSpread(_objectSpread({}, commonProps), {}, {
     dataSource: dataSource,
@@ -462,11 +499,13 @@ var CWRangePicker = /*#__PURE__*/forwardRef(function (props, ref) {
     backTooltipVisible: backTooltipVisible,
     setBackTooltipVisible: setBackTooltipVisible,
     expandTooltipVisible: expandTooltipVisible,
-    setExpandTooltipVisible: setExpandTooltipVisible
+    setExpandTooltipVisible: setExpandTooltipVisible,
+    isRightDisabled: isRightDisabled
   });
   var refreshProps = _objectSpread(_objectSpread({}, commonProps), {}, {
     isHasDate: isHasDate,
-    setBackTooltipVisible: setBackTooltipVisible
+    setBackTooltipVisible: setBackTooltipVisible,
+    isClickAutoRefresh: isClickAutoRefresh
   });
   return /*#__PURE__*/React.createElement("div", {
     className: classnames("cw-range-picker-wrapper", classNameWrapper),
@@ -493,6 +532,12 @@ var CWRangePicker = /*#__PURE__*/forwardRef(function (props, ref) {
             value: [_value[0], moment()]
           });
         }
+        var _values3 = _values2,
+          resValue = _values3.value;
+        if (isSameDate(resValue[0], resValue[1], "second") || isAfterDate(resValue[0], resValue[1])) {
+          _message.error(localeObj["the-selected-time-does-not-meet-the-rule-limit"]);
+          return;
+        }
         _onChange(_values2);
         var _getHistoryInfo5 = getHistoryInfo(_values2, historyList, locale, format),
           _getHistoryInfo6 = _slicedToArray(_getHistoryInfo5, 2),
@@ -550,15 +595,8 @@ var CWRangePicker = /*#__PURE__*/forwardRef(function (props, ref) {
         }
       }
     },
-    defaultTimeOption: {
-      startTimeOption: moment("00:00:00", "HH:mm:ss"),
-      endTimeOption: moment("23:59:59", "HH:mm:ss")
-    },
-    defaultValue: [moment().subtract(1, "months").startOf("month"), moment().subtract(1, "months").startOf("month").add(1, "d").set({
-      "hour": 23,
-      "minute": 59,
-      "second": 59
-    })],
+    defaultValue: _defaultValue // 默认为当前已经选择的时间
+    ,
     showTime: {
       hideDisabledOptions: true
     }
@@ -595,8 +633,7 @@ var CWRangePicker = /*#__PURE__*/forwardRef(function (props, ref) {
 CWRangePicker.defaultProps = {
   moreItemDropdownPosition: "left",
   growSize: 3,
-  format: "YYYY/MM/DD HH:mm:ss",
-  forceRenderTitle: false
+  format: "YYYY/MM/DD HH:mm:ss"
 };
 CWRangePicker.propTypes = {
   /**
@@ -619,6 +656,10 @@ CWRangePicker.propTypes = {
    * 时间变化的回调onChange({value,isRecently?timeDomain?number?unit?})
    */
   onChange: PropTypes.func,
+  /**
+   * 初始时间数据进入时间返回的回调(*主要针对于最近时间)
+   */
+  onInitChange: PropTypes.func,
   /**
    * 时间跨度的比例,>=2,默认为3
    */

package/lib/CWRangePicker/locale/en_US.js

@@ -30,5 +30,6 @@ export default {
   clear: 'Clear',
   "enter manually": "You can manually enter a query statement in the following format",
   "fit-the-input-format": "Fit the input format",
-  "does-not-match-the-input-format": "Does not match the input format"
+  "does-not-match-the-input-format": "Does not match the input format",
+  "the-selected-time-does-not-meet-the-rule-limit": "If the selected time is the same or exceeds the current time, select another time"
 };

package/lib/CWRangePicker/locale/zh_CN.js

@@ -30,5 +30,6 @@ export default {
   clear: '清空',
   "enter manually": "可根据以下类型，按查询语句格式手动输入",
   "fit-the-input-format": "符合输入格式",
-  "does-not-match-the-input-format": "不符合输入格式,请重新输入"
+  "does-not-match-the-input-format": "不符合输入格式,请重新输入",
+  "the-selected-time-does-not-meet-the-rule-limit": "选择的时间二者相同或者某一时间超过当前时间，请重新选择"
 };

package/lib/CWRangePicker/utils/index.js

@@ -170,6 +170,12 @@ export var echoInputValue = function echoInputValue() {
     }
   } else {
     var _value3;
+    if (isRule) {
+      if (isFoucs) {
+        return recordUnit;
+      }
+      return echoRecentlyTimeTitle(locale, captureUnit);
+    }
     if (Array.isArray(value) && (_value3 = value) !== null && _value3 !== void 0 && _value3.length) {
       return echoAbsoluteTimeTitle(value, format);
     }
@@ -225,7 +231,7 @@ export var getTimeSpanFromValue = function getTimeSpanFromValue(value) {
     value: value,
     timeDomain: timeDomain,
     number: captureUnit[0],
-    unit: captureUnit[1]
+    unit: captureUnit[1] === "mo" ? "M" : captureUnit[1]
   };
 };
 
@@ -379,7 +385,7 @@ export var getCorrectValue = function getCorrectValue(value) {
     returnValue = _objectSpread(_objectSpread({}, returnValue), {}, {
       timeDomain: key,
       number: captureUnit[0],
-      unit: captureUnit[1],
+      unit: captureUnit[1] === "mo" ? "M" : captureUnit[1],
       isRecently: true
     });
     if (!returnValue.value) {
@@ -448,8 +454,8 @@ export var isAfterDate = function isAfterDate(currentDate, compareDate) {
   return currentDate.isAfter(compareDate);
 };
 // 检查一个 moment 是否与另一个 moment 相同
-export var isSameDate = function isSameDate(currentDate, compareDate) {
-  return currentDate.isSame(compareDate);
+export var isSameDate = function isSameDate(currentDate, compareDate, unit) {
+  return unit ? currentDate.isSame(compareDate, unit) : currentDate.isSame(compareDate);
 };
 var isAfterCurrentDate = function isAfterCurrentDate(cloneStartDate, cloneEndDate) {
   var flag = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;

package/lib/CWSelect/index.js

@@ -149,16 +149,16 @@ var CWSelect = /*#__PURE__*/forwardRef(function (props, ref) {
   useEffect(function () {
     if (mode) {
       getMapFromArray(defaultValue);
-      if (defaultValue && mode == "multiple") {
-        setActiveKey(defaultValue);
+      if ("defaultValue" in props && mode == "multiple") {
+        setActiveKey(defaultValue || []);
       }
     }
   }, [defaultValue]);
   useEffect(function () {
     if (mode) {
       getMapFromArray(value);
-      if (value && mode == "multiple") {
-        setActiveKey(value);
+      if ("value" in props && mode == "multiple") {
+        setActiveKey(value || []);
       }
     }
   }, [value]);

package/lib/CWSelect/index.less

@@ -661,7 +661,7 @@
         font-weight: @select-item-selected-font-weight; // UI规范
         background-color: @select-selected-enable-bg; // UI规范
     }
-    &.cw-select-dropdown-multiple{
+    &.cw-select-dropdown-multiple.cw-select-dropdown-has-checkbox{
         .@{select-prefix-cls}-item-option.@{select-prefix-cls}-item-option-selected:not(.@{select-prefix-cls}-item-option-disabled){
             color: @text-color; // UI规范
             font-weight: 400; // UI规范

package/lib/Cascader/index.less

@@ -2,9 +2,31 @@
 
 .@{cascader-prefix-cls}-menus {
     position: static !important;
+
+    .@{cascader-prefix-cls}-menu {
+        .@{cascader-prefix-cls}-menu-item {
+
+            .@{cascader-prefix-cls}-menu-item-expand-icon,
+            .@{cascader-prefix-cls}-menu-item-loading-icon {
+                position: static;
+            }
+        }
+    }
 }
-.@{cascader-prefix-cls}.@{ant-prefix}-select{
-    .@{ant-prefix}-select-selection-overflow{
+
+.@{cascader-prefix-cls}.@{ant-prefix}-select {
+    .@{ant-prefix}-select-selection-overflow {
         flex: 0 1 auto;
+
+        .@{ant-prefix}-select-selection-overflow-item {
+
+            .@{ant-prefix}-select-selection-search {
+                margin: 0;
+            }
+        }
     }
+}
+// antd4 ：点击空白处浮层不消失问题
+.@{cascader-prefix-cls}-dropdown.@{ant-prefix}-select-dropdown.@{ant-prefix}-slide-up-leave{
+    display: none !important;
 }

package/lib/DropdownDatePicker/DropdownMenu/MoreTimeList/index.js

@@ -0,0 +1,46 @@
+import _Row from "@chaoswise/ui/lib/Antd/Row";
+import _Col from "@chaoswise/ui/lib/Antd/Col";
+import "@chaoswise/ui/lib/TooltipText/index.less";
+import _TooltipText from "@chaoswise/ui/lib/TooltipText";
+import _ConfigProvider from "@chaoswise/ui/lib/ConfigProvider";
+import React from "react";
+import classnames from "classnames";
+import { getLocale } from "../../locale";
+import _ from "lodash";
+import "./index.less";
+var MoreTimeList = function MoreTimeList(props) {
+  var regroupDataSource = props.regroupDataSource,
+    recordDateValue = props.recordDateValue,
+    onClickItem = props.onClickItem;
+  var _ConfigProvider$useLo = _ConfigProvider.useLocale(),
+    _ConfigProvider$useLo2 = _ConfigProvider$useLo.locale,
+    locale = _ConfigProvider$useLo2 === void 0 ? "zh" : _ConfigProvider$useLo2;
+  var localeObj = getLocale(locale);
+  // 点击Menu.Item中切换常规模式
+  var onClickMoreItem = function onClickMoreItem(item) {
+    onClickItem(item);
+  };
+  return /*#__PURE__*/React.createElement("div", {
+    className: classnames("cw-dropdown-date-picker-popup-more-content")
+  }, regroupDataSource.map(function (timeTypeItem, index) {
+    return /*#__PURE__*/React.createElement("div", {
+      style: {
+        padding: "8px 0",
+        borderBottom: regroupDataSource.length - 1 !== index ? "1px solid rgba(0,0,0,0.06)" : ""
+      },
+      key: timeTypeItem.type
+    }, /*#__PURE__*/React.createElement("h3", null, localeObj[timeTypeItem.type]), /*#__PURE__*/React.createElement(_Row, null, timeTypeItem.timeList.map(function (item) {
+      return /*#__PURE__*/React.createElement(_Col, {
+        key: item.key,
+        span: timeTypeItem.type === "absolute" || timeTypeItem.type == "unixTimestamp" ? 12 : 8,
+        className: classnames("more-col-item", {
+          "cw-dropdown-date-picker-dropdown-menu-item-selected": (recordDateValue === null || recordDateValue === void 0 ? void 0 : recordDateValue.key) === item.key
+        }),
+        onClick: function onClick() {
+          return onClickMoreItem(item);
+        }
+      }, /*#__PURE__*/React.createElement(_TooltipText, null, item.render ? item.render(item) : item.title));
+    })));
+  }));
+};
+export default MoreTimeList;

package/lib/DropdownDatePicker/DropdownMenu/MoreTimeList/index.less

@@ -0,0 +1,14 @@
+.cw-dropdown-date-picker-popup-more-content {
+    padding: 12px 16px 8px;
+    background-color: @component-background;
+    .more-col-item{
+        cursor: pointer;
+        color:@text-color-show;
+        &.cw-dropdown-date-picker-dropdown-menu-item-selected{
+            background: @select-selected-enable-bg;
+        }
+    }
+    .more-col-item:hover {
+        color: @primary-5;
+    }
+}

package/lib/DropdownDatePicker/DropdownMenu/index.js

@@ -0,0 +1,126 @@
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+import _Dropdown from "@chaoswise/ui/lib/Antd/Dropdown";
+import _Icon from "@chaoswise/ui/lib/Antd/Icon";
+import _ConfigProvider from "@chaoswise/ui/lib/ConfigProvider";
+var _excluded = ["timeDomain", "number", "unit", "value", "isRecently"];
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+import React from "react";
+import classnames from "classnames";
+import { getLocale } from "../locale";
+import Calendar2Svg from "../assets/Calendar2";
+import LiveSvg from "../assets/live";
+import MoreSvg from "../assets/more";
+import MoreTimeList from "./MoreTimeList";
+import { funcValueChangeArrayValue, getCorrectValue } from "../utils";
+import _ from "lodash";
+import "./index.less";
+var DropdownMenu = function DropdownMenu(props) {
+  var dataSource = props.dataSource,
+    regroupDataSource = props.regroupDataSource,
+    setIsCalendar = props.setIsCalendar,
+    recordDateValue = props.recordDateValue,
+    setRecordDateValue = props.setRecordDateValue,
+    _value = props.value,
+    onChange = props.onChange,
+    menuOption = props.menuOption,
+    setIsFocus = props.setIsFocus;
+  var _ConfigProvider$useLo = _ConfigProvider.useLocale(),
+    _ConfigProvider$useLo2 = _ConfigProvider$useLo.locale,
+    locale = _ConfigProvider$useLo2 === void 0 ? "zh" : _ConfigProvider$useLo2;
+  var localeObj = getLocale(locale);
+  var _menuOption$showCalen = menuOption.showCalendar,
+    showCalendar = _menuOption$showCalen === void 0 ? true : _menuOption$showCalen,
+    _menuOption$showDefau = menuOption.showDefaultCount,
+    showDefaultCount = _menuOption$showDefau === void 0 ? 8 : _menuOption$showDefau,
+    _menuOption$moreItemD = menuOption.moreItemDropdownPosition,
+    moreItemDropdownPosition = _menuOption$moreItemD === void 0 ? "left" : _menuOption$moreItemD;
+  // 点击Menu.Item中切换选项列表
+  var onClickItem = function onClickItem(item) {
+    var timeDomain = recordDateValue.timeDomain,
+      number = recordDateValue.number,
+      unit = recordDateValue.unit,
+      value = recordDateValue.value,
+      isRecently = recordDateValue.isRecently,
+      rest = _objectWithoutProperties(recordDateValue, _excluded);
+    setIsFocus(false);
+    var values = item.value;
+    if (item.key !== recordDateValue.key) {
+      var returnValue = _objectSpread(_objectSpread({}, item), {}, {
+        value: funcValueChangeArrayValue(values)
+      });
+      returnValue = getCorrectValue(returnValue, item.key);
+      onChange(returnValue);
+      if (!_value) {
+        setRecordDateValue(returnValue);
+      }
+    }
+  };
+  // 点击切换为日历
+  var onClickSelectCalendar = function onClickSelectCalendar(e) {
+    e.nativeEvent.stopImmediatePropagation();
+    setIsCalendar(true);
+  };
+  return /*#__PURE__*/React.createElement("div", {
+    className: classnames("cw-dropdown-date-picker-dropdown-menu-wrapper")
+  }, dataSource === null || dataSource === void 0 ? void 0 : dataSource.slice(0, showDefaultCount).map(function (item) {
+    return /*#__PURE__*/React.createElement("div", {
+      className: classnames("cw-dropdown-date-picker-dropdown-menu-_item", {
+        "cw-dropdown-date-picker-dropdown-menu-item-selected": (recordDateValue === null || recordDateValue === void 0 ? void 0 : recordDateValue.key) === item.key
+      }),
+      key: item.key,
+      onClick: function onClick() {
+        return onClickItem(item);
+      }
+    }, item.icon ? item.icon : /*#__PURE__*/React.createElement(LiveSvg, null), /*#__PURE__*/React.createElement("span", {
+      style: {
+        marginLeft: "4px"
+      }
+    }, item.render ? item.render(item) : item.title));
+  }), (dataSource === null || dataSource === void 0 ? void 0 : dataSource.length) > showDefaultCount && /*#__PURE__*/React.createElement(_Dropdown, {
+    overlay: /*#__PURE__*/React.createElement(MoreTimeList, {
+      regroupDataSource: regroupDataSource,
+      recordDateValue: recordDateValue,
+      onClickItem: onClickItem
+    }),
+    overlayClassName: classnames("cw-dropdown-date-picker-dropdown-menu-more-wrapper", {
+      "cw-dropdown-date-picker-dropdown-menu-more-wrapper-left": moreItemDropdownPosition === "left"
+    }),
+    getPopupContainer: function getPopupContainer(triggerNode) {
+      return triggerNode;
+    }
+  }, /*#__PURE__*/React.createElement("div", {
+    className: classnames("cw-dropdown-date-picker-dropdown-menu-_item", "cw-dropdown-date-picker-dropdown-menu-item-more")
+  }, /*#__PURE__*/React.createElement("div", {
+    style: {
+      display: "flex",
+      alignItems: "center"
+    }
+  }, /*#__PURE__*/React.createElement(MoreSvg, {
+    className: "cw-range-picker-prefix-icon"
+  }), /*#__PURE__*/React.createElement("span", {
+    style: {
+      marginLeft: "4px"
+    }
+  }, localeObj.more)), /*#__PURE__*/React.createElement(_Icon, {
+    type: "right"
+  }))), showCalendar && /*#__PURE__*/React.createElement("div", {
+    className: classnames("cw-dropdown-date-picker-dropdown-menu-_item"),
+    key: "unique-calendar",
+    onClick: onClickSelectCalendar
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "cw-range-picker-menu-item-calendar"
+  }, /*#__PURE__*/React.createElement(Calendar2Svg, {
+    className: "cw-range-picker-prefix-icon"
+  })), /*#__PURE__*/React.createElement("span", {
+    style: {
+      marginLeft: "4px"
+    }
+  }, localeObj["select-calendar"])));
+};
+export default DropdownMenu;