@zat-design/sisyphus-react 3.4.2-beta.1 → 3.4.2-beta.10

package/lib/ProForm/components/render/RenderFields.js

@@ -33,7 +33,7 @@ var RenderFields = function RenderFields(props) {
     outerClearNotShow = props.clearNotShow,
     requiredOnView = props.requiredOnView,
     required = props.required,
-    originalTip = props.originalTip,
+    originalDiffTip = props.originalDiffTip,
     globalControl = props.globalControl;
   // 是否包含隐藏字段
   var hiddenData = columns.filter(function (item) {
@@ -213,7 +213,7 @@ var RenderFields = function RenderFields(props) {
         originalValues: originalValues,
         equalWith: equalWith,
         requiredOnView: requiredOnView,
-        originalTip: originalTip,
+        originalDiffTip: originalDiffTip,
         globalControl: globalControl
       })
     }, "".concat(_formItemProps.name || _formItemProps.label).concat(index));

package/lib/ProForm/index.js

@@ -25,7 +25,7 @@ var _index = require("./utils/index");
 var _useForm3 = require("./utils/useForm");
 var _useFieldProps = require("./utils/useFieldProps");
 var _locale = _interopRequireDefault(require("../locale"));
-var _excluded = ["mode", "span", "disabled", "isView", "columns", "footer", "onOk", "okText", "onCancel", "confirmLoading", "cancelText", "form", "children", "rowProps", "className", "expand", "expandOpen", "expandOpenChange", "viewEmpty", "labelAlign", "labelWidth", "onValuesChange", "onFinish", "originalValues", "submitOnEnter", "clearNotShow", "initialValues", "requiredOnView", "formId", "required", "originalTip", "formKey", "globalControl"];
+var _excluded = ["mode", "span", "disabled", "isView", "columns", "footer", "onOk", "okText", "onCancel", "confirmLoading", "cancelText", "form", "children", "rowProps", "className", "expand", "expandOpen", "expandOpenChange", "viewEmpty", "labelAlign", "labelWidth", "onValuesChange", "onFinish", "originalValues", "submitOnEnter", "clearNotShow", "initialValues", "requiredOnView", "formId", "required", "originalDiffTip", "formKey", "globalControl"];
 var ProForm = function ProForm(props, ref) {
   var _forms$formKey, _localStorage;
   var _props$mode = props.mode,
@@ -64,8 +64,8 @@ var ProForm = function ProForm(props, ref) {
     requiredOnView = _props$requiredOnView === void 0 ? true : _props$requiredOnView,
     formId = props.formId,
     required = props.required,
-    _props$originalTip = props.originalTip,
-    originalTip = _props$originalTip === void 0 ? true : _props$originalTip,
+    _props$originalDiffTi = props.originalDiffTip,
+    originalDiffTip = _props$originalDiffTi === void 0 ? true : _props$originalDiffTi,
     formKey = props.formKey,
     globalControl = props.globalControl,
     otherProps = (0, _objectWithoutProperties2.default)(props, _excluded);
@@ -255,7 +255,7 @@ var ProForm = function ProForm(props, ref) {
         clearNotShow: clearNotShow,
         requiredOnView: requiredOnView,
         required: required,
-        originalTip: originalTip,
+        originalDiffTip: originalDiffTip,
         globalControl: globalControl
       }), children, footerRender()]
     }))

package/lib/ProForm/propsType.d.ts

@@ -69,7 +69,7 @@ export interface ProFormProps<Values = any> extends FormProps<Values> {
     requiredOnView?: boolean;
     formId?: string;
     required?: boolean;
-    originalTip?: boolean;
+    originalDiffTip?: boolean;
 }
 export interface Transform<T = any> {
     normalize?: (value: StoreValue, prevValue: StoreValue, allValues: Store) => StoreValue;

package/lib/ProForm/utils/{contrastOriginal.d.ts → diffOriginal.d.ts}

@@ -3,7 +3,8 @@ interface Params {
     originalValue: any;
     value: any;
     form: FormInstance;
+    name?: string | any[];
     equalWith?: (originalValue: any, currentValue: any) => boolean;
 }
-export declare const contrastOriginal: (params: Params) => boolean;
+export declare const diffOriginal: (params: Params) => boolean;
 export {};

package/lib/ProForm/utils/diffOriginal.js

@@ -0,0 +1,68 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.diffOriginal = void 0;
+var _createForOfIteratorHelper2 = _interopRequireDefault(require("@babel/runtime/helpers/createForOfIteratorHelper"));
+var _lodash = require("lodash");
+var nullValue = [null, undefined, '']; // 输入框空值时可能存在的三种值 视为相等
+var extractValue = function extractValue(obj, path) {
+  var value = obj || {};
+  if (!Object.keys(obj)) {
+    return [];
+  }
+  var _iterator = (0, _createForOfIteratorHelper2.default)(path),
+    _step;
+  try {
+    for (_iterator.s(); !(_step = _iterator.n()).done;) {
+      var key = _step.value;
+      if (value && value.hasOwnProperty(key)) {
+        value = value[key];
+      } else {
+        return undefined;
+      }
+    }
+  } catch (err) {
+    _iterator.e(err);
+  } finally {
+    _iterator.f();
+  }
+  return Object.values(value);
+};
+/** 将解构后的name值，反向转回names,例如 formData {a:1, b:2} names ['a', 'b'] 返回 [1,2] */
+var extractValues = function extractValues(data, pathString) {
+  if (pathString.includes('_')) {
+    var namePrefixes = pathString.split('-')[0].split('_').slice(0, -1);
+    return extractValue(data, namePrefixes);
+  }
+  return pathString.split('-').map(function (item) {
+    return data[item];
+  });
+};
+var diffOriginal = exports.diffOriginal = function diffOriginal(params) {
+  var originalValue = params.originalValue,
+    _value = params.value,
+    equalWith = params.equalWith,
+    form = params.form,
+    name = params.name;
+  var value = !(name === null || name === void 0 ? void 0 : name.includes('-')) ? _value : extractValues(form.getFieldsValue(), name);
+  // 支持传入自定义比较事件
+  if ((0, _lodash.isFunction)(equalWith)) {
+    return !equalWith(originalValue, value);
+  }
+  if (Array.isArray(originalValue)) {
+    return originalValue.some(function (valueItem, index) {
+      // 如果两个值有一个不是空值, 则进行深比较
+      if (!nullValue.includes(value === null || value === void 0 ? void 0 : value[index]) || !nullValue.includes(valueItem)) {
+        return !(0, _lodash.isEqual)(value === null || value === void 0 ? void 0 : value[index], valueItem);
+      }
+      return false;
+    });
+  }
+  if (!nullValue.includes(value) || !nullValue.includes(originalValue)) {
+    return !(0, _lodash.isEqual)(value, originalValue);
+  }
+  return false;
+};

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

@@ -26,7 +26,7 @@ export declare const isTrim: (type: string, trim: boolean, configData: any) => a
  */
 export declare const isUpperCase: (type: string, upperCase: boolean) => any;
 export declare const weedOutProps: (data: Record<string, any>, keys: string[]) => {}[];
-export declare const contrast: (prevValues: any, curValues: any, names: NamePath[]) => boolean;
+export declare const diffField: (prevValues: any, curValues: any, names: NamePath[]) => boolean;
 export declare const splitNameStr: (name: string) => NamePath[];
 export declare const filterInternalFields: (values: any) => any;
 export declare const getAllNamePath: (object: Record<string, any>, currentPath?: InternalNamePath) => InternalNamePath[];

package/lib/ProForm/utils/index.js

@@ -5,7 +5,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.getAllNamePath = exports.findOptionByValue = exports.filterInternalFields = exports.equalDependencies = exports.deleteForPath = exports.customEqualForFun = exports.contrast = void 0;
+exports.getAllNamePath = exports.findOptionByValue = exports.filterInternalFields = exports.equalDependencies = exports.diffField = exports.deleteForPath = exports.customEqualForFun = void 0;
 exports.getArrayBeforeNumber = getArrayBeforeNumber;
 exports.hasRowKey = exports.getLayout = exports.getDecimalDigits = void 0;
 exports.initialValuesToNames = initialValuesToNames;
@@ -124,7 +124,7 @@ var weedOutProps = exports.weedOutProps = function weedOutProps(data, keys) {
   return [obj, weedOut];
 };
 // 对比字段变化
-var contrast = exports.contrast = function contrast(prevValues, curValues, names) {
+var diffField = exports.diffField = function diffField(prevValues, curValues, names) {
   return names.some(function (name) {
     return _lodash.default.get(prevValues, name) !== _lodash.default.get(curValues, name);
   });

package/lib/ProForm/utils/transformValue.js

@@ -48,7 +48,7 @@ var transformValue = exports.transformValue = function transformValue(names, for
       }, cusRest);
     },
     shouldUpdate: function shouldUpdate(prevValues, curValues) {
-      return (0, _utils.contrast)(prevValues, curValues, names);
+      return (0, _utils.diffField)(prevValues, curValues, names);
     }
   };
 };

package/lib/ProForm/utils/useChanged.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.useChanged = void 0;
 var _antd = require("antd");
 var _lodash = require("lodash");
-var _contrastOriginal = require("./contrastOriginal");
+var _diffOriginal = require("./diffOriginal");
 var useChanged = exports.useChanged = function useChanged(_ref) {
   var name = _ref.name,
     names = _ref.names,
@@ -21,11 +21,12 @@ var useChanged = exports.useChanged = function useChanged(_ref) {
   if (notWatch) form = [];
   var value = _antd.Form.useWatch(namesStr || name, form);
   if (notWatch) return [false];
-  var changed = (0, _contrastOriginal.contrastOriginal)({
+  var changed = (0, _diffOriginal.diffOriginal)({
     originalValue: originalValue,
     value: value,
     form: form,
-    equalWith: equalWith
+    equalWith: equalWith,
+    name: namesStr || name
   });
   return [changed, originalValue];
 };

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

@@ -1,7 +1,7 @@
 import { FormInstance } from 'antd';
 import { InternalNamePath, NamePath } from 'antd/lib/form/interface';
 interface Params {
-    name?: NamePath;
+    name?: any;
     names?: NamePath[];
     namesStr?: NamePath;
     originalName?: NamePath;

package/lib/ProForm/utils/useListChanged.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.useListChanged = void 0;
 var _antd = require("antd");
 var _lodash = require("lodash");
-var _contrastOriginal = require("./contrastOriginal");
+var _diffOriginal = require("./diffOriginal");
 var toNamePath = function toNamePath(name) {
   if (Array.isArray(name)) {
     return name;
@@ -88,11 +88,12 @@ var useListChanged = exports.useListChanged = function useListChanged(params) {
   if (notWatch) _form = [];
   var value = _antd.Form.useWatch(namePath, _form);
   if (notWatch || noChange) return [false];
-  var changed = (0, _contrastOriginal.contrastOriginal)({
+  var changed = (0, _diffOriginal.diffOriginal)({
     value: value,
     originalValue: originalValue,
     form: form,
-    equalWith: equalWith
+    equalWith: equalWith,
+    name: namesStr || name
   });
   return [changed, originalValue];
 };

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

@@ -7,33 +7,36 @@
   .@{ant-prefix}-menu-root {
     overflow-y: auto !important;
 
-    &>.@{ant-prefix}-menu-submenu>.@{ant-prefix}-menu-submenu-title,
-    &>.@{ant-prefix}-menu-item.@{ant-prefix}-menu-item-only-child {
+    & > .@{ant-prefix}-menu-submenu > .@{ant-prefix}-menu-submenu-title,
+    & > .@{ant-prefix}-menu-item.@{ant-prefix}-menu-item-only-child {
       padding-left: 16px !important;
     }
 
-    &>.@{ant-prefix}-menu-submenu {
+    & > .@{ant-prefix}-menu-submenu {
       .@{ant-prefix}-menu-sub {
-        background: #1A202D;
+        background: #1a202d;
       }
 
-      &>.@{ant-prefix}-menu-sub>.@{ant-prefix}-menu-submenu>.@{ant-prefix}-menu-submenu-title,
-      &>.@{ant-prefix}-menu-item-only-child,
-      &>.@{ant-prefix}-menu-sub>.@{ant-prefix}-menu-item-only-child {
+      & > .@{ant-prefix}-menu-sub > .@{ant-prefix}-menu-submenu > .@{ant-prefix}-menu-submenu-title,
+      & > .@{ant-prefix}-menu-item-only-child,
+      & > .@{ant-prefix}-menu-sub > .@{ant-prefix}-menu-item-only-child {
         padding-left: 16px !important;
       }
     }
 
-    &>.@{ant-prefix}-menu-item-only-child {
-      min-height    : 48px;
-      padding-top   : 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;
+    & > .@{ant-prefix}-menu-item-only-child {
+      height: auto;
+      min-height: 48px;
+      margin: 0;
+      padding-top: 12px;
+      padding-bottom: calc(
+        var(--zaui-space-size-md; 16px) * var(--zaui-size; 1) - var(--zaui-space-size-xs; 4px) *
+          var(--zaui-size; 1)
+      );
 
       h2 {
+        height: auto !important;
         line-height: initial !important;
-        height     : auto !important;
         white-space: pre-wrap;
       }
     }
@@ -45,7 +48,6 @@
         display: none;
       }
     }
-
   }
 
   .@{ant-prefix}-menu-inline {
@@ -62,14 +64,12 @@
       h2 {
         color: #fff;
       }
-
     }
   }
 
-
   .@{ant-prefix}-menu.@{ant-prefix}-menu-dark {
-    background: #1A202D;
     overflow-x: hidden;
+    background: #1a202d;
 
     .@{ant-prefix}-menu-item-only-child {
       &:hover {
@@ -90,104 +90,107 @@
     }
   }
 
-  .@{ant-prefix}-menu-sub.@{ant-prefix}-menu-inline>.@{ant-prefix}-menu-item,
+  .@{ant-prefix}-menu-sub.@{ant-prefix}-menu-inline > .@{ant-prefix}-menu-item,
   .@{ant-prefix}-menu-submenu-title {
-    white-space: pre-wrap;
-    line-height: initial !important;
-    height     : auto !important;
-    margin     : 0;
+    height: auto !important;
+    min-height: 48px;
+    margin: 0;
     padding: 12px 0;
-    min-height : 48px;
+    line-height: initial !important;
+    white-space: pre-wrap;
   }
 
   .@{ant-prefix}-menu-title-content {
-
-
     div {
-      display        : flex;
-      align-items    : center;
+      display: flex;
+      align-items: center;
       justify-content: left;
 
       .pro-layout-icon {
-        flex  : 0 0 20px;
-        width : 20px;
+        flex: 0 0 20px;
+        width: 20px;
         height: 20px;
-        color : #CACACA;
+        color: #cacaca;
       }
 
       h2 {
-        flex-grow    : 1;
+        display: inline-block;
+        flex-grow: 1;
         margin-bottom: 0;
-        opacity      : 1;
-        transition   : opacity .3s cubic-bezier(.645, .045, .355, 1), margin .3s, color .3s;
-        display      : inline-block;
-        padding-left : 12px;
-        color        : #CACACA;
-        font-weight  : 400;
-        font-size    : var(--zaui-font-size-md, 14px);
+        padding-left: 12px;
+        color: #cacaca;
+        font-weight: 400;
+        font-size: var(--zaui-font-size-md, 14px);
+        opacity: 1;
+        transition: opacity 0.3s cubic-bezier(0.645, 0.045, 0.355, 1), margin 0.3s, color 0.3s;
       }
     }
-
-
   }
 
   .anticon-caret-down {
-    color     : #CACACA;
-    transform : rotateZ(0deg);
-    top       : auto;
+    top: auto;
+    color: #cacaca;
+    transform: rotateZ(0deg);
     transition: all 0.1s ease-in;
   }
 
   .@{ant-prefix}-menu-submenu-open {
     .anticon-caret-down {
+      color: #fff;
       transform: rotateZ(180deg);
-      color    : #fff;
     }
 
     .@{ant-prefix}-menu-submenu-inline {
       .anticon-caret-down {
+        color: #cacaca;
         transform: rotateZ(0deg);
-        color    : #CACACA;
       }
 
       &.@{ant-prefix}-menu-submenu-open {
         .anticon-caret-down {
+          color: #fff;
           transform: rotateZ(180deg);
-          color    : #fff;
         }
       }
     }
   }
 
-  .@{ant-prefix}-menu-submenu:hover>.@{ant-prefix}-menu-submenu-title>.@{ant-prefix}-menu-submenu-expand-icon {
+  .@{ant-prefix}-menu-submenu:hover
+    > .@{ant-prefix}-menu-submenu-title
+    > .@{ant-prefix}-menu-submenu-expand-icon {
     color: #fff;
   }
 
+ .@{ant-prefix}-menu-item-selected{
+  .@{ant-prefix}-menu-title-content{
+    h2{
+      font-weight: bold !important;
+    }
+  }
+ }
+
   .@{ant-prefix}-menu-submenu-selected {
-    &>.@{ant-prefix}-menu-submenu-title {
+    & > .@{ant-prefix}-menu-submenu-title {
       .@{ant-prefix}-menu-title-content div {
         .pro-layout-icon {
           color: #fff;
         }
 
         h2 {
-          font-weight: bold;
-          color      : #fff;
+          color: #fff;
         }
       }
-
     }
 
     .@{ant-prefix}-menu-item-only-child .@{ant-prefix}-menu-title-content div {
       .pro-layout-icon {
-        color: #CACACA;
+        color: #cacaca;
       }
 
       h2 {
+        color: #cacaca;
         font-weight: 400;
-        color      : #CACACA;
       }
     }
-
   }
 }

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

@@ -2,18 +2,18 @@
 @import (reference) '~antd/es/style/themes/index.less';
 
 .pro-layout-sider-menu {
-  width     : 220px;
+  width: 220px;
   background: #fff;
 
   h2 {
     margin-bottom: 0;
-    padding      : 16px 16px 8px;
-    color        : var(--zaui-text, #343434);
-    color        : var(--zaui-text);
-    font-weight  : 500;
-    font-size    : var(--zaui-font-size-lg, 16px);
-    line-height  : inherit;
-    text-align   : left;
+    padding: 16px 16px 8px;
+    color: var(--zaui-text, #343434);
+    color: var(--zaui-text);
+    font-weight: 500;
+    font-size: var(--zaui-font-size-lg, 16px);
+    line-height: inherit;
+    text-align: left;
   }
 
   .pro-layout-open-menu {
@@ -33,15 +33,22 @@
       }
 
       .@{ant-prefix}-menu {
+        .@{ant-prefix}-menu-item-only-child{
+          .@{ant-prefix}-menu-title-content  .pro-layout-open-menu-lv1 h2{
+            padding-right: 0;
+          }
+        }
         .@{ant-prefix}-menu-title-content {
           div h2 {
-            color  : var(--zaui-text);
             padding: 0;
+            padding-right: 12px;
+            color: var(--zaui-text);
           }
 
           .pro-layout-open-menu-lv1 {
             h2 {
-              color      : var(--zaui-text);
+              padding-right: 26px;
+              color: var(--zaui-text);
               font-weight: 500;
             }
           }
@@ -53,19 +60,19 @@
           &.pro-layout-icon-empty {
             display: none;
 
-            &~h2 {
+            & ~ h2 {
               margin-left: var(--zaui-space-size-md, 16px);
             }
           }
         }
 
         .pro-layout-icon {
-          fill : currentColor;
           color: var(--zaui-text, #343434) !important;
+          fill: currentColor;
         }
 
         &.@{ant-prefix}-menu-sub {
-          overflow  : hidden;
+          overflow: hidden;
           background: #fff;
         }
 
@@ -74,8 +81,8 @@
 
         .@{ant-prefix}-menu-submenu-title:hover,
         .@{ant-prefix}-menu-item:hover {
+          color: #fff;
           background-color: #f2f2f2;
-          color           : #fff;
         }
 
         .@{ant-prefix}-menu-item {
@@ -87,15 +94,13 @@
         }
 
         .@{ant-prefix}-menu-submenu-title,
-        &.@{ant-prefix}-menu-root>.@{ant-prefix}-menu-item-only-child,
-        &.@{ant-prefix}-menu-sub.@{ant-prefix}-menu-inline>.@{ant-prefix}-menu-item {
-          padding-top   : 10px;
+        &.@{ant-prefix}-menu-root > .@{ant-prefix}-menu-item-only-child,
+        &.@{ant-prefix}-menu-sub.@{ant-prefix}-menu-inline > .@{ant-prefix}-menu-item {
+          min-height: 40px;
+          padding-top: 10px;
           padding-bottom: 10px;
-          min-height    : 40px;
         }
       }
     }
   }
-
-
 }