@zat-design/sisyphus-react 4.0.0-beta.3 → 4.0.0-beta.5

package/es/ProTree/components/ProTree.js

@@ -1,8 +1,13 @@
-import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+import "antd/es/spin/style";
+import _Spin from "antd/es/spin";
+import "antd/es/checkbox/style";
+import _Checkbox from "antd/es/checkbox";
+import "antd/es/input/style";
+import _Input from "antd/es/input";
 import _regeneratorRuntime from "@babel/runtime/helpers/esm/regeneratorRuntime";
 import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
-import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
-import _typeof from "@babel/runtime/helpers/esm/typeof";
+import "antd/es/message/style";
+import _message from "antd/es/message";
 import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
@@ -11,7 +16,6 @@ import { useEffect } from 'react';
 import classNames from 'classnames';
 import { CaretDownOutlined, Loading3QuartersOutlined } from '@ant-design/icons';
 import { useDeepCompareEffect, useSetState, useRequest as useRequestFunc } from 'ahooks';
-import { Checkbox, Input, message, Spin } from 'antd';
 import { cloneDeep, isFunction } from 'lodash';
 import { ReactSVG } from 'react-svg';
 import { useProConfig } from "../../ProConfigProvider";
@@ -22,7 +26,7 @@ import searchSVG from "../../assets/input-search.svg";
 import "../style/index.less";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
-var ProTree = function ProTree(props) {
+var ProTree = props => {
   var _props$otherProps, _props$otherProps2, _locale$ProTree, _state$innerExpandKey2, _state$innerExpandKey3, _locale$ProTree2, _locale$ProTree3, _locale$ProTree4;
   var _useProConfig = useProConfig('ProEnum'),
     _useProConfig$dics = _useProConfig.dics,
@@ -86,7 +90,7 @@ var ProTree = function ProTree(props) {
     _useSetState2 = _slicedToArray(_useSetState, 2),
     state = _useSetState2[0],
     setState = _useSetState2[1];
-  useEffect(function () {
+  useEffect(() => {
     if (expandedKeys) {
       setState({
         innerExpandKeys: expandedKeys
@@ -95,7 +99,7 @@ var ProTree = function ProTree(props) {
   }, [expandedKeys]);
   var fetchFunction = useRequestFunc(useRequest === null || useRequest === void 0 ? void 0 : useRequest.service, _objectSpread({
     manual: true,
-    onSuccess: function onSuccess(res) {
+    onSuccess: res => {
       if (transformResponse && typeof transformResponse === 'function') {
         var responseData = transformResponse(res);
         var flatTrees = getFlatTreeData(responseData, fieldNames);
@@ -113,7 +117,7 @@ var ProTree = function ProTree(props) {
           msg = res.message,
           data = res.data;
         if (status !== 200) {
-          message.error(msg);
+          _message.error(msg);
           return;
         }
         var _flatTrees = getFlatTreeData(data, fieldNames);
@@ -129,7 +133,7 @@ var ProTree = function ProTree(props) {
     },
     debounceWait: 300
   }, useRequest === null || useRequest === void 0 ? void 0 : useRequest.options));
-  useDeepCompareEffect(function () {
+  useDeepCompareEffect(() => {
     if (dataSource && dataSource.length) {
       var allKey = getAllKeys(dataSource, fieldNames);
       setState({
@@ -160,7 +164,7 @@ var ProTree = function ProTree(props) {
       });
     }
   }, [dataSource, enumCode]);
-  useDeepCompareEffect(function () {
+  useDeepCompareEffect(() => {
     if (enumCode || dataSource) {
       return undefined;
     }
@@ -174,7 +178,7 @@ var ProTree = function ProTree(props) {
     // 执行用户配置的枚举服务，拉取枚举数据进行更新
     fetchFunction.run(params);
   }, [useRequest === null || useRequest === void 0 ? void 0 : useRequest.options]);
-  var handleSignalSelect = function handleSignalSelect(value) {
+  var handleSignalSelect = value => {
     var checkedValues = [];
     var innerVal = value;
     if (labelInValue) {
@@ -184,10 +188,10 @@ var ProTree = function ProTree(props) {
       checkedValues = innerVal;
     }
     setState({
-      checkedValues: checkedValues
+      checkedValues
     });
   };
-  var handleCheckSelect = function handleCheckSelect(allKeys) {
+  var handleCheckSelect = allKeys => {
     var checkedValues = [];
     if (allValue && typeof value === 'string') {
       // 如果value等于allValue那么全选中，否则选中value得值
@@ -200,26 +204,22 @@ var ProTree = function ProTree(props) {
       var innerVal = value;
       // 开启 labelInValue [{ label:xx, value: ""}] 形式、需要取出来 value
       if (labelInValue) {
-        var isObjectArray = innerVal && innerVal.every(function (element) {
-          return _typeof(element) === 'object' && element !== null;
-        });
+        var isObjectArray = innerVal && innerVal.every(element => typeof element === 'object' && element !== null);
         if (!isObjectArray) {
           console.error('Please enter an array object');
         }
-        checkedValues = innerVal && innerVal.map(function (item) {
-          return item[fieldNameValue];
-        });
+        checkedValues = innerVal && innerVal.map(item => item[fieldNameValue]);
       } else {
         // 复选，单纯value数组场景
         checkedValues = innerVal;
       }
     }
     setState({
-      checkedValues: checkedValues,
+      checkedValues,
       checkAll: checkedValues.length === allKeys.length
     });
   };
-  useEffect(function () {
+  useEffect(() => {
     if (value) {
       var allKeys = state.allKeys;
       if (!(other !== null && other !== void 0 && other.checkable)) {
@@ -240,41 +240,37 @@ var ProTree = function ProTree(props) {
   /**
    * 复选事件处理函数，全选事件处理函数
    */
-  var handleFinish = function handleFinish(allValue, checkAll, checkedValues, checkedNode) {
+  var handleFinish = (allValue, checkAll, checkedValues, checkedNode) => {
     if (disabled || isView) {
       return null;
     }
     // 全选的时候返回 allValue 标记即可
     setState({
-      checkedValues: checkedValues
+      checkedValues
     });
     if (allValue !== undefined && checkAll) {
       onChange && onChange(allValue);
     } else {
       var values = checkedValues;
-      var options = state.flatTreeData.filter(function (item) {
-        return values.includes(item[fieldNameValue]);
-      });
+      var options = state.flatTreeData.filter(item => values.includes(item[fieldNameValue]));
       if (checkedNode) {
         options = checkedNode;
         delete options[(fieldNames === null || fieldNames === void 0 ? void 0 : fieldNames.children) || 'children'];
       }
       if (labelInValue) {
-        values = state.flatTreeData.filter(function (item) {
-          return values.includes(item[fieldNameValue]);
-        });
+        values = state.flatTreeData.filter(item => values.includes(item[fieldNameValue]));
       }
       onChange && onChange(values, options);
     }
   };
 
   // 该方法只有复选框，在勾中checkbox后才会走到这个方法
-  var onCheck = function onCheck(checkedKeys, info) {
+  var onCheck = (checkedKeys, info) => {
     var _info$node;
     if (disabled || isView) {
       return null;
     }
-    var checkedValues = _toConsumableArray(state.checkedValues);
+    var checkedValues = [...state.checkedValues];
     var originalTreeData = state.originalTreeData;
 
     // 此时应该取消掉自身并包含它所有的子集
@@ -283,29 +279,21 @@ var ProTree = function ProTree(props) {
       // 2. 把所有的子节点也要取消
       var childrenkeys = [];
       getChildrenKeys(info.node, childrenkeys, fieldNames, 'treeCheck');
-      checkedValues = checkedValues.filter(function (key) {
-        return !childrenkeys.includes(key);
-      });
+      checkedValues = checkedValues.filter(key => !childrenkeys.includes(key));
 
       // 3. 取消父节点
       var parentNodes = findTreeNodeByKey(originalTreeData, info.node.key, fieldNames);
-      var parentKeys = parentNodes.reduce(function (prev, curr) {
-        return prev.concat(curr[fieldNameValue]);
-      }, []);
-      checkedValues = checkedValues.filter(function (key) {
-        return !parentKeys.includes(key);
-      });
+      var parentKeys = parentNodes.reduce((prev, curr) => prev.concat(curr[fieldNameValue]), []);
+      checkedValues = checkedValues.filter(key => !parentKeys.includes(key));
     } else {
       // checkStrictly 模式下取 checkedKeys.checked 或者自身的 key
       if (checkStrictly) {
         if (!info.checked) {
-          checkedValues = checkedValues.filter(function (key) {
-            return key !== info.node.key;
-          });
+          checkedValues = checkedValues.filter(key => key !== info.node.key);
         }
         checkedKeys = checkedKeys.checked || [];
       }
-      checkedKeys.forEach(function (key) {
+      checkedKeys.forEach(key => {
         var exist = checkedValues.includes(key);
         if (info.checked && !exist) {
           checkedValues.push(key);
@@ -317,9 +305,7 @@ var ProTree = function ProTree(props) {
       checkAll: checkAllTemp
     });
     var checkNodeValue = info === null || info === void 0 || (_info$node = info.node) === null || _info$node === void 0 ? void 0 : _info$node[fieldNameValue];
-    var options = state.flatTreeData.filter(function (item) {
-      return checkNodeValue === item[fieldNameValue];
-    });
+    var options = state.flatTreeData.filter(item => checkNodeValue === item[fieldNameValue]);
     handleFinish(allValue, checkAllTemp, checkedValues, Array.isArray(options) ? options === null || options === void 0 ? void 0 : options[0] : options);
     if (other !== null && other !== void 0 && other.onCheck) {
       other.onCheck(checkedKeys, {
@@ -329,7 +315,7 @@ var ProTree = function ProTree(props) {
       });
     }
   };
-  var onSearch = function onSearch(e) {
+  var onSearch = e => {
     var str = e.target.value;
     setState({
       searchStr: str
@@ -344,7 +330,7 @@ var ProTree = function ProTree(props) {
   /**
    * 全选操作,改变自身state并将值通过onchange上传到form
    */
-  var handleAllCheck = function handleAllCheck(e) {
+  var handleAllCheck = e => {
     if (disabled || isView) {
       return null;
     }
@@ -386,13 +372,9 @@ var ProTree = function ProTree(props) {
             });
           case 7:
             values = props;
-            options = state.flatTreeData.filter(function (item) {
-              return values === item[fieldNameValue];
-            });
+            options = state.flatTreeData.filter(item => values === item[fieldNameValue]);
             if (labelInValue) {
-              values = state.flatTreeData.filter(function (item) {
-                return values === item[fieldNameValue];
-              });
+              values = state.flatTreeData.filter(item => values === item[fieldNameValue]);
             }
             option = (_options$ = options === null || options === void 0 ? void 0 : options[0]) !== null && _options$ !== void 0 ? _options$ : {};
             delete option[(fieldNames === null || fieldNames === void 0 ? void 0 : fieldNames.children) || 'children'];
@@ -412,11 +394,12 @@ var ProTree = function ProTree(props) {
       return _ref2.apply(this, arguments);
     };
   }();
-  var boxClass = classNames(_defineProperty({
+  var boxClass = classNames({
     'pro-tree': true,
-    'footer-shadow': footer
-  }, className, className));
-  var toggleExpand = function toggleExpand() {
+    'footer-shadow': footer,
+    [className]: className
+  });
+  var toggleExpand = () => {
     var _state$innerExpandKey;
     if (state !== null && state !== void 0 && (_state$innerExpandKey = state.innerExpandKeys) !== null && _state$innerExpandKey !== void 0 && _state$innerExpandKey.length) {
       setState({
@@ -424,7 +407,7 @@ var ProTree = function ProTree(props) {
       });
     } else {
       var expandKeys = [];
-      state === null || state === void 0 || state.flatTreeData.map(function (item) {
+      state === null || state === void 0 || state.flatTreeData.map(item => {
         var val = item[fieldNameValue];
         expandKeys.push(val);
         return item;
@@ -443,14 +426,14 @@ var ProTree = function ProTree(props) {
   return /*#__PURE__*/_jsx("div", {
     className: boxClass,
     style: style,
-    children: /*#__PURE__*/_jsx(Spin, {
+    children: /*#__PURE__*/_jsx(_Spin, {
       spinning: state.clickShowLoading,
       indicator: antIcon,
       children: /*#__PURE__*/_jsxs("div", {
         className: "pro-tree-content",
         children: [/*#__PURE__*/_jsxs("div", {
           className: "pro-tree-header-box",
-          children: [showSearch && /*#__PURE__*/_jsx(Input, {
+          children: [showSearch && /*#__PURE__*/_jsx(_Input, {
             disabled: disabled,
             allowClear: true,
             value: state.searchStr,
@@ -467,7 +450,7 @@ var ProTree = function ProTree(props) {
               className: "tree-title-text",
               children: title
             }), showExpand && /*#__PURE__*/_jsxs("div", {
-              className: "expand-button ".concat(state !== null && state !== void 0 && (_state$innerExpandKey2 = state.innerExpandKeys) !== null && _state$innerExpandKey2 !== void 0 && _state$innerExpandKey2.length ? 'expand' : ''),
+              className: `expand-button ${state !== null && state !== void 0 && (_state$innerExpandKey2 = state.innerExpandKeys) !== null && _state$innerExpandKey2 !== void 0 && _state$innerExpandKey2.length ? 'expand' : ''}`,
               onClick: toggleExpand,
               children: [/*#__PURE__*/_jsx("div", {
                 className: "expand-icon",
@@ -498,7 +481,7 @@ var ProTree = function ProTree(props) {
           className: allValue || footer ? 'pro-tree-footer-box' : '',
           children: [/*#__PURE__*/_jsx("div", {
             className: "check-all-box",
-            children: allValue !== undefined ? /*#__PURE__*/_jsx(Checkbox, {
+            children: allValue !== undefined ? /*#__PURE__*/_jsx(_Checkbox, {
               checked: state.checkAll,
               disabled: disabled,
               onChange: handleAllCheck,