@chaoswise/ui 2.3.6 → 2.3.8

package/lib/CWRangePicker/Refresh/index.js

@@ -146,7 +146,7 @@ var Refresh = /*#__PURE__*/forwardRef(function (props, ref) {
     title: localeObj["refresh"]
   }, /*#__PURE__*/React.createElement(_Button, {
     onClick: onRefresh,
-    disabled: isDisabledRefresh || !enableAutoRefresh
+    disabled: isDisabledRefresh
   }, /*#__PURE__*/React.createElement(Refresh1Svg, null))), showAutoRefresh && /*#__PURE__*/React.createElement(_Tooltip, {
     title: localeObj["autoRefresh"]
   }, /*#__PURE__*/React.createElement(_Button, {

package/lib/CWTree/index.js

@@ -9,7 +9,7 @@ import _ConfigProvider from "@chaoswise/ui/lib/ConfigProvider";
 import _Menu from "@chaoswise/ui/lib/Menu";
 import "antd/es/tree/style";
 import _Tree from "antd/es/tree";
-var _excluded = ["children", "treeData", "menuData", "extendType", "onClickMenu", "menuStyle", "menuRender", "extraFooter", "tooltipPlacement", "searchValue", "multiple", "selectedKeys", "defaultSelectedKeys", "onSelect", "searchHighlight", "draggable", "isDrawer", "searchHighlightStyle", "className"],
+var _excluded = ["children", "treeData", "menuData", "extendType", "onClickMenu", "menuStyle", "menuRender", "extraFooter", "tooltipPlacement", "searchValue", "multiple", "selectedKeys", "defaultSelectedKeys", "onSelect", "searchHighlight", "draggable", "isDrawer", "searchHighlightStyle", "className", "caseSensitive", "onExpand"],
   _excluded2 = ["icon", "title", "key", "children"];
 function _extends() { _extends = Object.assign ? Object.assign.bind() : 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 ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
@@ -33,9 +33,11 @@ import classnames from "classnames";
 import DragSvg from "./assets/Drag";
 import { getLocale } from "./locale";
 import "./index.less";
+import { createTitle, KMPMatch } from "../QuickTransfer/utils";
 var TreeNode = _Tree.TreeNode,
   DirectoryTree = _Tree.DirectoryTree;
 var SubMenu = _Menu.SubMenu;
+
 /**
  * 基于antd Tree封 支持自定义功能菜单内容、主要适用于左侧导航树（符合UIUE规范）
  */
@@ -68,15 +70,23 @@ function CWTree(_ref) {
       color: "#F5222D"
     } : _ref$searchHighlightS,
     className = _ref.className,
+    _ref$caseSensitive = _ref.caseSensitive,
+    caseSensitive = _ref$caseSensitive === void 0 ? false : _ref$caseSensitive,
+    _ref$onExpand = _ref.onExpand,
+    onExpand = _ref$onExpand === void 0 ? function () {} : _ref$onExpand,
     rest = _objectWithoutProperties(_ref, _excluded);
   var _useState = useState(""),
     _useState2 = _slicedToArray(_useState, 2),
     _showExtend = _useState2[0],
     setShowExtend = _useState2[1];
-  var _useState3 = useState(defaultSelectedKeys),
+  var _useState3 = useState([]),
     _useState4 = _slicedToArray(_useState3, 2),
-    selfSelectedKeys = _useState4[0],
-    setSelfSelectedKeys = _useState4[1];
+    expandedKeys = _useState4[0],
+    setExpandedKeys = _useState4[1];
+  var _useState5 = useState(defaultSelectedKeys),
+    _useState6 = _slicedToArray(_useState5, 2),
+    selfSelectedKeys = _useState6[0],
+    setSelfSelectedKeys = _useState6[1];
   var _ConfigProvider$useLo = _ConfigProvider.useLocale(),
     _ConfigProvider$useLo2 = _ConfigProvider$useLo.locale,
     locale = _ConfigProvider$useLo2 === void 0 ? "zh" : _ConfigProvider$useLo2;
@@ -105,36 +115,41 @@ function CWTree(_ref) {
       });
     });
   }
+  var createTree = function createTree(list, searchValue, caseSensitive, isAppend) {
+    return list.reduce(function (t, c) {
+      var children = c.children,
+        title = c.title;
+      var isHit = KMPMatch(caseSensitive ? title.toLowerCase() : title, caseSensitive ? searchValue.toLowerCase() : searchValue) > -1;
+      if (children && children.length) {
+        var res = createTree(children, searchValue, caseSensitive, isAppend);
+        if (isHit) {
+          if (res.length > 0) {
+            return t.concat(_objectSpread(_objectSpread({}, c), {}, {
+              children: res
+            }));
+          } else {
+            return isAppend ? t.concat(_objectSpread({}, c)) : t.concat(_objectSpread(_objectSpread({}, c), {}, {
+              children: undefined
+            }));
+          }
+        } else {
+          if (res.length > 0) {
+            return t.concat(_objectSpread(_objectSpread({}, c), {}, {
+              children: res
+            }));
+          } else {
+            return t;
+          }
+        }
+      }
+      return isHit ? t.concat(c) : t;
+    }, []);
+  };
   var _treeData = useMemo(function () {
     var addRootTreeData = addRoot(treeData, "/");
     if (!searchHighlight) return addRootTreeData;
-    var loop = function loop(treeData) {
-      return treeData.map(function (item) {
-        var index = 0;
-        if (typeof item.title === "string") {
-          index = item.title.indexOf(searchValue);
-        }
-        if (item.children && item.children.length > 0) {
-          var _children = loop(item.children);
-          return _objectSpread(_objectSpread({}, item), {}, {
-            title: index > -1 || _children.length ? item.title : null,
-            children: _children !== null && _children !== void 0 && _children.length ? _children : undefined
-          });
-        }
-        return index > -1 ? _objectSpread({}, item) : _objectSpread(_objectSpread({}, item), {}, {
-          title: null
-        });
-      }).filter(function (item) {
-        return !!item.title;
-      });
-    };
-    addRootTreeData = loop(addRootTreeData);
-    return rest.checkable ? treeData.filter(function (i) {
-      return addRootTreeData.find(function (item) {
-        return item.key === i.key;
-      });
-    }) : addRootTreeData;
-  }, [searchHighlight, treeData, searchValue, rest.checkable]);
+    return createTree(addRootTreeData, searchValue, caseSensitive, rest.checkable);
+  }, [searchHighlight, treeData, searchValue, rest.checkable, caseSensitive]);
   function buildMenu(array) {
     // 递归构建菜单解构
     return array.map(function (item) {
@@ -234,24 +249,26 @@ function CWTree(_ref) {
   }
   function creatTreeNode(data) {
     // 创建树结构
-    return data.map(function () {
-      var _ref3 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : item;
-      var icon = _ref3.icon,
-        title = _ref3.title,
-        key = _ref3.key,
-        children = _ref3.children,
-        props = _objectWithoutProperties(_ref3, _excluded2);
+    return data.map(function (_props) {
+      var icon = _props.icon,
+        title = _props.title,
+        key = _props.key,
+        children = _props.children,
+        props = _objectWithoutProperties(_props, _excluded2);
       var _title = title;
       if (searchHighlight && typeof title === "string") {
-        var index = title.indexOf(searchValue);
-        var beforeStr = title.substr(0, index);
-        var afterStr = title.substr(index + (searchValue === null || searchValue === void 0 ? void 0 : searchValue.length));
-        _title = index > -1 ? /*#__PURE__*/React.createElement("span", null, beforeStr, /*#__PURE__*/React.createElement("span", {
+        var _createTitle = createTitle(caseSensitive, searchValue, title),
+          index = _createTitle.index,
+          beforeTitle = _createTitle.beforeTitle,
+          afterTitle = _createTitle.afterTitle,
+          searchStr = _createTitle.searchStr;
+        _title = index > -1 ? /*#__PURE__*/React.createElement("span", null, beforeTitle, /*#__PURE__*/React.createElement("span", {
           style: searchHighlightStyle
-        }, searchValue), afterStr) : /*#__PURE__*/React.createElement("span", null, title);
+        }, searchStr), afterTitle) : /*#__PURE__*/React.createElement("span", null, title);
       }
       return /*#__PURE__*/React.createElement(TreeNode, _extends({
         className: "cw-tree-treenode",
+        record: _props,
         icon: icon ? icon : null,
         title: menuData(_title, key, props) || menuRender ? creatTitle(icon, _title, key, children, props) : /*#__PURE__*/React.createElement("span", {
           className: "cw-tree-treenode-content"
@@ -266,6 +283,39 @@ function CWTree(_ref) {
       }, props), children && creatTreeNode(children));
     });
   }
+  var _onExpand = function _onExpand(keys, e) {
+    setExpandedKeys(keys);
+    onExpand(keys, e);
+  };
+  useEffect(function () {
+    if (searchValue) {
+      var _expandedKeys = [];
+      // 遍历树获取所有父节点key
+      var loop = function loop(treeData) {
+        treeData.forEach(function (item) {
+          if (item.children && item.children.length > 0) {
+            _expandedKeys.push(item.key);
+            loop(item.children);
+          }
+        });
+      };
+      loop(_treeData);
+      setExpandedKeys(_expandedKeys);
+    }
+  }, [searchValue, _treeData]);
+
+  // 有搜索内容默认展开搜索节点
+  var expandedConfig = useMemo(function () {
+    // 获取全部父节点key
+    if (searchValue) {
+      return {
+        expandedKeys: expandedKeys
+        // autoExpandParent: true,
+      };
+    }
+
+    return {};
+  }, [searchValue, expandedKeys]);
   return /*#__PURE__*/React.createElement("div", {
     className: "cw-tree-outer-wrapper"
   }, /*#__PURE__*/React.createElement("div", {
@@ -292,8 +342,9 @@ function CWTree(_ref) {
     onMouseLeave: function onMouseLeave(e) {
       return hideExtend(e);
     },
-    draggable: draggable
-  }, rest), children ? children : creatTreeNode(_treeData))))), /*#__PURE__*/React.createElement("div", {
+    draggable: draggable,
+    onExpand: _onExpand
+  }, expandedConfig, rest), children ? children : creatTreeNode(_treeData))))), /*#__PURE__*/React.createElement("div", {
     className: "cw-tree-footer"
   }, extraFooter));
 }

package/lib/QuickTransfer/index.js

@@ -5,6 +5,8 @@ import "@chaoswise/ui/lib/CWTree/index.less";
 import _CWTree from "@chaoswise/ui/lib/CWTree";
 import "@chaoswise/ui/lib/CWTable/index.less";
 import _CWTable from "@chaoswise/ui/lib/CWTable";
+import "@chaoswise/ui/lib/TooltipText/index.less";
+import _TooltipText from "@chaoswise/ui/lib/TooltipText";
 import "@chaoswise/ui/lib/Checkbox/index.less";
 import _Checkbox from "@chaoswise/ui/lib/Checkbox";
 import _ConfigProvider from "@chaoswise/ui/lib/ConfigProvider";
@@ -35,7 +37,7 @@ 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; }
 import React, { useState, useEffect, Fragment, forwardRef, useMemo } from "react";
-import { filterTreeByName, filterTree, filterTreeByNameTable, filterObj, getNotSelectKeys, getKeysAndTitle, getBottomKey, renderLeafNodetree, renderRelationNode } from "./utils";
+import { filterTreeByName, filterTree, filterTreeByNameTable, filterObj, getNotSelectKeys, getKeysAndTitle, getBottomKey, renderLeafNodetree, renderRelationNode, createTitle } from "./utils";
 import classnames from "classnames";
 import CheckList from "./CheckList";
 import PropTypes from "prop-types";
@@ -94,7 +96,9 @@ var QuickTransfer = /*#__PURE__*/forwardRef(function (props, ref) {
     _props$showBorder = props.showBorder,
     showBorder = _props$showBorder === void 0 ? false : _props$showBorder,
     _props$searchOption = props.searchOption,
-    searchOption = _props$searchOption === void 0 ? {} : _props$searchOption;
+    searchOption = _props$searchOption === void 0 ? {} : _props$searchOption,
+    _props$caseSensitive = props.caseSensitive,
+    caseSensitive = _props$caseSensitive === void 0 ? false : _props$caseSensitive;
   var _searchOption$leftSea = searchOption.leftSearchOption,
     _searchOption$leftSea2 = _searchOption$leftSea === void 0 ? {} : _searchOption$leftSea,
     _searchOption$leftSea3 = _searchOption$leftSea2.onChange,
@@ -340,10 +344,10 @@ var QuickTransfer = /*#__PURE__*/forwardRef(function (props, ref) {
       setData(newData);
       setListCheckedStyle(listCheckedKeys_, newData);
     }
-    if (type === "tree") {
-      newData = filterTree(dataSource, searchValue);
-      setData(newData);
-    }
+    // if (type === "tree") {
+    //     newData = filterTree(dataSource, searchValue);
+    //     setData(newData);
+    // }
     if (type === "table") {
       newData = filterTreeByNameTable(dataSource, searchValue, searchColumns ? searchColumns : newSearchColumns);
       setData(newData);
@@ -449,15 +453,9 @@ var QuickTransfer = /*#__PURE__*/forwardRef(function (props, ref) {
   var renderTreeData = function renderTreeData(data) {
     return data.map(function (item) {
       if (item.children) {
-        if (item.children.length === 0) {
-          return _objectSpread(_objectSpread({}, item), {}, {
-            title: treeSelect === "leafNode" ? /*#__PURE__*/React.createElement("span", null, item.title, /*#__PURE__*/React.createElement("small", null, "(", localeObj.noAddItem, ")")) : item.title
-          });
-        } else {
-          return _objectSpread(_objectSpread({}, item), {}, {
-            children: renderTreeData(item.children)
-          });
-        }
+        return _objectSpread(_objectSpread({}, item), {}, {
+          children: renderTreeData(item.children)
+        });
       } else {
         return item;
       }
@@ -646,10 +644,11 @@ var QuickTransfer = /*#__PURE__*/forwardRef(function (props, ref) {
         onChange: onCheckAllChange,
         checked: checkAll
       }, allSelectedTextRender ? allSelectedTextRender(listCheckedKeys, data) : allSelectedText), data.map(function (value) {
-        var index = value.title.toLowerCase().indexOf(saveSearchValueLeft.toLowerCase());
-        var beforeTitle = value.title.substr(0, index);
-        var searchValue = value.title.substr(index, saveSearchValueLeft.length);
-        var afterTitle = value.title.substr(index + saveSearchValueLeft.length);
+        var _createTitle = createTitle(caseSensitive, saveSearchValueLeft, value.title),
+          index = _createTitle.index,
+          beforeTitle = _createTitle.beforeTitle,
+          afterTitle = _createTitle.afterTitle,
+          searchStr = _createTitle.searchStr;
         return /*#__PURE__*/React.createElement(_Checkbox, {
           key: value.key,
           checked: listCheckedKeys.includes(value.key),
@@ -657,11 +656,14 @@ var QuickTransfer = /*#__PURE__*/forwardRef(function (props, ref) {
             return onChangeChecked(e, value);
           },
           disabled: value.disabled
-        }, index > -1 ? /*#__PURE__*/React.createElement("span", null, beforeTitle, /*#__PURE__*/React.createElement("span", {
+        }, /*#__PURE__*/React.createElement(_TooltipText, {
+          title: value.title,
+          placement: 'topLeft'
+        }, /*#__PURE__*/React.createElement("span", null, index > -1 ? /*#__PURE__*/React.createElement(React.Fragment, null, beforeTitle, /*#__PURE__*/React.createElement("span", {
           style: {
             color: "#F5222D"
           }
-        }, searchValue), afterTitle) : value.title);
+        }, searchStr), afterTitle) : value.title)));
       }));
     }
     if (type === "table") {
@@ -685,7 +687,8 @@ var QuickTransfer = /*#__PURE__*/forwardRef(function (props, ref) {
         selectable: false,
         defaultExpandAll: defaultExpandAll,
         searchValue: saveSearchValueLeft,
-        searchHighlight: true
+        searchHighlight: true,
+        caseSensitive: caseSensitive
       }, treeRest));
     }
   };
@@ -903,6 +906,13 @@ QuickTransfer.propTypes = {
    *  allSelectedTextRender(listCheckedKeys,data)
    * }
    */
-  leftContentOption: PropTypes.object
+  leftContentOption: PropTypes.object,
+  /**
+   * 是否区分大小写
+   * leftContentOption = {
+   *  allSelectedTextRender(listCheckedKeys,data)
+   * }
+   */
+  caseSensitive: PropTypes.bool
 };
 export default QuickTransfer;

package/lib/QuickTransfer/index.less

@@ -3,362 +3,400 @@
 @table-padding-horizontal-md: 12px; // ui规范
 
 .cw-transfer-main {
-    display: flex;
-    background: @component-background;
+  display: flex;
+  background: @component-background;
+  height: 100%;
+
+  &.cw-transfer-main-has-border {
+    border: @border-width-base @border-style-base @border-color-split;
+    border-radius: @border-radius-base;
+  }
+
+  .cw-transfer-left {
+    width: 50%;
     height: 100%;
+    display: flex;
+    flex-direction: column;
 
-    &.cw-transfer-main-has-border {
-        border: @border-width-base @border-style-base @border-color-split;
-        border-radius: @border-radius-base;
-    }
+    .cw-transfer-left-content {
+      width: 100%;
+      flex: 1;
+      display: flex;
+      flex-direction: column;
+      overflow: hidden;
 
-    .cw-transfer-left {
-        width: 50%;
-        height: 100%;
-        display: flex;
-        flex-direction: column;
-        .cw-transfer-left-content {
-            width: 100%;
-            flex: 1;
-            display: flex;
-            flex-direction: column;
-            overflow: hidden;
+      .cw-transfer-left-top {
+        padding: 8px 16px 0;
+      }
 
-            .cw-transfer-left-top {
-                padding: 8px 16px 0;
-            }
-            .cw-transfer-left-main-wrapper{
-                flex: 1;
-                overflow: auto;
-                // table
-                .cw-common-table {
-                    border: none;
-                    .cw-common-table-title-box {
-                        border: none;
-                    }
-                }
-                .cw-transfer-table {
-                    padding: 0 16px;
-                }
-            }
-            small {
-                display: none;
-                margin-left: 8px;
-                color: #faad14
-            }
+      .cw-transfer-left-main-wrapper {
+        flex: 1;
+        overflow: auto;
+        // table
+        .cw-common-table {
+          border: none;
 
-            .@{ant-prefix}-tree-treenode-checkbox-checked {
-                small {
-                    display: inline;
-                }
-            }
+          .cw-common-table-title-box {
+            border: none;
+          }
+        }
+
+        .cw-transfer-table {
+          padding: 0 16px;
+        }
+
+      }
+
+      small {
+        display: none;
+        margin-left: 8px;
+        color: #faad14
+      }
 
+      .@{ant-prefix}-tree-treenode-checkbox-checked {
+        small {
+          display: inline;
+        }
+      }
 
-            .cw-transfer-left-content-checkbox {
-                display: flex;
-                flex-direction: column;
 
-                .@{checkbox-prefix-cls}-wrapper+.@{checkbox-prefix-cls}-wrapper {
-                    margin: 0;
-                }
+      .cw-transfer-left-content-checkbox {
+        display: flex;
+        flex-direction: column;
 
-                .@{checkbox-prefix-cls}-wrapper {
-                    flex: 1;
-                    padding: 8px 16px;
-                }
+        .@{checkbox-prefix-cls}-wrapper + .@{checkbox-prefix-cls}-wrapper {
+          margin: 0;
+        }
 
-                .@{checkbox-prefix-cls}-wrapper:hover {
-                    background: @item-hover-bg; // 符合UI规范
-                }
-            }
+        .@{checkbox-prefix-cls}-wrapper {
+          flex: 1;
+          padding: 8px 16px;
+          display: flex;
+          width: 100%;
+          align-items: center;
         }
+
+        .@{checkbox-prefix-cls}-wrapper span:nth-of-type(2) {
+          width: 100%;
+        }
+
+        .@{checkbox-prefix-cls}-wrapper:hover {
+          background: @item-hover-bg; // 符合UI规范
+        }
+      }
     }
-    .cw-transfer-footer {
-        height: 40px;
+  }
+
+  .cw-transfer-footer {
+    height: 40px;
+    display: flex;
+    align-items: center;
+    // border-top: 1px solid #e8e8e8;
+    padding: 8px 16px;
+  }
+
+  .cw-transfer-division {
+    width: @border-width-base;
+    background-color: @background-color-base;
+  }
+
+  .cw-transfer-right {
+    width: 50%;
+    height: 100%;
+    display: flex;
+    flex-direction: column;
+
+    .cw-transfer-right-content {
+      // border: 1px solid #e8e8e8;
+      display: flex;
+      flex: 1;
+      width: 100%;
+      overflow: hidden;
+      flex-direction: column;
+
+      .cw-transfer-right-header {
         display: flex;
+        text-align: center;
         align-items: center;
-        // border-top: 1px solid #e8e8e8;
-        padding: 8px 16px;
-    }
-    .cw-transfer-division {
-        width: @border-width-base;
-        background-color: @background-color-base;
-    }
+        padding: 12px 16px; // 符合UI规范
+        &.cw-transfer-right-header-has-search {
+          padding: 8px 16px; // 符合UI规范
+        }
 
-    .cw-transfer-right {
-        width: 50%;
-        height: 100%;
-        display: flex;
-        flex-direction: column;
-        .cw-transfer-right-content {
-            // border: 1px solid #e8e8e8;
+        .cw-transfer-right-header-top {
+          display: flex;
+          justify-content: space-between;
+          width: 100%;
+          line-height: 20px;
+          cursor: pointer;
+
+          .cw-transfer-right-header-clear {
+            color: @primary-color;
+          }
+        }
+
+      }
+
+      .cw-transfer-right-main-wrapper {
+        flex: 1;
+        overflow: auto;
+
+        .cw-transfer-right-content-main {
+          line-height: 20px; // 符合UI规范
+          padding: 8px 16px;
+          display: flex;
+          justify-content: space-between;
+          align-items: center;
+          position: relative;
+
+          &.drop-over-downward {
+            border-bottom: 1px dashed @primary-color;
+            padding-bottom: 7px;
+          }
+
+          &.drop-over-upward {
+            border-top: 1px dashed @primary-color;
+            padding-top: 7px;
+          }
+
+          .cw-transfer-right-content-drag {
+            color: @text-color;
+            position: absolute;
+            left: 8px;
+            display: block;
+          }
+
+          &:hover {
+            background-color: @item-hover-bg; // 符合UI规范
+
+            .cw-transfer-right-content-drag {
+              color: @primary-color;
+              display: block;
+            }
+          }
+
+          .cw-transfer-right-content-item {
             display: flex;
-            flex: 1;
+            align-items: center;
             width: 100%;
-            overflow: hidden;
-            flex-direction: column;
-
-            .cw-transfer-right-header {
-                display: flex;
-                text-align: center;
-                align-items: center;
-                padding: 12px 16px; // 符合UI规范
-                &.cw-transfer-right-header-has-search{
-                    padding: 8px 16px; // 符合UI规范
-                }
-                .cw-transfer-right-header-top {
-                    display: flex;
-                    justify-content: space-between;
-                    width: 100%;
-                    line-height: 20px;
-                    cursor: pointer;
-
-                    .cw-transfer-right-header-clear {
-                        color: @primary-color;
-                    }
-                }
 
+            .cw-transfer-right-content-item-drag-wrapper {
+              display: flex;
+              justify-content: center;
+              align-items: center;
+              width: 14px;
+              height: 14px;
+              margin-right: 8px;
             }
-            .cw-transfer-right-main-wrapper{
-                flex: 1;
-                overflow: auto;
-                .cw-transfer-right-content-main {
-                    line-height: 20px; // 符合UI规范
-                    padding: 8px 16px;
-                    display: flex;
-                    justify-content: space-between;
-                    align-items: center;
-                    position: relative;
-                    &.drop-over-downward{
-                        border-bottom: 1px dashed @primary-color;
-                        padding-bottom: 7px;
-                    }
-                    &.drop-over-upward{
-                        border-top: 1px dashed @primary-color;
-                        padding-top: 7px;
-                    }
-                    .cw-transfer-right-content-drag {
-                        color: @text-color;
-                        position: absolute;
-                        left: 8px;
-                        display: block;
-                    }
-        
-                    &:hover {
-                        background-color: @item-hover-bg; // 符合UI规范
-        
-                        .cw-transfer-right-content-drag {
-                            color: @primary-color;
-                            display: block;
-                        }
-                    }
-                    .cw-transfer-right-content-item{
-                        display: flex;
-                        align-items: center;
-                        width: 100%;
-                        .cw-transfer-right-content-item-drag-wrapper{
-                            display: flex;
-                            justify-content: center;
-                            align-items: center;
-                            width: 14px;
-                            height: 14px;
-                            margin-right: 8px;
-                        }
-                        .cw-transfer-right-content-item-text-wrapper{
-                            flex: 1;
-                        }
-                    }
-                }
-        
-                .cw-transfer-right-content-del {
-                    cursor: pointer;
-                    // font-size: 14px;
-                }
-        
-                .cw-transfer-right-content-del:hover {
-                    color: @primary-5;
-                }
+
+            .cw-transfer-right-content-item-text-wrapper {
+              flex: 1;
             }
+          }
         }
+
+        .cw-transfer-right-content-del {
+          cursor: pointer;
+          // font-size: 14px;
+        }
+
+        .cw-transfer-right-content-del:hover {
+          color: @primary-5;
+        }
+      }
     }
-    .cw-transfer-search {
-        display: flex;
-        text-align: center;
-        align-items: center;
-        padding: 8px 16px; // 符合UI规范
-    }
+  }
+
+  .cw-transfer-search {
+    display: flex;
+    text-align: center;
+    align-items: center;
+    padding: 8px 16px; // 符合UI规范
+  }
 }
 
 .cw-transfer-left-main-wrapper {
-    .cw-tree-location-box {
-        .cw-tree-box {
-            .cw-tree {
-                .@{ant-prefix}-tree li .@{ant-prefix}-tree-node-content-wrapper {
-                    height: 36px !important;
-                    line-height: 36px !important;
-                }
-                line-height: 36px;
-                .@{ant-prefix}-tree-node-content-wrapper {
-                    .@{ant-prefix}-tree-title {
-                        height: 36px;
-                        line-height: 36px;
-                        .cw-tree-treenode-title {
-                            height: 36px;
-                            line-height: 36px;
-                        }
-                        //  使用ant变量
-                        .cw-tree-treenode-extend {
-                            .cw-tree-treenode-extend-dropdown {
-                                height: 36px;
-                                line-height: 36px;
-
-                            }
-                        }
-                    }
-                }
-            }
+  .cw-tree-location-box {
+    .cw-tree-box {
+      .cw-tree {
+        .@{ant-prefix}-tree li .@{ant-prefix}-tree-node-content-wrapper {
+          height: 36px !important;
+          line-height: 36px !important;
+        }
 
+        line-height: 36px;
 
-            .@{ant-prefix}-tree.@{ant-prefix}-tree-directory>li span.@{ant-prefix}-tree-node-content-wrapper::before,
-            .@{ant-prefix}-tree.@{ant-prefix}-tree-directory .@{ant-prefix}-tree-child-tree>li span.@{ant-prefix}-tree-node-content-wrapper::before {
-                height: 36px;
-                line-height: 36px;
+        .@{ant-prefix}-tree-node-content-wrapper {
+          .@{ant-prefix}-tree-title {
+            height: 36px;
+            line-height: 36px;
+
+            .cw-tree-treenode-title {
+              height: 36px;
+              line-height: 36px;
             }
 
-            .cw-tree.@{ant-prefix}-tree-directory>li span.@{ant-prefix}-tree-node-content-wrapper>span,
-            .cw-tree.@{ant-prefix}-tree-directory .@{ant-prefix}-tree-child-tree>li span.@{ant-prefix}-tree-node-content-wrapper>span {
+            //  使用ant变量
+            .cw-tree-treenode-extend {
+              .cw-tree-treenode-extend-dropdown {
                 height: 36px;
                 line-height: 36px;
+
+              }
             }
+          }
         }
-        .cw-tree-drag {
-            .cw-tree {
+      }
+
 
-                .@{ant-prefix}-tree li .@{ant-prefix}-tree-node-content-wrapper {
-                    height: 36px !important;
-                    line-height: 36px !important;
-                }
+      .@{ant-prefix}-tree.@{ant-prefix}-tree-directory > li span.@{ant-prefix}-tree-node-content-wrapper::before,
+      .@{ant-prefix}-tree.@{ant-prefix}-tree-directory .@{ant-prefix}-tree-child-tree > li span.@{ant-prefix}-tree-node-content-wrapper::before {
+        height: 36px;
+        line-height: 36px;
+      }
+
+      .cw-tree.@{ant-prefix}-tree-directory > li span.@{ant-prefix}-tree-node-content-wrapper > span,
+      .cw-tree.@{ant-prefix}-tree-directory .@{ant-prefix}-tree-child-tree > li span.@{ant-prefix}-tree-node-content-wrapper > span {
+        height: 36px;
+        line-height: 36px;
+      }
+    }
+
+    .cw-tree-drag {
+      .cw-tree {
+
+        .@{ant-prefix}-tree li .@{ant-prefix}-tree-node-content-wrapper {
+          height: 36px !important;
+          line-height: 36px !important;
+        }
+
+        line-height: 36px;
+
+        .@{ant-prefix}-tree-node-content-wrapper {
+          .@{ant-prefix}-tree-title {
+            height: 36px;
+            line-height: 36px;
+
+            .cw-tree-treenode-content {
+              .cw-tree-treenode-title {
+                height: 36px;
                 line-height: 36px;
-                .@{ant-prefix}-tree-node-content-wrapper {
-                    .@{ant-prefix}-tree-title {
-                        height: 36px;
-                        line-height: 36px;
-                        .cw-tree-treenode-content {
-                            .cw-tree-treenode-title {
-                                height: 36px;
-                                line-height: 36px;
-                            }
-                        }
-
-                        //  使用ant变量
-                        .cw-tree-treenode-extend {
-                            display: inline-flex;
-                            background-color: transparent;
-                            // background-color: @primary-1;
-                            transition: all 0.3s;
-
-                            .cw-tree-treenode-extend-dropdown-drag {
-                                line-height: 36px;
-                            }
-                        }
-
-                        .cw-tree-treenode-extend-show {
-                            .cw-tree-treenode-extend-dropdown-drag {
-                                height: 36px;
-                            }
-                        }
-                    }
-                }
+              }
             }
-            .@{ant-prefix}-tree.@{ant-prefix}-tree-directory>li span.@{ant-prefix}-tree-node-content-wrapper::before,
-            .@{ant-prefix}-tree.@{ant-prefix}-tree-directory .@{ant-prefix}-tree-child-tree>li span.@{ant-prefix}-tree-node-content-wrapper::before {
-                height: 36px;
+
+            //  使用ant变量
+            .cw-tree-treenode-extend {
+              display: inline-flex;
+              background-color: transparent;
+              // background-color: @primary-1;
+              transition: all 0.3s;
+
+              .cw-tree-treenode-extend-dropdown-drag {
                 line-height: 36px;
+              }
             }
 
-            .cw-tree.@{ant-prefix}-tree-directory>li span.@{ant-prefix}-tree-node-content-wrapper>span,
-            .cw-tree.@{ant-prefix}-tree-directory .@{ant-prefix}-tree-child-tree>li span.@{ant-prefix}-tree-node-content-wrapper>span {
+            .cw-tree-treenode-extend-show {
+              .cw-tree-treenode-extend-dropdown-drag {
                 height: 36px;
-                line-height: 36px;
+              }
             }
+          }
         }
+      }
 
-        .@{ant-prefix}-tree.@{ant-prefix}-tree-directory>li span.@{ant-prefix}-tree-switcher,
-        .@{ant-prefix}-tree.@{ant-prefix}-tree-directory .@{ant-prefix}-tree-child-tree>li span.@{ant-prefix}-tree-switcher {
-            height: 36px !important;
-            line-height: 36px !important;
-        }
+      .@{ant-prefix}-tree.@{ant-prefix}-tree-directory > li span.@{ant-prefix}-tree-node-content-wrapper::before,
+      .@{ant-prefix}-tree.@{ant-prefix}-tree-directory .@{ant-prefix}-tree-child-tree > li span.@{ant-prefix}-tree-node-content-wrapper::before {
+        height: 36px;
+        line-height: 36px;
+      }
 
-        .@{ant-prefix}-tree.@{ant-prefix}-tree-directory>li span.@{ant-prefix}-tree-node-content-wrapper::before,
-        .@{ant-prefix}-tree.@{ant-prefix}-tree-directory .@{ant-prefix}-tree-child-tree>li span.@{ant-prefix}-tree-node-content-wrapper::before {
-            height: 36px;
-            line-height: 36px;
-        }
+      .cw-tree.@{ant-prefix}-tree-directory > li span.@{ant-prefix}-tree-node-content-wrapper > span,
+      .cw-tree.@{ant-prefix}-tree-directory .@{ant-prefix}-tree-child-tree > li span.@{ant-prefix}-tree-node-content-wrapper > span {
+        height: 36px;
+        line-height: 36px;
+      }
+    }
 
-        .@{ant-prefix}-tree.@{ant-prefix}-tree-directory>li.@{ant-prefix}-tree-treenode-selected>span.@{ant-prefix}-tree-node-content-wrapper::before,
-        .@{ant-prefix}-tree.@{ant-prefix}-tree-directory .@{ant-prefix}-tree-child-tree>li.@{ant-prefix}-tree-treenode-selected>span.@{ant-prefix}-tree-node-content-wrapper::before {
-            height: 36px;
-            line-height: 36px;
-        }
-        .@{ant-prefix}-tree-directory>li span.@{ant-prefix}-tree-node-content-wrapper>span,
-        .cw-tree.@{ant-prefix}-tree-directory .@{ant-prefix}-tree-child-tree>li span.@{ant-prefix}-tree-node-content-wrapper>span {
-            height: 36px;
-            line-height: 36px;
-        }
+    .@{ant-prefix}-tree.@{ant-prefix}-tree-directory > li span.@{ant-prefix}-tree-switcher,
+    .@{ant-prefix}-tree.@{ant-prefix}-tree-directory .@{ant-prefix}-tree-child-tree > li span.@{ant-prefix}-tree-switcher {
+      height: 36px !important;
+      line-height: 36px !important;
+    }
 
-        .@{ant-prefix}-tree-node-content-wrapper>span {
-            height: 36px !important;
-            line-height: 36px !important;
-        }
-        .cw-tree-treenode {
-            .@{ant-prefix}-tree-checkbox {
-                transform: translateY(0); // 修复选择框与文字未对齐
-            }
-        }
+    .@{ant-prefix}-tree.@{ant-prefix}-tree-directory > li span.@{ant-prefix}-tree-node-content-wrapper::before,
+    .@{ant-prefix}-tree.@{ant-prefix}-tree-directory .@{ant-prefix}-tree-child-tree > li span.@{ant-prefix}-tree-node-content-wrapper::before {
+      height: 36px;
+      line-height: 36px;
     }
 
-    .cw-tree-location-box .cw-tree-box .cw-tree.@{ant-prefix}-tree-directory>li.@{ant-prefix}-tree-treenode-selected>span.@{ant-prefix}-tree-node-content-wrapper::before,
-    .cw-tree-location-box .cw-tree-box .cw-tree.@{ant-prefix}-tree-directory .@{ant-prefix}-tree-child-tree>li.@{ant-prefix}-tree-treenode-selected>span.@{ant-prefix}-tree-node-content-wrapper::before {
-        height: 36px !important;
-        line-height: 36px !important;
+    .@{ant-prefix}-tree.@{ant-prefix}-tree-directory > li.@{ant-prefix}-tree-treenode-selected > span.@{ant-prefix}-tree-node-content-wrapper::before,
+    .@{ant-prefix}-tree.@{ant-prefix}-tree-directory .@{ant-prefix}-tree-child-tree > li.@{ant-prefix}-tree-treenode-selected > span.@{ant-prefix}-tree-node-content-wrapper::before {
+      height: 36px;
+      line-height: 36px;
     }
 
-    .cw-tree-location-box .cw-tree-box .cw-tree .cw-tree-treenode .@{ant-prefix}-tree-node-content-wrapper {
-        height: 36px;
-        line-height: 36px;
+    .@{ant-prefix}-tree-directory > li span.@{ant-prefix}-tree-node-content-wrapper > span,
+    .cw-tree.@{ant-prefix}-tree-directory .@{ant-prefix}-tree-child-tree > li span.@{ant-prefix}-tree-node-content-wrapper > span {
+      height: 36px;
+      line-height: 36px;
     }
 
-    .@{ant-prefix}-tree li.drag-over::before {
-        height: 36px;
+    .@{ant-prefix}-tree-node-content-wrapper > span {
+      height: 36px !important;
+      line-height: 36px !important;
     }
 
+    .cw-tree-treenode {
+      .@{ant-prefix}-tree-checkbox {
+        transform: translateY(0); // 修复选择框与文字未对齐
+      }
+    }
+  }
 
-    .@{table-prefix-cls}-middle {
-        > .@{table-prefix-cls}-title,
-        > .@{table-prefix-cls}-content > .@{table-prefix-cls}-footer {
-            padding: 8px @table-padding-horizontal-md 7px;
-        }
-        > .@{table-prefix-cls}-content {
-          > .@{table-prefix-cls}-header > table,
-          > .@{table-prefix-cls}-body > table,
-          > .@{table-prefix-cls}-scroll > .@{table-prefix-cls}-header > table,
-          > .@{table-prefix-cls}-scroll > .@{table-prefix-cls}-body > table,
-          > .@{table-prefix-cls}-fixed-left > .@{table-prefix-cls}-header > table,
-          > .@{table-prefix-cls}-fixed-right > .@{table-prefix-cls}-header > table,
-          > .@{table-prefix-cls}-fixed-left
-            > .@{table-prefix-cls}-body-outer
-            > .@{table-prefix-cls}-body-inner
-            > table,
-          > .@{table-prefix-cls}-fixed-right
-            > .@{table-prefix-cls}-body-outer
-            > .@{table-prefix-cls}-body-inner
-            > table {
-            > .@{table-prefix-cls}-thead > tr > th,
-            > .@{table-prefix-cls}-tbody > tr > td {
-                padding: 8px @table-padding-horizontal-md 7px;
-            }
-          }
+  .cw-tree-location-box .cw-tree-box .cw-tree.@{ant-prefix}-tree-directory > li.@{ant-prefix}-tree-treenode-selected > span.@{ant-prefix}-tree-node-content-wrapper::before,
+  .cw-tree-location-box .cw-tree-box .cw-tree.@{ant-prefix}-tree-directory .@{ant-prefix}-tree-child-tree > li.@{ant-prefix}-tree-treenode-selected > span.@{ant-prefix}-tree-node-content-wrapper::before {
+    height: 36px !important;
+    line-height: 36px !important;
+  }
+
+  .cw-tree-location-box .cw-tree-box .cw-tree .cw-tree-treenode .@{ant-prefix}-tree-node-content-wrapper {
+    height: 36px;
+    line-height: 36px;
+  }
+
+  .@{ant-prefix}-tree li.drag-over::before {
+    height: 36px;
+  }
+
+
+  .@{table-prefix-cls}-middle {
+    > .@{table-prefix-cls}-title,
+    > .@{table-prefix-cls}-content > .@{table-prefix-cls}-footer {
+      padding: 8px @table-padding-horizontal-md 7px;
+    }
+
+    > .@{table-prefix-cls}-content {
+      > .@{table-prefix-cls}-header > table,
+      > .@{table-prefix-cls}-body > table,
+      > .@{table-prefix-cls}-scroll > .@{table-prefix-cls}-header > table,
+      > .@{table-prefix-cls}-scroll > .@{table-prefix-cls}-body > table,
+      > .@{table-prefix-cls}-fixed-left > .@{table-prefix-cls}-header > table,
+      > .@{table-prefix-cls}-fixed-right > .@{table-prefix-cls}-header > table,
+      > .@{table-prefix-cls}-fixed-left
+      > .@{table-prefix-cls}-body-outer
+      > .@{table-prefix-cls}-body-inner
+      > table,
+      > .@{table-prefix-cls}-fixed-right
+      > .@{table-prefix-cls}-body-outer
+      > .@{table-prefix-cls}-body-inner
+      > table {
+        > .@{table-prefix-cls}-thead > tr > th,
+        > .@{table-prefix-cls}-tbody > tr > td {
+          padding: 8px @table-padding-horizontal-md 7px;
         }
-      
       }
-}
+    }
+
+  }
+}

package/lib/QuickTransfer/utils.js

@@ -67,6 +67,18 @@ export var KMPMatch = function KMPMatch(str, pattern) {
     return -1;
   }
 };
+export var createTitle = function createTitle(caseSensitive, searchValue, title) {
+  var index = caseSensitive ? KMPMatch(title, searchValue) : KMPMatch(title.toLowerCase(), searchValue.toLowerCase());
+  var beforeTitle = title.substr(0, index);
+  var searchStr = title.substr(index, searchValue.length);
+  var afterTitle = title.substr(index + searchValue.length);
+  return {
+    beforeTitle: beforeTitle,
+    afterTitle: afterTitle,
+    searchStr: searchStr,
+    index: index
+  };
+};
 function generateNextArr(pattern) {
   var i = 0;
   var j = -1;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@chaoswise/ui",
-  "version": "2.3.6",
+  "version": "2.3.8",
   "description": "公共UI库",
   "keywords": [
     "ui",
@@ -140,5 +140,5 @@
     "access": "public"
   },
   "license": "MIT",
-  "gitHead": "6c8d75666cf9208346704fc975f2aa9bbe148e11"
+  "gitHead": "5c3d424c7a7595e63664d10264230b8b3132e023"
 }