@lingxiteam/assets 4.0.1-alpha.2 → 4.1.1

package/es/error/errorDisplay/Web/Notification/Notice.js

@@ -21,7 +21,9 @@ var Notice = /*#__PURE__*/forwardRef(function (props, ref) {
     footer = props.footer,
     maxLine = props.maxLine,
     maxLen = props.maxLen,
-    duration = props.duration;
+    duration = props.duration,
+    badge = props.badge,
+    onShowStash = props.onShowStash;
   var _useState = useState(),
     _useState2 = _slicedToArray(_useState, 2),
     footerContent = _useState2[0],
@@ -98,7 +100,10 @@ var Notice = /*#__PURE__*/forwardRef(function (props, ref) {
     }
   }, /*#__PURE__*/React.createElement("div", {
     className: "lx-notification-notice"
-  }, isDomEle(title) ? /*#__PURE__*/React.createElement("div", {
+  }, badge ? /*#__PURE__*/React.createElement("i", {
+    className: "lx-notification-notice-badge",
+    onClick: onShowStash
+  }, badge + 1) : null, isDomEle(title) ? /*#__PURE__*/React.createElement("div", {
     className: "lx-notification-notice-head"
   }, /*#__PURE__*/React.createElement("img", {
     src: getSvgImageBase64(WarnIcon),

package/es/error/errorDisplay/Web/Notification/Notification.js

@@ -25,12 +25,14 @@ import Notice from './Notice';
 import './Notification.less';
 var keyNbr = 0;
 var Notification = /*#__PURE__*/forwardRef(function (props, ref) {
-  var _props$maxCount = props.maxCount,
-    maxCount = _props$maxCount === void 0 ? 6 : _props$maxCount;
   var _useState = useState([]),
     _useState2 = _slicedToArray(_useState, 2),
     configList = _useState2[0],
     setConfigList = _useState2[1];
+  var _useState3 = useState([]),
+    _useState4 = _slicedToArray(_useState3, 2),
+    stashOpenList = _useState4[0],
+    setStashOpenList = _useState4[1];
   var openListRef = useRef([]);
   useMemo(function () {
     openListRef.current = configList;
@@ -46,6 +48,9 @@ var Notification = /*#__PURE__*/forwardRef(function (props, ref) {
         return item.key !== key;
       });
     });
+    if (stashOpenList.length) {
+      setStashOpenList([]);
+    }
   };
   var onAddNotice = function onAddNotice(config) {
     setConfigList(function (list) {
@@ -69,12 +74,17 @@ var Notification = /*#__PURE__*/forwardRef(function (props, ref) {
           }
         }));
       }
-      if (maxCount > 0 && clone.length > maxCount) {
-        clone = clone.slice(-maxCount);
-      }
       return clone;
     });
   };
+  var onShowStash = function onShowStash() {
+    if (stashOpenList.length) {
+      stashOpenList.forEach(function (item) {
+        return onAddNotice(item);
+      });
+      setStashOpenList([]);
+    }
+  };
   useImperativeHandle(ref, function () {
     return {
       open: onAddNotice,
@@ -89,6 +99,11 @@ var Notification = /*#__PURE__*/forwardRef(function (props, ref) {
       },
       setOpenList: function setOpenList(_param) {
         setConfigList(_toConsumableArray(_param));
+      },
+      stashOpenListSet: function stashOpenListSet(config) {
+        setStashOpenList(function (pre) {
+          return [].concat(_toConsumableArray(pre), [config]);
+        });
       }
     };
   });
@@ -97,7 +112,10 @@ var Notification = /*#__PURE__*/forwardRef(function (props, ref) {
       return configList.map(function (notice) {
         return /*#__PURE__*/React.createElement(Notice, _extends({
           itemKey: notice === null || notice === void 0 ? void 0 : notice.itemKey
-        }, notice));
+        }, notice, {
+          onShowStash: onShowStash,
+          badge: stashOpenList.length
+        }));
       });
     }
     return '';
@@ -136,7 +154,8 @@ Notification.insert = function () {
       close: notification.close,
       destroy: notification.destroy,
       getOpenList: notification.getOpenList,
-      setOpenList: notification.setOpenList
+      setOpenList: notification.setOpenList,
+      stashOpenListSet: notification.stashOpenListSet
     });
   };
   render( /*#__PURE__*/React.createElement(Notification, _extends({}, props, {

package/es/error/errorDisplay/Web/Notification/Notification.less

@@ -47,6 +47,29 @@
     line-height: 1.5;
     position: relative;
     cursor: default;
+
+    &-badge {
+      position: absolute;
+      top: 0;
+      right: 0;
+      transform: translate(50%,-50%);
+      transform-origin: 100% 0%;
+      z-index: auto;
+      min-width: 20px;
+      height: 20px;
+      padding: 0 6px;
+      color: #fff;
+      font-weight: 400;
+      font-style:normal;
+      font-size: 12px;
+      line-height: 20px;
+      white-space: nowrap;
+      text-align: center;
+      background: #ff4d4f;
+      border-radius: 10px;
+      box-shadow: 0 0 0 1px #fff;
+      cursor: pointer;
+    }
     
     &-head {
       display: flex;

package/es/error/errorDisplay/Web/Notification/index.js

@@ -89,6 +89,10 @@ var ontificationAPI = {
   },
   setOpenList: function setOpenList(_arr) {
     return Object.values(notificationInstance)[0].setOpenList(_arr);
+  },
+  stashOpenListSet: function stashOpenListSet(_args) {
+    // console.log(Object.values(notificationInstance)[0]);
+    Object.values(notificationInstance)[0].stashOpenListSet(_args);
   }
 };
 export { notificationInstance };

package/es/error/errorDisplay/Web/defaultGlobalConfig.js

@@ -9,6 +9,8 @@ export var defaultGlobalConfig = {
   showType: 'notification',
   maxCount: null,
   // 最大错误显示数据
+  showBadge: false,
+  // 展示当前错误徽标数，当maxCount为1时生效
   placement: 'topRight',
   // 'topRight', 'topLeft', 'bottomRight', 'bottomLeft'
   extendFooter: null,