@zat-design/sisyphus-react 3.1.5 → 3.2.0

package/lib/ProForm/style/index.less

@@ -11,6 +11,28 @@
 @import '../components/old/EnumSelect/style/index.less';
 
 .pro-form {
+  &.ant-form-vertical {
+    .ant-form-item .ant-form-item-label {
+      flex: none !important;
+    }
+
+    .pro-form-custom-footer {
+      display      : flex;
+      align-items  : center;
+      margin-bottom: 0;
+      height       : auto;
+      padding-top  : 6px;
+
+      .ant-space-align-center {
+        align-items: normal;
+      }
+    }
+  }
+
+  &.ant-form {
+    margin-bottom: calc(var(--zaui-space-size-md; 16px) * var(--zaui-size; 1));
+  }
+
   .pro-collapse-level2 {
     .ant-collapse-item {
       margin-bottom: 0 !important;
@@ -23,17 +45,17 @@
   }
 
   span.ant-input-clear-icon {
-    display: unset;
+    display   : unset;
     visibility: hidden;
   }
 
   .ant-input-affix-wrapper:hover span.ant-input-clear-icon {
-    display: unset;
+    display   : unset;
     visibility: unset;
   }
 
   .ant-input-affix-wrapper:hover span.ant-input-clear-icon[class~='ant-input-clear-icon-hidden'] {
-    display: unset;
+    display   : unset;
     visibility: hidden;
   }
 
@@ -67,8 +89,8 @@
 
   // 展开折叠按钮
   .expand-button {
-    line-height: 32px;
-    cursor: pointer;
+    line-height: @zaui-space-card;
+    cursor     : pointer;
 
     .rotate-to-top {
       transform: rotate(90deg);
@@ -80,40 +102,39 @@
   }
 
   .ant-form-item {
-    margin-bottom: 22px !important;
+    margin-bottom: calc(var(--zaui-space-size-md; 16px) * var(--zaui-size; 1)) !important;
+
+    &.pro-form-item-width-auto {
+      .ant-form-item-control-input {
+        flex-grow: inherit;
+      }
+
+      .ant-form-item-control-input-content {
+        flex: initial;
+      }
+    }
 
     .ant-form-item-tooltip {
       svg {
-        width: 14px;
-        height: 14px;
+        width         : 14px;
+        height        : 14px;
         vertical-align: bottom;
-        fill: #909090;
+        fill          : @zaui-aide-text;
       }
     }
 
     // 比较原始值场景下  不同时候的样式
     &.pro-form-item-changed {
+
       span.ant-input-affix-wrapper,
       .ant-select-selector,
       .ant-picker {
-        background: #fffaa1;
+        background: @zaui-contract-bg;
 
         input {
-          background: #fffaa1;
+          background: @zaui-contract-bg;
         }
       }
-
-      #switch {
-        background: #bfbfbf;
-      }
-    }
-
-    // 自定义label宽度场景
-    &.label-width {
-      .ant-form-item-label {
-        width: auto !important;
-        max-width: fit-content !important;
-      }
     }
 
     .ant-row {
@@ -147,9 +168,9 @@
         }
 
         .range-right {
-          width: 100%;
-          border: 1px solid #d9d9d9;
-          border-top-left-radius: 0;
+          width                    : 100%;
+          border                   : 1px solid @zaui-form-control-line;
+          border-top-left-radius   : 0;
           border-bottom-left-radius: 0;
         }
       }
@@ -160,149 +181,36 @@
     display: none;
   }
 
-  // 查看模式
-  &.mode-view {
-    // 查看模式样式覆盖
-    .ant-input[disabled] {
-      .noDisabled();
-    }
-
-    .ant-input-disabled {
-      .noDisabled();
-    }
-
-    .ant-picker.ant-picker-disabled {
-      .noDisabled();
-    }
-
-    .ant-picker-input > input[disabled] {
-      .noDisabled();
-    }
-
-    .ant-picker-suffix {
-      display: none;
-    }
-
-    .ant-input-textarea.ant-input-textarea-show-count::after {
-      display: none;
-    }
-
-    .ant-select-disabled.ant-select:not(.ant-select-customize-input) .ant-select-selector {
-      .noDisabled();
-    }
-
-    .ant-select-arrow {
-      display: none;
-    }
-
-    .ant-upload.ant-upload-disabled {
-      display: none;
-    }
-
-    .ant-switch-loading,
-    .ant-switch-disabled {
-      .ant-switch-inner {
-        .noDisabled();
-      }
-
-      .ant-switch-handle {
-        display: none;
-      }
-
-      background-color: #fff;
-      cursor: default;
-      opacity: 1;
-    }
-
-    .ant-radio-wrapper.ant-radio-wrapper-checked.ant-radio-wrapper-disabled {
-      display: block;
-
-      .ant-radio.ant-radio-checked.ant-radio-disabled {
-        display: none;
-      }
-
-      > span {
-        .noDisabled();
-        position: relative;
-        top: -3px;
-      }
-    }
-
-    .ant-radio-wrapper.ant-radio-wrapper-disabled {
-      display: none;
-    }
-
-    .ant-checkbox-wrapper.ant-checkbox-wrapper-checked.ant-checkbox-wrapper-disabled {
-      display: block;
-
-      .ant-checkbox.ant-checkbox-checked.ant-checkbox-disabled {
-        display: none;
-      }
-
-      > span {
-        .noDisabled();
-        position: relative;
-        top: -3px;
-      }
-    }
-
-    .ant-checkbox-wrapper.ant-checkbox-wrapper-disabled {
-      display: none;
-    }
-
-    .ant-form-item-has-error {
-      .ant-form-item-explain.ant-form-item-explain-error {
-        display: none;
-      }
-    }
-
-    ::placeholder {
-      font-size: 0px;
-    }
-
-    .ant-input-affix-wrapper-disabled {
-      background-color: transparent;
-      border: none;
-    }
-
-    .ant-select-selection-placeholder {
-      display: none;
-    }
-
-    .ant-input-suffix {
-      display: none;
-    }
-  }
-
   .ant-form-item-label {
-    > label {
+    >label {
       white-space: pre-wrap;
     }
   }
 
   .suffix-value {
-    margin-left: 8px;
+    margin-left: @zaui-space-size-sm;
   }
 
   .ant-form-item-has-error {
     .group-separator {
-      color: var(--ant-error-color);
+      color       : var(--ant-error-color);
       border-color: var(--ant-error-color);
     }
 
     .site-input-split {
-      border-color: #ff4d4f;
+      border-color: @zaui-danger;
     }
   }
 
   .site-input-group-wrapper {
+
     // 范围值表单样式
     & .site-input-split {
-      text-align: center;
-      background-color: #fafafa;
+      text-align      : center;
+      background-color: @zaui-table-strip-bg;
 
       &.site-input-split-disabled {
-        background-color: #f2f2f2;
+        background-color: @zaui-disabled-bg;
       }
     }
 
@@ -344,33 +252,33 @@
       }
     }
 
-    &.ant-input-group.ant-input-group-compact > *:not(:last-child) {
+    &.ant-input-group.ant-input-group-compact>*:not(:last-child) {
       margin-right: 0;
     }
 
-    > *:first-child {
-      border-top-right-radius: 0 !important;
+    >*:first-child {
+      border-top-right-radius   : 0 !important;
       border-bottom-right-radius: 0 !important;
 
-      > .ant-select-selector {
-        border-top-right-radius: 0 !important;
+      >.ant-select-selector {
+        border-top-right-radius   : 0 !important;
         border-bottom-right-radius: 0 !important;
       }
     }
 
-    > *:last-child {
-      border-top-left-radius: 0 !important;
+    >*:last-child {
+      border-top-left-radius   : 0 !important;
       border-bottom-left-radius: 0 !important;
 
-      > .ant-select-selector {
-        border-top-left-radius: 0 !important;
+      >.ant-select-selector {
+        border-top-left-radius   : 0 !important;
         border-bottom-left-radius: 0 !important;
       }
     }
   }
 
-  .ant-input-group.ant-input-group-compact > * {
-    float: none;
+  .ant-input-group.ant-input-group-compact>* {
+    float         : none;
     vertical-align: top;
   }
 
@@ -379,17 +287,17 @@
   }
 
   .noDisabled {
-    color: #333;
-    font-size: 14px;
+    color           : @zaui-disabled-text;
+    font-size       : var(--zaui-font-size, 14px);
     background-color: transparent;
-    border: none;
-    cursor: default;
-    opacity: 1;
+    border          : none;
+    cursor          : default;
+    opacity         : 1;
   }
 
   div.pro-form-custom-footer {
-    width: unset !important;
-    height: 32px;
+    width        : unset !important;
+    height       : @zaui-space-card;
     margin-bottom: calc(var(--zaui-height-size-md, 16px) * var(--zaui-size, 1));
 
     &.pro-form-custom-footer-hidden {
@@ -398,14 +306,14 @@
   }
 
   .pro-form-view-container {
-    display: inline-block;
-    color: var(--zaui-text, #343434);
+    display   : inline-block;
+    color     : var(--zaui-text, #343434);
     word-break: break-all;
   }
 
   .pro-form-view-container_nowrap {
-    overflow: hidden;
-    white-space: nowrap;
+    overflow     : hidden;
+    white-space  : nowrap;
     text-overflow: ellipsis;
   }
 

package/lib/ProForm/utils/index.d.ts

@@ -17,7 +17,7 @@ export declare const isSelect: (props: any) => any;
  * @param trim 是否移除前后空格
  * @returns {}
  */
-export declare const isTrim: (type: string, trim: boolean) => any;
+export declare const isTrim: (type: string, trim: boolean, configData: any) => any;
 /**
  * Input TextArea 小写自动转大写
  * @param type 组件类型

package/lib/ProForm/utils/index.js

@@ -78,9 +78,14 @@ var isSelect = exports.isSelect = function isSelect(props) {
  * @param trim 是否移除前后空格
  * @returns {}
  */
-var isTrim = exports.isTrim = function isTrim(type, trim) {
+var isTrim = exports.isTrim = function isTrim(type, trim, configData) {
+  var _state$type;
   var result = {};
-  if (['Input', 'TextArea', 'ProCombination'].includes(type) && trim) {
+  var _ref = configData || {},
+    _ref$state = _ref.state,
+    state = _ref$state === void 0 ? {} : _ref$state;
+  var _trim = trim || (state === null || state === void 0 ? void 0 : (_state$type = state[type]) === null || _state$type === void 0 ? void 0 : _state$type.trim);
+  if (['Input', 'TextArea', 'ProCombination'].includes(type) && _trim) {
     result.getValueFromEvent = function (event) {
       var _event$target$value;
       if (Array.isArray(event)) {

package/lib/ProForm/utils/rulesCreator.js

@@ -8,9 +8,10 @@ exports.rulesCreator = void 0;
 var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
 var _utils = require("@zat-design/utils");
 var _index = require("./index");
+var _locale = _interopRequireDefault(require("../../locale"));
 var rulesCreator = exports.rulesCreator = function rulesCreator(rules, label, isSelect) {
   var _result;
-  var message = "".concat(isSelect ? '请选择' : '请输入', "\u6B63\u786E\u7684").concat(label || '');
+  var message = "".concat(isSelect ? "".concat(_locale.default.ProForm.selectPlaceHolder) : "".concat(_locale.default.ProForm.inputPlaceholder)).concat(_locale.default.ProForm.ruleText).concat(label || '');
   var result = [];
   result = rules.map(function (ruleItem) {
     var rule = (0, _objectSpread2.default)({}, ruleItem);

package/lib/ProForm/utils/useRules.js

@@ -10,6 +10,7 @@ var _react = require("react");
 var _lodash = require("lodash");
 var _rulesCreator = require("./rulesCreator");
 var _index = require("./index");
+var _locale = _interopRequireDefault(require("../../locale"));
 var useRules = function useRules(props) {
   var rules = props.rules,
     required = props.required,
@@ -28,7 +29,7 @@ var useRules = function useRules(props) {
         return 'required' in rule;
       }));
       if (!requiredRule) {
-        var message = isSelect ? "\u8BF7\u9009\u62E9".concat(label || '') : "\u8BF7\u8F93\u5165".concat(label || '');
+        var message = isSelect ? "".concat(_locale.default.ProForm.selectPlaceHolder).concat(label || '') : "".concat(_locale.default.ProForm.inputPlaceholder).concat(label || '');
         var rule = {
           required: required,
           message: message
@@ -37,7 +38,7 @@ var useRules = function useRules(props) {
         if (names === null || names === void 0 ? void 0 : names.length) {
           rule.validator = function (_, value) {
             if (!value || (0, _index.isNullArray)(value)) {
-              return Promise.reject(new Error("\u8BF7\u586B\u5199".concat(label)));
+              return Promise.reject(new Error("".concat(_locale.default.ProForm.inputPlaceholder).concat(label)));
             }
             return Promise.resolve();
           };
@@ -56,7 +57,7 @@ var useRules = function useRules(props) {
         validator: function validator(rules, value) {
           // 完整性校验, 空数组不校验, 数组有值且值不完整则校验不通过
           if (Array.isArray(value) && !(0, _index.isNullArray)(value) && (0, _index.isNotFullArray)(value, names.length)) {
-            return Promise.reject(new Error("\u8BF7\u5B8C\u6574\u586B\u5199".concat(label || '')));
+            return Promise.reject(new Error("".concat(_locale.default.ProForm.completeText).concat(label || '')));
           }
           return Promise.resolve();
         }

package/lib/ProForm/utils/useShouldUpdate.js

@@ -11,16 +11,16 @@ var _react = require("react");
 var _lodash = require("lodash");
 var _index = require("./index");
 // 代理shouldUpdate事件, 执行函数值的[show, disabled], 当[show, disabled]与上一次值不相同时更新状态
-var useShouldUpdate = function useShouldUpdate(_ref) {
-  var show = _ref.show,
-    formItemProps = _ref.formItemProps,
-    form = _ref.form,
-    disabled = _ref.disabled,
-    rules = _ref.rules,
-    required = _ref.required,
-    fieldProps = _ref.fieldProps,
-    component = _ref.component,
-    originComponent = _ref.originComponent;
+var useShouldUpdate = function useShouldUpdate(props) {
+  var show = props.show,
+    formItemProps = props.formItemProps,
+    form = props.form,
+    disabled = props.disabled,
+    rules = props.rules,
+    required = props.required,
+    fieldProps = props.fieldProps,
+    component = props.component,
+    originComponent = props.originComponent;
   var _shouldUpdate = formItemProps.shouldUpdate,
     name = formItemProps.name,
     clearNotShow = formItemProps.clearNotShow,
@@ -39,12 +39,6 @@ var useShouldUpdate = function useShouldUpdate(_ref) {
     _useState2 = (0, _slicedToArray2.default)(_useState, 2),
     reRender = _useState2[1];
   var values = {};
-  if (namePath) {
-    // formList场景values取当前行数据
-    values = form.getFieldValue(namePath) || {};
-  } else {
-    values = form.getFieldsValue(true);
-  }
   // 不是动态函数直接返回
   if (!(0, _lodash.isFunction)(show) && !(0, _lodash.isFunction)(disabled) && !(0, _lodash.isFunction)(required) && !(0, _lodash.isFunction)(rules) && !(0, _lodash.isFunction)(fieldProps) && !(0, _lodash.isFunction)(originComponent)) {
     return {
@@ -57,6 +51,12 @@ var useShouldUpdate = function useShouldUpdate(_ref) {
       component: newComponent
     };
   }
+  if (namePath) {
+    // formList场景values取当前行数据
+    values = form.getFieldValue(namePath) || {};
+  } else {
+    values = form.getFieldsValue(true);
+  }
   if ((0, _lodash.isFunction)(show)) {
     showRef.current = Boolean(show(values, {
       form: form,

package/lib/ProLayout/components/Layout/Menu/OpenMenu/index.js

@@ -128,6 +128,12 @@ var OpenMenu = function OpenMenu(props) {
       });
     }
   }, [sideMenu]);
+  (0, _react.useEffect)(function () {
+    // 同步路由，解决进入详情页后router没有变化，点击相同router菜单无效问题
+    setState({
+      router: window.location.pathname
+    });
+  }, [window.location.pathname]);
   (0, _react.useEffect)(function () {
     // 路由变更，且不再demo文档中
     if (router && !window.location.href.includes('~demos/prolayout')) {

package/lib/ProLayout/components/Layout/Menu/OpenMenu/style/index.less

@@ -24,7 +24,7 @@
     &>.ant-menu-item-only-child {
       min-height    : 48px;
       padding-top   : 12px;
-      padding-bottom: 12px;
+      padding-bottom: calc(var(--zaui-space-size-md; 16px) * var(--zaui-size; 1) - var(--zaui-space-size-xs; 4px) * var(--zaui-size; 1));
       margin        : 0;
       height        : auto;
 
@@ -94,7 +94,7 @@
     height        : auto !important;
     margin        : 0;
     padding-top   : 12px;
-    padding-bottom: 12px;
+    padding-bottom: calc(var(--zaui-space-size-md; 16px) * var(--zaui-size; 1) - var(--zaui-space-size-xs; 4px) * var(--zaui-size; 1));
     min-height    : 48px;
   }
 

package/lib/ProLayout/components/Layout/Notice/index.js

@@ -8,6 +8,7 @@ exports.default = void 0;
 var _jsxRuntime = require("react/jsx-runtime");
 var _tipMsg = _interopRequireDefault(require("../../../images/tipMsg.png"));
 var _close = _interopRequireDefault(require("../../../images/close.png"));
+var _locale = _interopRequireDefault(require("../../../../locale"));
 var Notice = function Notice(props) {
   var headerHeight = props.headerHeight,
     notice = props.notice,
@@ -22,13 +23,13 @@ var Notice = function Notice(props) {
     },
     children: [(0, _jsxRuntime.jsx)("img", {
       src: _tipMsg.default,
-      alt: "\u63D0\u793A"
+      alt: "".concat(_locale.default.ProLayout.tipAlt)
     }), " ", notice, (0, _jsxRuntime.jsx)("span", {
       className: "pro-layout-header-notice-close",
       onClick: onCancel,
       children: (0, _jsxRuntime.jsx)("img", {
         src: _close.default,
-        alt: "\u5173\u95ED"
+        alt: "".concat(_locale.default.ProLayout.closeAlt)
       })
     })]
   });

package/lib/ProLayout/components/ProCollapse/style/index.less

@@ -9,13 +9,13 @@
 
   &.ant-collapse {
     .pro-collapse-panel {
-      margin-bottom: var(--zaui-space-size-md, 16px);
+      margin-bottom: calc(var(--zaui-space-size-md; 16px) * var(--zaui-size; 1));
     }
   }
 
   .ant-collapse-header {
     align-items: center !important;
-    padding    : 14px var(--zaui-space-size-md, 16px) !important;
+    padding    : 12px var(--zaui-space-size-md, 16px) !important;
     background : var(--zaui-area, #fafafa);
   }
 
@@ -49,7 +49,7 @@
     background   : var(--zaui-base-bg, #ffffff);
 
     .ant-collapse-header {
-      margin-bottom: var(--zaui-space-size-md, 16px);
+      margin-bottom: calc(var(--zaui-space-size-md; 16px) * var(--zaui-size; 1));
       padding      : 0 !important;
       background   : var(--zaui-base-bg, #ffffff);
 
@@ -154,7 +154,7 @@
     }
 
     .ant-descriptions {
-      margin-bottom: var(--zaui-space-size-md, 16px);
+      margin-bottom: calc(var(--zaui-space-size-md; 16px) * var(--zaui-size; 1));
     }
   }
 }

package/lib/ProLayout/components/ProHeader/components/Copy/index.js

@@ -10,6 +10,7 @@ var _antd = require("antd");
 var _reactSvg = require("react-svg");
 var _icons = require("@ant-design/icons");
 var _copy = _interopRequireDefault(require("../../../../../assets/copy.svg"));
+var _locale = _interopRequireDefault(require("../../../../../locale"));
 var Paragraph = _antd.Typography.Paragraph;
 var Copy = function Copy(_ref) {
   var text = _ref.text;
@@ -21,7 +22,7 @@ var Copy = function Copy(_ref) {
         className: "drag-icon",
         src: _copy.default
       }, "copy-icon"), (0, _jsxRuntime.jsx)(_icons.CheckOutlined, {}, "copied-icon")],
-      tooltips: ['复制', '复制成功']
+      tooltips: ["".concat(_locale.default.ProHeader.copyTooltips[0]), "".concat(_locale.default.ProHeader.copyTooltips[1])]
     }
   });
 };

package/lib/{old → ProLayout/components/ProHeader/components}/ProBackBtn/index.js

@@ -1,5 +1,6 @@
 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -7,6 +8,7 @@ exports.default = void 0;
 var _jsxRuntime = require("react/jsx-runtime");
 var _icons = require("@ant-design/icons");
 var _antd = require("antd");
+var _locale = _interopRequireDefault(require("../../../../../locale"));
 /**
  * 页面返回按钮
  * @param onBack 自定义返回方法
@@ -15,7 +17,7 @@ var _antd = require("antd");
 var ProBackBtn = function ProBackBtn(_ref) {
   var onBack = _ref.onBack,
     _ref$text = _ref.text,
-    text = _ref$text === void 0 ? '返回' : _ref$text;
+    text = _ref$text === void 0 ? "".concat(_locale.default.ProHeader.backText) : _ref$text;
   var handleClick = function handleClick() {
     if (onBack) {
       onBack();

package/lib/ProLayout/components/ProHeader/components/ProBackBtn/style/index.less

@@ -0,0 +1,21 @@
+.back-button-container {
+  &.ant-btn {
+    color      : var(--zaui-text);
+    font-weight: 400;
+    background : var(--zaui-disabled-bg);
+    border     : none;
+
+    &:hover {
+      color     : var(--zaui-aide-text);
+      background: var(--zaui-disabled-bg);
+      border    : none;
+    }
+
+    &:active,
+    &:focus {
+      color      : var(--zaui-text);
+      font-weight: 400;
+      background : var(--zaui-disabled-bg);
+    }
+  }
+}

package/lib/ProLayout/components/ProHeader/components/index.d.ts

@@ -1 +1,2 @@
 export { default as Copy } from './Copy';
+export { default as ProBackBtn } from './ProBackBtn';

package/lib/ProLayout/components/ProHeader/components/index.js

@@ -10,4 +10,11 @@ Object.defineProperty(exports, "Copy", {
     return _Copy.default;
   }
 });
-var _Copy = _interopRequireDefault(require("./Copy"));
+Object.defineProperty(exports, "ProBackBtn", {
+  enumerable: true,
+  get: function get() {
+    return _ProBackBtn.default;
+  }
+});
+var _Copy = _interopRequireDefault(require("./Copy"));
+var _ProBackBtn = _interopRequireDefault(require("./ProBackBtn"));