@titaui/pc 1.12.13-beta.1 → 1.12.15

package/lib/components/okr-flow/export-modal/index.js

@@ -21,6 +21,10 @@ var _toast = _interopRequireDefault(require("../../toast"));
 
 var _dialog = _interopRequireDefault(require("../../dialog"));
 
+var _tooltip = _interopRequireDefault(require("../../tooltip"));
+
+var _selectLayer = _interopRequireDefault(require("../../select-layer"));
+
 var _utils = require("../utils");
 
 var _context2 = require("../context");
@@ -99,8 +103,25 @@ var ExportMapModal = function ExportMapModal(props) {
       isExport = _useState6[0],
       setIsExport = _useState6[1];
 
+  var _useState7 = (0, _react.useState)({
+    label: (0, _getLocale.getLocale)('Rep_NewS_HDmode'),
+    value: 20
+  }),
+      _useState8 = _slicedToArray(_useState7, 2),
+      model = _useState8[0],
+      setModel = _useState8[1];
+
   var modalRef = (0, _react.useRef)();
   var virtualElements = (0, _react.useRef)([]);
+  var models = [{
+    label: (0, _getLocale.getLocale)('Rep_NewS_Standardmode'),
+    value: 10,
+    toolText: (0, _getLocale.getLocale)('Rep_NewS_SmallFileSuita')
+  }, {
+    label: (0, _getLocale.getLocale)('Rep_NewS_HDmode'),
+    value: 20,
+    toolText: (0, _getLocale.getLocale)('Rep_NewS_LargeileSize')
+  }];
   (0, _react.useEffect)(function () {
     if ((0, _bsGlobal.isWx)() && window.WWOpenData) {
       if (window.WWOpenData.enableCanvasSharing) {
@@ -132,7 +153,7 @@ var ExportMapModal = function ExportMapModal(props) {
 
               canvas = document.createElement('canvas'); // 创建一个canvas节点
 
-              scale = 20; // 定义任意放大倍数 支持小数
+              scale = model.value; // 定义任意放大倍数 支持小数
 
               canvas.width = width * scale; // 定义canvas 宽度 * 缩放
 
@@ -219,13 +240,7 @@ var ExportMapModal = function ExportMapModal(props) {
                   scope.setExtra('userMessage', userId + '租户：' + telentId + '我得到了图片大小为：' + size + '，路径为' + imgUrl);
                 });
                 (0, _requestApis.getBase64DownloadUrl)(imgUrl.split(',')[1]).then(function (url) {
-                  var image = new Image(); // @ts-ignore
-                  // window.titaTracker && window.titaTracker("action").record({
-                  //   actionName: userId+'租户：'+telentId+'我获得了地址'+url.Data.obj,
-                  //   actionGroup: 'okr地图接口',
-                  //   productName: 'okr地图导出',
-                  // });
-
+                  // const image = new Image()
                   // @ts-ignore
                   // window.titaTracker && window.titaTracker("action").record({
                   //   actionName: userId+'租户：'+telentId+'我获得了地址'+url.Data.obj,
@@ -237,35 +252,18 @@ var ExportMapModal = function ExportMapModal(props) {
                     scope.setTag('error-type', '地图导出-图片地址');
                     scope.setExtra('userMessage', userId + '租户：' + telentId + '我得到了图片大小为：' + size + '，路径为' + imgUrl);
                   });
+                  var newUrl = url.Data.obj;
+                  var x = new XMLHttpRequest();
+                  x.open("GET", newUrl, true);
+                  x.responseType = 'blob';
+
+                  x.onload = function (e) {
+                    var url = window.URL.createObjectURL(x.response);
+                    var a = document.createElement('a');
+                    a.href = url;
+                    a.download = model.value === 20 ? '高清图片' : '标清图片';
+                    a.click();
 
-                  _toast["default"].Warning('图片上传成功，准备本地下载', {
-                    canClose: true
-                  });
-
-                  image.setAttribute('crossOrigin', 'anonymous');
-
-                  image.onload = function () {
-                    if (!url.Data.obj) {
-                      _toast["default"].Error('导出失败，请稍后重试', {
-                        canClose: false
-                      });
-                    }
-
-                    var a = document.createElement('a'); // 生成一个a元素
-
-                    // 生成一个a元素
-                    var event = new MouseEvent('click'); // 创建一个单击事件
-
-                    // 创建一个单击事件
-                    a.download = 'okr地图'; // 设置图片名称
-
-                    // 设置图片名称
-                    a.href = url.Data.obj; // 将生成的URL设置为a
-
-                    // 将生成的URL设置为a
-                    a.dispatchEvent(event); // 触发a的单击事件
-
-                    // 触发a的单击事件
                     _toast["default"].Success('导出成功');
 
                     setIsExport(false);
@@ -275,7 +273,24 @@ var ExportMapModal = function ExportMapModal(props) {
                     }
                   };
 
-                  image.src = imgUrl;
+                  x.send(); // image.setAttribute('crossOrigin', 'anonymous')
+                  // image.onload = async() => {
+                  //   if (!url.Data.obj) {
+                  //     Toast.Error('导出失败，请稍后重试', { canClose: false })
+                  //   }
+                  //   await downloadFile(url.Data.obj,model.value===20?'高清分享图片':'标准分享图片')
+                  //   // const a = document.createElement('a') // 生成一个a元素
+                  //   // const event = new MouseEvent('click') // 创建一个单击事件
+                  //   // a.download = '123' // 设置图片名称
+                  //   // a.href = url.Data.obj // 将生成的URL设置为a
+                  //   // a.dispatchEvent(event) // 触发a的单击事件
+                  //   Toast.Success('导出成功')
+                  //   setIsExport(false)
+                  //   if (onCloseHandler) {
+                  //     onCloseHandler()
+                  //   }
+                  // }
+                  // image.src = imgUrl
                 });
               })["catch"](function (err) {
                 setIsExport(false);
@@ -315,6 +330,10 @@ var ExportMapModal = function ExportMapModal(props) {
     setMapInstance(instance);
   };
 
+  var onChangeHandler = function onChangeHandler(data) {
+    setModel(data);
+  };
+
   var colorChangeHandler = function colorChangeHandler(colors) {
     setBgColor(colors ? colors.color : 'none');
   };
@@ -336,7 +355,7 @@ var ExportMapModal = function ExportMapModal(props) {
     title: (0, _getLocale.getLocale)('OKR_Ali_Exportmap'),
     noFooterLine: true,
     visible: visible,
-    width: "1000px",
+    width: "840px",
     onClose: onCloseHandler,
     onOk: confirmHandler,
     onCancel: onCloseHandler,
@@ -346,9 +365,11 @@ var ExportMapModal = function ExportMapModal(props) {
     forceRender: true
   }, /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement("div", {
     className: "export-map-modal__setting"
+  }, /*#__PURE__*/_react["default"].createElement("div", {
+    className: "export-map-modal__setting-color"
   }, /*#__PURE__*/_react["default"].createElement("span", {
     style: {
-      marginRight: 10
+      marginRight: 16
     }
   }, (0, _getLocale.getLocale)('OKR_Ali_Selectbackground')), /*#__PURE__*/_react["default"].createElement(_rcColorPicker["default"], {
     animation: "slide-up",
@@ -356,12 +377,28 @@ var ExportMapModal = function ExportMapModal(props) {
     onChange: colorChangeHandler,
     className: "titaui-color-picker",
     mode: "HSB"
+  }, /*#__PURE__*/_react["default"].createElement(_tooltip["default"], {
+    overlay: (0, _getLocale.getLocale)('Mod_Customization'),
+    placement: "top"
   }, /*#__PURE__*/_react["default"].createElement("span", {
-    className: "export-map-modal__color-trigger"
-  })), /*#__PURE__*/_react["default"].createElement("span", {
-    className: "export-map-modal__color-trans",
+    className: "export-map-modal__setting-color-trigger"
+  }))), /*#__PURE__*/_react["default"].createElement(_tooltip["default"], {
+    overlay: (0, _getLocale.getLocale)('OKR_Ali_Butt_Transparent'),
+    placement: "top"
+  }, /*#__PURE__*/_react["default"].createElement("span", {
+    className: "export-map-modal__setting-color-trans",
     onClick: colorChangeHandler
-  })), /*#__PURE__*/_react["default"].createElement("div", null, visible && /*#__PURE__*/_react["default"].createElement(_context2.CommonContext.Provider, {
+  }))), /*#__PURE__*/_react["default"].createElement(_selectLayer["default"], {
+    onChangeSelect: onChangeHandler,
+    items: models,
+    initValue: model.value
+  }, /*#__PURE__*/_react["default"].createElement("div", {
+    className: "titaui-search-dropdown"
+  }, /*#__PURE__*/_react["default"].createElement("span", {
+    className: "titaui-search-dropdown__text"
+  }, model.label), /*#__PURE__*/_react["default"].createElement("span", {
+    className: "tu-icon-sort-down"
+  })))), /*#__PURE__*/_react["default"].createElement("div", null, visible && /*#__PURE__*/_react["default"].createElement(_context2.CommonContext.Provider, {
     value: {
       direction: direction,
       showkr: showkr,
@@ -380,7 +417,7 @@ var ExportMapModal = function ExportMapModal(props) {
     zoomOnDoubleClick: false,
     paneMoveable: false,
     style: {
-      height: 600,
+      height: 446,
       width: '100%',
       background: bgColor
     }

package/lib/components/period-selector/components/button/style.js

@@ -13,7 +13,7 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "d
 
 function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
 
-var DefaultWrapper = _styledComponents["default"].button(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  box-sizing: border-box;\n  display: inline-flex;\n\n  align-items: center;\n  justify-content: center;\n  color: #6f7886;\n  cursor: pointer;\n  outline: none;\n  transition: color 0.3s ease, border 0.3s ease;\n  background: transparent;\n  border-radius: 3px;\n  border: 1px solid #e9ecf0;\n  &.btn-size-m {\n    min-width: 90px;\n    height: 36px;\n    padding: 0 18px;\n    font-size: 14px;\n    font-weight: 400;\n  }\n  &.btn-size-s {\n    min-width: 68px;\n    height: 26px;\n    padding: 0 20px;\n    font-size: 13px;\n    font-weight: 400;\n  }\n  :hover {\n    color: #2879ff;\n    border-color: #2879ff;\n  }\n  :disabled {\n    cursor: not-allowed;\n    background-color: #f0f2f5;\n    color: #a4acb9;\n    border: none;\n    :hover {\n      border: none;\n      color: #bfc7d5;\n      opacity: 1;\n      background-color: #f0f2f5;\n    }\n  }\n"])));
+var DefaultWrapper = _styledComponents["default"].button(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  box-sizing: border-box;\n  display: inline-flex;\n\n  align-items: center;\n  justify-content: center;\n  color: #6f7886;\n  cursor: pointer;\n  outline: none;\n  transition: color 0.3s ease, border 0.3s ease;\n  background: transparent;\n  border-radius: 3px;\n  border: 1px solid #e9ecf0;\n  &.btn-size-m {\n    min-width: 90px;\n    height: 36px;\n    border-radius: 18px;\n    padding: 0 18px;\n    font-size: 14px;\n    font-weight: 400;\n  }\n  &.btn-size-s {\n    min-width: 68px;\n    height: 26px;\n    padding: 0 20px;\n    font-size: 13px;\n    font-weight: 400;\n  }\n  :hover {\n    color: #2879ff;\n    border-color: #2879ff;\n  }\n  :disabled {\n    cursor: not-allowed;\n    background-color: #f0f2f5;\n    color: #a4acb9;\n    border: none;\n    :hover {\n      border: none;\n      color: #bfc7d5;\n      opacity: 1;\n      background-color: #f0f2f5;\n    }\n  }\n"])));
 
 exports.DefaultWrapper = DefaultWrapper;
 var PrimaryWrapper = (0, _styledComponents["default"])(DefaultWrapper)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  color: #ffffff;\n  background: #2879ff;\n  border: none;\n  :hover {\n    color: #ffffff;\n    background-color: #5c8eff;\n    border: none;\n  }\n"])));

package/lib/components/period-selector/index.css

@@ -6,6 +6,7 @@
   font-size: 16px;
   transform: scale(0.5);
   margin-left: 4px;
+  color: #6f7886;
 }
 
 .titaui-period-selector__down-arrow {

package/lib/components/period-selector/index.js

@@ -52,9 +52,12 @@ function PeriodSelector(_ref) {
       onChange = _ref.onChange,
       getPopupContainer = _ref.getPopupContainer,
       selected = _ref.selected,
+      lastSelected = _ref.lastSelected,
       selectorClass = _ref.selectorClass,
       _ref$showCustom = _ref.showCustom,
       showCustom = _ref$showCustom === void 0 ? true : _ref$showCustom,
+      _ref$isShowCustom = _ref.isShowCustom,
+      isShowCustom = _ref$isShowCustom === void 0 ? true : _ref$isShowCustom,
       _ref$showFullCycle = _ref.showFullCycle,
       showFullCycle = _ref$showFullCycle === void 0 ? true : _ref$showFullCycle,
       _ref$showMonth = _ref.showMonth,
@@ -110,6 +113,8 @@ function PeriodSelector(_ref) {
   (0, _react.useEffect)(function () {
     if (selected) {
       setSelectedPeriod(selected);
+    } else if (lastSelected) {
+      setSelectedPeriod(lastSelected);
     }
   }, []);
   (0, _react.useEffect)(function () {
@@ -124,7 +129,7 @@ function PeriodSelector(_ref) {
 
           if (selected) {
             setSelectedPeriod(selected);
-          } else {
+          } else if (lastSelected) {} else {
             setSelectedPeriod((0, _common.getDefalutCycle)(res.Data));
             onChange && onChange((0, _common.getDefalutCycle)(res.Data));
           }
@@ -143,7 +148,7 @@ function PeriodSelector(_ref) {
   var popup = /*#__PURE__*/_react["default"].createElement(_selector["default"], {
     className: selectorClass,
     selected: selectedPeriod,
-    showCustom: isFetch ? cycleSetting.isOpenCustom : showCustom,
+    showCustom: isShowCustom ? isFetch ? cycleSetting.isOpenCustom : showCustom : isShowCustom,
     showFullCycle: showFullCycle,
     showMonth: isFetch ? cycleSetting.isOpenMonth : showMonth,
     showQuarter: isFetch ? cycleSetting.isOpenQuarter : showQuarter,

package/lib/components/picker/components/panels/date-panel/date-body.js

@@ -35,14 +35,13 @@ var DATE_ROW_NUM = 6;
 var DatePanelBody = function DatePanelBody(props) {
   var viewDate = props.viewDate,
       _props$weekStartDay = props.weekStartDay,
-      weekStartDay = _props$weekStartDay === void 0 ? 'SUNDAY' : _props$weekStartDay,
+      weekStartDay = _props$weekStartDay === void 0 ? "SUNDAY" : _props$weekStartDay,
       onSelect = props.onSelect;
 
   var _useContext = (0, _react.useContext)(_context["default"]),
-      format = _useContext.format,
       value = _useContext.value;
 
-  var weekStartDaySun = weekStartDay === 'SUNDAY';
+  var weekStartDaySun = weekStartDay === "SUNDAY";
 
   var getCells = function getCells(sunday, currentMonth) {
     var dates = [];
@@ -50,27 +49,16 @@ var DatePanelBody = function DatePanelBody(props) {
     var _loop = function _loop(day) {
       var _classNames;
 
-      var date = (0, _moment["default"])(sunday).add(day, 'd');
-
-      var _isCurrentDateInRange = (0, _utils.isCurrentDateInRanges)({
-        nowDate: date,
-        values: value
-      }),
-          inRanges = _isCurrentDateInRange.inRanges,
-          rangeStart = _isCurrentDateInRange.rangeStart,
-          rangeEnd = _isCurrentDateInRange.rangeEnd;
-
-      var classes = (0, _classnames["default"])(_utils.PickerCellClass, (_classNames = {}, _defineProperty(_classNames, "".concat(_utils.PickerCellClass, "--today"), date.isSame((0, _moment["default"])(), 'date')), _defineProperty(_classNames, "".concat(_utils.PickerCellClass, "--in-view"), date.format('YYYY/MM') === currentMonth), _defineProperty(_classNames, "".concat(_utils.PickerCellClass, "--in-ranges"), inRanges), _defineProperty(_classNames, "".concat(_utils.PickerCellClass, "--in-ranges--start"), rangeStart), _defineProperty(_classNames, "".concat(_utils.PickerCellClass, "--in-ranges--end"), rangeEnd), _defineProperty(_classNames, "".concat(_utils.PickerCellClass, "--selected"), value === null || value === void 0 ? void 0 : value.some(function (v) {
-        return date.isSame((0, _moment["default"])(v).format('YYYY/MM/DD'), 'date');
-      })), _classNames));
+      var date = (0, _moment["default"])(sunday).add(day, "d");
+      var classes = (0, _classnames["default"])(_utils.PickerCellClass, (_classNames = {}, _defineProperty(_classNames, "".concat(_utils.PickerCellClass, "--tody"), date.isSame((0, _moment["default"])(), "date")), _defineProperty(_classNames, "".concat(_utils.PickerCellClass, "--in-view"), date.format("YYYYMM") === currentMonth), _defineProperty(_classNames, "".concat(_utils.PickerCellClass, "--selected"), date.isSame(value)), _classNames));
       dates.push( /*#__PURE__*/_react["default"].createElement("td", {
         className: classes,
-        key: date.format('YYYY/MM/DD')
+        key: date.format("YYYY/MM/DD")
       }, /*#__PURE__*/_react["default"].createElement("div", {
         className: (0, _classnames["default"])("".concat(_utils.PickerCellClass, "__inner")),
-        title: date.format('YYYY-MM-DD'),
+        title: date.format("YYYY-MM-DD"),
         onClick: function onClick() {
-          return onSelect && onSelect(date, 'date');
+          return onSelect && onSelect(date, "date");
         }
       }, date.date())));
     };
@@ -85,16 +73,16 @@ var DatePanelBody = function DatePanelBody(props) {
   var getRows = function getRows(date) {
     var currentDate = (0, _moment["default"])(date);
     var monthFirstDay = currentDate.date(1);
-    var currentMonth = monthFirstDay.format('YYYY/MM');
+    var currentMonth = monthFirstDay.format("YYYYMM");
     var daysDiff = weekStartDaySun ? 0 : 1;
-    var weekStartDay = monthFirstDay.subtract(monthFirstDay.day() - daysDiff, 'days');
+    var weekStartDay = monthFirstDay.subtract(monthFirstDay.day() - daysDiff, "days");
     var rows = [];
 
     for (var row = 0; row < DATE_ROW_NUM; row += 1) {
       rows.push( /*#__PURE__*/_react["default"].createElement("tr", {
         key: row
       }, getCells(weekStartDay, currentMonth)));
-      weekStartDay = weekStartDay.add(1, 'w');
+      weekStartDay = weekStartDay.add(1, "w");
     }
 
     return rows;
@@ -106,25 +94,25 @@ var DatePanelBody = function DatePanelBody(props) {
     className: (0, _classnames["default"])("".concat(_utils.PickerClass, "-content"))
   }, /*#__PURE__*/_react["default"].createElement("thead", null, /*#__PURE__*/_react["default"].createElement("tr", null, weekStartDaySun && /*#__PURE__*/_react["default"].createElement("th", {
     className: _utils.PickerCellClass
-  }, (0, _getLocale.getLocale)('Mod_Sun')), /*#__PURE__*/_react["default"].createElement("th", {
+  }, (0, _getLocale.getLocale)("Mod_Sun")), /*#__PURE__*/_react["default"].createElement("th", {
     className: _utils.PickerCellClass
-  }, (0, _getLocale.getLocale)('Mod_Mon')), /*#__PURE__*/_react["default"].createElement("th", {
+  }, (0, _getLocale.getLocale)("Mod_Mon")), /*#__PURE__*/_react["default"].createElement("th", {
     className: _utils.PickerCellClass
-  }, (0, _getLocale.getLocale)('Mod_Tues')), /*#__PURE__*/_react["default"].createElement("th", {
+  }, (0, _getLocale.getLocale)("Mod_Tues")), /*#__PURE__*/_react["default"].createElement("th", {
     className: _utils.PickerCellClass
-  }, (0, _getLocale.getLocale)('Mod_Wed')), /*#__PURE__*/_react["default"].createElement("th", {
+  }, (0, _getLocale.getLocale)("Mod_Wed")), /*#__PURE__*/_react["default"].createElement("th", {
     className: _utils.PickerCellClass
-  }, (0, _getLocale.getLocale)('Mod_Thur')), /*#__PURE__*/_react["default"].createElement("th", {
+  }, (0, _getLocale.getLocale)("Mod_Thur")), /*#__PURE__*/_react["default"].createElement("th", {
     className: _utils.PickerCellClass
-  }, (0, _getLocale.getLocale)('Mod_Fri')), /*#__PURE__*/_react["default"].createElement("th", {
+  }, (0, _getLocale.getLocale)("Mod_Fri")), /*#__PURE__*/_react["default"].createElement("th", {
     className: _utils.PickerCellClass
-  }, (0, _getLocale.getLocale)('Mod_Sat')), weekStartDay !== 'SUNDAY' && /*#__PURE__*/_react["default"].createElement("th", {
+  }, (0, _getLocale.getLocale)("Mod_Sat")), weekStartDay !== "SUNDAY" && /*#__PURE__*/_react["default"].createElement("th", {
     className: _utils.PickerCellClass
-  }, (0, _getLocale.getLocale)('Mod_Sun')))), /*#__PURE__*/_react["default"].createElement("tbody", null, getRows((0, _moment["default"])(viewDate)))));
+  }, (0, _getLocale.getLocale)("Mod_Sun")))), /*#__PURE__*/_react["default"].createElement("tbody", null, getRows((0, _moment["default"])(viewDate)))));
 };
 
 DatePanelBody.defaultProps = {
-  weekStartDay: 'SUNDAY'
+  weekStartDay: "SUNDAY"
 };
 var _default = DatePanelBody;
 exports["default"] = _default;

package/lib/components/picker/components/panels/date-panel/date-head.js

@@ -25,8 +25,8 @@ function DatePanelHead(props) {
       onPrev = props.onPrev,
       onNext = props.onNext,
       onPanelChange = props.onPanelChange;
-  var yearText = (0, _moment["default"])(viewDate).format('YYYY');
-  var monthText = (0, _moment["default"])(viewDate).format('MM');
+  var yearText = (0, _moment["default"])(viewDate).format("YYYY");
+  var monthText = (0, _moment["default"])(viewDate).format("MM");
   return /*#__PURE__*/_react["default"].createElement("div", {
     className: (0, _classnames["default"])(_utils.PickerHeadClass)
   }, !_getLocale.isEn && /*#__PURE__*/_react["default"].createElement("div", {
@@ -34,7 +34,7 @@ function DatePanelHead(props) {
   }, /*#__PURE__*/_react["default"].createElement("button", {
     className: (0, _classnames["default"])("".concat(_utils.PickerHeadClass, "-btn__year")),
     onClick: function onClick() {
-      return onPanelChange && onPanelChange(viewDate, 'year');
+      return onPanelChange && onPanelChange(viewDate, "year");
     },
     type: "button"
   }, yearText), /*#__PURE__*/_react["default"].createElement("span", {
@@ -42,7 +42,7 @@ function DatePanelHead(props) {
   }, "\xA0\u5E74"), /*#__PURE__*/_react["default"].createElement("button", {
     className: (0, _classnames["default"])("".concat(_utils.PickerHeadClass, "-btn__month")),
     onClick: function onClick() {
-      return onPanelChange && onPanelChange(viewDate, 'month');
+      return onPanelChange && onPanelChange(viewDate, "month");
     },
     type: "button"
   }, monthText), /*#__PURE__*/_react["default"].createElement("span", {
@@ -52,7 +52,7 @@ function DatePanelHead(props) {
   }, /*#__PURE__*/_react["default"].createElement("button", {
     className: (0, _classnames["default"])("".concat(_utils.PickerHeadClass, "-btn__month")),
     onClick: function onClick() {
-      return onPanelChange && onPanelChange(viewDate, 'month');
+      return onPanelChange && onPanelChange(viewDate, "month");
     },
     style: {
       marginRight: 4
@@ -61,7 +61,7 @@ function DatePanelHead(props) {
   }, _utils.MONTHDATAMAPEN[Number(monthText) - 1]), /*#__PURE__*/_react["default"].createElement("button", {
     className: (0, _classnames["default"])("".concat(_utils.PickerHeadClass, "-btn__year")),
     onClick: function onClick() {
-      return onPanelChange && onPanelChange(viewDate, 'year');
+      return onPanelChange && onPanelChange(viewDate, "year");
     },
     type: "button"
   }, yearText)), /*#__PURE__*/_react["default"].createElement("div", {
@@ -70,14 +70,14 @@ function DatePanelHead(props) {
   /*#__PURE__*/
   // eslint-disable-next-line jsx-a11y/control-has-associated-label
   _react["default"].createElement("button", {
-    className: (0, _classnames["default"])("".concat(_utils.PickerHeadClass, "-btn__prev"), 'tu-icon-arrow-up1'),
+    className: (0, _classnames["default"])("".concat(_utils.PickerHeadClass, "-btn__prev"), "tu-icon-arrow-up1"),
     onClick: onPrev,
     type: "button"
   }),
   /*#__PURE__*/
   // eslint-disable-next-line jsx-a11y/control-has-associated-label
   _react["default"].createElement("button", {
-    className: (0, _classnames["default"])("".concat(_utils.PickerHeadClass, "-btn__next"), 'tu-icon-arrow-down1'),
+    className: (0, _classnames["default"])("".concat(_utils.PickerHeadClass, "-btn__next"), "tu-icon-arrow-down1"),
     onClick: onNext,
     type: "button"
   })));

package/lib/components/picker/components/panels/date-panel/index.js

@@ -29,7 +29,7 @@ var DatePanel = function DatePanel(props) {
 
   var onMonthChange = function onMonthChange(diff) {
     if (onViewDateChange) {
-      onViewDateChange((0, _moment["default"])(viewDate).add(diff, 'M'));
+      onViewDateChange((0, _moment["default"])(viewDate).add(diff, "M"));
     }
   };
 

package/lib/components/picker/components/panels/month-panel/index.css

@@ -25,8 +25,3 @@
   background-color: #2879ff;
   color: #ffffff;
 }
-
-.tita-ui__picker-panel__month .tita-ui__picker-cell--selected:hover .tita-ui__picker-cell__inner {
-  background-color: #5c8eff;
-  color: #ffffff;
-}

package/lib/components/picker/components/panels/month-panel/index.js

@@ -1,13 +1,11 @@
 "use strict";
 
-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); }
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports["default"] = void 0;
 
-var _react = _interopRequireWildcard(require("react"));
+var _react = _interopRequireDefault(require("react"));
 
 var _classnames = _interopRequireDefault(require("classnames"));
 
@@ -25,24 +23,8 @@ var _excluded = ["viewDate", "onPanelChange", "onViewDateChange"];
 
 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); }
 
-function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
-
-function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
-
-function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
-
-function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
-
-function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
-
-function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
-
 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; }
@@ -53,28 +35,16 @@ var MonthPanel = function MonthPanel(props) {
       onViewDateChange = props.onViewDateChange,
       restProps = _objectWithoutProperties(props, _excluded);
 
-  var _useState = (0, _react.useState)(viewDate),
-      _useState2 = _slicedToArray(_useState, 2),
-      newViewDate = _useState2[0],
-      setNewViewDate = _useState2[1];
-
   var onYearChange = function onYearChange(diff) {
     if (onViewDateChange) {
-      onViewDateChange((0, _moment["default"])(newViewDate[0]).add(diff, 'y'));
+      onViewDateChange((0, _moment["default"])(viewDate).add(diff, "y"));
     }
   };
 
-  (0, _react.useEffect)(function () {
-    if (typeof viewDate === 'string') {
-      setNewViewDate(viewDate.split('~')[0]);
-    } else {
-      setNewViewDate(viewDate);
-    }
-  }, []);
   return /*#__PURE__*/_react["default"].createElement("div", {
     className: (0, _classnames["default"])("".concat(_utils.PickerPanelClass, "__month"))
   }, /*#__PURE__*/_react["default"].createElement(_monthHead["default"], _extends({}, restProps, {
-    viewDate: newViewDate,
+    viewDate: viewDate,
     onPrevYear: function onPrevYear() {
       onYearChange(-1);
     },
@@ -82,7 +52,7 @@ var MonthPanel = function MonthPanel(props) {
       onYearChange(1);
     },
     onYearClick: function onYearClick() {
-      onPanelChange === null || onPanelChange === void 0 ? void 0 : onPanelChange(newViewDate, 'year');
+      onPanelChange === null || onPanelChange === void 0 ? void 0 : onPanelChange(viewDate, "year");
     }
   })), /*#__PURE__*/_react["default"].createElement(_monthBody["default"], _extends({
     viewDate: viewDate

package/lib/components/picker/components/panels/month-panel/month-body.js

@@ -35,7 +35,8 @@ var MonthPanelBody = function MonthPanelBody(props) {
       onSelect = props.onSelect;
 
   var _useContext = (0, _react.useContext)(_context["default"]),
-      value = _useContext.value;
+      value = _useContext.value,
+      mode = _useContext.mode;
 
   var getCells = function getCells(baseMonth) {
     var cols = [];
@@ -45,14 +46,14 @@ var MonthPanelBody = function MonthPanelBody(props) {
 
       var month = col + baseMonth;
       cols.push( /*#__PURE__*/_react["default"].createElement("td", {
-        className: (0, _classnames["default"])(_utils.PickerCellClass, "".concat(_utils.PickerCellClass, "--in-view"), (_classNames = {}, _defineProperty(_classNames, "".concat(_utils.PickerCellClass, "--this-month"), month === (0, _moment["default"])().month()), _defineProperty(_classNames, "".concat(_utils.PickerCellClass, "--selected"), month === (0, _moment["default"])(viewDate).month()), _classNames)),
+        className: (0, _classnames["default"])(_utils.PickerCellClass, "".concat(_utils.PickerCellClass, "--in-view"), (_classNames = {}, _defineProperty(_classNames, "".concat(_utils.PickerCellClass, "--this-month"), month === (0, _moment["default"])().month()), _defineProperty(_classNames, "".concat(_utils.PickerCellClass, "--selected"), month === (0, _moment["default"])(value).month() && mode === "month"), _classNames)),
         key: month
       }, /*#__PURE__*/_react["default"].createElement("div", {
         onClick: function onClick() {
-          return onSelect && onSelect((0, _moment["default"])(viewDate).month(month), 'month');
+          return onSelect && onSelect((0, _moment["default"])(viewDate).month(month), "month");
         },
         className: (0, _classnames["default"])("".concat(_utils.PickerCellClass, "__inner")),
-        title: (0, _moment["default"])(viewDate).month(month).format('YYYY-MM')
+        title: (0, _moment["default"])(viewDate).month(month).format("YYYY-MM")
       }, _getLocale.isEn ? _utils.MONTHDATAMAPEN[month] : _utils.MONTHDATAMAP[month])));
     };
 

package/lib/components/picker/components/panels/month-panel/month-head.js

@@ -40,7 +40,7 @@ var MonthPanelHead = function MonthPanelHead(props) {
     className: (0, _classnames["default"])("".concat(_utils.PickerHeadClass, "-btn__year")),
     onClick: onYearClick,
     type: "button"
-  }, (0, _moment["default"])(viewDate).year()));
+  }, viewDate.year()));
 };
 
 var _default = MonthPanelHead;

package/lib/components/picker/components/panels/year-panel/index.css

@@ -21,8 +21,3 @@
   background-color: #2879ff;
   color: #ffffff;
 }
-
-.tita-ui__picker-panel__year .tita-ui__picker-cell--selected:hover .tita-ui__picker-cell__inner {
-  background-color: #5c8eff;
-  color: #ffffff;
-}