@zat-design/sisyphus-react 3.0.13

package/lib/ProForm/propsType.d.ts

@@ -0,0 +1,69 @@
+import { ButtonProps, ColProps, RowProps } from 'antd';
+import { FormProps, FormInstance } from 'antd/es/form/Form';
+import { NamePath } from 'antd/lib/form/interface';
+import { StoreValue, Store } from 'rc-field-form/es/interface.d';
+import { ShouldUpdate } from 'rc-field-form/es/Field.d';
+import React, { ReactNode } from 'react';
+import { ComponentMap, ProColumnProps, ViewType } from './components/render/propsType';
+export * from './components/render/propsType';
+export interface ButtonItem extends ButtonProps {
+    children?: any;
+}
+export interface FooterButtonProps {
+    okButtonProps?: ButtonItem;
+    cancelButtonProps?: ButtonItem;
+}
+export interface ProFormItemChildProps {
+    value?: any;
+    onChange?: () => void;
+    [key: string]: any;
+}
+export type ModeEnum = 'search' | 'drawer';
+type FooterType = ReactNode | {
+    okButtonProps: ButtonItem;
+    cancelButtonProps: ButtonItem;
+} | boolean;
+export declare const otherKeys: string[];
+export interface ProFormOtherProps {
+    isView?: boolean;
+    viewEmpty?: React.ReactNode;
+    label?: React.ReactNode;
+    valueType?: string;
+    viewType?: ViewType;
+    name?: NamePath;
+    names?: NamePath[];
+    form?: FormInstance;
+    type?: ComponentMap;
+    hiddenNames?: string[] | any[];
+    colProps: ColProps;
+    disabled: boolean;
+}
+export interface ProFormProps<Values = any> extends FormProps<Values> {
+    disabled?: boolean;
+    mode?: ModeEnum;
+    /** 是否查看 */
+    isView?: boolean;
+    span?: number;
+    columns?: ProColumnProps<Values>[];
+    rowProps?: RowProps;
+    footer?: FooterType;
+    expand?: number;
+    expandOpen?: boolean;
+    expandOpenChange?: (open: boolean) => void;
+    onOk?: () => void;
+    okText?: string;
+    onCancel?: () => void;
+    cancelText?: string;
+    viewEmpty?: React.ReactNode | string;
+    confirmLoading?: boolean;
+    labelWidth?: string | number;
+    originalValues?: Values;
+    /** 是否回车提交 */
+    submitOnEnter?: boolean;
+    clearNotShow?: boolean;
+}
+export interface Transform<T = any> {
+    normalize?: (value: StoreValue, prevValue: StoreValue, allValues: Store) => StoreValue;
+    getValueProps?: (value: StoreValue) => Record<string, unknown>;
+    shouldUpdate?: ShouldUpdate<T>;
+}

package/lib/ProForm/propsType.js

@@ -0,0 +1,23 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _exportNames = {
+  otherKeys: true
+};
+exports.otherKeys = void 0;
+var _propsType = require("./components/render/propsType");
+Object.keys(_propsType).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _propsType[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _propsType[key];
+    }
+  });
+});
+var otherKeys = ['isView', 'viewEmpty', 'label', 'valueType', 'viewType', 'name', 'names', 'form', 'type', 'hiddenNames'];
+exports.otherKeys = otherKeys;

package/lib/ProForm/style/index.less

@@ -0,0 +1,410 @@
+@import '../components/old/EnumSelect/style/index.less';
+@import '../components/base/SwitchCheckbox/style/index.less';
+@import '../components/combination/ProAddressBar/style/index.less';
+@import '../components/combination/ProNumberRange/style/index.less';
+@import '../components/combination/ProModalSelect/style/index.less';
+
+.pro-form {
+  .pro-collapse-level2 {
+    .ant-collapse-item {
+      margin-bottom: 0 !important;
+    }
+  }
+
+
+
+  &.pro-form-view {
+    .ant-form-item-label {
+      label {
+        color: var(--zaui-aide-text, #939599);
+      }
+    }
+
+    .ant-form-item {
+      margin-bottom: 24px;
+    }
+
+    .ant-form-item * {
+      line-height: 1 !important;
+      height     : auto !important;
+      min-height : auto !important;
+    }
+
+  }
+
+  .ant-picker-range {
+    width: 100%;
+  }
+
+  .pro-form-list-line {
+    .ant-row {
+      width: 100%;
+    }
+  }
+
+  // 展开折叠按钮
+  .expand-button {
+    line-height: 32px;
+    cursor     : pointer;
+
+    .rotate-to-top {
+      transform: rotate(90deg);
+    }
+
+    .rotate-to-bottom {
+      transform: rotate(-90deg);
+    }
+  }
+
+  .ant-form-item {
+    display: flex;
+
+    .ant-form-item-tooltip {
+      svg {
+        width         : 14px;
+        height        : 14px;
+        vertical-align: bottom;
+        fill          : #909090;
+      }
+    }
+
+    // 比较原始值场景下  不同时候的样式
+    &.pro-form-item-changed {
+      background: #fffaa1;
+
+      span.ant-input-affix-wrapper,
+      .ant-select-selector,
+      .ant-picker {
+        background: #fffaa1;
+
+        input {
+          background: #fffaa1;
+        }
+      }
+
+      .ant-checkbox-group {
+        label:not([class~='ant-checkbox-wrapper-checked']) {
+          .ant-checkbox-inner {
+            background: #fffaa1;
+
+            input {
+              background: #fffaa1;
+            }
+          }
+        }
+      }
+
+      #switch {
+        background: #bfbfbf;
+      }
+    }
+
+    // 自定义label宽度场景
+    &.label-width {
+      .ant-form-item-label {
+        width    : auto !important;
+        max-width: fit-content !important;
+      }
+    }
+
+    .ant-row {
+      width: 100%;
+    }
+
+    .ant-col.ant-col-0 {
+      display: none;
+    }
+
+    &.ant-form-item-with-help {
+      margin-bottom: 0;
+      transition   : none;
+    }
+
+    .ant-form-item-explain {
+      height: var(--zaui-space-size-md, 16px);
+
+      .ant-form-item-explain-error {
+        font-size  : var(--zaui-font-size, 14px);
+        line-height: var(--zaui-space-size-md, 16px);
+      }
+    }
+
+
+
+    .ant-input-number {
+      width: 100%;
+    }
+
+    .pro-number-range {
+      .ant-input-number {
+        width: calc(50% - 20px);
+      }
+
+      .range-right {
+        .ant-input-number {
+          border-left: none;
+        }
+
+        .range-right {
+          width                    : 100%;
+          border                   : 1px solid #d9d9d9;
+          border-top-left-radius   : 0;
+          border-bottom-left-radius: 0;
+        }
+      }
+    }
+  }
+
+  .ant-form-item-hidden {
+    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 {
+      white-space: pre-wrap;
+    }
+  }
+
+  .suffix-value {
+    margin-left: 8px;
+  }
+
+  .ant-form-item-has-error {
+    .site-input-split {
+      border-color: #ff4d4f;
+    }
+  }
+
+  .site-input-group-wrapper {
+
+    // 范围值表单样式
+    & .site-input-split {
+      text-align      : center;
+      background-color: #fafafa;
+
+      &.site-input-split-disabled {
+        background-color: #f2f2f2;
+      }
+    }
+
+    & .site-input-right {
+      border-left-width: 0;
+    }
+
+    & .site-input-right:focus {
+      border-left-width: 1px;
+    }
+
+    & .ant-input-rtl.site-input-right {
+      border-right-width: 0;
+    }
+
+    & .ant-input-rtl.site-input-right:hover,
+    & .ant-input-rtl.site-input-right:focus {
+      border-right-width: 1px;
+    }
+
+    .ant-form-item {
+      margin-bottom: 0;
+    }
+
+    .site-input-left,
+    .site-input-right {
+      width: calc(50% - 20px);
+    }
+
+    .site-input-left {
+      .ant-input-number {
+        border-right: none;
+      }
+    }
+
+    .site-input-right {
+      .ant-input-number {
+        border-left: none;
+      }
+    }
+
+    &.ant-input-group.ant-input-group-compact>*:not(:last-child) {
+      margin-right: 0;
+    }
+
+    >*:first-child {
+      border-top-right-radius   : 0 !important;
+      border-bottom-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;
+      border-bottom-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;
+    vertical-align: top;
+  }
+
+  .pro-form-control {
+    display: flex;
+  }
+
+  .noDisabled {
+    color           : #333;
+    font-size       : 14px;
+    background-color: transparent;
+    border          : none;
+    cursor          : default;
+    opacity         : 1;
+  }
+
+  div.pro-form-custom-footer {
+    align-self: start;
+    width     : unset !important;
+  }
+
+  .pro-form-view-container {
+    display   : inline-block;
+    word-break: break-all;
+    color     : var(--zaui-text, #343434);
+  }
+
+  .pro-form-view-container_nowrap {
+    overflow     : hidden;
+    white-space  : nowrap;
+    text-overflow: ellipsis;
+  }
+
+  .full-form-item {
+    width: 100%;
+  }
+
+  .delete-icon {
+    width: 18px;
+  }
+}

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

@@ -0,0 +1 @@
+export declare const contrastOriginal: (name: any, names: any, originValues: any, currentValue: any, fun: any) => any;

package/lib/ProForm/utils/contrastOriginal.js

@@ -0,0 +1,35 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.contrastOriginal = void 0;
+var _lodash = require("lodash");
+var nullValue = [null, undefined, '']; // 输入框空值时可能存在的三种值 视为相等
+var contrastOriginal = function contrastOriginal(name, names, originValues, currentValue, fun) {
+  // 支持传入自定义比较事件
+  if ((0, _lodash.isFunction)(fun)) {
+    if (names === null || names === void 0 ? void 0 : names.length) {
+      var originVal = names.map(function (key) {
+        return (0, _lodash.get)(originValues, key);
+      });
+      return !fun(originVal, currentValue);
+    }
+    return !fun((0, _lodash.get)(originValues, name), currentValue);
+  }
+  if (names === null || names === void 0 ? void 0 : names.length) {
+    return names.some(function (nameItem, index) {
+      var originalValue = (0, _lodash.get)(originValues, nameItem);
+      if (!nullValue.includes(currentValue === null || currentValue === void 0 ? void 0 : currentValue[index]) || !nullValue.includes(originalValue)) {
+        return !(0, _lodash.isEqual)(currentValue === null || currentValue === void 0 ? void 0 : currentValue[index], (0, _lodash.get)(originValues, nameItem));
+      }
+      return false;
+    });
+  }
+  var originalValue = (0, _lodash.get)(originValues, name);
+  if (!nullValue.includes(currentValue) || !nullValue.includes(originalValue)) {
+    return !(0, _lodash.isEqual)(currentValue, (0, _lodash.get)(originValues, name));
+  }
+  return false;
+};
+exports.contrastOriginal = contrastOriginal;

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

@@ -0,0 +1,59 @@
+import { ColProps, FormProps } from 'antd';
+import { InternalNamePath, NamePath } from 'antd/es/form/interface';
+interface transProps {
+    modeFooter: boolean;
+    formProps: FormProps;
+    colProps: ColProps;
+    [name: string]: any;
+}
+interface AnyObject {
+    [key: string]: any;
+}
+export declare const getLayout: (params: any) => transProps;
+export declare const useControlled: (props: any) => any[];
+export declare const isSelect: (props: any) => any;
+/**
+ * Input TextArea 移除前后空格
+ * @param type 组件类型
+ * @param trim 是否移除前后空格
+ * @returns {}
+ */
+export declare const isTrim: (type: string, trim: 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 splitNameStr: (name: string) => NamePath[];
+export declare const filterInternalFields: (values: any) => any;
+export declare const getAllNamePath: (object: Record<string, any>, currentPath?: InternalNamePath) => InternalNamePath[];
+export declare const isNullValue: (value: any) => boolean;
+export declare const isNullArray: (value: any, length: any) => boolean;
+export declare function toArray<T>(value?: T | T[] | null): T[];
+/**
+ * names值合并
+ * @param obj AnyObject
+ * @returns AnyObject
+ */
+export declare function processHyphenKeys(obj: AnyObject): AnyObject;
+/**
+ * 初始化值names值合并
+ * @param obj AnyObject
+ * @returns AnyObject
+ */
+export declare function initialValuesToNames(values: AnyObject, columns: AnyObject): AnyObject;
+/**
+ * 获取数组含数字的新数组
+ * @returns ['group-7x19no', 0, 'abc'] =>['group-7x19no', 0]
+ */
+export declare function getArrayBeforeNumber(arr: (string | number)[]): (string | number)[];
+export declare const customEqualForFun: (value: any, other: any) => boolean;
+/**
+ * 查询数据中是否包含rowKey
+ */
+export declare const hasRowKey: (obj: any) => boolean;
+/**
+ * 查询数据中是否包含rowKey
+ */
+export declare const view: (obj: any) => boolean;
+export {};
+/**
+ * 查看高阶render
+ */