@titaui/pc 1.11.36 → 1.11.39-beta.1

package/lib/components/drawer/headerDrop.js

@@ -9,6 +9,8 @@ exports["default"] = void 0;
 
 var _react = _interopRequireWildcard(require("react"));
 
+var _helper = require("../okr-detail/helper");
+
 var _popup = _interopRequireDefault(require("../popup"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
@@ -44,7 +46,9 @@ var HeaderDropItem = function HeaderDropItem(_ref) {
       colorInDrop = _ref.colorInDrop,
       hoverColorInDrop = _ref.hoverColorInDrop,
       _onClick = _ref.onClick,
-      onClose = _ref.onClose;
+      onClose = _ref.onClose,
+      approvalSetting = _ref.approvalSetting,
+      detailInfo = _ref.detailInfo;
 
   var _useState = (0, _react.useState)(false),
       _useState2 = _slicedToArray(_useState, 2),
@@ -52,7 +56,37 @@ var HeaderDropItem = function HeaderDropItem(_ref) {
       setHover = _useState2[1];
 
   var hasIcon = !!icon && typeof icon === "string";
-  return /*#__PURE__*/_react["default"].createElement("div", {
+  var applyState = detailInfo === null || detailInfo === void 0 ? void 0 : detailInfo.applyState;
+  var OkrAndKrApprovalTypes = detailInfo === null || detailInfo === void 0 ? void 0 : detailInfo.OkrAndKrApprovalTypes;
+  return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, icon === 'tu-icon-del' ? /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, (0, _helper.getApprovalOkr)(approvalSetting, 'deleteOkr', applyState, OkrAndKrApprovalTypes) ? /*#__PURE__*/_react["default"].createElement("div", {
+    className: "header-drop-item",
+    style: {
+      color: hover ? hoverColorInDrop || hoverColor : colorInDrop || color
+    },
+    onClick: function onClick(e) {
+      _onClick && _onClick(e);
+      onClose(false);
+    },
+    onMouseOver: function onMouseOver() {
+      return setHover(true);
+    },
+    onMouseOut: function onMouseOut() {
+      return setHover(false);
+    }
+  }, hasIcon && /*#__PURE__*/_react["default"].createElement("div", {
+    className: "header-drop-item-icon",
+    style: {
+      color: hover ? hoverIconColorInDrop || hoverColorInDrop || hoverColor : iconColorInDrop || colorInDrop || color
+    }
+  }, typeof icon === "string" ? /*#__PURE__*/_react["default"].createElement("span", {
+    className: icon
+  }) : icon), title) : /*#__PURE__*/_react["default"].createElement("div", {
+    className: "header-drop-item-approval"
+  }, hasIcon && /*#__PURE__*/_react["default"].createElement("div", {
+    className: "header-drop-item-icon"
+  }, typeof icon === "string" ? /*#__PURE__*/_react["default"].createElement("span", {
+    className: icon
+  }) : icon), title)) : /*#__PURE__*/_react["default"].createElement("div", {
     className: "header-drop-item",
     style: {
       color: hover ? hoverColorInDrop || hoverColor : colorInDrop || color
@@ -74,19 +108,23 @@ var HeaderDropItem = function HeaderDropItem(_ref) {
     }
   }, typeof icon === "string" ? /*#__PURE__*/_react["default"].createElement("span", {
     className: icon
-  }) : icon), title);
+  }) : icon), title));
 };
 
 var HeaderDrop = function HeaderDrop(_ref2) {
   var visible = _ref2.visible,
       onVisibleChange = _ref2.onVisibleChange,
       items = _ref2.items,
-      children = _ref2.children;
+      children = _ref2.children,
+      approvalSetting = _ref2.approvalSetting,
+      detailInfo = _ref2.detailInfo;
   var renderDrop = (0, _react.useMemo)(function () {
     return /*#__PURE__*/_react["default"].createElement("div", {
       className: "titaui-drawer-header-action-drop-wrapper"
     }, items.map(function (item) {
       return /*#__PURE__*/_react["default"].createElement(HeaderDropItem, _extends({}, item, {
+        detailInfo: detailInfo,
+        approvalSetting: approvalSetting,
         onClose: function onClose() {
           return onVisibleChange(false);
         }

package/lib/components/drawer/index.css

@@ -164,6 +164,39 @@
   background-repeat: no-repeat;
 }
 
+.titaui-drawer-header-action-drop-wrapper .header-drop-item-approval {
+  height: 32px;
+  display: flex;
+  align-items: center;
+  padding: 0 23px;
+  cursor: pointer;
+  color: #BFC7D5;
+}
+
+.titaui-drawer-header-action-drop-wrapper .header-drop-item-approval-icon {
+  font-size: 18px;
+  color: inherit;
+  width: 18px;
+  height: 18px;
+  cursor: pointer;
+  margin-right: 10px;
+  background-size: contain;
+  background-position: center center;
+  background-repeat: no-repeat;
+}
+
+.titaui-drawer-header-action-drop-wrapper .header-drop-item-approval-icon > span {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  color: inherit;
+  width: 18px;
+  height: 18px;
+  background-size: contain;
+  background-position: center center;
+  background-repeat: no-repeat;
+}
+
 .drawer-left .drawer-content-wrapper,
 .drawer-right .drawer-content-wrapper,
 .drawer-left .drawer-content,

package/lib/components/drawer/index.js

@@ -25,7 +25,9 @@ require("./index.css");
 
 var _context = _interopRequireDefault(require("../drawer-manager/context"));
 
-var _excluded = ["visible", "placement", "children", "mask", "width", "className", "contentWrapperStyle", "onClose", "style", "afterVisibleChange", "destroyOnClose", "bodyStyle", "zIndex"];
+var _dom = require("./utils/dom");
+
+var _excluded = ["visible", "placement", "children", "mask", "width", "className", "contentWrapperStyle", "onClose", "style", "afterVisibleChange", "destroyOnClose", "bodyStyle", "zIndex", "autoClosable"];
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
@@ -70,6 +72,8 @@ var Drawer = function Drawer(props) {
       bodyStyle = props.bodyStyle,
       _props$zIndex = props.zIndex,
       zIndex = _props$zIndex === void 0 ? 1200 : _props$zIndex,
+      _props$autoClosable = props.autoClosable,
+      autoClosable = _props$autoClosable === void 0 ? false : _props$autoClosable,
       rest = _objectWithoutProperties(props, _excluded);
 
   var handleAfterVisibleChange = (0, _react.useCallback)(function (opened) {
@@ -89,6 +93,20 @@ var Drawer = function Drawer(props) {
     return children;
   }
 
+  var autoClose = function autoClose(e) {
+    if ((0, _dom.hasAncestorElement)(e.target, 'document-mouse-event-ignore,rc-tooltip,titaui-popup,rc-dialog-root,common-modal,in-modal,task-hot-add')) return;
+    onClose();
+  };
+
+  (0, _react.useEffect)(function () {
+    if (autoClosable) {
+      document.addEventListener('mousedown', autoClose);
+    }
+
+    return function () {
+      document.removeEventListener('mousedown', autoClose);
+    };
+  }, []);
   return /*#__PURE__*/_react["default"].createElement(DrawerContext.Provider, {
     value: {
       close: function close() {
@@ -123,7 +141,10 @@ function DrawerHeader(_ref) {
       content = _ref.content,
       style = _ref.style,
       onClose = _ref.onClose,
-      actionComponent = _ref.actionComponent;
+      actionComponent = _ref.actionComponent,
+      onlyShowContent = _ref.onlyShowContent,
+      approvalSetting = _ref.approvalSetting,
+      detailInfo = _ref.detailInfo;
   var drawer = (0, _react.useContext)(DrawerContext);
   var manager = (0, _react.useContext)(_context["default"]);
   var showClose = closable && (!!onClose || !!drawer);
@@ -152,9 +173,11 @@ function DrawerHeader(_ref) {
     style: {
       flex: 1
     }
-  }), /*#__PURE__*/_react["default"].createElement("div", null, actionComponent), displayActions.map(function (action) {
+  }), /*#__PURE__*/_react["default"].createElement("div", null, onlyShowContent), /*#__PURE__*/_react["default"].createElement("div", null, actionComponent), displayActions.map(function (action) {
     return /*#__PURE__*/_react["default"].createElement(_headerAction["default"], action);
   }), !!collapsedActions.length && /*#__PURE__*/_react["default"].createElement(_headerAction["default"], {
+    approvalSetting: approvalSetting,
+    detailInfo: detailInfo,
     title: (0, _getLocale.getLocale)('Mod_MoreOperate'),
     icon: "tu-icon-10",
     children: collapsedActions

package/lib/components/dynamic/new-ui.css

@@ -129,7 +129,7 @@
 }
 
 .titaui-new-ui-dynamic__no-more-data::before {
-  content: "";
+  content: '';
   display: inline-block;
   margin-right: 12px;
   width: 192px;
@@ -139,7 +139,7 @@
 }
 
 .titaui-new-ui-dynamic__no-more-data::after {
-  content: "";
+  content: '';
   display: inline-block;
   margin-left: 12px;
   width: 192px;
@@ -150,8 +150,8 @@
 
 .titaui-new-ui-dynamic__go-to-top {
   position: fixed;
-  bottom: 128px;
-  right: 24px;
+  bottom: 20px;
+  right: 86px;
   display: flex;
   align-items: center;
   justify-content: center;

package/lib/components/nav-top/components/menu/img/new.svg

@@ -0,0 +1,30 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="36px" height="26px" viewBox="0 0 36 26" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <title>气泡</title>
+    <defs>
+        <path d="M26.0757238,0 C26.0757238,0 26.5924276,0.590963041 26.752784,2.04150869 C26.8839846,3.22831876 26.7408566,3.5759702 26.6844729,3.66315551 L26.6693863,3.6833642 L26.6693863,3.6833642 C26.6636971,3.68904201 27.2516704,3.6353181 27.3942094,3.25925071 C27.5358931,2.88547554 28.1011492,5.62102555 27.2497105,6.55512322 C27.2725189,6.60410922 27.2788178,6.63812034 27.2701648,6.65847289 C27.7385548,7.67365164 28,8.80629392 28,10 C28,14.418278 24.418278,18 20,18 L8,18 C3.581722,18 5.41083001e-16,14.418278 0,10 C-5.41083001e-16,5.581722 3.581722,2 8,2 L20,2 C20.4454205,2 20.8823388,2.03640207 21.3079422,2.10639354 C21.2551772,2.04616026 21.2417596,2.01501277 21.2749755,2.02035937 C21.4000713,1.99627315 21.6377016,1.90182651 22.0846325,1.61171738 C22.9398664,1.05657029 23.1002227,0.823766663 23.1002227,0.823766663 C23.1002227,0.823766663 23.2249443,1.19983405 23.1714922,1.53113152 C23.1180401,1.86242898 23.064588,2.05941666 23.064588,2.05941666 C23.064588,2.05941666 24.2583519,1.98778477 24.9888641,1.27146594 C25.7193764,0.555147099 26.0757238,0 26.0757238,0 Z" id="path-1"></path>
+        <filter x="-25.0%" y="-27.8%" width="150.0%" height="177.8%" filterUnits="objectBoundingBox" id="filter-2">
+            <feOffset dx="0" dy="2" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
+            <feGaussianBlur stdDeviation="2" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
+            <feColorMatrix values="0 0 0 0 0.941176471   0 0 0 0 0.368627451   0 0 0 0 0.368627451  0 0 0 0.4 0" type="matrix" in="shadowBlurOuter1"></feColorMatrix>
+        </filter>
+    </defs>
+    <g id="控件" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="top-面谈" transform="translate(-797.000000, -7.000000)">
+            <g id="一级菜单" transform="translate(204.000000, 3.000000)">
+                <g id="气泡" transform="translate(597.000000, 6.000000)">
+                    <text id="new" font-family="Arial-BoldMT, Arial" font-size="12" font-weight="bold" line-spacing="18" fill="#FFFFFF">
+                        <tspan x="1" y="11">new</tspan>
+                    </text>
+                    <g id="hot" fill-rule="nonzero">
+                        <g id="形状">
+                            <use fill="black" fill-opacity="1" filter="url(#filter-2)" xlink:href="#path-1"></use>
+                            <use fill="#F05E5E" xlink:href="#path-1"></use>
+                        </g>
+                        <path d="M4.61115455,12.8702703 L4.61115455,10.2702703 C4.61115455,9.62882883 4.65224568,9.18918919 4.73442794,8.95135135 C4.8166102,8.71351351 4.96855182,8.52252252 5.1902528,8.37837838 C5.41195378,8.23423423 5.662323,8.16216216 5.94136044,8.16216216 C6.15923899,8.16216216 6.34558249,8.21261261 6.50039093,8.31351351 C6.65519937,8.41441441 6.76700547,8.55585586 6.83580923,8.73783784 C6.90461298,8.91981982 6.93901486,9.32072072 6.93901486,9.94054054 L6.93901486,9.94054054 L6.93901486,12.8702703 L8.5501694,12.8702703 L8.5501694,9.3027027 C8.5501694,8.85945946 8.52054557,8.51891892 8.46129789,8.28108108 C8.40205021,8.04324324 8.29693337,7.83063063 8.14594735,7.64324324 C7.99496134,7.45585586 7.77230475,7.3018018 7.47797759,7.18108108 C7.18365042,7.06036036 6.85874381,7 6.50325775,7 C5.69672487,7 5.0277995,7.32432432 4.49648163,7.97297297 L4.49648163,7.97297297 L4.49648163,7.12972973 L3,7.12972973 L3,12.8702703 L4.61115455,12.8702703 Z M12.6669273,13 C13.3358527,13 13.8929719,12.854955 14.3382851,12.5648649 C14.7835983,12.2747748 15.1094605,11.8522523 15.3158718,11.2972973 L15.3158718,11.2972973 L13.7104509,11.0432432 C13.622535,11.3315315 13.4925723,11.5405405 13.3205629,11.6702703 C13.1485536,11.8 12.9364087,11.8648649 12.6841282,11.8648649 C12.3133524,11.8648649 12.0037356,11.7396396 11.7552776,11.4891892 C11.5068196,11.2387387 11.3768569,10.8882883 11.3653896,10.4378378 L11.3653896,10.4378378 L15.4018765,10.4378378 C15.4248111,9.27387387 15.1744418,8.40990991 14.6507688,7.84594595 C14.1270958,7.28198198 13.4123013,7 12.5063852,7 C11.6998523,7 11.0328382,7.26936937 10.5053427,7.80810811 C9.97784728,8.34684685 9.71409956,9.09189189 9.71409956,10.0432432 C9.71409956,10.8396396 9.91477717,11.4990991 10.3161324,12.0216216 C10.8245157,12.6738739 11.608114,13 12.6669273,13 Z M13.8021892,9.50810811 L11.3940579,9.50810811 C11.3902354,9.09369369 11.5029971,8.76576577 11.732343,8.52432432 C11.9616888,8.28288288 12.2521936,8.16216216 12.6038572,8.16216216 C12.9325862,8.16216216 13.2116237,8.27657658 13.4409695,8.50540541 C13.6703154,8.73423423 13.7907219,9.06846847 13.8021892,9.50810811 L13.8021892,9.50810811 Z M19.4154287,12.8702703 L20.447485,9.17837838 L21.4967422,12.8702703 L23.0448267,12.8702703 L25,7.12972973 L23.41178,7.12972973 L22.2478499,10.8918919 L21.2329945,7.12972973 L19.6791764,7.12972973 L18.6299192,10.8918919 L17.4889236,7.12972973 L15.9236383,7.12972973 L17.8501433,12.8702703 L19.4154287,12.8702703 Z" id="new" fill="#FFFFFF"></path>
+                    </g>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>

package/lib/components/nav-top/components/menu/index.css

@@ -117,6 +117,97 @@
   position: relative;
 }
 
+.titaui-nav-top-menu__tips {
+  position: relative;
+}
+
+.titaui-nav-top-menu__tips-new {
+  width: 36px;
+  height: 26px;
+  position: absolute;
+  top: 4px;
+  right: -12px;
+}
+
+.titaui-nav-top-menu__tips-box {
+  width: 308px;
+  height: 142px;
+  box-sizing: border-box;
+  padding: 16px;
+  background: #5c8eff;
+  box-shadow: 0px 8px 24px 0px rgba(127, 145, 180, 0.3);
+  border: 1px solid #eff0f1;
+  border-radius: 12px;
+  z-index: 99;
+}
+
+.titaui-nav-top-menu__tips-box-head {
+  padding-left: 24px;
+  background-image: url("./img/wecome-temp.png");
+  background-position: 0 0;
+  background-repeat: no-repeat;
+  background-size: 20px 20px;
+}
+
+.titaui-nav-top-menu__tips-box-title {
+  display: block;
+  font-size: 14px;
+  color: #ffffff;
+  line-height: 22px;
+  font-weight: 600;
+}
+
+.titaui-nav-top-menu__tips-box-content {
+  font-size: 12px;
+  color: #ffffff;
+  line-height: 20px;
+  margin-top: 10px;
+}
+
+.titaui-nav-top-menu__tips-box-ok {
+  height: 28px;
+  margin-top: 8px;
+  margin-left: 210px;
+  background: #ffffff;
+  box-shadow: 0px -4px 12px 0px rgba(127, 145, 180, 0.2);
+  border-radius: 14px;
+  box-sizing: border-box;
+  padding: 3px 17px;
+  font-size: 14px;
+  color: #2879ff;
+  line-height: 22px;
+  cursor: pointer;
+}
+
+.titaui-nav-top-menu__tips-triangle {
+  position: absolute;
+  top: -4px;
+  left: 50%;
+  margin-left: -4px;
+  width: 0;
+  height: 0;
+  border-left: 5px solid transparent;
+  border-right: 5px solid transparent;
+  border-bottom: 5px solid #fff;
+}
+
+.titaui-nav-top-menu__tips-triangle::after {
+  content: '';
+  width: 0;
+  height: 0;
+  position: absolute;
+  left: -4px;
+  top: 2px;
+  border-left: solid 4px transparent;
+  border-right: solid 4px transparent;
+  border-bottom: solid 4px #5c8eff;
+  z-index: 99;
+}
+
+.titaui-nav-top-menu__tips-hide {
+  display: none;
+}
+
 .titaui-nav-top-menu .rc-overflow-item {
   position: relative;
 }

package/lib/components/nav-top/components/menu/index.js

@@ -21,6 +21,8 @@ var _conditionRender = _interopRequireDefault(require("../../../../components/co
 
 var _useGlobalValue3 = _interopRequireDefault(require("../../useGlobalValue"));
 
+var _new = _interopRequireDefault(require("./img/new.svg"));
+
 require("./index.css");
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
@@ -52,6 +54,15 @@ var popupAlign = {
   },
   targetOffset: [0, 0]
 };
+var NewFeatureGuidePopupAlign = {
+  offset: [104, -5],
+  overflow: {
+    adjustX: true,
+    adjustY: true
+  },
+  targetOffset: [0, 0]
+};
+var NEWMENUS = '#/interview';
 
 var Menu = function Menu(_ref) {
   var menus = _ref.menus,
@@ -59,8 +70,13 @@ var Menu = function Menu(_ref) {
 
   var _useState = (0, _react.useState)(false),
       _useState2 = _slicedToArray(_useState, 2),
-      popupVisible = _useState2[0],
-      setPopupVisible = _useState2[1];
+      isKnow = _useState2[0],
+      setIsKonw = _useState2[1];
+
+  var _useState3 = (0, _react.useState)(false),
+      _useState4 = _slicedToArray(_useState3, 2),
+      popupVisible = _useState4[0],
+      setPopupVisible = _useState4[1];
 
   var _useGlobalValue = (0, _useGlobalValue3["default"])(),
       _useGlobalValue2 = _slicedToArray(_useGlobalValue, 1),
@@ -84,33 +100,66 @@ var Menu = function Menu(_ref) {
     }
   };
 
-  var handleClickToLearning = function handleClickToLearning() {
-    window.open("".concat(apiPath, "/").concat(userId, "/eLearningHome#/"), '_self');
+  var handleClick = function handleClick() {
+    setIsKonw(true);
+    localStorage.setItem("isNewMenuItem__".concat(userId), "".concat(userId));
   };
 
+  (0, _react.useEffect)(function () {
+    var isKnow = localStorage.getItem("isNewMenuItem__".concat(userId));
+
+    if (isKnow) {
+      setIsKonw(true);
+    }
+  }, []);
+
+  var popup = /*#__PURE__*/_react["default"].createElement("div", {
+    className: "".concat(prefix, "__tips")
+  }, /*#__PURE__*/_react["default"].createElement("div", {
+    className: (0, _classnames["default"])("".concat(prefix, "__tips-box"), _defineProperty({}, "".concat(prefix, "__tips-hide"), isKnow))
+  }, /*#__PURE__*/_react["default"].createElement("div", {
+    className: "".concat(prefix, "__tips-box-head")
+  }, /*#__PURE__*/_react["default"].createElement("h2", {
+    className: "".concat(prefix, "__tips-box-title")
+  }, "1 : 1 \u9762\u8C08\uFF08\u4E00\u5BF9\u4E00\u9762\u8C08\uFF09\u4E0A\u7EBF\u5566\uFF01"), /*#__PURE__*/_react["default"].createElement("p", {
+    className: "".concat(prefix, "__tips-box-content")
+  }, "\u52A9\u529B\u7ECF\u7406\u548C\u4E0B\u7EA7\u8FDB\u884C\u6301\u7EED\u6C9F\u901A\uFF0C\u4E3A\u4E0D\u540C\u573A\u666F\u63D0\u4F9B\u4E30\u5BCC\u7684\u6C9F\u901A\u6A21\u677F\uFF0C\u5373\u523B\u4E86\u89E3\uFF0CGo~")), /*#__PURE__*/_react["default"].createElement("div", {
+    className: "".concat(prefix, "__tips-box-ok"),
+    onClick: handleClick
+  }, "\u597D\u54D2")), /*#__PURE__*/_react["default"].createElement("div", {
+    className: (0, _classnames["default"])("".concat(prefix, "__tips-triangle"), _defineProperty({}, "".concat(prefix, "__tips-hide"), isKnow))
+  }));
+
   var renderRawItem = function renderRawItem(menu) {
+    var href = menu.href;
+
+    if (menu.title === 'Learning') {
+      href = "".concat(apiPath, "/").concat(userId, "/eLearningHome#/");
+    }
+
     return /*#__PURE__*/_react["default"].createElement(_rcOverflow["default"].Item, {
       component: "span"
     }, /*#__PURE__*/_react["default"].createElement(_conditionRender["default"], {
-      condition: menu.title !== 'Learning'
+      condition: menu.id
+    }, /*#__PURE__*/_react["default"].createElement(_popup["default"], {
+      popupVisible: !isKnow,
+      popup: menu.href === NEWMENUS ? popup : null,
+      mask: false,
+      action: ['focus'],
+      popupAlign: NewFeatureGuidePopupAlign
     }, /*#__PURE__*/_react["default"].createElement("a", {
       className: (0, _classnames["default"])("".concat(prefix, "__menu-show"), _defineProperty({}, "".concat(prefix, "__menu-show--active"), activeMenuId === menu.id)),
-      href: "".concat(menu.href),
+      href: href,
       target: "_self",
       onClick: function onClick() {
         return handleTracker(menu);
       }
     }, menu.title, menu.href === '#dynamic' && feedNum > 0 && /*#__PURE__*/_react["default"].createElement("div", {
       className: (0, _classnames["default"])("".concat(prefix, "__menu--hasNum"), _defineProperty({}, "".concat(prefix, "__menu--hasNum-active"), activeMenuId === menu.id && menu.href === '#dynamic'))
-    }, feedNum > 100 ? '99+' : feedNum))), /*#__PURE__*/_react["default"].createElement(_conditionRender["default"], {
-      condition: menu.title === 'Learning'
-    }, /*#__PURE__*/_react["default"].createElement("span", {
-      className: (0, _classnames["default"])("".concat(prefix, "__menu-show"), _defineProperty({}, "".concat(prefix, "__menu-show--active"), activeMenuId === menu.id)),
-      onClick: function onClick() {
-        handleTracker(menu);
-        handleClickToLearning();
-      }
-    }, menu.title)));
+    }, feedNum > 100 ? '99+' : feedNum), menu.href === NEWMENUS && /*#__PURE__*/_react["default"].createElement("img", {
+      src: _new["default"],
+      className: "".concat(prefix, "__tips-new")
+    })))));
   };
 
   var renderRest = function renderRest(items) {
@@ -122,18 +171,17 @@ var Menu = function Menu(_ref) {
     var popContent = /*#__PURE__*/_react["default"].createElement("div", {
       className: "".concat(prefix, "__hide-menus")
     }, items.map(function (menu) {
+      var href = menu.href;
+
+      if (menu.title === 'Learning') {
+        href = "".concat(apiPath, "/").concat(userId, "/eLearningHome#/");
+      }
+
       return /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_conditionRender["default"], {
-        condition: menu.title !== 'Learning'
-      }, /*#__PURE__*/_react["default"].createElement("a", {
-        className: (0, _classnames["default"])("".concat(prefix, "__menu-hide"), _defineProperty({}, "".concat(prefix, "__menu-hide--active"), activeMenuId === menu.id)),
-        href: "".concat(menu.href),
-        key: menu.id,
-        target: "_self"
-      }, menu.title)), /*#__PURE__*/_react["default"].createElement(_conditionRender["default"], {
-        condition: menu.title === 'Learning'
+        condition: menu.id
       }, /*#__PURE__*/_react["default"].createElement("a", {
         className: (0, _classnames["default"])("".concat(prefix, "__menu-hide"), _defineProperty({}, "".concat(prefix, "__menu-hide--active"), activeMenuId === menu.id)),
-        href: "".concat(apiPath, "/").concat(userId, "/eLearningHome#/"),
+        href: href,
         key: menu.id,
         target: "_self"
       }, menu.title)));

package/lib/components/nav-top/index.js

@@ -15,6 +15,8 @@ var _bsGlobal = require("../../utils/bs-global");
 
 var _userOwnMenu = _interopRequireDefault(require("./components/user-own-menu"));
 
+var _useGlobalValue = _interopRequireDefault(require("./useGlobalValue"));
+
 var _menu = _interopRequireDefault(require("./components/menu"));
 
 var _userMessage = _interopRequireDefault(require("./components/user-message"));
@@ -170,5 +172,7 @@ var NavTop = function NavTop() {
   }, /*#__PURE__*/_react["default"].createElement(_userOwnMenu["default"], null)));
 };
 
-var _default = NavTop;
-exports["default"] = _default;
+var _default = NavTop; // @ts-ignore
+
+exports["default"] = _default;
+NavTop.useGlobalValue = _useGlobalValue["default"];

package/lib/components/okr-detail/base-info/other-infos/date-cycle/index.js

@@ -13,6 +13,10 @@ var _okrPeriodSelector = _interopRequireDefault(require("../../../../okr-period-
 
 var _getLocale = require("../../../../../utils/getLocale");
 
+var _context = require("../../../context");
+
+var _helper = require("../../../helper");
+
 require("./index.css");
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
@@ -40,14 +44,22 @@ var DateCycle = function DateCycle(_ref) {
       _ref$canEdit = _ref.canEdit,
       canEdit = _ref$canEdit === void 0 ? false : _ref$canEdit;
 
+  var _useContext = (0, _react.useContext)(_context.CommonContext),
+      okrInfo = _useContext.okrInfo,
+      approvalSetting = _useContext.approvalSetting;
+
+  var canCycleEdit = canEdit && (0, _helper.getApprovalOkr)(approvalSetting, "changeOkrTime", okrInfo === null || okrInfo === void 0 ? void 0 : okrInfo.applyState, okrInfo === null || okrInfo === void 0 ? void 0 : okrInfo.OkrAndKrApprovalTypes);
+
   var _useState = (0, _react.useState)(false),
       _useState2 = _slicedToArray(_useState, 2),
       isFocus = _useState2[0],
       setIsFocus = _useState2[1];
 
   var handleButtonFocus = (0, _react.useCallback)(function () {
-    canEdit && setIsFocus(true);
-  }, [canEdit]);
+    if (canCycleEdit) {
+      setIsFocus(true);
+    }
+  }, [canCycleEdit]);
   var handleButtonBlur = (0, _react.useCallback)(function () {
     setIsFocus(false);
   }, []);
@@ -57,9 +69,10 @@ var DateCycle = function DateCycle(_ref) {
         clickCallback = _ref2.clickCallback,
         text = _ref2.text;
     return /*#__PURE__*/_react["default"].createElement("button", {
+      type: "button",
       onFocus: handleButtonFocus,
       onBlur: handleButtonBlur,
-      className: "base-info-date-cycle__button ".concat(isFocus ? "base-info-date-cycle__button--focus" : "", " ").concat(!canEdit && "base-info-date-cycle__button--disable"),
+      className: "base-info-date-cycle__button ".concat(isFocus ? "base-info-date-cycle__button--focus" : "", " ").concat(!canCycleEdit && "base-info-date-cycle__button--disable"),
       ref: btnRef,
       onClick: clickCallback
     }, /*#__PURE__*/_react["default"].createElement("span", {
@@ -78,10 +91,13 @@ var DateCycle = function DateCycle(_ref) {
     cycle: cycle,
     setCycle: setCycle,
     okrId: okrId,
-    canEdit: canEdit,
+    canEdit: canCycleEdit,
     getCycleRange: true
   }));
 };
 
+DateCycle.defaultProps = {
+  canEdit: false
+};
 var _default = DateCycle;
 exports["default"] = _default;

package/lib/components/okr-detail/base-info/other-infos/principal/index.js

@@ -21,6 +21,10 @@ var _popConfirm = _interopRequireDefault(require("../../../../../components-v1/p
 
 var _getLocale = require("../../../../../utils/getLocale");
 
+var _context2 = require("../../../context");
+
+var _helper = require("../../../helper");
+
 require("./index.css");
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
@@ -60,6 +64,10 @@ var Principal = function Principal(_ref) {
       selectUser = _useState2[0],
       setSelectUser = _useState2[1];
 
+  var _useContext = (0, _react.useContext)(_context2.CommonContext),
+      okrInfo = _useContext.okrInfo,
+      approvalSetting = _useContext.approvalSetting;
+
   var handleSelected = function handleSelected(_ref2) {
     var _ref3 = _slicedToArray(_ref2, 1),
         user = _ref3[0];
@@ -114,7 +122,7 @@ var Principal = function Principal(_ref) {
   }, (0, _getLocale.getLocale)("Mod_Owner")), /*#__PURE__*/_react["default"].createElement("div", {
     className: "base-info-other-infos__principal-user",
     ref: selectUserRef
-  }, canEdit ? /*#__PURE__*/_react["default"].createElement(_popConfirm["default"], {
+  }, canEdit && (0, _helper.getApprovalOkr)(approvalSetting, "changeOkrName", okrInfo.applyState, okrInfo === null || okrInfo === void 0 ? void 0 : okrInfo.OkrAndKrApprovalTypes) ? /*#__PURE__*/_react["default"].createElement(_popConfirm["default"], {
     ref: popConfirmRef,
     showArrow: false,
     style: {

package/lib/components/okr-detail/components/header/index.js

@@ -31,6 +31,8 @@ var _progress = _interopRequireDefault(require("../../../progress"));
 
 var _utils = require("../../../progress/utils");
 
+var _helper = require("../../helper");
+
 var _tooltip = _interopRequireDefault(require("../../../tooltip"));
 
 var _auth = require("../../../../utils/auth");
@@ -85,6 +87,8 @@ function Header(props) {
       setGeneralOkrClassify = _useContext.setGeneralOkrClassify,
       showOkrEvalute = _useContext.showOkrEvalute;
 
+  var commonContext = (0, _react.useContext)(_context.CommonContext);
+  var approvalSetting = commonContext.approvalSetting;
   var showOScore = (_window = window) === null || _window === void 0 ? void 0 : (_window$BSGlobal = _window.BSGlobal) === null || _window$BSGlobal === void 0 ? void 0 : (_window$BSGlobal$OkrA = _window$BSGlobal.OkrAdvancedSetting) === null || _window$BSGlobal$OkrA === void 0 ? void 0 : (_window$BSGlobal$OkrA2 = _window$BSGlobal$OkrA.KRSetting) === null || _window$BSGlobal$OkrA2 === void 0 ? void 0 : _window$BSGlobal$OkrA2.OScore;
   var _okrInfo$progressGrow = okrInfo.progressGrow,
       progressGrow = _okrInfo$progressGrow === void 0 ? 0 : _okrInfo$progressGrow,
@@ -156,7 +160,7 @@ function Header(props) {
   }, /*#__PURE__*/_react["default"].createElement("div", {
     className: "".concat(precls, "__avatar")
   }, /*#__PURE__*/_react["default"].createElement(_oAvatar["default"], {
-    editable: editable,
+    editable: editable && (okrInfo === null || okrInfo === void 0 ? void 0 : okrInfo.applyState) !== 1,
     okrId: okrInfo.workId
   })), /*#__PURE__*/_react["default"].createElement("div", {
     className: "".concat(precls, "__content")
@@ -164,7 +168,10 @@ function Header(props) {
     editable: editable,
     okrName: okrName,
     setIsEdit: setIsEdit,
-    okrStatus: okrInfo.status
+    okrStatus: okrInfo === null || okrInfo === void 0 ? void 0 : okrInfo.status,
+    OkrAndKrApprovalTypes: okrInfo === null || okrInfo === void 0 ? void 0 : okrInfo.OkrAndKrApprovalTypes,
+    applyState: okrInfo === null || okrInfo === void 0 ? void 0 : okrInfo.applyState,
+    approvalSetting: approvalSetting
   }, /*#__PURE__*/_react["default"].createElement(_oClassify["default"], {
     editable: editable,
     okrId: okrInfo.workId,
@@ -187,7 +194,7 @@ function Header(props) {
   })), /*#__PURE__*/_react["default"].createElement("span", {
     className: "".concat(precls, "__action-item")
   }, /*#__PURE__*/_react["default"].createElement(_oCycle["default"], {
-    editable: editable,
+    editable: editable && (0, _helper.getApprovalOkr)(approvalSetting, "changeOkrTime", okrInfo === null || okrInfo === void 0 ? void 0 : okrInfo.applyState, okrInfo === null || okrInfo === void 0 ? void 0 : okrInfo.OkrAndKrApprovalTypes),
     okrId: okrInfo.workId
   })), /*#__PURE__*/_react["default"].createElement("span", {
     className: "".concat(precls, "__action-item")