@flatbiz/antd/dist/search-form/index.d.ts

import { TAny, TPlainObject } from '@flatbiz/utils';
import { ButtonProps, FormInstance, FormProps, RowProps, SpaceProps } from 'antd';
import { CSSProperties, ReactElement, ReactNode } from 'react';

export type ButtonWrapperProps = Omit<ButtonProps, "onClick" | "color"> & {
	/** 当返回 Promise 时，按钮自动loading */
	onClick?: (e: React.MouseEvent<HTMLElement>) => Promise<TAny> | void;
	/** 重复点击间隙，单位毫秒 默认值：500 */
	debounceDuration?: number;
	/** 基于GLOBAL中elemAclLimits按钮权限列表，控制按钮显示、隐藏 */
	permission?: string;
	/** 是否隐藏按钮 */
	hidden?: boolean;
	/** loading 显示位置，默认值：left */
	loadingPosition?: "left" | "center";
	/** 移除按钮内边距，一般用于 type=link 类型下 */
	removeGap?: boolean;
	color?: string;
};
export type FormOperateColProps = {
	className?: string;
	leftList?: Array<ReactElement | null>;
	rightList?: Array<ReactElement | null>;
	justify?: RowProps["justify"];
	/** 强制单独一行 */
	forceAloneRow?: boolean;
	hidden?: boolean;
	leftSpaceProps?: SpaceProps;
	rightSpaceProps?: SpaceProps;
};
export type FormRowProps = RowProps & {
	children?: ReactNode | ReactNode[];
	/**
	 * default = { xs: 24, sm: 12, md: 8, lg: 8, xl: 8, xxl: 6 };
	 * small = { xs: 24, sm: 12, md: 8, lg: 6, xl: 6, xxl: 6 };
	 */
	gridSize?: "default" | "small";
};
export type TFormLayoutPreClassNameProps = {
	/**
	 * label宽度，Form内部所有FormItem label都生效
	 * ```
	 * 1. 可设置数值
	 * 2. 可设置`auto`自适应
	 * ```
	 */
	labelWidth?: "auto" | "70" | "80" | "90" | "100" | "110" | "120" | "130" | "140" | "150" | "160" | "170" | "180" | "190" | "200";
	/** labelItem 竖直布局 */
	labelItemVertical?: boolean;
	/** label 对齐方式 */
	labelAlign?: "left" | "right";
	/** formItem之间竖直间距，默认值：24 */
	formItemGap?: "24" | "15" | "8" | "5" | "0";
	/**
	 * className 中可能会包含 preDefinedClassName.form.xx，优先级大于 labelWidth、labelItemVertical、labelAlign、formItemGap
	 */
	className?: string;
};
export type FormWrapperProps<Values = any> = TFormLayoutPreClassNameProps & FormProps<Values> & {
	children: ReactNode;
};
export type SearchFormProps = {
	children: ReactElement | ReactElement[] | ((form: FormInstance) => ReactElement);
	/** isPure = true时无效 */
	searchOperate?: (form: FormInstance) => FormOperateColProps;
	/** 是否为纯净模式（查询条件布局是否自定义）， */
	isPure?: boolean;
	/** 查询按钮配置 */
	queryButtonProps?: Omit<ButtonWrapperProps, "onClick"> & {
		text?: string;
	};
	/** 重置按钮配置 */
	resetButtonProps?: Omit<ButtonWrapperProps, "onClick"> & {
		text?: string;
	};
	/**
	 * 网格布局设置
	 * default = { xs: 24, sm: 12, md: 12, lg: 8, xl: 8, xxl: 6 };
	 * small = { xs: 24, sm: 8, md: 8, lg: 6, xl: 6, xxl: 6 };
	 */
	formGridSize?: FormRowProps["gridSize"];
	formClassName?: string;
	formStyle?: CSSProperties;
	/** form 初始值 */
	formInitialValues?: TPlainObject;
	/** label宽度，Form内部所有FormItem label都生效 */
	formLabelWidth?: FormWrapperProps["labelWidth"];
	/** labelItem 竖直布局 */
	formLabelItemVertical?: FormWrapperProps["labelItemVertical"];
	/** label 对齐方式 */
	formLabelAlign?: FormWrapperProps["labelAlign"];
	/** formItem之间竖直间距，默认值：24 */
	formFormItemGap?: FormWrapperProps["formItemGap"];
	/**
	 * 自定义 searchOperate.rightList 后 默认【查询、重置】按钮处理逻辑
	 * 1. cover：覆盖内部查询重置按钮（默认值）
	 * 2. beforeAppend：添加到【查询重置】按钮前面
	 * 3. afterAppend：添加到【查询重置】按钮后面
	 *
	 * 如果想隐藏【查询、重置】按钮中的某一个，可设置 queryButtonProps.hidden、resetButtonProps.hidden
	 */
	rightOperateAreaAppendType?: "cover" | "beforeAppend" | "afterAppend";
	/** 默认重启按钮触发请求，默认值：true */
	defaultResetButtonTriggerRequest?: boolean;
	/**
	 * 展开、收起key值列表（内容当前组件子组件key值）
	 */
	foldKeys?: string[];
	/**
	 * 按钮提交事件
	 * 如果需要自定义回车提交事件，需要自定义提交按钮
	 */
	onFormFinish?: (values?: TPlainObject) => void;
	/** 重置按钮 */
	onReset?: () => void;
	/** 查询按钮 */
	onQuery?: (values: TPlainObject) => void;
	/**
	 * 是否缓存查询数据，默认值：true
	 * ```
	 * 1. 一般首页可缓存，二级、三级等页面不能缓存
	 * ```
	 */
	cacheSwitch?: boolean;
	/** 初始化是否请求，默认值：true */
	initRequest?: boolean;
	form?: FormInstance;
};
export type SearchFormRefApi = {
	onQuery: (values?: TPlainObject) => void;
	form: FormInstance;
};
/**
 * 搜索表单
 *
 *```
 * 1. 用法1
 *  -- 默认网格布局 规则：{ xs: 24, sm: 12, md: 12, lg: 8, xl: 8, xxl: 6 }
 *  <SearchForm>
 *   <Form.Item name="field1" label="条件1">xxx</Form.Item>
 *  </SearchForm>
 *
 *  -- 自定义网格布局 使用 FormCol组件包装 Form.Item
 *  <SearchForm>
 *    <FormCol span={12}><Form.Item name="field1" label="条件1">xxx</Form.Item></FormCol>
 *  </SearchForm>
 *
 *  -- children 可为 function
 *  <SearchForm>
 *   {(form) => {
 *     return <Form.Item name="field1" label="条件1">xxx</Form.Item>
 *   }}
 * </SearchForm>
 *
 * 2. 用户2（自定义布局）
 *    SearchForm设置 isPure = true，FormItem无布局规则
 * 3. SearchForm中内置了 Form 标签，当children为函数时，可获取form实例
 * 4. 默认布局下，可通过设置 searchOperate 设置操作按钮
 * 5. SearchForm 子节点包含 hidden = true 会被忽略
 * 6. 如果想隐藏【查询、重置】按钮中的某一个，可设置 queryButtonProps.hidden、resetButtonProps.hidden
 * 7. 通过设置 defaultResetButtonTriggerRequest，可在右侧按钮区域新增自定义按钮
 * 8. 可设置 cacheSwitch 来控制是否缓存查询数据（一般一级页面可缓存，二级、三级等不能缓存），
 *    缓存数据存储在内存中，react路由跳转可正常读取缓存，浏览器刷新后缓存丢失
 *```
 */
export declare const SearchForm: import("react").ForwardRefExoticComponent<SearchFormProps & import("react").RefAttributes<SearchFormRefApi>>;

export {};