mirror of
https://gitee.com/baidu/amis.git
synced 2024-12-03 04:18:29 +08:00
更新 Schema
This commit is contained in:
parent
4341bebf91
commit
7dd979981f
@ -15,6 +15,8 @@ import {CollapseSchema} from './renderers/Collapse';
|
|||||||
import {ColorSchema} from './renderers/Color';
|
import {ColorSchema} from './renderers/Color';
|
||||||
import {ContainerSchema} from './renderers/Container';
|
import {ContainerSchema} from './renderers/Container';
|
||||||
import {CRUDSchema} from './renderers/CRUD';
|
import {CRUDSchema} from './renderers/CRUD';
|
||||||
|
import {DateSchema} from './renderers/Date';
|
||||||
|
import {DividerSchema} from './renderers/Divider';
|
||||||
|
|
||||||
// 每加个类型,这补充一下。
|
// 每加个类型,这补充一下。
|
||||||
export type SchemaType =
|
export type SchemaType =
|
||||||
@ -37,7 +39,11 @@ export type SchemaType =
|
|||||||
| 'collapse'
|
| 'collapse'
|
||||||
| 'color'
|
| 'color'
|
||||||
| 'container'
|
| 'container'
|
||||||
| 'crud';
|
| 'crud'
|
||||||
|
| 'date'
|
||||||
|
| 'datetime'
|
||||||
|
| 'time'
|
||||||
|
| 'divider';
|
||||||
|
|
||||||
export type SchemaObject =
|
export type SchemaObject =
|
||||||
| PageSchema
|
| PageSchema
|
||||||
@ -56,7 +62,9 @@ export type SchemaObject =
|
|||||||
| CollapseSchema
|
| CollapseSchema
|
||||||
| ColorSchema
|
| ColorSchema
|
||||||
| ContainerSchema
|
| ContainerSchema
|
||||||
| CRUDSchema;
|
| CRUDSchema
|
||||||
|
| DateSchema
|
||||||
|
| DividerSchema;
|
||||||
|
|
||||||
export type SchemaCollection =
|
export type SchemaCollection =
|
||||||
| SchemaObject
|
| SchemaObject
|
||||||
|
@ -104,7 +104,7 @@ export interface ButtonSchema extends BaseSchema {
|
|||||||
/**
|
/**
|
||||||
* 激活状态时的类名
|
* 激活状态时的类名
|
||||||
*/
|
*/
|
||||||
activeClassName: string;
|
activeClassName?: string;
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 如果按钮在弹框中,可以配置这个动作完成后是否关闭弹窗,或者指定关闭目标弹框。
|
* 如果按钮在弹框中,可以配置这个动作完成后是否关闭弹窗,或者指定关闭目标弹框。
|
||||||
@ -128,8 +128,7 @@ export interface AjaxActionSchema extends ButtonSchema {
|
|||||||
*/
|
*/
|
||||||
api: SchemaApi;
|
api: SchemaApi;
|
||||||
|
|
||||||
// todo
|
feedback?: DialogSchema;
|
||||||
feedback?: any;
|
|
||||||
|
|
||||||
reload?: SchemaReload;
|
reload?: SchemaReload;
|
||||||
redirect?: string;
|
redirect?: string;
|
||||||
@ -158,8 +157,7 @@ export interface DialogActionSchema extends ButtonSchema {
|
|||||||
*/
|
*/
|
||||||
actionType: 'dialog';
|
actionType: 'dialog';
|
||||||
|
|
||||||
// todo
|
dialog: DialogSchema;
|
||||||
dialog: any;
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 是否有下一个的表达式,正常可以不用配置,如果想要刷掉某些数据可以配置这个。
|
* 是否有下一个的表达式,正常可以不用配置,如果想要刷掉某些数据可以配置这个。
|
||||||
@ -174,8 +172,10 @@ export interface DrawerActionSchema extends ButtonSchema {
|
|||||||
* 指定为打开弹窗,抽出式弹窗
|
* 指定为打开弹窗,抽出式弹窗
|
||||||
*/
|
*/
|
||||||
actionType: 'drawer';
|
actionType: 'drawer';
|
||||||
// todo
|
/**
|
||||||
drawer: any;
|
* 弹窗内容
|
||||||
|
*/
|
||||||
|
drawer: DrawerSchema;
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 是否有下一个的表达式,正常可以不用配置,如果想要刷掉某些数据可以配置这个。
|
* 是否有下一个的表达式,正常可以不用配置,如果想要刷掉某些数据可以配置这个。
|
||||||
@ -284,6 +284,8 @@ import {
|
|||||||
SchemaTooltip,
|
SchemaTooltip,
|
||||||
SchemaTpl
|
SchemaTpl
|
||||||
} from '../Schema';
|
} from '../Schema';
|
||||||
|
import {DialogSchema} from './Dialog';
|
||||||
|
import {DrawerSchema} from './Drawer';
|
||||||
|
|
||||||
export interface ActionProps
|
export interface ActionProps
|
||||||
extends ButtonSchema,
|
extends ButtonSchema,
|
||||||
|
@ -1,16 +1,46 @@
|
|||||||
import React from 'react';
|
import React from 'react';
|
||||||
import {Renderer, RendererProps} from '../factory';
|
import {Renderer, RendererProps} from '../factory';
|
||||||
import moment from 'moment';
|
import moment from 'moment';
|
||||||
|
import {BaseSchema} from '../Schema';
|
||||||
|
|
||||||
export interface DateProps extends RendererProps {
|
/**
|
||||||
className?: string;
|
* Date 展示渲染器。
|
||||||
placeholder?: string;
|
* 文档:https://baidu.gitee.io/amis/docs/components/date
|
||||||
|
*/
|
||||||
|
export interface DateSchema extends BaseSchema {
|
||||||
|
/**
|
||||||
|
* 指定为日期展示类型
|
||||||
|
*/
|
||||||
|
type: 'date' | 'datetime' | 'time';
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 展示的时间格式,参考 moment 中的格式说明。
|
||||||
|
*/
|
||||||
format?: string;
|
format?: string;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 占位符
|
||||||
|
*/
|
||||||
|
placeholder?: string;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 值的时间格式,参考 moment 中的格式说明。
|
||||||
|
*/
|
||||||
valueFormat?: string;
|
valueFormat?: string;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 显示成相对时间,比如1分钟前
|
||||||
|
*/
|
||||||
fromNow?: boolean;
|
fromNow?: boolean;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 更新频率, 默认为1分钟
|
||||||
|
*/
|
||||||
updateFrequency?: number;
|
updateFrequency?: number;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
export interface DateProps extends RendererProps, DateSchema {}
|
||||||
|
|
||||||
export interface DateState {
|
export interface DateState {
|
||||||
random?: number;
|
random?: number;
|
||||||
}
|
}
|
||||||
@ -18,7 +48,10 @@ export interface DateState {
|
|||||||
export class DateField extends React.Component<DateProps, DateState> {
|
export class DateField extends React.Component<DateProps, DateState> {
|
||||||
refreshInterval: NodeJS.Timeout;
|
refreshInterval: NodeJS.Timeout;
|
||||||
|
|
||||||
static defaultProps: Partial<DateProps> = {
|
static defaultProps: Pick<
|
||||||
|
DateProps,
|
||||||
|
'placeholder' | 'format' | 'valueFormat' | 'fromNow' | 'updateFrequency'
|
||||||
|
> = {
|
||||||
placeholder: '-',
|
placeholder: '-',
|
||||||
format: 'YYYY-MM-DD',
|
format: 'YYYY-MM-DD',
|
||||||
valueFormat: 'X',
|
valueFormat: 'X',
|
||||||
|
@ -12,11 +12,75 @@ import {ModalStore, IModalStore} from '../store/modal';
|
|||||||
import {findDOMNode} from 'react-dom';
|
import {findDOMNode} from 'react-dom';
|
||||||
import {Spinner} from '../components';
|
import {Spinner} from '../components';
|
||||||
import {IServiceStore} from '../store/service';
|
import {IServiceStore} from '../store/service';
|
||||||
|
import {
|
||||||
|
BaseSchema,
|
||||||
|
SchemaClassName,
|
||||||
|
SchemaCollection,
|
||||||
|
SchemaName,
|
||||||
|
SchemaObject,
|
||||||
|
SchemaTpl
|
||||||
|
} from '../Schema';
|
||||||
|
import {ActionSchema} from './Action';
|
||||||
|
|
||||||
export interface DialogProps extends RendererProps {
|
/**
|
||||||
title?: string; // 标题
|
* Dialog 弹框渲染器。
|
||||||
size?: 'md' | 'lg' | 'sm' | 'xl' | 'full';
|
* 文档:https://baidu.gitee.io/amis/docs/components/dialog
|
||||||
|
*/
|
||||||
|
export interface DialogSchema extends Omit<BaseSchema, 'type'> {
|
||||||
|
/**
|
||||||
|
* 默认不用填写,自动会创建确认和取消按钮。
|
||||||
|
*/
|
||||||
|
actions?: Array<ActionSchema>;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 内容区域
|
||||||
|
*/
|
||||||
|
body?: SchemaCollection;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 配置 Body 容器 className
|
||||||
|
*/
|
||||||
|
bodyClassName?: SchemaClassName;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 是否支持按 ESC 关闭 Dialog
|
||||||
|
*/
|
||||||
closeOnEsc?: boolean;
|
closeOnEsc?: boolean;
|
||||||
|
|
||||||
|
name?: SchemaName;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Dialog 大小
|
||||||
|
*/
|
||||||
|
size?: 'xs' | 'sm' | 'md' | 'lg' | 'full';
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 请通过配置 title 设置标题
|
||||||
|
*/
|
||||||
|
title?: SchemaTpl | SchemaObject;
|
||||||
|
|
||||||
|
header?: SchemaTpl | SchemaObject;
|
||||||
|
headerClassName?: SchemaClassName;
|
||||||
|
|
||||||
|
footer?: SchemaTpl | SchemaObject;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 影响自动生成的按钮,如果自己配置了按钮这个配置无效。
|
||||||
|
*/
|
||||||
|
confirm?: boolean;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 是否显示关闭按钮
|
||||||
|
*/
|
||||||
|
showCloseButton?: boolean;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 是否显示错误信息
|
||||||
|
*/
|
||||||
|
showErrorMsg?: boolean;
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface DialogProps extends RendererProps, DialogSchema {
|
||||||
onClose: () => void;
|
onClose: () => void;
|
||||||
onConfirm: (
|
onConfirm: (
|
||||||
values: Array<object>,
|
values: Array<object>,
|
||||||
@ -26,18 +90,9 @@ export interface DialogProps extends RendererProps {
|
|||||||
) => void;
|
) => void;
|
||||||
children?: React.ReactNode | ((props?: any) => React.ReactNode);
|
children?: React.ReactNode | ((props?: any) => React.ReactNode);
|
||||||
store: IModalStore;
|
store: IModalStore;
|
||||||
className?: string;
|
|
||||||
header?: SchemaNode;
|
|
||||||
body?: SchemaNode;
|
|
||||||
headerClassName?: string;
|
|
||||||
bodyClassName?: string;
|
|
||||||
footer?: SchemaNode;
|
|
||||||
confirm?: boolean;
|
|
||||||
show?: boolean;
|
show?: boolean;
|
||||||
lazyRender?: boolean;
|
lazyRender?: boolean;
|
||||||
wrapperComponent: React.ReactType;
|
wrapperComponent: React.ElementType;
|
||||||
showCloseButton?: boolean;
|
|
||||||
showErrorMsg?: boolean;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface DialogState {
|
export interface DialogState {
|
||||||
@ -122,14 +177,14 @@ export default class Dialog extends React.Component<DialogProps, DialogState> {
|
|||||||
this.isDead = true;
|
this.isDead = true;
|
||||||
}
|
}
|
||||||
|
|
||||||
buildActions(): Array<Action> {
|
buildActions(): Array<ActionSchema> {
|
||||||
const {actions, confirm, translate: __} = this.props;
|
const {actions, confirm, translate: __} = this.props;
|
||||||
|
|
||||||
if (typeof actions !== 'undefined') {
|
if (typeof actions !== 'undefined') {
|
||||||
return actions;
|
return actions;
|
||||||
}
|
}
|
||||||
|
|
||||||
let ret: Array<Action> = [];
|
let ret: Array<ActionSchema> = [];
|
||||||
ret.push({
|
ret.push({
|
||||||
type: 'button',
|
type: 'button',
|
||||||
actionType: 'cancel',
|
actionType: 'cancel',
|
||||||
|
@ -1,13 +1,18 @@
|
|||||||
import React from 'react';
|
import React from 'react';
|
||||||
import {Renderer, RendererProps} from '../factory';
|
import {Renderer, RendererProps} from '../factory';
|
||||||
import {ServiceStore, IServiceStore} from '../store/service';
|
import {BaseSchema} from '../Schema';
|
||||||
import {filter} from '../utils/tpl';
|
|
||||||
import cx from 'classnames';
|
|
||||||
|
|
||||||
export interface DividerProps extends RendererProps {
|
/**
|
||||||
lineStyle: 'dashed' | 'solid';
|
* Divider 分割线渲染器。
|
||||||
|
* 文档:https://baidu.gitee.io/amis/docs/components/divider
|
||||||
|
*/
|
||||||
|
export interface DividerSchema extends BaseSchema {
|
||||||
|
type: 'divider';
|
||||||
|
lineStyle?: 'dashed' | 'solid';
|
||||||
}
|
}
|
||||||
|
|
||||||
|
export interface DividerProps extends RendererProps, DividerSchema {}
|
||||||
|
|
||||||
export default class Divider extends React.Component<DividerProps, object> {
|
export default class Divider extends React.Component<DividerProps, object> {
|
||||||
static defaultProps: Pick<DividerProps, 'className' | 'lineStyle'> = {
|
static defaultProps: Pick<DividerProps, 'className' | 'lineStyle'> = {
|
||||||
className: '',
|
className: '',
|
||||||
|
@ -11,12 +11,90 @@ import {IModalStore, ModalStore} from '../store/modal';
|
|||||||
import {filter} from '../utils/tpl';
|
import {filter} from '../utils/tpl';
|
||||||
import {Spinner} from '../components';
|
import {Spinner} from '../components';
|
||||||
import {IServiceStore} from '../store/service';
|
import {IServiceStore} from '../store/service';
|
||||||
|
import {
|
||||||
|
BaseSchema,
|
||||||
|
SchemaClassName,
|
||||||
|
SchemaCollection,
|
||||||
|
SchemaName,
|
||||||
|
SchemaObject,
|
||||||
|
SchemaTpl
|
||||||
|
} from '../Schema';
|
||||||
|
import {ActionSchema} from './Action';
|
||||||
|
|
||||||
export interface DrawerProps extends RendererProps {
|
/**
|
||||||
title?: string; // 标题
|
* Drawer 抽出式弹框。
|
||||||
size?: 'md' | 'lg' | 'xs' | 'sm';
|
* 文档:https://baidu.gitee.io/amis/docs/components/drawer
|
||||||
position?: 'left' | 'right' | 'top' | 'bottom';
|
*/
|
||||||
|
export interface DrawerSchema extends Omit<BaseSchema, 'type'> {
|
||||||
|
/**
|
||||||
|
* 默认不用填写,自动会创建确认和取消按钮。
|
||||||
|
*/
|
||||||
|
actions?: Array<ActionSchema>;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 内容区域
|
||||||
|
*/
|
||||||
|
body?: SchemaCollection;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 配置 Body 容器 className
|
||||||
|
*/
|
||||||
|
bodyClassName?: SchemaClassName;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 是否支持按 ESC 关闭 Dialog
|
||||||
|
*/
|
||||||
closeOnEsc?: boolean;
|
closeOnEsc?: boolean;
|
||||||
|
|
||||||
|
name?: SchemaName;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Dialog 大小
|
||||||
|
*/
|
||||||
|
size?: 'xs' | 'sm' | 'md' | 'lg' | 'full';
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 请通过配置 title 设置标题
|
||||||
|
*/
|
||||||
|
title?: SchemaTpl | SchemaObject;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 从什么位置弹出
|
||||||
|
*/
|
||||||
|
position?: 'left' | 'right' | 'top' | 'bottom';
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 头部
|
||||||
|
*/
|
||||||
|
header?: SchemaCollection;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 底部
|
||||||
|
*/
|
||||||
|
footer?: SchemaCollection;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 影响自动生成的按钮,如果自己配置了按钮这个配置无效。
|
||||||
|
*/
|
||||||
|
confirm?: boolean;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 是否可以拖动弹窗大小
|
||||||
|
*/
|
||||||
|
resizable?: boolean;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 是否显示蒙层
|
||||||
|
*/
|
||||||
|
overlay?: boolean;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 点击外部的时候是否关闭弹框。
|
||||||
|
*/
|
||||||
|
closeOnOutside?: boolean;
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface DrawerProps extends RendererProps, DrawerSchema {
|
||||||
onClose: () => void;
|
onClose: () => void;
|
||||||
onConfirm: (
|
onConfirm: (
|
||||||
values: Array<object>,
|
values: Array<object>,
|
||||||
@ -26,16 +104,8 @@ export interface DrawerProps extends RendererProps {
|
|||||||
) => void;
|
) => void;
|
||||||
children?: React.ReactNode | ((props?: any) => React.ReactNode);
|
children?: React.ReactNode | ((props?: any) => React.ReactNode);
|
||||||
store: IModalStore;
|
store: IModalStore;
|
||||||
className?: string;
|
|
||||||
header?: SchemaNode;
|
|
||||||
body?: SchemaNode;
|
|
||||||
bodyClassName?: string;
|
|
||||||
footer?: SchemaNode;
|
|
||||||
confirm?: boolean;
|
|
||||||
show?: boolean;
|
show?: boolean;
|
||||||
resizable?: boolean;
|
|
||||||
overlay?: boolean;
|
|
||||||
closeOnOutside?: boolean;
|
|
||||||
drawerContainer?: () => HTMLElement;
|
drawerContainer?: () => HTMLElement;
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -113,14 +183,14 @@ export default class Drawer extends React.Component<DrawerProps, object> {
|
|||||||
this.reaction && this.reaction();
|
this.reaction && this.reaction();
|
||||||
}
|
}
|
||||||
|
|
||||||
buildActions(): Array<Action> {
|
buildActions(): Array<ActionSchema> {
|
||||||
const {actions, confirm, translate: __} = this.props;
|
const {actions, confirm, translate: __} = this.props;
|
||||||
|
|
||||||
if (typeof actions !== 'undefined') {
|
if (typeof actions !== 'undefined') {
|
||||||
return actions;
|
return actions;
|
||||||
}
|
}
|
||||||
|
|
||||||
let ret: Array<Action> = [];
|
let ret: Array<ActionSchema> = [];
|
||||||
ret.push({
|
ret.push({
|
||||||
type: 'button',
|
type: 'button',
|
||||||
actionType: 'close',
|
actionType: 'close',
|
||||||
|
Loading…
Reference in New Issue
Block a user