@aplus-frontend/ui
Version:
100 lines (99 loc) • 4.52 kB
TypeScript
import { Recordable } from '../../type';
import { ApTableValueFields, ApTableValueTypes, CommonFieldReturnType, FieldPropsType } from '../../ap-table/interface';
import { AgGridColumnType, AgGridProps } from '../interface';
import { VNode } from 'vue';
import { DataIndex } from '@aplus-frontend/antdv/es/vc-table/interface';
import { EditableTableExpose } from '../../editable-table';
import { NamePath } from '@aplus-frontend/antdv/es/form/interface';
import { ApFormItemProps } from '../../ap-form';
export type EditableAgGridColumnType<RecordType = any, ExtraValueType = 'text', ValueType extends ApTableValueTypes = ApTableValueTypes, MergedValueType extends ExtraValueType | ValueType = ExtraValueType | ValueType> = MergedValueType extends ExtraValueType | ValueType ? Omit<AgGridColumnType<RecordType, ExtraValueType, ValueType>, 'children' | 'customRender' | 'hideInSearch' | 'customRenderFormItem' | 'fieldProps'> & {
children?: EditableAgGridColumnType<RecordType, ExtraValueType, ValueType>[];
/**
* 是否可编辑
*/
editable?: boolean | ((text: any, record: RecordType, index: number) => boolean);
/**
* 自定义表单，适用于内置`valueType`不满足的情况下使用
*/
customRenderFormItem?: (config: EditableAgGridColumnType<RecordType>, fieldProps: Recordable, editable: boolean, record: RecordType) => any;
/**
* 指定值类型（将会用于普通列和可编辑表格的渲染）
*/
valueType?: MergedValueType;
/**
* 值类型额外配置的参数（支持函数）
*/
fieldProps?: FieldPropsType<Extract<MergedValueType, ValueType> extends never ? CommonFieldReturnType : ApTableValueFields[Extract<MergedValueType, ValueType>], RecordType, ExtraValueType, ValueType, MergedValueType>;
/**
* 自定义渲染，添加了`editable`以及`originalNode`
* @param opt
* @returns
*/
customRender?: (opt: {
value: any;
text: any;
record: RecordType;
index: number;
renderIndex: number;
column: AgGridColumnType<RecordType>;
editable?: boolean;
originalNode?: VNode;
path: (string | number)[];
}) => any;
/**
* 是否渲染必填标记（只渲染标记不生成校验规则）
*/
markRequired?: boolean;
} : never;
export type EditableAgGridProps<RecordType = any> = Omit<AgGridProps<RecordType>, 'columns' | 'dataSource' | 'onChange' | 'card' | 'request' | 'params' | 'defaultData' | 'searchForm' | 'beforeSearchSubmit' | 'manual' | 'size'> & {
/**
* 列配置
*/
columns?: EditableAgGridColumnType<RecordType, any>[];
/**
* 表格数据v-model
*/
value?: RecordType[];
/**
* 表格数据默认值（只生效一次，如果是异步数据，请使用`v-model`）
*/
defaultValue?: RecordType[];
'onUpdate:value'?: (value: RecordType[]) => void;
/**
* 数据修改时触发onChange（也包含数据的删除）
* @param value
* @returns
*/
onChange?: (value: RecordType[]) => void;
/**
* 表格最大行数，超过行后将无法调用相关API新增
*/
maxLength?: number;
/**
* 设置可编辑表格的名字，如果不传，将会使用默认值
*/
name?: any;
/**
* 当字段值变更的时候触发（注意，向表单设置值并不会触发）
* @returns
*/
onFieldChange?: (rowIndex: number, fieldName: DataIndex, newValue: any) => void;
};
export type EditableAgGridExpose<RecordType = any, ModelType = RecordType[]> = Omit<EditableTableExpose<ModelType, RecordType>, 'scrollTo' | 'remove'> & {
scrollTo: (index: number | 'end', position?: 'top' | 'bottom' | 'middle') => void;
scrollToRow: (index: number | 'end', position?: 'top' | 'bottom' | 'middle') => void;
scrollToColumn: (key: string, position?: 'auto' | 'start' | 'middle' | 'end') => void;
remove: (data: RecordType | RecordType[]) => void;
};
export type EditableAgGridFormItemExpose<RecordType = any, ModelType = RecordType[]> = Omit<EditableAgGridExpose<RecordType, ModelType>, 'resetFields' | 'validateFields'>;
export type EditableAgGridFormItemProps<RecordType = any> = Omit<EditableAgGridProps<RecordType>, 'name' | 'value' | 'onUpdate:value'> & {
label?: string;
/**
* FormItem的name
*/
name: NamePath;
/**
* 额外的表单项配置属性
*/
formItem?: Partial<Omit<ApFormItemProps, 'name' | 'label'>>;
};