UNPKG

choerodon-ui

Version:

An enterprise-class UI design language and React-based implementation

519 lines (518 loc) 14.5 kB
import { CSSProperties, ReactNode } from 'react'; import { IComputedValue, ObservableMap } from 'mobx'; import { MomentInput } from 'moment'; import { AxiosRequestConfig } from 'axios'; import DataSet, { DataSetProps } from './DataSet'; import Record from './Record'; import { CustomValidator, ValidationMessages } from '../validator/Validator'; import { CheckedStrategy, DateMode, FieldFormat, FieldIgnore, FieldTrim, FieldType, SortOrder } from './enum'; import ValidationResult from '../validator/ValidationResult'; import { ValidatorProps } from '../validator/rules'; import { LovConfig, TimeStep } from '../interface'; import { TransportHookProps } from './Transport'; import AttachmentFile from './AttachmentFile'; import { AttachmentValue } from '../configure'; export declare type FormatNumberFuncOptions = { lang?: string | undefined; options: Intl.NumberFormatOptions; }; export declare type Fields = ObservableMap<string, Field>; export declare type DynamicPropsArguments = { dataSet: DataSet; record: Record; name: string; }; export declare type DynamicProps = { [P in keyof FieldProps]?: (propsArg: DynamicPropsArguments) => FieldProps[P]; }; export declare type HighlightProps = { title?: ReactNode; content?: ReactNode; dataSet?: DataSet | undefined; record?: Record | undefined; name?: string | undefined; className?: string; style?: CSSProperties; hidden?: boolean; }; export declare type FieldProps = { /** * 字段名 */ name?: string; /** * 字段类型 */ type?: FieldType; /** * 排序类型 * 可选值: asc | desc */ order?: SortOrder; /** * 字段标签 */ label?: string | ReactNode; /** * 字段标签宽度 */ labelWidth?: string; /** * 字符串类型和日期类型字段值格式化 */ format?: string | FieldFormat; /** * 正则 */ pattern?: string | RegExp; /** * 最小长度 */ minLength?: number; /** * 最大长度 */ maxLength?: number; /** * 步距 */ step?: number | string | TimeStep; /** * 非严格步距 */ nonStrictStep?: boolean; /** * 最大值 */ max?: MomentInput | null; /** * 最小值 */ min?: MomentInput | null; /** * 小数点精度, 提交时会截断 */ precision?: number; /** * 千分位分组显示 */ numberGrouping?: boolean; /** * 数字和货币格式化配置 */ formatterOptions?: FormatNumberFuncOptions; /** * 校验器 */ validator?: CustomValidator; /** * 是否必选 * @default false */ required?: boolean; /** * 是否只读 * @default false */ readOnly?: boolean; /** * 是否禁用 * @default false */ disabled?: boolean; /** * 1.当type为object时需要显示的字段名 * 2.值列表的文本字段,默认值为`meaning` */ textField?: string; /** * 值列表的值字段,默认值为`value` */ valueField?: string; /** * 树形值列表的值字段,默认值为`value` */ idField?: string; /** * 树形值列表的父值字段 */ parentField?: string; /** * 类型为boolean时,true对应的值 */ trueValue?: string | number | boolean; /** * 类型为boolean时,false对应的值 */ falseValue?: string | number | boolean; /** * 下拉框组件的菜单数据集 */ options?: DataSet | string; /** * 值集组件的数据集配置 */ optionsProps?: DataSetProps | ((p: DataSetProps) => DataSetProps); /** * 是否分组 * 如果是number,则为分组的顺序 */ group?: number | boolean; /** * 默认值 */ defaultValue?: any; /** * 是否为值数组 * 当为字符串时,作为数据分隔符,查询时会将字符串分割成数组,提交时会将数组拼接成字符串 * @default false */ multiple?: boolean | string; /** * 是否为多行类型 * @default false */ multiLine?: boolean; /** * 是否为范围值 * 当为true时,则值为[startValue, endValue] * 当为数组时,例如['start', 'end']时,则值为{ start: startValue, end: endValue } * @default false */ range?: boolean | [string, string]; /** * 唯一索引或联合唯一索引组名 */ unique?: boolean | string; /** * LOV代码 */ lovCode?: string; /** * LOV查询参数 */ lovPara?: object; /** * 值列表代码 */ lookupCode?: string; /** * 值列表请求的Url */ lookupUrl?: string | ((code: string) => string); /** * LOV配置请求地址 */ lovDefineUrl?: string | ((code: string) => string); /** * LOV查询请求地址 */ lovQueryUrl?: string | ((code: string, config: LovConfig | undefined, props: TransportHookProps) => string); /** * 值列表请求的axiosConfig */ lookupAxiosConfig?: AxiosRequestConfig | ((props: { params?: any; dataSet?: DataSet; record?: Record; lookupCode?: string; }) => AxiosRequestConfig); /** * LOV配置请求的钩子 */ lovDefineAxiosConfig?: AxiosRequestConfig | ((code: string, field?: Field) => AxiosRequestConfig); /** * 批量请求LOV配置的钩子 */ lovDefineBatchAxiosConfig?: (codes: string[]) => AxiosRequestConfig; /** * LOV查询请求的钩子 */ lovQueryAxiosConfig?: AxiosRequestConfig | ((code: string, lovConfig?: LovConfig) => AxiosRequestConfig); /** * 批量值列表请求的axiosConfig */ lookupBatchAxiosConfig?: (codes: string[]) => AxiosRequestConfig; /** * 内部字段别名绑定 */ bind?: string; /** * 动态属性 */ dynamicProps?: DynamicProps | /* @deprecated */ ((props: DynamicPropsArguments) => FieldProps | undefined); /** * 计算属性,具有 mobx-computed 的缓存功能 */ computedProps?: DynamicProps; /** * 快码和LOV查询时的级联参数映射 * @example * cascadeMap: { parentCodeValue: 'city' } * 其中'city'是当前所在数据源的其他字段名,parentCodeValue是关联父级的查询字段 */ cascadeMap?: object; /** * 货币代码 */ currency?: string; /** * 忽略提交 * 可选值: always - 总是忽略 clean - 值未变化时忽略 never - 从不忽略 */ ignore?: FieldIgnore; /** * 在发送请求之前对数据进行处理 */ transformRequest?: ((value: any, record: Record) => any) | undefined; /** * 在获得响应之后对数据进行处理 */ transformResponse?: (value: any, object: any) => any; /** * 字符串值是否去掉首尾空格 * 可选值: both left right none */ trim?: FieldTrim; /** * 默认校验信息 */ defaultValidationMessages?: ValidationMessages; /** * 额外信息,常用于提示 */ help?: ReactNode; /** * 高亮 */ highlight?: boolean | ReactNode | HighlightProps; /** * 树形多选时定义选中项回填的方式。 */ showCheckedStrategy?: CheckedStrategy; /** * 附件上传的桶名 */ bucketName?: string; /** * 附件上传的桶目录 */ bucketDirectory?: string; /** * 附件存储编码 */ storageCode?: string; /** * 附件数量 */ attachmentCount?: number; /** * 附件模板 */ template?: AttachmentValue; /** * 附件上传属性名 */ fileKey?: string; /** * 附件大小限制 */ fileSize?: number; /** * 附件开启分片上传 */ useChunk?: boolean; /** * 附件分片大小 */ chunkSize?: number; /** * 附件分片上传并发数 */ chunkThreads?: number; /** * 值变化前,拦截并返回新的值 */ processValue?: (value: any, range?: 0 | 1) => any; dateMode?: DateMode; /** * Attachment 可接受的上传文件类型 */ accept?: string[] | undefined; /** * 占位词 */ placeholder?: string | string[]; }; export default class Field { static defaultProps: FieldProps; dataSet: DataSet; record?: Record | undefined; lookupToken?: string | undefined; lastDynamicProps?: { [key: string]: any; } | undefined; dynamicPropsComputingChains?: string[] | undefined; computedProps?: Map<string | symbol, IComputedValue<any>> | undefined; computedOptions?: IComputedValue<DataSet | undefined> | undefined; props: ObservableMap<string, any>; dirtyProps?: Partial<FieldProps> | undefined; get attachments(): AttachmentFile[] | undefined; set attachments(attachments: AttachmentFile[] | undefined); get attachmentCount(): number | undefined; set attachmentCount(count: number | undefined); get pristineProps(): FieldProps; set pristineProps(props: FieldProps); get lookup(): object[] | undefined; get options(): DataSet | undefined; get dirty(): boolean; get name(): string; get order(): string | undefined; set order(order: string | undefined); get valid(): boolean; get validationMessage(): ReactNode; private hasLookupSideEffects; private hasLovSideEffects; constructor(props: FieldProps | undefined, dataSet: DataSet, record?: Record | undefined); processForLookupAndLovConfig(record: Record): void; isDirty(record?: Record | undefined): boolean; /** * 获取所有属性 * @return 属性对象 */ getProps(record?: Record | undefined): FieldProps & { [key: string]: any; }; /** * 根据属性名获取属性值 * @param propsName 属性名 * @return {any} */ get(propsName: string, record?: Record | undefined): any; private getProp; /** * 设置属性值 * @param propsName 属性名 * @param value 属性值 * @return {any} */ set(propsName: string, value: any): Field; replace(props?: Partial<FieldProps>): Field; merge(props: Partial<FieldProps>): Field; getLookup(record?: Record | undefined): object[] | undefined; /** * 根据lookup值获取lookup对象 * @param value lookup值 * @return {object} */ getLookupData(value?: any, record?: Record | undefined): object; getValue(record?: Record | undefined): any; /** * 可以根据lookup值获取含义 * @param value lookup值 * @param boolean showValueIfNotFound * @return {string} */ getLookupText(value?: any, showValueIfNotFound?: boolean, record?: Record | undefined): string | undefined; /** * 可以根据options值获取含义 * @param value opions值 * @param boolean showValueIfNotFound * @return {string} */ getOptionsText(value?: any, showValueIfNotFound?: boolean, record?: Record | undefined): string | undefined; /** * 根据lookup值获取lookup含义 * @param value lookup值 * @param boolean showValueIfNotFound * @return {string} */ getText(value?: any, showValueIfNotFound?: boolean, record?: Record | undefined): string | undefined; setOptions(options: DataSet): void; getOptions(record?: Record | undefined): DataSet | undefined; /** * 重置设置的属性 */ reset(): void; commit(record?: Record | undefined): void; /** * 是否必选 * @return true | false */ get required(): boolean; /** * 设置是否必选 * @param required 是否必选 */ set required(required: boolean); /** * 是否只读 * @return true | false */ get readOnly(): boolean; /** * 设置是否只读 * @param readOnly 是否只读 */ set readOnly(readOnly: boolean); /** * 是否禁用 * @return true | false */ get disabled(): boolean; /** * 设置是否禁用 * @param disabled 是否禁用 */ set disabled(disabled: boolean); /** * 获取字段类型 * @return 获取字段类型 */ get type(): FieldType; /** * 设置字段类型 * @param type 字段类型 */ set type(type: FieldType); /** * 设置Lov的查询参数 * @param {String} name * @param {Object} value */ setLovPara(name: string, value: any, record?: Record | undefined): void; getValidatorPropGetter(record?: Record | undefined): <T extends keyof ValidatorProps>(key: T) => ValidatorProps[T]; /** * 校验字段值 * 只有通过record.getField()获取的field才能校验 * @return true | false */ checkValidity(record?: Record | undefined): Promise<boolean>; /** * 请求lookup值, 如有缓存值直接获得。 * @param noCache default: undefined * @return Promise<object[]> */ fetchLookup(noCache?: boolean, record?: Record | undefined): Promise<object[] | undefined>; fetchLovConfig(record?: Record | undefined): void; fetchAttachments(props: { bucketName?: string; bucketDirectory?: string; storageCode?: string; attachmentUUID: string; isPublic?: boolean; }, record?: Record | undefined): void; fetchAttachmentCount(uuid: string, isPublic?: boolean, record?: Record | undefined): void; isValid(record?: Record | undefined): boolean; getValidationMessage(record?: Record | undefined): ReactNode; getValidationErrorValues(record?: Record | undefined): ValidationResult[]; setAttachments(attachments: AttachmentFile[] | undefined, record?: Record | undefined, uuid?: string | undefined): void; getAttachments(record?: Record | undefined, uuid?: string | undefined): any; setAttachmentCount(count: number | undefined, record?: Record | undefined): void; getAttachmentCount(record?: Record | undefined): any; ready(): Promise<any>; private checkDynamicProp; private handlePropChange; private executeDynamicProps; private findDataSetField; }