@zat-design/sisyphus-react 4.1.3-beta.5 → 4.1.3-beta.6

package/es/ProTreeModal/components/Tree.js

@@ -13,12 +13,12 @@ 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; }
 /* eslint-disable no-plusplus */
-import React, { forwardRef, useEffect, useMemo, useState } from 'react';
+import React, { forwardRef, useEffect, useMemo, useRef, useState } from 'react';
 import { Tree } from 'antd';
 import ListComponent from "./List";
 import SearchTitle from "./SearchTitle";
 import CloseIcon from "./CloseIcon";
-import { filterCheckedNodes, getParentKey } from "../utils";
+import { filterCheckedNodes, getAllKeys, getParentKey } from "../utils";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 import { Fragment as _Fragment } from "react/jsx-runtime";
@@ -53,6 +53,7 @@ function List(props, ref) {
     _useState4 = _slicedToArray(_useState3, 2),
     autoExpandParent = _useState4[0],
     setAutoExpandParent = _useState4[1];
+  var hasInitializedExpand = useRef(false);
   useEffect(() => {
     if (searchStr) {
       var newExpandedKeys = flatTreeData.map(item => {
@@ -66,6 +67,14 @@ function List(props, ref) {
       setAutoExpandParent(true);
     }
   }, [searchStr]);
+  useEffect(() => {
+    if (!searchStr && !hasInitializedExpand.current && originalTreeData !== null && originalTreeData !== void 0 && originalTreeData.length) {
+      var defaultExpandedKeys = getAllKeys(originalTreeData || [], fieldNames);
+      setExpandedKeys(defaultExpandedKeys);
+      setAutoExpandParent(true);
+      hasInitializedExpand.current = true;
+    }
+  }, [originalTreeData, fieldNames, searchStr]);
   var _treeData = useMemo(() => {
     function fn() {
       var loop = (data, index) => {

package/es/ProTreeModal/components/Trigger.js

@@ -62,13 +62,21 @@ function Trigger(props) {
         mode: 'appoint'
       });
     }
-  }, [checkAll]);
+  }, [allValue, value, appoint, checkAll]);
   var onIconClick = () => {
     if (appoint && state.mode === 'all') {
       return;
     }
     handleClick();
   };
+  var viewIconClassName = classNames('pro-tree-modal-view-svg', {
+    'pro-tree-modal-view-svg-active': !!isView && checkedValues.length > 0 && state.mode !== 'all' && !afterDisabled,
+    'pro-tree-modal-view-svg-not-allowed': appoint && state.mode === 'all'
+  });
+  var addonAfterClassName = classNames('pro-enum-input-addonAfter', {
+    'pro-enum-input-addonAfter-not-allowed': appoint && state.mode === 'all',
+    'trigger-no-hover': afterDisabled
+  });
   if (isView) {
     var _locale$ProTreeModal;
     return /*#__PURE__*/_jsxs("div", {
@@ -80,9 +88,9 @@ function Trigger(props) {
           num: checkedValues.length
         })
       }), /*#__PURE__*/_jsx("div", {
-        className: "pro-enum-input-addonAfter",
+        className: addonAfterClassName,
         children: /*#__PURE__*/_jsx(ReactSVG, {
-          className: "pro-tree-modal-view-svg",
+          className: viewIconClassName,
           src: viewSvg,
           onClick: onIconClick
         })
@@ -161,14 +169,14 @@ function Trigger(props) {
           flex: 1
         })
       })), /*#__PURE__*/_jsxs("div", {
-        className: "pro-enum-input-addonAfter",
+        className: addonAfterClassName,
         children: [checkedValues.length > 0 && !afterDisabled && /*#__PURE__*/_jsx("span", {
           className: "close-icon",
           children: /*#__PURE__*/_jsx(CloseOutlined, {
             onClick: handleClearAll
           })
         }), /*#__PURE__*/_jsx(ReactSVG, {
-          className: "pro-tree-modal-view-svg",
+          className: viewIconClassName,
           src: viewSvg,
           onClick: onIconClick
         })]

package/es/ProTreeModal/index.js

@@ -780,7 +780,7 @@ var ProTreeModal = props => {
         title: title,
         mode: "Modal",
         className: "pro-tree-modal-container",
-        extraLeft: allValue !== undefined ? /*#__PURE__*/_jsx(Checkbox, {
+        extraLeft: allValue !== undefined && !isView ? /*#__PURE__*/_jsx(Checkbox, {
           checked: state.checkAll,
           disabled: disabled,
           onChange: handleAllCheck,
@@ -811,12 +811,12 @@ var ProTreeModal = props => {
               className: "pro-tree-modal-box-header",
               children: [/*#__PURE__*/_jsxs("span", {
                 children: [locale === null || locale === void 0 || (_locale$ProTreeModal11 = locale.ProTreeModal) === null || _locale$ProTreeModal11 === void 0 ? void 0 : _locale$ProTreeModal11.check, " (", state.checkedValues.length, "/", max || state.flatTreeData.length, ")"]
-              }), /*#__PURE__*/_jsx(Button, {
+              }), !isView ? /*#__PURE__*/_jsx(Button, {
                 disabled: disabled,
                 type: "link",
                 onClick: handleClearAll,
                 children: locale === null || locale === void 0 || (_locale$ProTreeModal12 = locale.ProTreeModal) === null || _locale$ProTreeModal12 === void 0 ? void 0 : _locale$ProTreeModal12.clearAll
-              })]
+              }) : null]
             }), /*#__PURE__*/_jsx("div", {
               className: "pro-tree-modal-tree-warp  pro-transfer-right",
               children: renderView()

package/es/ProTreeModal/style/index.less

@@ -53,10 +53,13 @@
   }
   
   &:hover{
-    .pro-enum-input-addonAfter {
+    .pro-enum-input-addonAfter:not(.trigger-no-hover):not(.pro-enum-input-addonAfter-not-allowed) {
       border-color: var(--zaui-brand-hover, #3387ff);
       color: var(--zaui-brand-hover, #3387ff);
     }
+    .pro-enum-input-addonAfter:not(.trigger-no-hover):not(.pro-enum-input-addonAfter-not-allowed) .pro-tree-modal-view-svg-active {
+      color: var(--zaui-brand-hover, #3387ff);
+    }
   }
   &-placeholder {
     color: #939499;
@@ -72,11 +75,28 @@
     }
   }
   .pro-tree-modal-view-svg {
+    color: inherit;
     div {
       display: flex;
     }
   }
 
+  .pro-tree-modal-view-svg-active {
+    color: var(--zaui-brand, #006aff);
+  }
+
+  .pro-tree-modal-view-svg-not-allowed {
+    cursor: not-allowed;
+    div,
+    svg {
+      cursor: not-allowed;
+    }
+  }
+
+  .pro-enum-input-addonAfter-not-allowed {
+    cursor: not-allowed;
+  }
+
   &-content {
     display: flex;
     flex-direction: row;

package/lib/ProTreeModal/components/Tree.js

@@ -60,6 +60,7 @@ function List(props, ref) {
     _useState4 = _slicedToArray(_useState3, 2),
     autoExpandParent = _useState4[0],
     setAutoExpandParent = _useState4[1];
+  var hasInitializedExpand = (0, _react.useRef)(false);
   (0, _react.useEffect)(() => {
     if (searchStr) {
       var newExpandedKeys = flatTreeData.map(item => {
@@ -73,6 +74,14 @@ function List(props, ref) {
       setAutoExpandParent(true);
     }
   }, [searchStr]);
+  (0, _react.useEffect)(() => {
+    if (!searchStr && !hasInitializedExpand.current && originalTreeData !== null && originalTreeData !== void 0 && originalTreeData.length) {
+      var defaultExpandedKeys = (0, _utils.getAllKeys)(originalTreeData || [], fieldNames);
+      setExpandedKeys(defaultExpandedKeys);
+      setAutoExpandParent(true);
+      hasInitializedExpand.current = true;
+    }
+  }, [originalTreeData, fieldNames, searchStr]);
   var _treeData = (0, _react.useMemo)(() => {
     function fn() {
       var loop = (data, index) => {

package/lib/ProTreeModal/components/Trigger.js

@@ -70,13 +70,21 @@ function Trigger(props) {
         mode: 'appoint'
       });
     }
-  }, [checkAll]);
+  }, [allValue, value, appoint, checkAll]);
   var onIconClick = () => {
     if (appoint && state.mode === 'all') {
       return;
     }
     handleClick();
   };
+  var viewIconClassName = (0, _classnames.default)('pro-tree-modal-view-svg', {
+    'pro-tree-modal-view-svg-active': !!isView && checkedValues.length > 0 && state.mode !== 'all' && !afterDisabled,
+    'pro-tree-modal-view-svg-not-allowed': appoint && state.mode === 'all'
+  });
+  var addonAfterClassName = (0, _classnames.default)('pro-enum-input-addonAfter', {
+    'pro-enum-input-addonAfter-not-allowed': appoint && state.mode === 'all',
+    'trigger-no-hover': afterDisabled
+  });
   if (isView) {
     var _locale$ProTreeModal;
     return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
@@ -88,9 +96,9 @@ function Trigger(props) {
           num: checkedValues.length
         })
       }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-        className: "pro-enum-input-addonAfter",
+        className: addonAfterClassName,
         children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactSvg.ReactSVG, {
-          className: "pro-tree-modal-view-svg",
+          className: viewIconClassName,
           src: _view.default,
           onClick: onIconClick
         })
@@ -169,14 +177,14 @@ function Trigger(props) {
           flex: 1
         })
       })), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-        className: "pro-enum-input-addonAfter",
+        className: addonAfterClassName,
         children: [checkedValues.length > 0 && !afterDisabled && /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
           className: "close-icon",
           children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.CloseOutlined, {
             onClick: handleClearAll
           })
         }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactSvg.ReactSVG, {
-          className: "pro-tree-modal-view-svg",
+          className: viewIconClassName,
           src: _view.default,
           onClick: onIconClick
         })]

package/lib/ProTreeModal/index.js

@@ -787,7 +787,7 @@ var ProTreeModal = props => {
         title: title,
         mode: "Modal",
         className: "pro-tree-modal-container",
-        extraLeft: allValue !== undefined ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.Checkbox, {
+        extraLeft: allValue !== undefined && !isView ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.Checkbox, {
           checked: state.checkAll,
           disabled: disabled,
           onChange: handleAllCheck,
@@ -818,12 +818,12 @@ var ProTreeModal = props => {
               className: "pro-tree-modal-box-header",
               children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("span", {
                 children: [_locale.default === null || _locale.default === void 0 || (_locale$ProTreeModal11 = _locale.default.ProTreeModal) === null || _locale$ProTreeModal11 === void 0 ? void 0 : _locale$ProTreeModal11.check, " (", state.checkedValues.length, "/", max || state.flatTreeData.length, ")"]
-              }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.Button, {
+              }), !isView ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.Button, {
                 disabled: disabled,
                 type: "link",
                 onClick: handleClearAll,
                 children: _locale.default === null || _locale.default === void 0 || (_locale$ProTreeModal12 = _locale.default.ProTreeModal) === null || _locale$ProTreeModal12 === void 0 ? void 0 : _locale$ProTreeModal12.clearAll
-              })]
+              }) : null]
             }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
               className: "pro-tree-modal-tree-warp  pro-transfer-right",
               children: renderView()

package/lib/ProTreeModal/style/index.less

@@ -53,10 +53,13 @@
   }
   
   &:hover{
-    .pro-enum-input-addonAfter {
+    .pro-enum-input-addonAfter:not(.trigger-no-hover):not(.pro-enum-input-addonAfter-not-allowed) {
       border-color: var(--zaui-brand-hover, #3387ff);
       color: var(--zaui-brand-hover, #3387ff);
     }
+    .pro-enum-input-addonAfter:not(.trigger-no-hover):not(.pro-enum-input-addonAfter-not-allowed) .pro-tree-modal-view-svg-active {
+      color: var(--zaui-brand-hover, #3387ff);
+    }
   }
   &-placeholder {
     color: #939499;
@@ -72,11 +75,28 @@
     }
   }
   .pro-tree-modal-view-svg {
+    color: inherit;
     div {
       display: flex;
     }
   }
 
+  .pro-tree-modal-view-svg-active {
+    color: var(--zaui-brand, #006aff);
+  }
+
+  .pro-tree-modal-view-svg-not-allowed {
+    cursor: not-allowed;
+    div,
+    svg {
+      cursor: not-allowed;
+    }
+  }
+
+  .pro-enum-input-addonAfter-not-allowed {
+    cursor: not-allowed;
+  }
+
   &-content {
     display: flex;
     flex-direction: row;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zat-design/sisyphus-react",
-  "version": "4.1.3-beta.5",
+  "version": "4.1.3-beta.6",
   "license": "MIT",
   "main": "lib/index.js",
   "module": "es/index.js",