import { TAny, TPlainObject } from '@flatbiz/utils';
import { FormItemProps, FormListOperation, PopoverProps, TableProps, TooltipProps } from 'antd';
import { FormListProps } from 'antd/es/form';
import { ColumnsType } from 'antd/es/table';
import { CSSProperties, ReactElement, ReactNode } from 'react';

export type TFormItemLayoutPreClassNameProps = {
	/**
	 * 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";
	/**
	 * className 中可能会包含 preDefinedClassName.formItem.xx，优先级大于 labelWidth、labelItemVertical、labelAlign
	 */
	className?: string;
};
export type FormItemWrapperProps = Omit<FormItemProps, "hidden" | "children" | "noStyle"> & TFormItemLayoutPreClassNameProps & {
	wrapper?: (children: ReactNode) => ReactElement;
	/** 设置wrapper后，before、after失效 */
	before?: ReactNode;
	/** 设置wrapper后，before、after失效 */
	after?: ReactNode;
	/** 设置 before、after 属性的包装结构style */
	beforeAfterStyle?: CSSProperties;
	/** value 序列化处理 */
	inputNormalize?: (value?: TAny) => TAny;
	/**
	 * onChange 参数序列化处理
	 * 如果设置 normalize 属性，outputNormalize将失效
	 */
	outputNormalize?: (value?: TAny) => TAny;
	/**
	 * 隐藏 Form.Item，同时清除 Form.Item 值
	 * ```
	 * 1.与 dependencies 属性配合使用，可实现当前FormItemWrapper的显示隐藏
	 * 2.提交不校验rules
	 * ```
	 */
	isClear?: boolean | ((formValues: TPlainObject) => boolean);
	/**
	 * 隐藏 Form.Item，不会清除 Form.Item 值
	 * ```
	 * 1.与 dependencies 属性配合使用，可实现当前FormItemWrapper的显示隐藏
	 * 2.提交会校验rules
	 * ```
	 */
	hidden?: boolean | ((formValues: TPlainObject) => boolean);
	/**
	 * 栅格占位格数，最大值：24
	 * ```
	 * 1. 当前FormItemWrapper处在 EasyForm 直接子节点中有效，即FormItemWrapper在EasyForm栅格中的占位格数；
	 * 2. 父节点使用属性值，当前节点不使用属性值
	 * ```
	 */
	span?: number;
	/** 不支持函数式写法，如果需要使用dependencies获取表单值，可使用FormItemWrapperDependencies 组件  */
	children?: ReactNode;
	/**
	 * ```
	 * 1. 设置noStyle后，可能会导致 FromItemWrapper 在 EasyFrom 内部渲染网格布局时出现异常
	 * 2. 在FormItemWrapper中使用 dependencies 逻辑不需要设置 noStyle
	 * ```
	 */
	noStyle?: boolean;
};
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";
};
export type EditableTableProDataIndex = string | readonly (string | number)[];
export interface EditableTableProOperation {
	add: (defaultValue: TPlainObject, insertIndex?: number) => void;
	remove: (index: number) => void;
	/** 同一级内移动 */
	move: (fromIndex: number, toIndex: number) => void;
	/** 是否可编辑 */
	editable: boolean;
	/** 当前行数据层级 */
	level: number;
	/** 设置当前行指定字段值 */
	setCurrentRowTargetField: (dataIndexConfigs: {
		name: EditableTableProDataIndex;
		value?: TAny;
	}[]) => void;
	/** 设置当前行 children 数据 */
	setCurrentRowChildrenValue: (value?: TPlainObject[]) => void;
	/** 当前行父级数据 */
	parentItem: TPlainObject | null;
	/** 当前行表单 name */
	tableRowFormItemName: Array<string | number>;
	/** 当前行表单完整 name */
	tableRowFormItemCompleteName: Array<string | number>;
	/** 当前行表单验证，需要自行指定nameList（dataIndex数组） */
	validateRowFields: (nameList: EditableTableProDataIndex[]) => Promise<void>;
}
export type EditableTableProColumnItem = Omit<ColumnsType[0], "render" | "title" | "dataIndex"> & {
	title?: ReactElement | string;
	dataIndex?: EditableTableProDataIndex;
	/** Form.Item props */
	formItemProps?: Omit<FormItemWrapperProps, "children" | "name"> | ((value: TAny, record: TPlainObject, index: number, operation: EditableTableProOperation) => Omit<FormItemWrapperProps, "children" | "name">);
	/**
	 * 通过 operation.editable 来判断渲染结构，其中render返回的根节点会作为 Form.Item 的children
	 * ```
	 *  例如
	 *  render: (_value, _record, _index, operation) => {
	 *    if (operation.editable) {
	 *      return <Input placeholder="请输入" />;
	 *    }
	 *    return <Tag>{value}</Tag>;
	 *  }
	 *
	 *  如果需要额外布局，可通过 formItemProps.wrapper 实现
	 *  formItemProps: (_value, _record, _index, operation) => {
	 *    return {
	 *      wrapper: (children) => {
	 *        return (
	 *          <FlexLayout fullIndex={[0]} direction="horizontal" gap={10}>
	 *            <div>{children}</div>
	 *            <div>额外布局</div>
	 *          </FlexLayout>
	 *        );
	 *      },
	 *    };
	 *  },
	 *  render: (_value, _record, _index, operation) => {
	 *    if (operation.editable) {
	 *      return <Input placeholder="请输入" />;
	 *    }
	 *    return <Tag>{value}</Tag>;
	 *  }
	 * ```
	 */
	render?: (value: TAny, record: TPlainObject, index: number, operation: EditableTableProOperation) => ReactElement;
	/** 是否可编辑 */
	editable: boolean | ((record: TPlainObject, index: number) => boolean);
	/**
	 * 会在 title 之后展示一个 icon
	 * ```
	 * 1. title为string类型有效
	 * 2. 可为icon添加提示效果
	 * 3. 可为icon添加点击事件
	 * ```
	 */
	tipsWrapperProps?: string | TipsWrapperProps;
	/** 为表格header中的字段添加必填标识，如果未配置 formItemProps.rules，内部会新增一条required rule  */
	required?: boolean;
};
export type EditableTableProProps = {
	columns: EditableTableProColumnItem[];
	/**
	 * 当前Edittable处在formList内部时（必填），完整formItem的name
	 * ```
	 * 例如 处在formList内部
	 * 1. formListName=[0,dataList]
	 * 2. formListCompleteName=[xxxList, 0, dataList]
	 * ```
	 */
	formListCompleteName?: Array<string | number>;
	/** Form.List name */
	formListName: Array<string | number> | string;
	/** 唯一值字段Key */
	uidFieldKey: string;
	/** 初始化值 */
	initialValue?: TPlainObject[];
	/** 指定树形结构的列名，默认值：children */
	childrenColumnName?: string;
	/** 表格组件配置 */
	tableProps?: Omit<TableProps<TPlainObject>, "dataSource" | "columns" | "rowKey"> & {
		cellVerticalAlign?: "baseline" | "middle" | "top" | "bottom";
	};
	/**
	 * Form.List rules
	 * ```
	 rules={[
		{
		  validator: async (_, names) => {
			if (!names || names.length < 2) {
			  return Promise.reject(new Error('At least 2 passengers'));
			}
		  },
		},
	  ]}
	 * ```
	 */
	rules?: FormListProps["rules"];
	className?: string;
	style?: CSSProperties;
	/**`默认新增按钮`新增行默认值，hiddenFooterBtn != true 有效 */
	addRowDefaultValues?: () => TPlainObject;
	/** 隐藏底部`新增`按钮 */
	hiddenFooterBtn?: boolean;
	/** 表格顶部区域渲染 */
	tableBeforeAreaRender?: (formListOperation: FormListOperation, nextRowIndex: number) => ReactElement | null;
	/** 表格底部区域渲染 */
	tableAfterAreaRender?: (formListOperation: FormListOperation, nextRowIndex: number) => ReactElement | null;
	/** 展开的行key，一般用于初始化，重新tableProps.expandable.expandedRowKeys后失效 */
	expandedRowKeys?: string[];
	/**
	 * 展开图标布局，默认：layout1
	 * ```
	 * 1. 可编辑表格第一项为可编辑状态时，选 layout1
	 * 2. 可编辑表格第一项为非可编辑状态时，选 layout2
	 * ```
	 */
	expandedIconLayout?: "layout1" | "layout2";
};
/**
 * 使用FormList实现可编辑表格
 * ```
 * 1. 必须在外部包裹Form组件
 * 2. 表格数据源数组中必须存在唯一值字段，通过uidFieldKey配置
 * 3. 可嵌套编辑，数据嵌套的节点名称可通过 childrenColumnName设置，默认：children
 * 4. 行内需要联动逻辑可使用 column.render.operation.setCurrentRowTargetField 方法
 * 5. 在多级编辑中，可通过 column.render.operation.level 判断当前行数据层级
 * 6. 不存在多级的情况下，可使用DragEditableTablePro组件实现拖拽排序
 * 7. 存在多级的情况下，可通过 column.render.operation.move 方法实现同一级内移动
 *
 * demo
 * https://fex.qa.tcshuke.com/docs/admin/main/table/row-editable1
 * https://fex.qa.tcshuke.com/docs/admin/main/table/row-editable2
 * https://fex.qa.tcshuke.com/docs/admin/main/table/row-editable4
 * ```
 */
export declare const EditableTablePro: (props: EditableTableProProps) => import("react").JSX.Element;

export {};
