jamis

import type { PlainObject, RendererEvent, RendererProps, SchemaBoolean, SchemaMessage } from 'jamis-core'; import type { ActionProps, ActionSchema, AutoGenerateFilterObject, BaseSchema, BaseSchemaScoped, CardsRendererEvent, CardsSchema, DropdownButtonSchema, FormSchema, ICRUDStore, IRow, ListRendererEvent, ListSchema, SchemaApi, SchemaClassName, SchemaExpression, SchemaObject, SchemaSlots, SchemaTokenizeableString, SchemaTpl, TableRendererEvent, TableSchema, WithWrapperHook } from '../types'; export type { ICRUDStore } from './CrudStore'; export type CRUDBultinToolbarType = 'columns-toggler' | 'drag-toggler' | 'pagination' | 'bulkActions' | 'bulk-actions' | 'statistics' | 'switch-per-page' | 'load-more' | 'filter-toggler' | 'export-csv' | 'export-excel' | 'reload'; /** * TODO: should split every toolbar to diff type, has problem in current stage */ export interface CRUDBultinToolbar extends Omit<BaseSchema, 'type'> { type: CRUDBultinToolbarType; /** * 对齐方式 */ align?: 'left' | 'right'; icon?: string; [key: string]: any; } export type CRUDToolbarChild = (SchemaObject & { align?: 'left' | 'right'; }) | CRUDBultinToolbar; export type CRUDRendererEvent = TableRendererEvent | CardsRendererEvent | ListRendererEvent; export interface CRUDCommonSchema extends BaseSchemaScoped, WithWrapperHook { /** * 指定为 CRUD 组件。 */ type: 'crud'; /** * 指定内容区的展示模式。 */ mode?: 'table' | 'grid' | 'cards' | /* grid 的别名*/ 'list'; /** * 初始化数据 API */ api?: SchemaApi; /** * 批量操作 */ bulkActions?: Array<ActionSchema | DropdownButtonSchema>; /** * 单条操作 */ itemActions?: Array<ActionSchema | DropdownButtonSchema>; /** * 点击列表项的行为 */ itemAction?: { onClick?: (event: React.SyntheticEvent<HTMLElement>, props: ActionProps, rowData: IRow['data']) => any; } & Omit<ActionSchema, 'onClick'>; /** * 每页个数，默认为 10，如果不是请设置。 * * @default 10 */ perPage?: number | SchemaExpression; /** * 每页个数表达式 */ perPageExpr?: SchemaExpression; /** * 默认排序字段 */ orderBy?: string; /** * 默认排序方向 */ orderDir?: 'asc' | 'desc'; /** * 可以默认给定初始参数如： {\"perPage\": 24} */ defaultParams?: PlainObject; /** * 是否可通过拖拽排序 */ draggable?: boolean; /** * 是否可通过拖拽排序，通过表达式来配置 */ draggableOn?: SchemaExpression; /** * 过滤器表单 */ filter?: Partial<FormSchema>; /** * 初始是否拉取 * @deprecated 建议用 api 的 sendOn 代替。 */ initFetch?: boolean; /** * 初始是否拉取，用表达式来配置。 * @deprecated 建议用 api 的 sendOn 代替。 */ initFetchOn?: SchemaExpression; /** * 设置自动刷新时间 */ interval?: number; /** * 设置用来确定位置的字段名，设置后新的顺序将被赋值到该字段中。 */ orderField?: string; /** * 设置分页页码字段名。 * @default page */ pageField?: string; /** * 设置分页一页显示的多少条数据的字段名。 * @default perPage */ perPageField?: string; /** * 快速编辑后用来批量保存的 API */ quickSaveApi?: SchemaApi; /** * 快速编辑配置成及时保存时使用的 API */ quickSaveItemApi?: SchemaApi; /** * 保存排序的 api */ saveOrderApi?: SchemaApi; /** * 是否将过滤条件的参数同步到地址栏,默认为true * @default true */ syncLocation?: boolean; /** * 顶部工具栏 */ headerToolbar?: Array<CRUDToolbarChild | CRUDBultinToolbarType>; /** * @deprecated 使用`slots.Table-headerToolbar` */ headerToolbarClassName?: SchemaClassName; /** * 底部工具栏 */ footerToolbar?: Array<CRUDToolbarChild | CRUDBultinToolbarType>; /** * @deprecated 使用`classMap` */ footerToolbarClassName?: SchemaClassName; /** * 每页显示多少个空间成员的配置如： [5, 10, 20, 50, 100]。 */ perPageAvailable?: Array<number>; messages?: SchemaMessage; /** * 是否隐藏快速编辑的按钮。 */ hideQuickSaveBtn?: boolean; /** * 是否自动跳顶部，当切分页的时候。默认false */ autoJumpToTopOnPagerChange?: boolean; /** * 静默拉取 */ silentPolling?: boolean; stopAutoRefreshWhen?: SchemaExpression; stopAutoRefreshWhenModalIsOpen?: boolean; filterTogglable?: boolean; filterDefaultVisible?: boolean; /** * 是否将接口返回的内容自动同步到地址栏，前提是开启了同步地址栏。 */ syncResponse2Query?: boolean; /** * 分页的时候是否保留用户选择, 同时在表格上部渲染出`已选择`部分 */ keepItemSelectionOnPageChange?: boolean; /** * 当配置 keepItemSelectionOnPageChange 时有用，用来配置已勾选项的文案。 */ labelTpl?: SchemaTpl; /** 默认是 `label` */ labelField?: string; /** 默认是 `id` */ primaryField?: string; /** * 是否为前端单次加载模式，可以用来实现前端分页。 */ loadDataOnce?: boolean; /** * 在开启loadDataOnce时，filter时是否去重新请求api */ loadDataOnceFetchOnFilter?: boolean; /** * 重新加载(reload) 监听表达式 */ reloadTrackExpression?: SchemaExpression; /** * 也可以直接从环境变量中读取，但是不太推荐。 */ source?: SchemaTokenizeableString; /** * 如果是内嵌模式，可以通过这个来配置默认的展开选项。 */ expandConfig?: { /** * 默认是展开第一个、所有、还是都不展开。 */ expand?: 'first' | 'all' | 'none'; /** * 是否显示全部切换按钮 */ expandAll?: boolean; /** * 是否为手风琴模式 */ accordion?: boolean; }; /** * 默认只有当分页数大于 1 是才显示，如果总是想显示请配置。 */ alwaysShowPagination?: boolean; /** * 开启查询区域，会根据列元素的searchable属性值，自动生成查询条件表单 */ autoGenerateFilter?: boolean | AutoGenerateFilterObject; /** * 内容区域占满屏幕剩余空间 */ autoFillHeight?: TableSchema['autoFillHeight']; /** * body内的css类型 * @deprecated 使用`slots.Crud-body` */ bodyClassName?: SchemaClassName; /** * `.cxd-Crud-actions` 元素的样式类 * @deprecated 使用`classMap` */ actionsClassName?: SchemaClassName; /** * 是否通过滚动方式加载更多, 只有在footerToolbar中有`load-more`时才会生效, 默认值是true */ loadMoreOnScroll?: boolean; /** * 加载更多按钮文字, 支持表达式 */ loadMoreBtnLabel?: SchemaExpression; /** * 加载更多按钮`.cxd-Crud-loadMore`的样式类 * @deprecated 使用`slots.Crud-loadMore` */ loadMoreClassName?: SchemaClassName; showLoading?: boolean; showLoadingOn?: SchemaBoolean; /** * 延迟渲染阈值配置, 默认是100 */ lazyRenderAfter?: number; /** * 是否多选, 默认配置了`bulkActions`批量操作时是多选的, 可以设置成`false`来启用单选 */ multiple?: SchemaBoolean; slots?: SchemaSlots<'Crud-beforeRegion' | 'Crud-afterRegion' | (string & {})>; } export interface CRUDCardsSchema extends Omit<CRUDCommonSchema, 'mode'>, Omit<CardsSchema, 'type' | 'itemAction' | 'slots'> { mode: 'cards'; /** CRUD的数据域 */ data?: Record<string, any>; } export interface CRUDListSchema extends Omit<CRUDCommonSchema, 'mode' | 'itemAction' | 'slots'>, Omit<ListSchema, 'type'> { mode: 'list'; /** CRUD的数据域 */ data?: Record<string, any>; } export interface CRUDTableSchema extends Omit<CRUDCommonSchema, 'mode' | 'slots'>, Omit<TableSchema, 'type' | 'headerToolbar'> { mode?: 'table'; /** CRUD的数据域 */ data?: Record<string, any>; } /** * CRUD 增删改查组件。 * */ export type CRUDSchema = CRUDTableSchema | CRUDCardsSchema | CRUDListSchema; export interface CRUDProps extends RendererProps, Omit<CRUDCommonSchema, 'type' | 'className' | 'data'> { store: ICRUDStore; pickerMode?: boolean; dispatchEvent: (event: string, data?: any) => Promise<RendererEvent>; toolbarClassName?: string; } /** * 滚动事件参数 */ export interface ScrollEventParam { hitBottom: boolean; scrollHeight: number; scrollTop: number; offsetHeight: number; }