jamis
Version:
一种支持通过JSON配置方式生成页面的组件库
233 lines (232 loc) • 6.16 kB
TypeScript
import type { RendererProps, SchemaBoolean } from 'jamis-core';
import type { ActionSchema, BaseSchema, BaseSchemaScoped, IListItem, IListStore, SchemaClassName, SchemaCollection, SchemaCopyable, SchemaExpression, SchemaObject, SchemaPopOver, SchemaQuickEdit, SchemaRemark, SchemaSlots, SchemaTokenizeableString, SchemaTpl, SchemaUrlPath, StaticControlSchemaBase, WithWrapperHook } from '../types';
export type { IListStore, IListItem, SListStore } from './ListStore';
/**
* List 列表展示控件。
*
*/
export interface ListSchema extends BaseSchemaScoped, WithWrapperHook, ListSchemaDeprecated {
/**
* 指定为 List 列表展示控件。
*/
type: 'list';
/**
* 单条数据展示内容配置
*/
listItem?: ListItemSchema;
/**
* 数据源: 绑定当前环境变量
*
* @default ${items}
*/
source?: SchemaTokenizeableString;
/**
* 无数据提示
*
* @default 暂无数据
*/
placeholder?: SchemaTpl;
placeholderExpr?: SchemaTpl;
/**
* 是否隐藏勾选框
*/
hideCheckToggler?: boolean;
/**
* 是否固顶
*/
affixHeader?: boolean;
/**
* 配置某项是否可以点选
*/
itemCheckableOn?: SchemaExpression;
draggable?: boolean;
/**
* 配置某项是否可拖拽排序,前提是要开启拖拽功能
*/
itemDraggableOn?: SchemaExpression;
/**
* 点击卡片的时候是否勾选卡片
*/
checkOnItemClick?: boolean;
/**
* 可以用来作为值的字段
*/
valueField?: string;
/**
* 大小
*/
size?: 'sm' | 'base';
/**
* 是否可选择
*/
selectable?: boolean;
/**
* 点击列表项的行为
*/
itemAction?: ActionSchema;
/** 是否显示加载中 */
showLoading?: boolean;
showLoadingOn?: SchemaBoolean;
/** 懒加载阈值配置, 默认是100 */
lazyRenderAfter?: number;
/**
* 是否多选
*/
multiple?: SchemaBoolean;
/**
* 是否显示底部
*/
showFooter?: boolean;
/**
* 是否显示头部
*/
showHeader?: boolean;
slots?: SchemaSlots<'List-beforeRegion' | 'List-afterRegion' | (string & {})>;
}
export interface ListSchemaDeprecated {
/**
* 底部区域
* @deprecated use `slots.List-footer.body`
*/
footer?: SchemaCollection;
/**
* 顶部区域
* @deprecated use `slots.List-header.body`
*/
header?: SchemaCollection;
/**
* 顶部区域类名
* @deprecated 请使用`slots.List-header.className`
*/
headerClassName?: SchemaClassName;
/**
* @deprecated 请使用`slots.List-body.className`
*/
bodyClassName?: SchemaClassName;
/**
* @deprecated 请使用`slots.ListItem.className`
*/
itemClassName?: SchemaClassName;
/**
* 底部区域类名
* @deprecated 请使用`slots.List-footer`
*/
footerClassName?: SchemaClassName;
/**
* 懒加载项`.cxd-ListItem-lazy`的样式类, 可以设置高度等
* @deprecated 请使用`slots.ListItem-lazy`
*/
lazyItemClassName?: SchemaClassName;
/**
* @deprecated 请使用`slots.List-headerToolbar`
*/
headerToolbarClassName?: SchemaClassName;
/**
* @deprecated 请使用`slots.List-footerToolbar`替代
*/
footerToolbarClassName?: SchemaClassName;
}
export interface StaticListSchema extends Omit<ListSchema, 'type'>, Omit<StaticControlSchemaBase, 'size' | 'slots'> {
type: 'static-list';
}
/**
* 不指定类型默认就是文本
*/
export interface ListBodyFieldObject {
/**
* 列标题
*/
label?: string;
/**
* label 类名
* @deprecated 请使用`slots.className`
*/
labelClassName?: SchemaClassName;
/**
* 绑定字段名
*/
name?: string;
/**
* 配置查看详情功能
*/
popOver?: SchemaPopOver;
/**
* 配置快速编辑功能
*/
quickEdit?: SchemaQuickEdit;
/**
* 配置点击复制功能
*/
copyable?: SchemaCopyable;
}
export interface ListItemSchema extends Omit<BaseSchema, 'type'> {
/**
* 自定义头部
*/
header?: SchemaCollection;
/**
* 标题
*/
title?: SchemaTpl;
titleClassName?: SchemaClassName;
/**
* 副标题
*/
subTitle?: SchemaTpl;
/**
* 描述
*/
desc?: SchemaTpl;
/**
* tooltip 说明
*/
remark?: SchemaRemark;
/**
* 图片地址
*/
avatar?: SchemaUrlPath;
avatarClassName?: SchemaClassName;
/**
* 内容区域
*/
body?: Array<(SchemaObject & ListBodyFieldObject) | ListBodyFieldObject>;
actions?: Array<ActionSchema>;
/**
* 操作位置,默认在右侧,可以设置成左侧。
*/
actionsPosition?: 'left' | 'right';
/**
* 操作位置样式类
*/
actionsClassName?: SchemaClassName;
/**
* 懒加载项`.cxd-ListItem-lazy`的样式类
*/
lazyItemClassName?: SchemaClassName;
}
export interface ListColumn {
type: string;
[propName: string]: any;
}
export interface ListProps extends RendererProps, Omit<ListSchema, 'type' | 'className' | 'data'> {
store: IListStore;
selected?: Array<any>;
onSelect: (selectedItems: Array<object>, unSelectedItems: Array<object>) => void;
onSave?: (items: Array<object> | object, diff: Array<object> | object, rowIndexes: Array<number> | number, unModifiedItems?: Array<object>, rowOrigins?: Array<object> | object, options?: {
resetOnFailed?: boolean;
reload?: string;
}) => void;
onSaveOrder?: (moved: Array<object>, items: Array<object>) => void;
onQuery: (values: object) => void;
}
export interface ListItemProps extends RendererProps, Omit<ListItemSchema, 'type' | 'className'> {
hideCheckToggler?: boolean;
item: IListItem;
/** 实际索引值 */
index: number;
itemIndex?: number;
checkable?: boolean;
checkOnItemClick?: boolean;
itemAction?: ActionSchema;
}
export type ListRendererEvent = 'itemClick';