@flatbiz/antd 4.2.80 → 4.2.82

package/index.d.ts

@@ -5,7 +5,7 @@
 import { API, ModelType } from '@dimjs/model';
 import { DateFormatType, TAny, TNoopDefine, TPlainObject } from '@flatbiz/utils';
 import { IAllProps } from '@tinymce/tinymce-react';
-import { ButtonProps, CascaderProps, CheckboxProps, CollapseProps, ColorPickerProps, DrawerProps, DropdownProps, FormInstance, FormItemProps, FormListFieldData, FormListOperation, InputNumberProps, InputProps, ModalProps, PaginationProps, PopconfirmProps, RadioGroupProps, RowProps, SelectProps, SpaceProps, SwitchProps, TableProps, TabsProps, TagProps, TimePickerProps, TimeRangePickerProps, TooltipProps, TreeProps, TreeSelectProps, UploadProps } from 'antd';
+import { ButtonProps, CascaderProps, CheckboxProps, CollapseProps, ColorPickerProps, DrawerProps, DropdownProps, FormInstance, FormItemProps, FormListFieldData, FormListOperation, InputNumberProps, InputProps, ModalProps, PaginationProps, PopconfirmProps, PopoverProps, RadioGroupProps, RowProps, SelectProps, SpaceProps, SwitchProps, TableProps, TabsProps, TagProps, TimePickerProps, TimeRangePickerProps, TooltipProps, TreeProps, TreeSelectProps, UploadProps } from 'antd';
 import { ConfigProviderProps } from 'antd/es/config-provider';
 import { PickerDateProps, RangePickerDateProps } from 'antd/es/date-picker/generatePicker';
 import { FormListProps } from 'antd/es/form';
@@ -59,6 +59,10 @@ export type ButtonWrapperProps = Omit<ButtonProps, "onClick"> & {
 	hidden?: boolean;
 	/** loading 显示位置，默认值：left */
 	loadingPosition?: "left" | "center";
+	/**
+	 * 移除间隙，一般用于 type=link 类型下
+	 */
+	removeGap?: boolean;
 };
 /**
  * antd Button包装组件
@@ -676,24 +680,22 @@ export type DragCollapseProps = {
  * @returns
  */
 export declare const DragCollapse: (props: DragCollapseProps) => import("react/jsx-runtime").JSX.Element;
-export type DragCollapseFormListHeaderProps = {
-	/** Form.List item fieldData */
-	formListFieldData: FormListFieldData;
-	/** 当前阶段 完整 formItem name */
-	formStageCompleteName: string | number | (string | number)[];
-	/** Form.List 操作项 */
-	operation: FormListOperation;
-	uid: string | number;
-};
 export type DragCollapseFormListContentProps = {
 	/** Form.List item fieldData */
 	formListFieldData: FormListFieldData;
 	/** 当前阶段 完整 formItem name */
-	formStageCompleteName: string | number | (string | number)[];
+	formStageCompleteName: Array<string | number>;
 	/** Form.List 操作项 */
 	operation: FormListOperation;
 	uid: string | number;
-};
+	/** 获取当前FormList 内部 Form.Item name */
+	getInsideFormItemName: (key: string) => Array<string | number>;
+	/** 获取当前 FormList Item 数据 */
+	getInsideFormItemData: () => TPlainObject;
+	/** 索引 */
+	index: number;
+};
+export type DragCollapseFormListHeaderProps = DragCollapseFormListContentProps;
 export type DragCollapseFormListProps = {
 	/** formList item 数据中的唯一值，默认值：uid */
 	uidFieldName?: string;
@@ -737,6 +739,80 @@ export type DragCollapseFormListProps = {
  * ```
  */
 export declare const DragCollapseFormList: (props: DragCollapseFormListProps) => import("react/jsx-runtime").JSX.Element;
+export type DragFormListContentProps = {
+	/** Form.List item fieldData */
+	formListFieldData: FormListFieldData;
+	/**
+	 * 当前阶段 完整 formItem name
+	 * ```
+	 * 1. 获取当前输入项Item数据
+	 *    form.getFieldValue(props.formStageCompleteName);
+	 * 2. 获取当前输入项Item指定字段数据
+	 *    form.getFieldValue([...props.formStageCompleteName, 'key']);
+	 * ```
+	 */
+	formStageCompleteName: (string | number)[];
+	/**
+	 * formList上一级 formItem完整name
+	 */
+	prevCompleteName: (string | number)[];
+	/** Form.List 操作项 */
+	operation: FormListOperation;
+	/** 索引 */
+	index: number;
+	/** 获取当前FormList 内部 Form.Item name */
+	getInsideFormItemName: (key: string) => Array<string | number>;
+	/** 获取当前 FormList Item 数据 */
+	getInsideFormItemData: () => TPlainObject;
+	/** 唯一值字段Key */
+	uidKey: string;
+};
+export type DragFormListProps = {
+	className?: string;
+	style?: CSSProperties;
+	/** formList item 数据中的唯一值，默认值：uid */
+	uidFieldName?: string;
+	/** formList name */
+	name: string | number | (string | number)[];
+	/**
+	 * formList上一级 formItem完整name
+	 * ```
+	 * 1. 如果没有传 []
+	 * 2. FormList内部通过 Form.useWatch 取值需要完整 name
+	 * ```
+	 */
+	prevCompleteName: (string | number)[];
+	/** 拖拽回调 */
+	onDropChange?: (items: TPlainObject[]) => void;
+	/** 设置拖拽图标 */
+	dragIcon?: ReactElement;
+	/** 禁用拖拽，拖拽图标隐藏 */
+	dragDisabled?: boolean;
+	/** 设置item禁止拖拽   */
+	getItemDragDisabled?: (uid: string | number, index: number) => boolean;
+	/** 新增行默认值，自定义onTableAfterRender后失效 */
+	getAddRowDefaultValues?: () => TPlainObject;
+	/** 隐藏新增行按钮 */
+	hiddenAddRowButton?: boolean;
+	/** 自定义新增行按钮，getAddRowDefaultValues配置失效 */
+	onCustomAddRowButton?: (operation: FormListOperation) => ReactElement;
+	/** formListItem 内容 */
+	children: (data: DragFormListContentProps) => ReactElement;
+	/** 隐藏数据为空渲染 */
+	hiddenEmptyRender?: boolean;
+	/** formList内部渲染包装，多用于FormListWrapper嵌套布局 */
+	formListChildrenWrapper?: (props: {
+		children: ReactElement;
+	}) => ReactElement;
+};
+/**
+ * 可拖拽FormList
+ * ```
+ * 1. FormList数组中必须要有唯一值字段，默认值字段名称uid，可通过uidFieldName自定义设置
+ * 2. Demo: https://fex.qa.tcshuke.com/docs/admin/main/form/list
+ * ```
+ */
+export declare const DragFormList: (props: DragFormListProps) => import("react/jsx-runtime").JSX.Element;
 export interface DrawerOperationProps {
 	loading?: boolean;
 	okText?: string;
@@ -936,11 +1012,11 @@ export type EasyTableFilterProps = {
 	/** 是否为纯净模式（查询条件布局是否自定义）， */
 	isPure?: boolean;
 	/** 查询按钮配置 */
-	queryButtonProps?: Omit<ButtonProps, "onClick"> & {
+	queryButtonProps?: Omit<ButtonWrapperProps, "onClick"> & {
 		text?: string;
 	};
 	/** 重置按钮配置 */
-	resetButtonProps?: Omit<ButtonProps, "onClick"> & {
+	resetButtonProps?: Omit<ButtonWrapperProps, "onClick"> & {
 		text?: string;
 	};
 	/**
@@ -956,11 +1032,58 @@ export type EasyTableFilterProps = {
 	filterWrapperStyle?: CSSProperties;
 	/** filter Form 外层 SimpleLayout className  */
 	filterWrapperClassName?: string;
+	/**
+	 * 自定义 filterOperate.rightList 后 默认【查询、重置】按钮处理逻辑
+	 * 1. cover：覆盖内部查询重置按钮（默认值）
+	 * 2. beforeAppend：添加到【查询重置】按钮前面
+	 * 3. afterAppend：添加到【查询重置】按钮后面
+	 *
+	 * 如果想隐藏【查询、重置】按钮中的某一个，可设置 queryButtonProps.hidden、resetButtonProps.hidden
+	 */
+	rightOperateAreaAppendType?: "cover" | "beforeAppend" | "afterAppend";
+};
+export type TipsWrapperProps = {
+	gap?: number;
+	className?: string;
+	style?: CSSProperties;
+	children?: ReactNode;
+	icon?: ReactElement;
+	/** Icon添加点击事件，设置hoverTips后失效 */
+	onClick?: (event: any) => void;
+	/**
+	 * 提示效果类型
+	 * ```
+	 * 1. popover 气泡卡片，内容通过popoverProps设置
+	 * 2. tooltip 文字提示，内容通过tooltipProps设置
+	 * ```
+	 */
+	tipType?: "popover" | "tooltip";
+	popoverProps?: PopoverProps;
+	tooltipProps?: TooltipProps;
+	trigger?: "icon" | "all";
 };
+/**
+ * 为目标元素右侧添加Icon
+ * ```
+ * Icon有两种交互行为
+ * 1. 鼠标悬浮显示提示效果;
+ * 2. 为Icon添加点击事件
+ *
+ * 例如：
+ * 1.
+ * <TipsWrapper tipType="tooltip" tooltipProps={{ title:'说明文案' }}>ABC</TipsWrapper>
+ * 2.
+ * <TipsWrapper tipType="popover" popoverProps={{ title:'说明标题', content:'说明内容' }}>ABC</TipsWrapper>
+ * 3.
+ * <TipsWrapper onClick={noop}>ABC</TipsWrapper>
+ * ```
+ */
+export declare const TipsWrapper: (props: TipsWrapperProps) => import("react/jsx-runtime").JSX.Element;
 export type TEasyTableTableColumn<T> = ColumnsType<T>[0] & {
 	/**
-	 * 会在 title 之后展示一个 icon，hover 之后提示一些信息
+	 * @description 请使用 tipsWrapperProps 属性配置
 	 * ```
+	 * 会在 title 之后展示一个 icon，hover 之后提示一些信息
 	 * 1. title为string类型有效
 	 * 2. hoverArea 默认值：icon
 	 * ```
@@ -971,6 +1094,15 @@ export type TEasyTableTableColumn<T> = ColumnsType<T>[0] & {
 		hoverArea?: "icon" | "all";
 	};
 	dataIndex?: keyof T | (string & {});
+	/**
+	 * 会在 title 之后展示一个 icon
+	 * ```
+	 * 1. title为string类型有效
+	 * 2. 可为icon添加提示效果
+	 * 3. 可为icon添加点击事件
+	 * ```
+	 */
+	tipsWrapperProps?: TipsWrapperProps;
 };
 export type EasyTableTableProps<T> = Omit<TableProps<TAny>, "dataSource" | "loading" | "rowKey" | "columns"> & {
 	children?: ReactElement | ReactElement[];
@@ -1036,6 +1168,7 @@ export declare const EasyTable: import("react").ForwardRefExoticComponent<EasyTa
 	 *3. EasyTable.Filter中内置了 Form 标签，当children为函数时，可获取form实例
 	 *4. 默认布局下，可通过设置 filterOperate 设置操作按钮
 	 *5. Filter 子节点包含 hidden = true 会被忽略
+	 *6. 如果想隐藏【查询、重置】按钮中的某一个，可设置 queryButtonProps.hidden、resetButtonProps.hidden
 	 *```
 	 */
 	Filter: (props: EasyTableFilterProps) => import("react/jsx-runtime").JSX.Element;
@@ -1051,7 +1184,9 @@ export declare const EasyTable: import("react").ForwardRefExoticComponent<EasyTa
 	/**
 	 * @deprecated 已过时 4.3.0版本移除，请使用 useEasyTable
 	 */
-	useEasyTablRef: () => import("react").MutableRefObject<EasyTableRefApi>;
+	useEasyTablRef: () => {
+		current: EasyTableRefApi;
+	};
 	/**  在 EasyTable子组件内才可使用 */
 	useEasyTable: () => EasyTableRefApi;
 };
@@ -1378,8 +1513,9 @@ export type fieldConfigFunctionParams = {
  */
 export type EditableTableColumn = Omit<ColumnsType["0"], "render"> & {
 	/**
-	 * 会在 title 之后展示一个 icon，hover 之后提示一些信息
+	 * @description 请使用 tipsWrapperProps 属性配置
 	 * ```
+	 * 会在 title 之后展示一个 icon，hover 之后提示一些信息
 	 * 1. title为string类型、ReactElement有效
 	 * 2. hoverArea 默认值：icon
 	 * ```
@@ -1389,6 +1525,15 @@ export type EditableTableColumn = Omit<ColumnsType["0"], "render"> & {
 		icon?: ReactElement;
 		hoverArea?: "icon" | "all";
 	};
+	/**
+	 * 会在 title 之后展示一个 icon
+	 * ```
+	 * 1. title为string类型有效
+	 * 2. 可为icon添加提示效果
+	 * 3. 可为icon添加点击事件
+	 * ```
+	 */
+	tipsWrapperProps?: TipsWrapperProps;
 	dataIndex?: string;
 	fieldConfig?: FieldSingleConfig | FormListConfig | ((data: fieldConfigFunctionParams) => FieldSingleConfig | FormListConfig);
 	/** 隐藏域字段 */
@@ -1412,7 +1557,7 @@ export type EditableTableColumn = Omit<ColumnsType["0"], "render"> & {
 		index: number;
 	}) => ReactElement | null;
 	/** table datasource children column 自定义渲染  */
-	tableChildrenColumnRender?: (value: any, record: TPlainObject, index: number) => ReactElement | null;
+	tableChildrenColumnRender?: (value: TAny, record: TPlainObject, index: number) => ReactElement | null;
 };
 export type EditableTableProps = {
 	name: EditableTableName;
@@ -1437,6 +1582,10 @@ export type EditableTableProps = {
 	/** 新增行默认值，自定义onTableAfterRender后失效 */
 	getAddRowDefaultValues?: () => TPlainObject;
 };
+export type EditableTableRefApi = {
+	/** 可用于表格行选择操作时，获取操作列数据 */
+	getTableItemDataByFormListItemKey: (key: number) => TPlainObject;
+};
 /**
  * 可编辑表格
  * demo：https://fex.qa.tcshuke.com/docs/admin/main/table/row-editable1
@@ -1445,9 +1594,10 @@ export type EditableTableProps = {
  * 1. table children column 不可编辑
  * 2. 当存在折叠children数据时，组件会在children中内置_isChildrenItem字段
  * 3. 可通过tableChildrenColumnRender自定义渲染 table children column 显示
+ * 4. 设置 rowSelection 后，rowSelection.onChange 通过 ref 的 getTableItemDataByFormListItemKey获取数据
  * ```
  */
-export declare const EditableTable: (props: EditableTableProps) => import("react/jsx-runtime").JSX.Element;
+export declare const EditableTable: import("react").ForwardRefExoticComponent<EditableTableProps & import("react").RefAttributes<EditableTableRefApi>>;
 export type EditorWrapperProps = {
 	onChange?: (data?: string) => void;
 	value?: string;
@@ -1677,14 +1827,14 @@ export declare const FormGrid: {
 	 * FormItem网格响应式布局
 	 *```
 	 * 1. 应用场景：Form条件布局
-	 * 2. 子元素只能是 FormCol、FormOperateCol，其他会被忽略
-	 * 3. 所有子元素中只能存在一个 FormOperateCol
+	 * 2. 子元素只能是 FormGrid.Col、FormGrid.OperateCol，其他会被忽略
+	 * 3. 所有子元素中只能存在一个 FormGrid.OperateCol
 	 */
 	Row: (props: FormRowProps) => import("react/jsx-runtime").JSX.Element;
 	/**
 	 * 网格响应式布局，默认值：{ xs: 24, sm: 12, md: 12, lg: 8, xl: 8, xxl: 6 }
 	 *```
-	 * 1. 设置 span 栅格占位格数，不考虑响应式
+	 * 1. 设置 span 栅格占位格数，替换lg、xl、xxl默认数据，不替换xs、sm布局数据
 	 * 2. grid 自定义响应式网格布局
 	 * xs: 屏幕 < 576px
 	 * sm: 屏幕 ≥ 576px
@@ -1719,6 +1869,15 @@ export type FormItemHorizontalUnionProps = {
 	groupConfigList: {
 		hidden?: boolean;
 		before?: ReactElement | string;
+		/**
+		 * 设置宽度
+		 * ```
+		 * 1. 自适应可设置：auto
+		 * 2. 可设置具体数值
+		 * 3. 不设置会在铺满flex剩余空间
+		 * 4. 多个未设置会等分铺满剩余空间
+		 * ```
+		 */
 		width?: number | string;
 		mainItem: ReactElement;
 		after?: ReactElement | string;
@@ -1768,6 +1927,73 @@ export interface FormItemWrapperProps extends FormItemProps {
  * ```
  */
 export declare const FormItemWrapper: (props: FormItemWrapperProps) => import("react/jsx-runtime").JSX.Element | null;
+export type FormListWrapperContentProps = {
+	/** Form.List item fieldData */
+	formListFieldData: FormListFieldData;
+	/**
+	 * 当前阶段 完整 formItem name
+	 * ```
+	 * 1. 获取当前输入项Item数据
+	 *    form.getFieldValue(props.formStageCompleteName);
+	 * 2. 获取当前输入项Item指定字段数据
+	 *    form.getFieldValue([...props.formStageCompleteName, 'key']);
+	 * ```
+	 */
+	formStageCompleteName: (string | number)[];
+	/**
+	 * formList上一级 formItem完整name
+	 */
+	prevCompleteName: (string | number)[];
+	/** Form.List 操作项 */
+	operation: FormListOperation;
+	/** 索引 */
+	index: number;
+	/** 获取当前FormList 内部 Form.Item name */
+	getInsideFormItemName: (key: string) => Array<string | number>;
+	/** 获取当前 FormList Item 数据 */
+	getInsideFormItemData: () => TPlainObject;
+	/** 唯一值字段Key */
+	uidKey: string;
+};
+export type FormListWrapperProps = {
+	className?: string;
+	style?: CSSProperties;
+	/** formList item 数据中的唯一值，默认值：uid */
+	uidFieldName?: string;
+	/** formList name */
+	name: string | number | (string | number)[];
+	/**
+	 * formList上一级 formItem完整name
+	 * ```
+	 * 1. 如果没有传 []
+	 * 2. FormList内部通过 Form.useWatch 取值需要完整 name
+	 * ```
+	 */
+	prevCompleteName: (string | number)[];
+	/** formListItem 内容 */
+	/** 新增行默认值，自定义onTableAfterRender后失效 */
+	getAddRowDefaultValues?: () => TPlainObject;
+	/** 隐藏新增行按钮 */
+	hiddenAddRowButton?: boolean;
+	/** 自定义新增行按钮，getAddRowDefaultValues配置失效 */
+	onCustomAddRowButton?: (operation: FormListOperation) => ReactElement;
+	/** formListItem 内容 */
+	children: (data: FormListWrapperContentProps) => ReactElement;
+	/** 隐藏数据为空渲染 */
+	hiddenEmptyRender?: boolean;
+	/** formList内部渲染包装，多用于FormListWrapper嵌套布局 */
+	formListChildrenWrapper?: (props: {
+		children: ReactElement;
+	}) => ReactElement;
+};
+/**
+ * FormList
+ * ```
+ * 1. FormList数组中必须要有唯一值字段，默认值字段名称uid，可通过uidFieldName自定义设置
+ * 2. Demo: https://fex.qa.tcshuke.com/docs/admin/main/form/list
+ * ```
+ */
+export declare const FormListWrapper: (props: FormListWrapperProps) => import("react/jsx-runtime").JSX.Element;
 export type GapProps = {
 	height?: number;
 	width?: number;
@@ -1853,6 +2079,7 @@ export type LabelValueLayoutProps = {
 	column?: number;
 	bordered?: boolean;
 	className?: string;
+	style?: CSSProperties;
 };
 /**
  * options[].span 是 Description.Item 的数量。 span={2} 会占用两个 DescriptionItem 的宽度
@@ -2020,6 +2247,8 @@ export declare const preDefinedClassName: {
 		label_value_vertical: string;
 		formItemGap15: string;
 		formItemGap8: string;
+		formItemGap5: string;
+		formItemGap0: string;
 	};
 	formItem: {
 		label_width_70: string;
@@ -2390,7 +2619,7 @@ export type SwitchConfirmWrapperProps = Omit<SwitchProps, "defaultChecked" | "on
 	needConfirm?: "close" | "open" | "all" | "none";
 	noMessage?: boolean;
 	onChange?: (value: SwitchConfirmWrapperValue) => void;
-	popConfirmProps?: Pick<PopconfirmProps, "disabled" | "title" | "description">;
+	popConfirmProps?: Pick<PopconfirmProps, "disabled" | "title" | "description"> | ((checked?: boolean) => Pick<PopconfirmProps, "disabled" | "title" | "description">);
 	serviceConfig?: {
 		onRequest: (value: SwitchConfirmWrapperValue) => TAny;
 		message?: {
@@ -2406,7 +2635,11 @@ export type SwitchConfirmWrapperProps = Omit<SwitchProps, "defaultChecked" | "on
  * @param value
  * @param checkedValue：选中状态值
  * @param unCheckedValue：非选中状态值
- * @param needConfirm：二次pop拦截时机 可不传 同 all close：switch 由开启转换成关闭时pop弹出、open：switch 由开启转换成开启时pop弹出all：switch 一直popnone：switch 不弹出
+ * @param needConfirm：二次pop拦截时机 可不传
+ *        close：switch 由开启转换成关闭时pop弹出
+ *        open：switch 由开启转换成开启时pop弹出
+ *        all：switch 一直pop
+ *        none：switch 不弹出
  * @param noMessage：不采用内置message提示
  * @param onChange：switch 有效切换回掉
  * @param popConfirmProps：popConfirm中参数 disabled title description
@@ -2690,7 +2923,7 @@ export type TableTitleTooltipProps = {
 	title: string | ReactElement;
 	tooltip: string | {
 		icon?: ReactElement;
-		content?: string;
+		content: string;
 		hoverArea?: "icon" | "all";
 	};
 	gap?: number;
@@ -2699,8 +2932,7 @@ export type TableTitleTooltipProps = {
 };
 /**
  * title + tooltip
- * @param props
- * @returns
+ * @deprecated 已过期，请使用 TipsWrapper 组件
  */
 export declare const TableTitleTooltip: (props: TableTitleTooltipProps) => import("react/jsx-runtime").JSX.Element;
 export type TabsWrapperProps = TabsProps & {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@flatbiz/antd",
-  "version": "4.2.80",
+  "version": "4.2.82",
   "description": "flat-biz ui components",
   "main": "index.js",
   "typings": "index.d.ts",
@@ -31,7 +31,7 @@
     "@dimjs/model": ">=1.1.8",
     "@dimjs/model-react": ">=1.1.8",
     "@dimjs/utils": ">=1.3.2",
-    "@flatbiz/utils": ">=4.0.13",
+    "@flatbiz/utils": ">=4.0.15",
     "@wove/react": ">=1.2.23",
     "antd": ">=5.5.1",
     "dayjs": ">=1.11.9",