@chaoswise/ui 2.3.12 → 2.3.14

package/lib/IconSelect/index.js

@@ -0,0 +1,138 @@
+import _Dropdown from "@chaoswise/ui/lib/Antd/Dropdown";
+import "@chaoswise/ui/lib/Button/index.less";
+import _Button from "@chaoswise/ui/lib/Button";
+import _Space from "@chaoswise/ui/lib/Space";
+import _ConfigProvider from "@chaoswise/ui/lib/ConfigProvider";
+import "@chaoswise/ui/lib/Tabs/index.less";
+import _Tabs from "@chaoswise/ui/lib/Tabs";
+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 = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i["return"] && (_r = _i["return"](), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+import React, { useEffect, useState } from "react";
+import Icon from "@icon-park/react/es/all";
+import CustomImg from "./components/CustomImg";
+import SearchIcon from "./components/SearchIcon";
+import { getLocale } from "./locale";
+import "./index.less";
+import PropTypes from "prop-types";
+var TabPane = _Tabs.TabPane;
+function IconSelect(_ref) {
+  var value = _ref.value,
+    defaultValue = _ref.defaultValue,
+    _ref$onChange = _ref.onChange,
+    onChange = _ref$onChange === void 0 ? function () {} : _ref$onChange,
+    _ref$category = _ref.category,
+    category = _ref$category === void 0 ? [] : _ref$category,
+    iconSelectRender = _ref.iconSelectRender;
+  var _useState = useState("icon"),
+    _useState2 = _slicedToArray(_useState, 2),
+    iconType = _useState2[0],
+    setIconType = _useState2[1]; //选中key  图标库 icon 自定义图片 customImg
+  var _useState3 = useState(null),
+    _useState4 = _slicedToArray(_useState3, 2),
+    iconInfo = _useState4[0],
+    setIconInfo = _useState4[1]; //组件图标数据集合
+  var _useState5 = useState(null),
+    _useState6 = _slicedToArray(_useState5, 2),
+    customFileInfo = _useState6[0],
+    setCustomFileInfo = _useState6[1]; //组件图标数据集合
+
+  var _ConfigProvider$useLo = _ConfigProvider.useLocale(),
+    _ConfigProvider$useLo2 = _ConfigProvider$useLo.locale,
+    locale = _ConfigProvider$useLo2 === void 0 ? "zh" : _ConfigProvider$useLo2;
+  var localeObj = getLocale(locale);
+  var _value = value || defaultValue;
+
+  //切换tab
+  var changeTab = function changeTab(activeKey) {
+    setIconType(activeKey);
+    onChange({
+      iconInfo: iconInfo,
+      customFileInfo: customFileInfo,
+      iconType: activeKey
+    });
+  };
+  useEffect(function () {
+    if (_value) {
+      var _iconInfo = _value.iconInfo,
+        _customFileInfo = _value.customFileInfo;
+      setIconInfo(_iconInfo);
+      setCustomFileInfo(_customFileInfo);
+    }
+  }, [_value]);
+  var menu = /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
+    className: "icon-select-dropdown",
+    onClick: function onClick(e) {
+      e.preventDefault();
+      e.stopPropagation();
+    }
+  }, /*#__PURE__*/React.createElement(_Tabs, {
+    activeKey: iconType,
+    onChange: changeTab,
+    className: "icon-select-dropdown-tabs"
+  }, /*#__PURE__*/React.createElement(TabPane, {
+    key: "icon",
+    tab: localeObj["icon-select-store-icon"]
+  }, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(SearchIcon, {
+    category: category,
+    iconInfo: iconInfo,
+    customFileInfo: customFileInfo,
+    setIconInfo: setIconInfo,
+    onChange: onChange
+  }))), /*#__PURE__*/React.createElement(TabPane, {
+    key: "customImg",
+    tab: localeObj["icon-select-custom-img"]
+  }, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(CustomImg, {
+    iconInfo: iconInfo,
+    customFileInfo: customFileInfo,
+    setCustomFileInfo: setCustomFileInfo,
+    onChange: onChange
+  }))))));
+  return /*#__PURE__*/React.createElement("div", {
+    className: "img-setting-box"
+  }, /*#__PURE__*/React.createElement(_Dropdown, {
+    trigger: ["click"],
+    overlay: menu
+  }, iconSelectRender ? iconSelectRender({
+    customFileInfo: customFileInfo,
+    iconInfo: iconInfo
+  }) : /*#__PURE__*/React.createElement(_Button, null, /*#__PURE__*/React.createElement(_Space, null, /*#__PURE__*/React.createElement("div", {
+    className: "img-setting-box-content"
+  }, customFileInfo !== null && customFileInfo !== void 0 && customFileInfo.baseCode ? /*#__PURE__*/React.createElement("img", {
+    src: customFileInfo === null || customFileInfo === void 0 ? void 0 : customFileInfo.baseCode,
+    className: "img-setting-box-content-custom"
+  }) : (iconInfo === null || iconInfo === void 0 ? void 0 : iconInfo.name) && /*#__PURE__*/React.createElement("div", {
+    className: "img-setting-box-content-icon"
+  }, /*#__PURE__*/React.createElement(Icon, {
+    type: iconInfo === null || iconInfo === void 0 ? void 0 : iconInfo.name,
+    theme: "filled",
+    size: "14"
+  }))), /*#__PURE__*/React.createElement(Icon, {
+    type: "down"
+  })))));
+}
+IconSelect.propTypes = {
+  defaultValue: PropTypes.shape({
+    iconType: PropTypes.string,
+    iconInfo: PropTypes.object,
+    customFileInfo: PropTypes.object
+  }),
+  value: PropTypes.shape({
+    iconType: PropTypes.string,
+    iconInfo: PropTypes.object,
+    customFileInfo: PropTypes.object
+  }),
+  /**
+   * 选中项变化时，tab切换时的回调,(value)=>{}
+   */
+  onChange: PropTypes.func,
+  category: PropTypes.arrayOf(PropTypes.string).isRequired,
+  /**
+   * 自定义Dropdown按钮内容
+   */
+  iconSelectRender: PropTypes.func
+};
+export default IconSelect;

package/lib/IconSelect/index.less

@@ -0,0 +1,59 @@
+.img-setting-box {
+  .img-setting-box-content {
+    width: 40px;
+    display: inline-block;
+    overflow: hidden;
+    margin-top: 5px;
+
+    .img-setting-box-content-custom {
+      width: 40px;
+    }
+
+    .img-setting-box-content-icon {
+      padding-top: 5px;
+      text-align: left;
+    }
+  }
+}
+
+.icon-select-dropdown {
+  background: @form-back-font;
+  width: 240px;
+  border-radius: 4px;
+  outline: none;
+  -webkit-box-shadow: @box-shadow-base;
+  box-shadow: @box-shadow-base;
+
+  .@{ant-prefix}-tabs-nav {
+    margin: 0;
+    padding: 0 10px;
+  }
+}
+
+.img-setting-tabs {
+  .@{ant-prefix}-tabs-nav {
+    margin: 0;
+    padding: 0 5px;
+  }
+}
+
+.iconInput {
+  .@{ant-prefix}-select-selection-selected-value {
+    svg {
+      width: 16px;
+      height: 16px;
+      margin-top: 4px;
+    }
+  }
+}
+
+.iconSelect {
+  width: 40px;
+  // height: 40px;
+  display: inline-block;
+
+  svg {
+    width: 16px;
+    height: 16px;
+  }
+}

package/lib/IconSelect/locale/en_US.js

@@ -0,0 +1,11 @@
+export default {
+  "icon-select-custom-type": "Files in this format are not supported",
+  "icon-select-custom-null": "Cannot upload empty files",
+  "icon-select-custom-length": "Img size does not exceed 2M",
+  "icon-select-custom-fail": "File reading failure",
+  "icon-select-custom-upload": "Upload image",
+  "icon-select-store-icon": "Icon library",
+  "icon-select-store-search": "Please enter search keywords",
+  "icon-select-custom-img": "Customized image",
+  "icon-select-custom-img-tip": "Recommend uploading 40*40 image in PNG, SVG, JPG, or JGPG format. Image size can not exceed 2 MB"
+};

package/lib/IconSelect/locale/index.js

@@ -0,0 +1,12 @@
+import zhCN from './zh_CN.js';
+import enUS from './en_US.js';
+export var getLocale = function getLocale(locale) {
+  switch (locale) {
+    case 'zh':
+      return zhCN;
+    case 'en':
+      return enUS;
+    default:
+      return zhCN;
+  }
+};

package/lib/IconSelect/locale/zh_CN.js

@@ -0,0 +1,11 @@
+export default {
+  "icon-select-custom-type": "暂不支持该格式文件",
+  "icon-select-custom-null": "不能上传空文件",
+  "icon-select-custom-length": "图片大小不超过2M",
+  "icon-select-custom-fail": "读取文件失败",
+  "icon-select-custom-upload": "上传本地图片",
+  "icon-select-store-icon": "图标库",
+  "icon-select-store-icon-search": "请输入搜索关键字",
+  "icon-select-custom-img": "自定义图片",
+  "icon-select-custom-img-tip": "推荐上传40*40的PNG、SVG、JPG、JGPG,⼤⼩不超过2M"
+};

package/lib/QuickTransfer/CheckList.js

@@ -25,7 +25,7 @@ var CheckList = function CheckList(props) {
     handlePreviewList(_toConsumableArray(checkValue)); //更新修改后的列表
   };
 
-  var isLockSort = checkValue.filter(function (item) {
+  var isLockSort = type === "list" && checkValue.filter(function (item) {
     return item.disabled;
   }).length;
   var renderList = function renderList(item, index) {

package/lib/QuickTransfer/TopicList.js

@@ -120,7 +120,7 @@ var TopicList = function TopicList(_ref) {
       cursor: "move"
     }
   } : {};
-  var lockSortContent = /*#__PURE__*/React.createElement("div", {
+  var listLockSortContent = /*#__PURE__*/React.createElement("div", {
     className: "cw-transfer-right-content-item"
   }, /*#__PURE__*/React.createElement("div", {
     className: "cw-transfer-right-content-item-drag-wrapper"
@@ -128,14 +128,14 @@ var TopicList = function TopicList(_ref) {
     title: localeObj["dragAndDrop"]
   }, /*#__PURE__*/React.createElement(DragSvg, null))), /*#__PURE__*/React.createElement("div", {
     className: "cw-transfer-right-content-item-text-wrapper"
-  }, type === "table" ? renderTable(labelValue) : render(value)), !disabled && /*#__PURE__*/React.createElement(_Icon, {
+  }, render(value)), !disabled && /*#__PURE__*/React.createElement(_Icon, {
     type: "close",
     className: "cw-transfer-right-content-del",
     onClick: function onClick() {
       return handleDeleted(labelValue);
     }
   }));
-  var renderItemContent = isLockSort ? lockSortContent : /*#__PURE__*/React.createElement(Fragment, null, dragList && /*#__PURE__*/React.createElement(_Tooltip, {
+  var renderItemContent = type == "list" && isLockSort ? listLockSortContent : /*#__PURE__*/React.createElement(Fragment, null, dragList && /*#__PURE__*/React.createElement(_Tooltip, {
     title: localeObj["dragAndDrop"]
   }, /*#__PURE__*/React.createElement(DragSvg, {
     className: "cw-transfer-right-content-drag"

package/lib/QuickTransfer/index.js

@@ -657,7 +657,7 @@ var QuickTransfer = /*#__PURE__*/forwardRef(function (props, ref) {
         style: {
           color: "#F5222D"
         }
-      }, searchStr), afterTitle) : value.title);
+      }, searchStr), afterTitle) : title);
     }
     return title;
   };

package/lib/SiderMenu/index.less

@@ -559,7 +559,7 @@
     width: 12px;
     font-size: 12px;
     line-height: 40px;
-    color: @text-color-show; // 符合ui规范
+    color: @menu-dark-arrow-color; // 符合ui规范
     .@{iconfont-css-prefix}{
       min-width: 12px;
       margin-right: 0;
@@ -567,6 +567,7 @@
       transition: transform 0.3s;
     }
     &.cw-expand-arrow-open{
+      color: @menu-dark-highlight-color !important;
       .@{iconfont-css-prefix}{
         transform:rotate(180deg);
       }

package/lib/SiderMenu/utils.js

@@ -0,0 +1,29 @@
+function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
+function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread 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 _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
+function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
+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; }
+/**
+ *
+ * @param {*} tree
+ * @param {*} pathName
+ * @param {*} path
+ * @returns 根据pathName遍历树节点将匹配到的pathName和父节点的pathName放入数组中返回
+ */
+export function findPathbyPathName(tree, pathName) {
+  var path = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : [];
+  for (var i = 0; i < tree.length; i++) {
+    var tempPath = _toConsumableArray(path);
+    tempPath.push(tree[i].pathName);
+    if (tree[i].pathName === pathName) {
+      return tempPath;
+    }
+    if (tree[i].children) {
+      var reuslt = findPathbyPathName(tree[i].children, pathName, tempPath);
+      if (reuslt) {
+        return reuslt;
+      }
+    }
+  }
+}

package/lib/Tooltip/index.less

@@ -35,7 +35,7 @@
       overflow: auto;
       line-height: 20px;
       box-shadow: none;
-      word-break: break-all; // 解决自动换行
+      word-break: keep-all;
     }
   }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@chaoswise/ui",
-  "version": "2.3.12",
+  "version": "2.3.14",
   "description": "公共UI库",
   "keywords": [
     "ui",
@@ -75,6 +75,7 @@
     "@chaoswise/utils": "^0.0.30",
     "@formily/antd": "^1.3.17",
     "@formily/antd-components": "^1.3.17",
+    "@icon-park/react": "^1.4.2",
     "ant-design-draggable-modal": "0.0.16",
     "antd": "^3.26.19",
     "axios": "^0.21.1",
@@ -96,6 +97,7 @@
     "rc-tabs": "^11.10.0",
     "rc-util": "^5.20.0",
     "re-resizable": "^6.9.0",
+    "react-color": "^2.19.3",
     "react-custom-scrollbars": "^4.2.1",
     "react-dnd": "^13.1.1",
     "react-dnd-html5-backend": "^12.1.1",
@@ -140,5 +142,5 @@
     "access": "public"
   },
   "license": "MIT",
-  "gitHead": "7b692dc324093295cdadeffb0f2eca49e4064d56"
+  "gitHead": "54815aa55f3cd3e2cbcdc42f09afba456b484d07"
 }