@zat-design/sisyphus-react 3.0.16-beta.2 → 3.1.4

package/lib/ProStep/index.js

@@ -1,18 +1,18 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.useStep = exports.default = exports.ProStepContext = void 0;
 var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
 var _regeneratorRuntime2 = _interopRequireDefault(require("@babel/runtime/helpers/regeneratorRuntime"));
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-var _react = _interopRequireWildcard(require("react"));
+var _jsxRuntime = require("react/jsx-runtime");
+var _react = require("react");
 var _ahooks = require("ahooks");
 var _utils = require("./utils");
 var _Step = _interopRequireDefault(require("./components/Step"));
@@ -20,12 +20,10 @@ var _Item = _interopRequireDefault(require("./components/Item"));
 var _Listener = _interopRequireDefault(require("./components/Listener"));
 require("./style/index.less");
 var _excluded = ["children"];
-var ProStepContext = /*#__PURE__*/(0, _react.createContext)(null);
-exports.ProStepContext = ProStepContext;
-var useStep = function useStep() {
+var ProStepContext = exports.ProStepContext = /*#__PURE__*/(0, _react.createContext)(null);
+var useStep = exports.useStep = function useStep() {
   return (0, _react.useContext)(ProStepContext) || {};
 };
-exports.useStep = useStep;
 var ProStep = function ProStep(_ref) {
   var children = _ref.children,
     resetProps = (0, _objectWithoutProperties2.default)(_ref, _excluded);
@@ -34,18 +32,58 @@ var ProStep = function ProStep(_ref) {
     _useSetState2 = (0, _slicedToArray2.default)(_useSetState, 2),
     errorCollection = _useSetState2[0],
     setErrorCollection = _useSetState2[1];
+  // 注册子节点id与title映射的集合
+  var _useSetState3 = (0, _ahooks.useSetState)({}),
+    _useSetState4 = (0, _slicedToArray2.default)(_useSetState3, 2),
+    registerMap = _useSetState4[0],
+    setRegisterMap = _useSetState4[1];
+  var _useState = (0, _react.useState)([]),
+    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+    anchorIds = _useState2[0],
+    setAnchorIds = _useState2[1];
   var _useLocalStorageState = (0, _ahooks.useLocalStorageState)('cache-pro-step'),
     _useLocalStorageState2 = (0, _slicedToArray2.default)(_useLocalStorageState, 2),
     setLocalData = _useLocalStorageState2[1];
-  var dataSource = resetProps.dataSource,
-    targetOffset = resetProps.targetOffset;
+  var targetOffset = resetProps.targetOffset,
+    _resetProps$collapse = resetProps.collapse,
+    collapse = _resetProps$collapse === void 0 ? false : _resetProps$collapse;
   var values = {};
+  var dataSource = (0, _react.useMemo)(function () {
+    var _Object$entries, _Object$entries$map;
+    if (resetProps === null || resetProps === void 0 ? void 0 : resetProps.dataSource) {
+      return resetProps === null || resetProps === void 0 ? void 0 : resetProps.dataSource;
+    }
+    return (_Object$entries = Object.entries(registerMap)) === null || _Object$entries === void 0 ? void 0 : (_Object$entries$map = _Object$entries.map) === null || _Object$entries$map === void 0 ? void 0 : _Object$entries$map.call(_Object$entries, function (_ref2) {
+      var _ref3 = (0, _slicedToArray2.default)(_ref2, 2),
+        key = _ref3[0],
+        _ref3$ = _ref3[1],
+        title = _ref3$.title,
+        order = _ref3$.order;
+      return {
+        code: key,
+        name: title,
+        order: order
+      };
+    }).filter(function (item) {
+      return anchorIds.includes(item.code);
+    }).sort(function (pre, next) {
+      return pre.order - next.order;
+    });
+  }, [resetProps === null || resetProps === void 0 ? void 0 : resetProps.dataSource, registerMap, anchorIds]);
   // 用来注册form匹配到对应的模块id
-  var register = function register(_ref2) {
-    var id = _ref2.id,
-      form = _ref2.form,
-      validator = _ref2.validator,
-      disabled = _ref2.disabled;
+  var register = function register(_ref4) {
+    var id = _ref4.id,
+      form = _ref4.form,
+      title = _ref4.title,
+      validator = _ref4.validator,
+      order = _ref4.order,
+      disabled = _ref4.disabled;
+    if (title && !registerMap[id]) {
+      setRegisterMap((0, _defineProperty2.default)({}, id, {
+        title: title,
+        order: order
+      }));
+    }
     if (disabled) {
       return null;
     }
@@ -78,7 +116,10 @@ var ProStep = function ProStep(_ref) {
             _context.prev = 13;
             _context.t0 = _context["catch"](1);
             num = _context.t0 === null || _context.t0 === void 0 ? void 0 : (_errors$errorFields = _context.t0.errorFields) === null || _errors$errorFields === void 0 ? void 0 : _errors$errorFields.length;
-            setLocalData(false);
+            if (num) {
+              setLocalData(false);
+              console.error(_context.t0);
+            }
           case 17:
             setErrorCollection((0, _defineProperty2.default)({}, id, num));
           case 18:
@@ -89,7 +130,7 @@ var ProStep = function ProStep(_ref) {
     })));
   };
   var notify = /*#__PURE__*/function () {
-    var _ref4 = (0, _asyncToGenerator2.default)( /*#__PURE__*/(0, _regeneratorRuntime2.default)().mark(function _callee2() {
+    var _ref6 = (0, _asyncToGenerator2.default)( /*#__PURE__*/(0, _regeneratorRuntime2.default)().mark(function _callee2() {
       return (0, _regeneratorRuntime2.default)().wrap(function _callee2$(_context2) {
         while (1) switch (_context2.prev = _context2.next) {
           case 0:
@@ -104,9 +145,31 @@ var ProStep = function ProStep(_ref) {
       }, _callee2);
     }));
     return function notify() {
-      return _ref4.apply(this, arguments);
+      return _ref6.apply(this, arguments);
     };
   }();
+  var handleListenerDom = function handleListenerDom() {
+    var targetElement = document.getElementById('pro-step');
+    var observer = new MutationObserver(function (mutations) {
+      mutations.forEach(function (mutation) {
+        // 处理 DOM 树变化的逻辑
+        var Anchors = document.getElementsByClassName('pro-step-item') || [];
+        // 当前页面所存在的所有折叠项
+        var nextAnchorIds = [];
+        Array.prototype.slice.call(Anchors).forEach(function (dom) {
+          var id = dom.getAttribute('id');
+          nextAnchorIds.push(id);
+        });
+        setAnchorIds(nextAnchorIds);
+      });
+    });
+    var config = {
+      subtree: true,
+      childList: true // 是否观察子元素的添加或删除
+    };
+
+    observer.observe(targetElement, config);
+  };
   (0, _react.useEffect)(function () {
     var errorModuleKeys = Object.keys(errorCollection).reverse();
     if (errorModuleKeys === null || errorModuleKeys === void 0 ? void 0 : errorModuleKeys.length) {
@@ -121,21 +184,28 @@ var ProStep = function ProStep(_ref) {
         targetOffset: targetOffset
       });
     }
-  }, [errorCollection]);
-  return /*#__PURE__*/_react.default.createElement(ProStepContext.Provider, {
+  }, [errorCollection, dataSource]);
+  (0, _react.useEffect)(function () {
+    handleListenerDom();
+  }, []);
+  return (0, _jsxRuntime.jsx)(ProStepContext.Provider, {
     value: {
+      collapse: collapse,
       register: register,
       notify: notify,
       handleScroll: _utils.handleScroll
-    }
-  }, /*#__PURE__*/_react.default.createElement("div", {
-    className: "pro-step-wrapper"
-  }, children, /*#__PURE__*/_react.default.createElement(_Step.default, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, resetProps), {}, {
-    errorCollection: errorCollection
-  }))));
+    },
+    children: (0, _jsxRuntime.jsxs)("div", {
+      className: "pro-step-wrapper",
+      id: "pro-step",
+      children: [children, (0, _jsxRuntime.jsx)(_Step.default, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, resetProps), {}, {
+        dataSource: dataSource,
+        errorCollection: errorCollection
+      }))]
+    })
+  });
 };
 ProStep.useStep = useStep;
 ProStep.Item = _Item.default;
 ProStep.Listener = _Listener.default;
-var _default = ProStep;
-exports.default = _default;
+var _default = exports.default = ProStep;

package/lib/ProStep/propsType.d.ts

@@ -2,10 +2,11 @@ import { ReactNode } from 'react';
 export interface ItemType {
     name: string;
     code: string;
+    order?: number;
 }
 export interface ProStepPropsType {
     /** @name 步骤条配置项 */
-    dataSource: ItemType[];
+    dataSource?: ItemType[];
     /** @name 距离顶部的偏移量 */
     fixedTop: number;
     /** @name 当前已激活的key */
@@ -16,4 +17,13 @@ export interface ProStepPropsType {
     style?: any;
     /** @name 滚动偏移量 */
     targetOffset?: number;
+    /** @name 是否使用折叠标题 */
+    collapse?: boolean;
+}
+export interface ProStepItem {
+    id: string;
+    title?: string;
+    collapse?: boolean;
+    order?: number;
+    [key: string]: any;
 }

package/lib/ProStep/style/index.less

@@ -5,13 +5,13 @@
 .pro-step {
   position        : fixed;
   right           : 0;
-  z-index         : 999;
+  z-index         : 101;
   min-width       : 48px;
   min-height      : 48px;
   text-align      : center;
-  background-color: #fff;
+  background-color: var(--zaui-global-bg, #fff);
   cursor          : pointer;
-  box-shadow      : -1px 0px 5px 0px rgba(0, 0, 0, 0.1);
+  box-shadow      : -1px 0px 5px 0px var(--zaui-shadow, rgba(56,56,56,0.15));
   transition      : width .2s;
   overflow-x: hidden;
   overflow-y: auto;
@@ -22,10 +22,10 @@
     width        : 100%;
     height       : 48px;
     font-size    : var(--zaui-font-size-lg, 16px);
-    border-bottom: 1px solid #dee0e3;
+    border-bottom: 1px solid var(--zaui-line, #dddddd);
 
     >.menu-icon {
-      font-size: 24px;
+      font-size: var(--zaui-font-size-lg-title, 24px);
       fill     : var(--zaui-brand, #006AFF);
 
       >div {
@@ -52,7 +52,7 @@
     justify-content: space-between;
     width          : 100%;
     height         : 48px;
-    padding-right  : 16px;
+    padding-right  : var(--zaui-space-size-md, 24px);
 
     &:hover {
       background-color: rgba(185, 185, 189, 0.1);
@@ -102,11 +102,11 @@
           display        : flex;
           align-items    : center;
           justify-content: center;
-          font-size      : 12px;
+          font-size      : var(--zaui-font-size-sm, 12px);
           color          : #ffffff;
           width          : 18px;
           height         : 18px;
-          background     : var(--zaui-brand);
+          background     : var(--zaui-brand, #006AFF);
           border-radius  : 9px;
 
           &.errored {
@@ -149,7 +149,7 @@
         >span {
           color        : #ff5050;
           font-weight  : 600;
-          font-size    : 10px;
+          font-size    : var(--aui-font-size-sm, 12px);
           font-family  : PingFangSC-Semibold, PingFang SC;
           border-radius: 8px;
         }
@@ -159,23 +159,9 @@
 
   &.open {
     width: 200px;
-
-    >.topMulu {
-      color      : #1d2129;
-      font-weight: 500;
-      font-size  : var(--zaui-font-size-xl);
-      font-family: PingFangSC-Medium, PingFang SC;
-      line-height: 25px;
-
-      >div {
-        display    : flex;
-        align-items: center;
-
-      }
-    }
   }
 
   &.closed {
     width: 48px;
   }
-}
+}

package/lib/ProStep/utils/index.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.handleScroll = exports.default = void 0;
 var _lodash = require("lodash");
-var handleScroll = function handleScroll(id, options) {
+var handleScroll = exports.handleScroll = function handleScroll(id, options) {
   var _ref = options || {},
     _ref$targetOffset = _ref.targetOffset,
     targetOffset = _ref$targetOffset === void 0 ? 0 : _ref$targetOffset;
@@ -19,6 +19,4 @@ var handleScroll = function handleScroll(id, options) {
     }, 100), 0);
   }
 };
-exports.handleScroll = handleScroll;
-var _default = handleScroll;
-exports.default = _default;
+var _default = exports.default = handleScroll;

package/lib/ProTable/components/RenderColumn/index.d.ts

@@ -0,0 +1,14 @@
+import { FC } from 'react';
+import { ProTableValueType } from '../../propsType';
+interface Props {
+    valueType?: ProTableValueType;
+    code?: string | string[] | (() => string);
+    value?: any;
+    record?: any;
+    copyable?: boolean;
+    ellipsis?: any;
+    width?: number | string;
+    transform?: (value: any, record?: any) => string[];
+}
+declare const RenderColumn: FC<Props>;
+export default RenderColumn;

package/lib/ProTable/components/RenderColumn/index.js

@@ -0,0 +1,81 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _jsxRuntime = require("react/jsx-runtime");
+var _antd = require("antd");
+var _icons = require("@ant-design/icons");
+var _reactSvg = require("react-svg");
+var _ProForm = _interopRequireDefault(require("../../../ProForm"));
+var _getEnumLabel = _interopRequireDefault(require("../../../ProEnum/utils/getEnumLabel"));
+var _copy = _interopRequireDefault(require("../../../assets/copy.svg"));
+var Paragraph = _antd.Typography.Paragraph,
+  Text = _antd.Typography.Text;
+// @ts-ignore
+var RenderColumn = function RenderColumn(props) {
+  var valueType = props.valueType,
+    code = props.code,
+    value = props.value,
+    record = props.record,
+    copyable = props.copyable,
+    ellipsis = props.ellipsis,
+    width = props.width,
+    transform = props.transform;
+  if (valueType === 'address') {
+    var _newValue$filter;
+    var newValue = transform ? transform(value, record) : value;
+    if (!newValue || Array.isArray(newValue) && (newValue === null || newValue === void 0 ? void 0 : (_newValue$filter = newValue.filter(function (item) {
+      return !!item;
+    })) === null || _newValue$filter === void 0 ? void 0 : _newValue$filter.length) === 0) {
+      return '-';
+    }
+    return (0, _jsxRuntime.jsx)(_ProForm.default.ProAddressBar, {
+      isView: true,
+      code: code,
+      value: newValue
+    });
+  }
+  if (copyable) {
+    return (0, _jsxRuntime.jsx)("span", {
+      className: "copyable-table-cell",
+      children: (0, _jsxRuntime.jsx)(Paragraph, {
+        style: ellipsis ? {
+          width: width
+        } : undefined,
+        ellipsis: ellipsis ? {
+          tooltip: value
+        } : false,
+        copyable: {
+          text: value,
+          icon: [(0, _jsxRuntime.jsx)(_reactSvg.ReactSVG, {
+            className: "drag-icon",
+            src: _copy.default
+          }, "copy-icon"), (0, _jsxRuntime.jsx)(_icons.CheckOutlined, {}, "copied-icon")],
+          tooltips: ['复制', '复制成功']
+        },
+        children: value
+      })
+    });
+  }
+  if (ellipsis) {
+    var node = value;
+    if (['enumName', 'enumCodeName'].includes(valueType)) {
+      node = (0, _getEnumLabel.default)(typeof code === 'function' ? code() : code, value, valueType === 'enumCodeName');
+    }
+    return value ? (0, _jsxRuntime.jsx)(Text, {
+      style: {
+        width: width
+      },
+      ellipsis: {
+        tooltip: true,
+        onEllipsis: function onEllipsis() {}
+      },
+      children: node
+    }) : '-';
+  }
+  return null;
+};
+var _default = exports.default = RenderColumn;

package/lib/ProTable/components/ResizableLine/index.d.ts

@@ -1,3 +1,2 @@
-import React from 'react';
-declare const ResizableLine: () => React.JSX.Element;
+declare const ResizableLine: () => JSX.Element;
 export default ResizableLine;

package/lib/ProTable/components/ResizableLine/index.js

@@ -1,18 +1,16 @@
 "use strict";
 
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _react = _interopRequireDefault(require("react"));
+var _jsxRuntime = require("react/jsx-runtime");
 var ResizableLine = function ResizableLine() {
-  return /*#__PURE__*/_react.default.createElement("span", {
+  return (0, _jsxRuntime.jsx)("span", {
     className: "pro-table-resizable-line",
     style: {
       display: 'none'
     }
   });
 };
-var _default = ResizableLine;
-exports.default = _default;
+var _default = exports.default = ResizableLine;

package/lib/ProTable/components/TableResizable/index.d.ts

@@ -1,4 +1,3 @@
-import React from 'react';
 declare const _default: {
     components: {
         header: {
@@ -7,7 +6,7 @@ declare const _default: {
                 onDrag: any;
                 width: number;
                 minwidth?: number;
-            }) => React.JSX.Element;
+            }) => JSX.Element;
         };
     };
 };

package/lib/ProTable/components/TableResizable/index.js

@@ -1,7 +1,6 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -9,7 +8,8 @@ exports.default = void 0;
 var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-var _react = _interopRequireWildcard(require("react"));
+var _jsxRuntime = require("react/jsx-runtime");
+var _react = require("react");
 var _reactResizable = require("react-resizable");
 var _classnames = _interopRequireDefault(require("classnames"));
 var _index = require("../../index");
@@ -39,13 +39,13 @@ var ResizableTitle = function ResizableTitle(props) {
     offset = _useState2[0],
     setOffset = _useState2[1];
   if (restProps === null || restProps === void 0 ? void 0 : (_restProps$className = restProps.className) === null || _restProps$className === void 0 ? void 0 : _restProps$className.includes('ant-table-selection-column')) {
-    return /*#__PURE__*/_react.default.createElement("th", (0, _objectSpread2.default)({}, restProps));
+    return (0, _jsxRuntime.jsx)("th", (0, _objectSpread2.default)({}, restProps));
   }
-  return /*#__PURE__*/_react.default.createElement(_reactResizable.Resizable, {
+  return (0, _jsxRuntime.jsx)(_reactResizable.Resizable, {
     width: Number(width) + Number(offset),
     minConstraints: [minwidth, 0],
     height: 0,
-    handle: /*#__PURE__*/_react.default.createElement("span", {
+    handle: (0, _jsxRuntime.jsx)("span", {
       className: (0, _classnames.default)(['react-resizable-handle', offset && 'active']),
       style: {
         transform: "translateX(".concat(offset, "px)")
@@ -87,21 +87,23 @@ var ResizableTitle = function ResizableTitle(props) {
     },
     draggableOpts: {
       enableUserSelectHack: false
-    }
-  }, /*#__PURE__*/_react.default.createElement("th", (0, _objectSpread2.default)((0, _objectSpread2.default)({}, restProps), {}, {
-    style: (0, _objectSpread2.default)({
-      overflow: 'visible'
-    }, restProps.style)
-  }), /*#__PURE__*/_react.default.createElement("div", {
-    className: "pro-table-th-cell"
-  }, restProps.children)));
+    },
+    children: (0, _jsxRuntime.jsx)("th", (0, _objectSpread2.default)((0, _objectSpread2.default)({}, restProps), {}, {
+      style: (0, _objectSpread2.default)({
+        overflow: 'visible'
+      }, restProps.style),
+      children: (0, _jsxRuntime.jsx)("div", {
+        className: "pro-table-th-cell",
+        children: restProps.children
+      })
+    }))
+  });
 };
 var components = {
   header: {
     cell: ResizableTitle
   }
 };
-var _default = {
+var _default = exports.default = {
   components: components
-};
-exports.default = _default;
+};

package/lib/ProTable/components/TooltipTitle/index.d.ts

@@ -0,0 +1,11 @@
+import { FC, ReactNode } from 'react';
+import { ColumnTitle } from 'antd/es/table/interface';
+interface Props {
+    title: ColumnTitle<any>;
+    tooltip?: ReactNode | {
+        title?: ReactNode;
+        icon?: ReactNode;
+    };
+}
+declare const TooltipTitle: FC<Props>;
+export default TooltipTitle;

package/lib/ProTable/components/TooltipTitle/index.js

@@ -0,0 +1,29 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _jsxRuntime = require("react/jsx-runtime");
+var _antd = require("antd");
+var _reactSvg = require("react-svg");
+var _tip = _interopRequireDefault(require("../../../assets/tip.svg"));
+var TooltipTitle = function TooltipTitle(props) {
+  var title = props.title,
+    tooltip = props.tooltip;
+  var _ref = tooltip || {},
+    tooltipTitle = _ref.title,
+    icon = _ref.icon;
+  return (0, _jsxRuntime.jsxs)("span", {
+    className: "pro-table-tooltip",
+    children: [title, (0, _jsxRuntime.jsx)(_antd.Tooltip, {
+      title: tooltipTitle !== null && tooltipTitle !== void 0 ? tooltipTitle : tooltip,
+      children: (0, _jsxRuntime.jsx)(_reactSvg.ReactSVG, {
+        className: "icon-tip",
+        src: icon || _tip.default
+      })
+    })]
+  });
+};
+var _default = exports.default = TooltipTitle;

package/lib/ProTable/index.d.ts

@@ -1,11 +1,11 @@
-import React from 'react';
+/// <reference types="react" />
 import { ProTableProps } from './propsType';
-export declare const TableContext: React.Context<{}>;
+export declare const TableContext: import("react").Context<{}>;
 export declare const defaultPage: {
     pageNum: number;
     pageSize: number;
 };
-declare function ProTable(props: ProTableProps): React.JSX.Element;
+declare function ProTable(props: ProTableProps): JSX.Element;
 declare namespace ProTable {
     var defaultProps: {
         quickConfig: boolean;