@jiaozhiye/qm-design-react 1.4.0-beta.2 → 1.4.0-beta.20

package/lib/_utils/types.d.ts

@@ -16,7 +16,7 @@ export declare type IntervalHandle = ReturnType<typeof setInterval>;
 export declare type AjaxResponse<T = any> = {
     code: number;
     data: T;
-    msg: string;
+    message: string;
 };
 export declare enum SizeHeight {
     large = 40,
@@ -31,3 +31,9 @@ export declare type IDict = {
     disabled?: boolean;
     children?: Array<IDict> | Nullable<undefined>;
 };
+export declare type IAuth = {
+    dataIndex?: string;
+    visible?: number;
+    disabled?: number;
+    secretName?: string;
+};

package/lib/_utils/util.d.ts

@@ -22,4 +22,3 @@ export declare const getValueByPath: (obj: AnyObject<any>, paths?: string) => un
 export declare const deepClone: <T extends object>(target: T, map?: WeakMap<object, any>) => T;
 export declare const getParserWidth: (val: number | string) => string;
 export declare const flatJson: <T extends Record<string, any>>(jsonObject: T) => T;
-export declare const getAuthValue: (code: string) => Record<string, any> | undefined;

package/lib/anchor/src/anchor-nav.d.ts

@@ -6,7 +6,7 @@ declare type IProps = {
     onTabClick: AnyFunction<void>;
 };
 declare class AnchorNav extends Component<IProps> {
-    renderLabel(prefixCls: string): React.ReactNode[];
+    renderLabel(): React.ReactNode[];
     render(): JSX.Element;
 }
 export default AnchorNav;

package/lib/anchor/src/anchor.d.ts

@@ -9,6 +9,7 @@ declare type IProps = {
     size?: ComponentSize;
     labelWidth?: number | string;
     labelList?: Array<ILabelItem>;
+    tabPosition?: 'left' | 'top';
     className?: string;
     style?: CSSProperties;
     children?: React.ReactNode;
@@ -34,7 +35,7 @@ declare class QmAnchor extends Component<IProps, IState> {
         }> | null | undefined)[]>;
     };
     static defaultProps: {
-        labelWidth: number;
+        tabPosition: string;
     };
     static contextType: React.Context<import("../../config-provider/context").IConfig>;
     private currentState;

package/lib/anchor/style/index.less

@@ -9,22 +9,15 @@
 @prefix-anchor: ~'@{qm-prefix}-anchor';
 
 .@{prefix-anchor} {
-  .reset-component;
+  .reset-container;
   display: flex;
-  flex-direction: row;
-  &__label {
-    width: 80px;
-  }
-  &-nav {
-    height: 100%;
-    margin-right: @--margin-md;
-    border-right: 1px solid @--border-color-base;
-    &__item {
+  .anchor-nav {
+    display: flex;
+    flex: none;
+    .item {
       display: flex;
       align-items: center;
-      justify-content: flex-end;
       height: @--height-md;
-      padding-right: @--padding-md;
       position: relative;
       cursor: pointer;
       &.actived {
@@ -32,30 +25,77 @@
         &::after {
           content: '';
           position: absolute;
-          right: -2px;
-          top: 0;
-          width: 2px;
-          height: 100%;
           background-color: @--primary-color;
         }
       }
       span {
         .text-overflow-cut();
         display: block;
-        text-align: right;
       }
     }
   }
-  &__container {
-    flex: 1;
-    width: 0;
-    padding-right: 5px;
+  &-left {
+    flex-direction: row;
+    .anchor-nav {
+      flex-direction: column;
+      margin-right: @--margin-md;
+      border-right: 1px solid @--border-color-base;
+      .item {
+        justify-content: flex-end;
+        padding: 0 @--padding-md;
+        &.actived {
+          &::after {
+            width: 2px;
+            right: -2px;
+            top: 0;
+            bottom: 0;
+          }
+        }
+      }
+    }
+  }
+  &-top {
+    flex-direction: column;
+    .anchor-nav {
+      flex-direction: row;
+      margin-bottom: @--margin-md;
+      border-bottom: 1px solid @--border-color-base;
+      .item {
+        justify-content: center;
+        padding: 0 @--padding-md + 2px;
+        &.actived {
+          &::after {
+            height: 2px;
+            bottom: -2px;
+            left: @--padding-md;
+            right: @--padding-md;
+          }
+        }
+      }
+    }
+  }
+  .anchor-container {
+    flex: auto;
+    min-width: 0;
+    min-height: 0;
     overflow-y: auto;
+    overflow-x: hidden;
   }
   // ------ size ------
   // 40  32  24
   &--lg {
+    .anchor-nav {
+      .item {
+        height: @--height-lg;
+      }
+    }
   }
   &--sm {
+    .anchor-nav {
+      .item {
+        height: @--height-sm + 2px;
+        font-size: 13px;
+      }
+    }
   }
 }

package/lib/antd/compact.less

@@ -0,0 +1,11 @@
+/*
+ * @Author: 焦质晔
+ * @Date: 2023-01-07 14:07:04
+ * @Last Modified by: 焦质晔
+ * @Last Modified time: 2023-01-07 14:07:27
+ */
+@import 'antd/dist/antd.compact.less';
+
+#__compact__ {
+  background-color: transparent;
+}

package/lib/button/src/button.d.ts

@@ -1,11 +1,12 @@
 import React, { Component } from 'react';
 import PropTypes from 'prop-types';
+import type { IAuth } from '../../_utils/types';
 import type { ButtonProps } from '../../antd';
 declare type IProps = ButtonProps & {
-    authCode?: string;
     click?: () => Promise<void> | void;
+    authConfig?: IAuth;
     confirm?: {
-        title?: string;
+        title?: string | React.ReactNode;
         onConfirm?: () => void;
         onCancel?: (ev: any) => void;
     };
@@ -18,7 +19,7 @@ declare class QmButton extends Component<IProps, IState> {
     static propTypes: {
         click: PropTypes.Requireable<(...args: any[]) => any>;
         confirm: PropTypes.Requireable<PropTypes.InferProps<{
-            title: PropTypes.Requireable<string>;
+            title: PropTypes.Requireable<PropTypes.ReactNodeLike>;
             onConfirm: PropTypes.Requireable<(...args: any[]) => any>;
             onCancel: PropTypes.Requireable<(...args: any[]) => any>;
         }>>;

package/lib/collapse/src/collapse.d.ts

@@ -7,6 +7,7 @@ declare type IProps = {
     disabled?: boolean;
     forceRender?: boolean;
     destroyOnClose?: boolean;
+    onChange?: (value: boolean) => void;
     className?: string;
     style?: React.CSSProperties;
     containerStyle?: React.CSSProperties;

package/lib/countup/style/index.less

@@ -1,22 +1,22 @@
-/*
- * @Author: 焦质晔
- * @Date: 2021-07-23 19:05:57
- * @Last Modified by: 焦质晔
- * @Last Modified time: 2021-08-01 21:58:46
- */
-@import '../../style/common';
-
-@prefix-countup: ~'@{qm-prefix}-countup';
-
-.@{prefix-countup} {
-  .reset-component;
-  font-size: @--font-size-base;
-  // ------ size ------
-  // 40  32  24
-  &--lg {
-    font-size: @--font-size-base;
-  }
-  &--sm {
-    font-size: @--font-size-sm;
-  }
-}
+/*
+ * @Author: 焦质晔
+ * @Date: 2021-07-23 19:05:57
+ * @Last Modified by: 焦质晔
+ * @Last Modified time: 2021-08-01 21:58:46
+ */
+@import '../../style/common';
+
+@prefix-countup: ~'@{qm-prefix}-countup';
+
+.@{prefix-countup} {
+  .reset-container;
+  font-size: @--font-size-base;
+  // ------ size ------
+  // 40  32  24
+  &--lg {
+    font-size: @--font-size-base;
+  }
+  &--sm {
+    font-size: @--font-size-sm;
+  }
+}

package/lib/divider/style/index.less

@@ -1,54 +1,54 @@
-/*
- * @Author: 焦质晔
- * @Date: 2021-07-23 19:05:57
- * @Last Modified by: 焦质晔
- * @Last Modified time: 2021-08-21 20:34:44
- */
-@import '../../style/common';
-
-@prefix-divider: ~'@{qm-prefix}-divider';
-
-.@{prefix-divider} {
-  .reset-component;
-  display: flex;
-  align-items: center;
-  padding: 0 @--padding-md;
-  height: @--height-md;
-  border: 1px solid @--border-color-base;
-  border-radius: @--border-radius-base;
-  background-color: @--background-color-cecondary;
-  position: relative;
-  &::before {
-    content: ' ';
-    position: absolute;
-    width: 6px;
-    left: -1px;
-    top: -1px;
-    bottom: -1px;
-    background-color: @--primary-color;
-  }
-  &__title {
-    margin-left: 5px;
-  }
-  &__extra {
-    .text-overflow-cut();
-    flex: 1;
-    margin-left: @--margin-md;
-  }
-  &__collapse {
-    margin-left: @--margin-md;
-    padding-left: 0;
-    padding-right: 0;
-    .anticon {
-      margin-left: 4px !important;
-    }
-  }
-  // ------ size ------
-  // 40  32  24
-  &--lg {
-    height: @--height-lg;
-  }
-  &--sm {
-    height: @--height-sm;
-  }
-}
+/*
+ * @Author: 焦质晔
+ * @Date: 2021-07-23 19:05:57
+ * @Last Modified by: 焦质晔
+ * @Last Modified time: 2021-08-21 20:34:44
+ */
+@import '../../style/common';
+
+@prefix-divider: ~'@{qm-prefix}-divider';
+
+.@{prefix-divider} {
+  .reset-container;
+  display: flex;
+  align-items: center;
+  padding: 0 @--padding-md;
+  height: @--height-md;
+  border: 1px solid @--border-color-base;
+  border-radius: @--border-radius-base;
+  background-color: @--background-color-cecondary;
+  position: relative;
+  &::before {
+    content: ' ';
+    position: absolute;
+    width: 6px;
+    left: -1px;
+    top: -1px;
+    bottom: -1px;
+    background-color: @--primary-color;
+  }
+  &__title {
+    margin-left: 5px;
+  }
+  &__extra {
+    .text-overflow-cut();
+    flex: 1;
+    margin-left: @--margin-md;
+  }
+  &__collapse {
+    margin-left: @--margin-md;
+    padding-left: 0;
+    padding-right: 0;
+    .anticon {
+      margin-left: 4px !important;
+    }
+  }
+  // ------ size ------
+  // 40  32  24
+  &--lg {
+    height: @--height-lg;
+  }
+  &--sm {
+    height: @--height-sm;
+  }
+}

package/lib/drawer/style/index.less

@@ -67,7 +67,7 @@
     .ant-drawer-header {
       height: 48px;
     }
-    .qm-drawer-spin {
+    .@{qm-prefix}-drawer-spin {
       top: 48px;
     }
   }
@@ -75,7 +75,7 @@
     .ant-drawer-header {
       height: 40px;
     }
-    .qm-drawer-spin {
+    .@{qm-prefix}-drawer-spin {
       top: 40px;
     }
   }

package/lib/form/src/context.d.ts

@@ -1,6 +1,9 @@
 /// <reference types="react" />
+import type { FormRef } from './form';
+import type { IDict } from '../../_utils/types';
 export declare type IFormContext = {
-    $$form: any;
+    $$form: FormRef;
+    echo_data: Record<string, IDict[]>;
 };
 declare const FormContext: import("react").Context<IFormContext | undefined>;
 export default FormContext;

package/lib/form/src/form.d.ts

@@ -2,7 +2,7 @@
 import React, { Component } from 'react';
 import { IFieldData } from './types';
 import type { IFormProps, IFormData, IFormItem, IExtraData, IViewData, IExpandData } from './types';
-import type { JSXElement, ValueOf } from '../../_utils/types';
+import type { JSXElement, ValueOf, IDict } from '../../_utils/types';
 import type { FormProps } from '../../antd';
 declare type IProps = FormProps & IFormProps;
 declare type IState = {
@@ -29,22 +29,16 @@ declare class QmForm extends Component<IProps, IState> {
         size: (props: any, propName: any, componentName: any) => void;
         cols: import("prop-types").Requireable<number>;
         customClass: import("prop-types").Requireable<string>;
+        compactMode: import("prop-types").Requireable<boolean>;
         labelWidth: import("prop-types").Requireable<string | number>;
         labelAlign: import("prop-types").Requireable<string>;
         labelWrap: import("prop-types").Requireable<boolean>;
         formType: import("prop-types").Requireable<string>;
         uniqueKey: import("prop-types").Requireable<string>;
-        authCode: import("prop-types").Requireable<string>;
         defaultRows: import("prop-types").Requireable<number>;
         searchButtonCols: import("prop-types").Requireable<number>;
         scrollToFirstError: import("prop-types").Requireable<boolean>;
-        authConfig: import("prop-types").Requireable<import("prop-types").InferProps<{
-            fetch: import("prop-types").Requireable<import("prop-types").InferProps<{
-                api: import("prop-types").Validator<(...args: any[]) => any>;
-                params: import("prop-types").Requireable<object>;
-                dataKey: import("prop-types").Requireable<string>;
-            }>>;
-        }>>;
+        authConfig: import("prop-types").Requireable<object>;
         isAutoFocus: import("prop-types").Requireable<boolean>;
         isCollapse: import("prop-types").Requireable<boolean>;
         isFieldsDefine: import("prop-types").Requireable<boolean>;
@@ -92,6 +86,7 @@ declare class QmForm extends Component<IProps, IState> {
     get dividers(): IFormItem[];
     get isFilterType(): boolean;
     get isOnlyShow(): boolean;
+    get isCompactMode(): boolean;
     get showDividerCollapse(): boolean;
     get showFilterCollapse(): boolean | undefined;
     componentDidMount(): void;
@@ -124,8 +119,7 @@ declare class QmForm extends Component<IProps, IState> {
         fieldName: any;
     }): boolean;
     formatFormValue(values: IFormData): IFormData;
-    createFormAuth(): void;
-    getFormAuth(): Promise<void>;
+    createFormAuth(): Promise<void>;
     INPUT(option: IFormItem): JSXElement;
     RANGE_INPUT(option: IFormItem): JSXElement;
     INPUT_NUMBER(option: IFormItem): JSXElement;
@@ -179,6 +173,7 @@ declare class QmForm extends Component<IProps, IState> {
     }) => void;
     set_fields_other(values: IFormData): void;
     get_fields_other(fields?: string[]): IFormData;
+    openValidateInfo: (errorFields: any) => void;
     scrollToField: (fieldName?: string) => void;
     formValidate(): Promise<IFormData>;
     SET_FIELDS_VALUE(values: IFormData): void;
@@ -186,10 +181,12 @@ declare class QmForm extends Component<IProps, IState> {
     GET_FORM_DATA(): Promise<[any, any]>;
     VALIDATE_FIELDS(fields?: string[]): Promise<any[]>;
     SET_FIELDS_EXTRA(values: IExtraData): void;
+    SET_FIELDS_ECHO(values: Record<string, IDict[]>): void;
     GET_FIELDS_EXTRA(fields?: string[]): IExtraData;
     GET_FIELDS_TOUCHED(fields?: string[]): boolean;
     SUBMIT_FORM(): Promise<void>;
     RESET_FORM(): void;
+    CREATE_FOCUS(fieldName: string): void;
     SET_FORM_ITEM(fieldName: string, option: Record<string, any>, forceUpdate?: boolean): void;
     render(): JSX.Element;
 }

package/lib/form/src/types.d.ts

@@ -2,7 +2,7 @@
 import PropTypes from 'prop-types';
 import type { BuildInPlacements } from 'rc-trigger';
 import type { IFetch, IColumn, IRowKey } from '../../table/src/table/types';
-import type { CSSProperties, ComponentSize, JSXElement, ValueOf, AjaxResponse, IDict } from '../../_utils/types';
+import type { CSSProperties, ComponentSize, JSXElement, ValueOf, AjaxResponse, IDict, IAuth } from '../../_utils/types';
 export declare const DEFAULT_COL = 4;
 export declare const DEFAULT_ROWS = 1;
 export declare const DEFAULT_LABEL_WIDTH = 80;
@@ -24,7 +24,6 @@ export declare type IFieldsDefine = {
     displayKey?: string;
     extraKey?: string;
 };
-export declare type ISecretType = 'name' | 'phone' | 'IDnumber' | 'bankCard';
 export declare type IDateType = 'date' | 'datetime' | 'exactdate' | 'week' | 'month' | 'quarter' | 'year';
 export declare enum EDateType {
     'date' = "date",
@@ -70,13 +69,15 @@ export declare type IRequest = {
     params?: IFetchParams;
     formatter?: (params: IFetchParams) => IFetchParams;
     dataKey?: string;
+    callback?: (itemList: IRecord[]) => void;
 };
 export declare type IAuthConfig = {
-    fetch: {
+    fetch?: {
         api: IFetchFn;
         params?: IFetchParams;
         dataKey?: string;
     };
+    fieldList?: IAuth[];
 };
 export declare type IFormItem = {
     type: IFormItemType;
@@ -109,7 +110,7 @@ export declare type IFormItem = {
         toUpper?: boolean;
         toTrim?: boolean;
         pattern?: RegExp;
-        secretType?: ISecretType;
+        secretType?: string;
         step?: number;
         min?: number;
         max?: number;
@@ -204,7 +205,10 @@ export declare type IFormItem = {
     request?: IRequest & {
         valueKey?: string;
         textKey?: string;
-        callback?: (itemList: IRecord[]) => void;
+    };
+    asyncLoad?: IRequest & {
+        valueKey?: string;
+        textKey?: string;
     };
     upload?: {
         action?: string;
@@ -247,12 +251,12 @@ export declare type IFormProps = {
     size?: ComponentSize;
     cols?: number;
     customClass?: string;
+    compactMode?: boolean;
     labelWidth?: number | string;
     labelAlign?: ILabelAlign;
     labelWrap?: boolean;
     formType?: IFormType;
     uniqueKey?: string;
-    authCode?: string;
     defaultRows?: number;
     searchButtonCols?: number;
     scrollToFirstError?: boolean;
@@ -281,22 +285,16 @@ export declare const propTypes: {
     size: (props: any, propName: any, componentName: any) => void;
     cols: PropTypes.Requireable<number>;
     customClass: PropTypes.Requireable<string>;
+    compactMode: PropTypes.Requireable<boolean>;
     labelWidth: PropTypes.Requireable<string | number>;
     labelAlign: PropTypes.Requireable<string>;
     labelWrap: PropTypes.Requireable<boolean>;
     formType: PropTypes.Requireable<string>;
     uniqueKey: PropTypes.Requireable<string>;
-    authCode: PropTypes.Requireable<string>;
     defaultRows: PropTypes.Requireable<number>;
     searchButtonCols: PropTypes.Requireable<number>;
     scrollToFirstError: PropTypes.Requireable<boolean>;
-    authConfig: PropTypes.Requireable<PropTypes.InferProps<{
-        fetch: PropTypes.Requireable<PropTypes.InferProps<{
-            api: PropTypes.Validator<(...args: any[]) => any>;
-            params: PropTypes.Requireable<object>;
-            dataKey: PropTypes.Requireable<string>;
-        }>>;
-    }>>;
+    authConfig: PropTypes.Requireable<object>;
     isAutoFocus: PropTypes.Requireable<boolean>;
     isCollapse: PropTypes.Requireable<boolean>;
     isFieldsDefine: PropTypes.Requireable<boolean>;

package/lib/form/src/utils.d.ts

@@ -7,7 +7,9 @@ export declare const isEmptyValue: (value: unknown) => boolean;
 export declare const getSplitValue: (data: IRecord, path: string) => any;
 export declare const setEchoRecord: (row: IRecord, alias: any, echoAlias: any) => void;
 export declare const setEchoExtras: (row: IRecord, extras: any, echoExtras: any) => void;
-export declare const deepMapList: (list: any[], valueKey: string, textKey: string) => IDict[];
+export declare const deepMapList: (list: any[], valueKey: string, textKey: string) => (IDict & {
+    isLeaf?: boolean | undefined;
+})[];
 export declare const deepFind: (arr: any[], mark: string) => any;
 export declare const deepFindValues: <T>(arr: T[], str: string, depth?: number) => T[];
 export declare const deepGetPath: (arr: any[], value: string) => string[] | undefined;

package/lib/form/style/index.less

@@ -2,7 +2,7 @@
  * @Author: 焦质晔
  * @Date: 2021-07-23 19:05:57
  * @Last Modified by: 焦质晔
- * @Last Modified time: 2022-11-26 21:27:53
+ * @Last Modified time: 2022-12-02 20:00:11
  */
 @import '../../style/common';
 
@@ -129,9 +129,6 @@
       }
     }
   }
-  &__only-show {
-    // ...
-  }
   // ------ size ------
   // 40  32  24
   &--lg {
@@ -139,10 +136,10 @@
   &--sm {
     .ant-form-item {
       margin-bottom: @--margin-md;
-      // label
-      .ant-form-item-label > label,
-      .ant-form-item-label .ant-form-item-tooltip {
-        font-size: @--font-size-sm;
+      .ant-form-item-label {
+        &-wrap {
+          line-height: 1;
+        }
       }
       // valigator
       .ant-form-item-control {
@@ -154,6 +151,19 @@
       }
     }
   }
+  &__only-show {
+    // ...
+  }
+  &__compact {
+    .ant-form-item {
+      margin-bottom: 4px;
+      .ant-form-item-control {
+        & > div:nth-last-of-type(1)[style*='nowrap'] {
+          display: none !important;
+        }
+      }
+    }
+  }
 }
 
 .ant-picker-footer-extra {
@@ -165,6 +175,8 @@
 // immediate
 .@{prefix-form}-immediate {
   padding: 5px 15px;
+  max-height: calc(100vh - 10px);
+  overflow-y: auto !important;
   .table {
     width: 100%;
     th,