@chaoswise/ui 3.0.3 → 3.0.5

package/lib/CWMessage/CommonIcon.js

@@ -1,4 +1,5 @@
 import React from "react";
+import Icon from "@ant-design/icons";
 function CommonIcon(_ref) {
   var img = _ref.img,
     messageImg = _ref.messageImg,
@@ -6,15 +7,10 @@ function CommonIcon(_ref) {
     onClick = _ref$onClick === void 0 ? function () {} : _ref$onClick;
   return messageImg ? /*#__PURE__*/React.createElement("div", {
     onClick: onClick
-  }, messageImg) : /*#__PURE__*/React.createElement("div", {
+  }, messageImg) : /*#__PURE__*/React.createElement(Icon, {
+    component: img,
     onClick: onClick,
-    style: {
-      cursor: "pointer",
-      width: 20,
-      height: 28,
-      background: "url(".concat(img, ") no-repeat center"),
-      backgroundSize: "100% auto"
-    }
+    className: "business-message-icon"
   });
 }
 export default CommonIcon;

package/lib/CWMessage/index.js

@@ -23,7 +23,7 @@ function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" !=
 function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
 import React, { useState, useEffect, useMemo, useRef } from "react";
 import useConfigContext from "../useConfigContext";
-import messageIcon from "./message.svg";
+import MessageIcon from "./messageSvg.js";
 import CommonIcon from "./CommonIcon";
 import { getSessionId, getMessageDetailApi, getMessageQuerySettingsApi, readInnerMessageApi } from "./service";
 import MessageContent from "./MessageContent";
@@ -80,29 +80,33 @@ function Message(props) {
   var _strongMessageOption$ = strongMessageOption.onClickStrongMessageItem,
     onClickStrongMessageItem = _strongMessageOption$ === void 0 ? function () {} : _strongMessageOption$,
     restStrongMessageOption = _objectWithoutProperties(strongMessageOption, _excluded2);
-  var _useState = useState(false),
+  var _useState = useState("windows"),
     _useState2 = _slicedToArray(_useState, 2),
-    visible = _useState2[0],
-    setVisible = _useState2[1];
-  // 铃铛未读消息数量
-  var _useState3 = useState(0),
+    mode = _useState2[0],
+    setMode = _useState2[1];
+  var _useState3 = useState(false),
     _useState4 = _slicedToArray(_useState3, 2),
-    messageTotal = _useState4[0],
-    setMessageTotal = _useState4[1];
+    visible = _useState4[0],
+    setVisible = _useState4[1];
+  // 铃铛未读消息数量
   var _useState5 = useState(0),
     _useState6 = _slicedToArray(_useState5, 2),
-    total = _useState6[0],
-    setTotal = _useState6[1];
+    messageTotal = _useState6[0],
+    setMessageTotal = _useState6[1];
+  var _useState7 = useState(0),
+    _useState8 = _slicedToArray(_useState7, 2),
+    total = _useState8[0],
+    setTotal = _useState8[1];
   // 保存消息配置
   var messageOptionRef = useRef({});
   // 分页配置初始化
-  var _useState7 = useState({
+  var _useState9 = useState({
       current: 1,
       pageSize: 30
     }),
-    _useState8 = _slicedToArray(_useState7, 2),
-    pageInfo = _useState8[0],
-    setPageInfo = _useState8[1];
+    _useState10 = _slicedToArray(_useState9, 2),
+    pageInfo = _useState10[0],
+    setPageInfo = _useState10[1];
   // 初始化条件
   var conditionsRef = useRef({
     current: 1,
@@ -113,11 +117,15 @@ function Message(props) {
   useEffect(function () {
     getMessageQuerySettings();
     connectSocket();
+  }, []);
+  useEffect(function () {
+    _notification.destroy();
     _notification.config({
       top: headerHeight,
-      maxCount: 1
+      maxCount: mode === "windows" ? 1 : null,
+      prefixCls: "".concat(prefixCls, "-notification")
     });
-  }, []);
+  }, [mode]);
   useEffect(function () {
     setPageInfo(function (pre) {
       return _objectSpread(_objectSpread({}, pre), {}, {
@@ -244,7 +252,7 @@ function Message(props) {
               });
               socket.on("push", /*#__PURE__*/function () {
                 var _ref5 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee3(data) {
-                  var _JSON$parse, count, message, _ref6, _ref6$total, total, noticeMessage, userMessageId, type, _ref7, enable, mode, _ref7$time, time;
+                  var _JSON$parse, count, message, _ref6, _ref6$total, total, noticeMessage, userMessageId, type, _ref7, enable, _mode, _ref7$time, time;
                   return _regeneratorRuntime().wrap(function _callee3$(_context3) {
                     while (1) switch (_context3.prev = _context3.next) {
                       case 0:
@@ -257,7 +265,8 @@ function Message(props) {
                           if (noticeMessage) {
                             userMessageId = noticeMessage.id, type = noticeMessage.type;
                             if (userMessageId) {
-                              _ref7 = messageOptionRef.current[type] || {}, enable = _ref7.enable, mode = _ref7.mode, _ref7$time = _ref7.time, time = _ref7$time === void 0 ? 5 : _ref7$time;
+                              _ref7 = messageOptionRef.current[type] || {}, enable = _ref7.enable, _mode = _ref7.mode, _ref7$time = _ref7.time, time = _ref7$time === void 0 ? 5 : _ref7$time;
+                              setMode(_mode);
                               if (enable) {
                                 openNotification(time, userMessageId);
                               }
@@ -338,7 +347,7 @@ function Message(props) {
     count: messageTotal,
     offset: [6, 5]
   }, _badgeOption), /*#__PURE__*/React.createElement(CommonIcon, {
-    img: messageIcon,
+    img: MessageIcon,
     onClick: onClickBell,
     messageImg: messageImg
   })), /*#__PURE__*/React.createElement(_Drawer, {

package/lib/CWMessage/index.style.js

@@ -3,6 +3,11 @@ function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object
 function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
 function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
 import { genStyleHooks } from "../Antd5/theme/internal";
+var prepareComponentToken = function prepareComponentToken(token) {
+  return {
+    headerColorLayout: token.Layout.headerColor
+  };
+};
 var genCustomCWMessageStyle = function genCustomCWMessageStyle(token) {
   var prefixCls = token.antCls;
   var messagePrefixCls = "".concat(prefixCls, "-business-message");
@@ -13,7 +18,11 @@ var genCustomCWMessageStyle = function genCustomCWMessageStyle(token) {
   return _defineProperty(_defineProperty(_defineProperty({}, "".concat(prefixCls, "-notification"), _defineProperty({}, "".concat(prefixCls, "-notification:has(").concat(messagePrefixCls, "-notification-wrapper)"), {
     margin: "0"
   })), "".concat(messagePrefixCls, "-wrapper"), _defineProperty({
-    display: "inline-flex"
+    display: "inline-flex",
+    ".business-message-icon": {
+      cursor: "pointer",
+      color: token.headerColorLayout
+    }
   }, badgePrefix, {
     "&-count": {
       height: "16px",
@@ -129,4 +138,4 @@ export default genStyleHooks("CWMessage", function (token) {
   return [
   // 
   genCustomCWMessageStyle(token)];
-});
+}, prepareComponentToken);

package/lib/CWMessage/messageSvg.js

@@ -0,0 +1,19 @@
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+import * as React from "react";
+var SvgMessage = function SvgMessage(props) {
+  return /*#__PURE__*/React.createElement("svg", _extends({}, props, {
+    width: 20,
+    height: 28,
+    viewBox: "0 0 16 16"
+  }), /*#__PURE__*/React.createElement("g", {
+    fill: "none",
+    fillRule: "evenodd"
+  }, /*#__PURE__*/React.createElement("path", {
+    d: "M0 0h16v16H0z"
+  }), /*#__PURE__*/React.createElement("path", {
+    fill: "currentColor",
+    fillRule: "nonzero",
+    d: "m5.9 14.211-.75-.685h5.65l-.75.685c-1.1 1.052-3 1.052-4.15 0M13 7.72V6.074c0-2.377-2-4.343-4.5-4.571v-.046C8.5 1.183 8.3 1 8 1s-.5.183-.5.457v.046C4.95 1.73 3 3.697 3 6.074V7.72c0 1.874-.7 3.749-2 5.211h14a7.89 7.89 0 0 1-2-5.211m-9 0V6.074C4 4.154 5.55 2.6 7.6 2.417l.45-.046.35.046C10.45 2.6 12 4.154 12 6.074V7.72c0 1.509.4 2.971 1.15 4.297H2.85A8.7 8.7 0 0 0 4 7.72"
+  })));
+};
+export default SvgMessage;

package/lib/ConfigProvider/ConfigProvider.js

@@ -69,9 +69,9 @@ var CWConfigProvider = function CWConfigProvider(_ref) {
   if (loading) {
     return null;
   }
-  var mergeTheme = JSON.parse(JSON.stringify(merge(customTheme, {
+  var mergeTheme = merge({}, customTheme, {
     components: chaoswiseUICustomTheme
-  }, theme)));
+  }, theme);
   return /*#__PURE__*/React.createElement(Provider, {
     value: {
       locale: currentLocale,

package/lib/ConfigProvider/customTheme.js

@@ -4,6 +4,7 @@ export default {
   token: {
     white: "#fff",
     colorPrimary: "#1890ff",
+    colorLink: "#1890ff",
     colorInfo: "#1890ff",
     colorError: "#f5222d",
     borderRadius: 2,

package/lib/Header/index.js

@@ -5,6 +5,7 @@ function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r)
 function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
 function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
 function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
 import React, { useState, useEffect, useRef, useMemo } from "react";
 import Icon, { CaretDownOutlined } from "@ant-design/icons";
 import LocaleSwitcher from "./LocaleSwitcher";
@@ -62,33 +63,14 @@ var defaultLogo = function defaultLogo() {
     y: "20"
   }, "\u667A\u80FD\u4E1A\u52A1\u8FD0\u7EF4"))))));
 };
-var homeIconSvg = function homeIconSvg() {
-  return /*#__PURE__*/React.createElement("svg", {
-    width: "17px",
-    height: "16px",
-    viewBox: "0 0 17 16",
-    version: "1.1"
-  }, /*#__PURE__*/React.createElement("title", null, "home"), /*#__PURE__*/React.createElement("g", {
-    id: "\u9875\u9762-1",
-    stroke: "none",
-    strokeWidth: "1",
-    fill: "none",
-    fillRule: "evenodd"
-  }, /*#__PURE__*/React.createElement("g", {
-    id: "\u9876\u90E8\u5BFC\u822A\u5E03\u5C40",
-    transform: "translate(-208.000000, -19.000000)",
-    fill: "#FFFFFF",
-    fillRule: "nonzero"
-  }, /*#__PURE__*/React.createElement("g", {
-    id: "\u7F16\u7EC4-7",
-    transform: "translate(208.000000, 18.000000)"
-  }, /*#__PURE__*/React.createElement("g", {
-    id: "home",
-    transform: "translate(0.000000, 1.000000)"
-  }, /*#__PURE__*/React.createElement("path", {
-    d: "M8.47346547,1.33175009 L15.0520643,7.3451772 C14.7170716,7.3862806 14.4026306,7.52397698 14.1518999,7.74388016 L14.1477896,7.7479905 L14.1436792,7.75210084 C13.9011692,7.96789368 13.6134454,8.34810011 13.6134454,8.94615455 L13.6134454,14.5464925 L11.2047863,14.5464925 L11.2047863,12.1666058 C11.2047863,11.2726069 10.4649251,10.5471319 9.55448484,10.5471319 L7.38422543,10.5471319 C6.47378517,10.5471319 5.733924,11.274662 5.733924,12.1666058 L5.733924,14.5444373 L3.35403727,14.5444373 L3.35403727,8.93382353 C3.35403727,8.11175557 2.72721045,7.42943917 1.91747351,7.32668067 L8.47346547,1.33175009 M8.47346547,0 C8.24328645,0 8.01310742,0.078096456 7.84869383,0.232234198 L0.279503106,7.15199123 C0.00822067958,7.38422543 -0.0698757764,7.73360431 0.0760412861,8.05215564 C0.221958349,8.3624863 0.532289003,8.54539642 0.889888564,8.54539642 L1.70373584,8.54539642 C1.93597004,8.54539642 2.12093533,8.72008586 2.12093533,8.93176836 L2.12093533,14.9616368 C2.12093533,15.4076087 2.51758312,15.7754841 3.00260322,15.7754841 L6.08535806,15.7754841 C6.57037815,15.7754841 6.96702594,15.4076087 6.96702594,14.9616368 L6.96702594,12.1666058 C6.96702594,11.9528681 7.15199123,11.7802338 7.38422543,11.7802338 L9.55448484,11.7802338 C9.78671904,11.7802338 9.97168433,11.9549233 9.97168433,12.1666058 L9.97168433,14.963692 C9.97168433,15.4096639 10.3683321,15.7775393 10.8636281,15.7775393 L13.9463829,15.7775393 C14.4416788,15.7775393 14.8486025,15.4096639 14.8486025,14.963692 L14.8486025,8.94204421 C14.8486025,8.82695469 14.8773749,8.74885824 14.9657472,8.67076178 C15.0438436,8.60294118 15.1507125,8.56389295 15.265802,8.56389295 L16.0303252,8.56389295 C16.3899799,8.56389295 16.6982554,8.37070698 16.8441725,8.07065217 C17.008586,7.75210084 16.9304896,7.39244611 16.6797589,7.16021191 L9.10029229,0.232234198 C8.9358787,0.078096456 8.7036445,0 8.47346547,0 Z",
-    id: "\u5F62\u72B6"
-  }))))));
+var homeIconSvg = function homeIconSvg(props) {
+  return /*#__PURE__*/React.createElement("svg", _extends({
+    width: 17,
+    height: 16
+  }, props), /*#__PURE__*/React.createElement("path", {
+    fill: "currentColor",
+    d: "m8.473 1.332 6.58 6.013c-.336.041-.65.179-.901.399l-.004.004-.004.004c-.243.216-.53.596-.53 1.194v5.6h-2.41v-2.38c0-.893-.74-1.619-1.65-1.619h-2.17c-.91 0-1.65.728-1.65 1.62v2.377h-2.38v-5.61c0-.822-.627-1.505-1.437-1.607zm0-1.332c-.23 0-.46.078-.624.232l-7.57 6.92a.746.746 0 0 0-.203.9c.146.31.456.493.814.493h.814c.232 0 .417.175.417.387v6.03c0 .446.397.813.882.813h3.082c.485 0 .882-.367.882-.813v-2.795c0-.214.185-.387.417-.387h2.17c.233 0 .418.175.418.387v2.797c0 .446.396.814.892.814h3.082c.496 0 .903-.368.903-.814V8.942c0-.115.028-.193.117-.271a.46.46 0 0 1 .3-.107h.764a.89.89 0 0 0 .814-.493.75.75 0 0 0-.164-.91L9.1.231A.92.92 0 0 0 8.473 0"
+  }));
 };
 function CWHeader(_ref) {
   var logo = _ref.logo,

package/lib/Header/index.style.js

@@ -47,7 +47,7 @@ var genCustomCWHeaderStyle = function genCustomCWHeaderStyle(token) {
           display: "block"
         },
         ".logo-text": {
-          color: "#fff",
+          color: token.headerColorLayout,
           marginLeft: "8px",
           fontSize: "18px"
         }
@@ -59,7 +59,8 @@ var genCustomCWHeaderStyle = function genCustomCWHeaderStyle(token) {
         display: "flex",
         alignItems: "center",
         marginLeft: "31px",
-        cursor: "pointer"
+        cursor: "pointer",
+        color: token.headerColorLayout
       },
       ".cw-header-dropdown-link": {
         height: "".concat(unit(token.headerHeightLayout)),

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@chaoswise/ui",
   "packageName": "chaoswiseUI",
-  "version": "3.0.3",
+  "version": "3.0.5",
   "description": "公共UI库",
   "keywords": [
     "ui",