diff --git a/docs/renderers/Number.md b/docs/renderers/Number.md index f09b63c7..1aaf5b15 100644 --- a/docs/renderers/Number.md +++ b/docs/renderers/Number.md @@ -3,9 +3,10 @@ 数字输入框。 - `type` 请设置成 `number` -- `min` 最小值 +- `min` 最小值，支持用`${xxx}`获取变量 +- `max` 最大值，支持用`${xxx}`获取变量 - `step` 步长 -- `max` 最大值 +- `precision` 精度 - 更多配置请参考 [FormItem](./FormItem.md) ```schema:height="200" scope="form-item" diff --git a/docs/renderers/Service.md b/docs/renderers/Service.md index 77e8baa5..74c05ae0 100644 --- a/docs/renderers/Service.md +++ b/docs/renderers/Service.md @@ -4,18 +4,21 @@ 该组件初始化时就会自动拉取一次数据，后续如果需要刷新，请结合 Action 实现，可以把 Action 的 actionType 设置为 reload, target 为该组件的 name 值。 同时该组件，还支持 api 数值自动监听，比如 `getData?type=$type` 只要当前环境 type 值发生变化，就会自动重新拉取。 -| 属性名 | 类型 | 默认值 | 说明 | -| ------------------- | --------------------------------- | ----------- | --------------------------------------------------- | -| type | `string` | `"service"` | 指定为 service 渲染器 | -| className | `string` | | 外层 Dom 的类名 | -| body | [Container](./Types.md#container) | | 内容容器 | -| api | [api](./Types.md#Api) | | 数据源 API 地址 | -| initFetch | `boolean` | | 是否默认拉取 | -| schemaApi | [api](./Types.md#Api) | | 用来获取远程 Schema 的 api | -| initFetchSchema | `boolean` | | 是否默认拉取 Schema | -| interval | `number` | `3000` | 刷新时间(最低 3000) | -| silentPolling | `boolean` | `false` | 配置刷新时是否显示加载动画 | -| stopAutoRefreshWhen | `string` | `""` | 通过[表达式](./Types.md#表达式)来配置停止刷新的条件 | +| 属性名 | 类型 | 默认值 | 说明 | +| --------------------- | --------------------------------- | -------------- | ------------------------------------------------------------------- | +| type | `string` | `"service"` | 指定为 service 渲染器 | +| className | `string` | | 外层 Dom 的类名 | +| body | [Container](./Types.md#container) | | 内容容器 | +| api | [api](./Types.md#Api) | | 数据源 API 地址 | +| initFetch | `boolean` | | 是否默认拉取 | +| schemaApi | [api](./Types.md#Api) | | 用来获取远程 Schema 的 api | +| initFetchSchema | `boolean` | | 是否默认拉取 Schema | +| messages | `Object` | | 消息提示覆写，默认消息读取的是 API 返回的消息，但是在此可以覆写它。 | +| messages.fetchSuccess | `string` | | 获取成功时提示 | +| messages.fetchFailed | `string` | `"初始化失败"` | 获取失败时提示 | +| interval | `number` | `3000` | 刷新时间(最低 3000) | +| silentPolling | `boolean` | `false` | 配置刷新时是否显示加载动画 | +| stopAutoRefreshWhen | `string` | `""` | 通过[表达式](./Types.md#表达式)来配置停止刷新的条件 | ```schema:height="200" scope="body" { diff --git a/src/renderers/Form/Number.tsx b/src/renderers/Form/Number.tsx index c641235f..a0336f42 100644 --- a/src/renderers/Form/Number.tsx +++ b/src/renderers/Form/Number.tsx @@ -5,12 +5,12 @@ import { } from './Item'; import * as cx from 'classnames'; import * as InputNumber from 'rc-input-number'; -import { Action } from '../../types'; +import {filter} from '../../utils/tpl'; export interface NumberProps extends FormControlProps { placeholder?: string; - max?: number; - min?: number; + max?: number | string; + min?: number | string; step?: number; precision?: number; }; @@ -21,7 +21,7 @@ export default class NumberControl extends React.Component { resetValue: '' }; - constructor(props:NumberProps) { + constructor(props: NumberProps) { super(props); this.handleChange = this.handleChange.bind(this); @@ -37,6 +37,14 @@ export default class NumberControl extends React.Component { onChange(typeof inputValue === 'undefined' ? (resetValue || '') : inputValue); } + filterNum(value: number | string | undefined) { + if (typeof value !== 'number') { + value = filter(value, this.props.data); + value = /^[-]?\d+/.test(value) ? parseInt(value, 10) : undefined; + } + return value; + } + render(): JSX.Element { const { className, @@ -47,7 +55,7 @@ export default class NumberControl extends React.Component { max, min, disabled, - placeholder, + placeholder } = this.props; let precisionProps: any = {}; @@ -62,8 +70,8 @@ export default class NumberControl extends React.Component { prefixCls={`${ns}Number`} value={value} step={step} - max={max} - min={min} + max={this.filterNum(max)} + min={this.filterNum(min)} onChange={this.handleChange} disabled={disabled} placeholder={placeholder} diff --git a/src/renderers/Service.tsx b/src/renderers/Service.tsx index 94e64ddb..941764b4 100644 --- a/src/renderers/Service.tsx +++ b/src/renderers/Service.tsx @@ -19,12 +19,20 @@ export interface ServiceProps extends RendererProps { stopAutoRefreshWhen?: string; store: IServiceStore; body?: SchemaNode; + messages: { + fetchSuccess?: string; + fetchFailed?: string; + }; } export default class Service extends React.Component { timer: NodeJS.Timeout; mounted: boolean; - static defaultProps: Partial = {}; + static defaultProps: Partial = { + messages: { + fetchFailed: '初始化失败' + } + }; static propsList: Array = []; @@ -38,7 +46,17 @@ export default class Service extends React.Component { } componentDidMount() { - const {schemaApi, initFetchSchema, api, initFetch, store} = this.props; + const { + schemaApi, + initFetchSchema, + api, + initFetch, + store, + messages: { + fetchSuccess, + fetchFailed + }, + } = this.props; this.mounted = true; @@ -47,7 +65,10 @@ export default class Service extends React.Component { initFetchSchema !== false && (!(schemaApi as ApiObject).sendOn || evalExpression((schemaApi as ApiObject).sendOn as string, store.data)) ) { - store.fetchSchema(schemaApi, store.data).then(this.initInterval); + store.fetchSchema(schemaApi, store.data, { + successMessage: fetchSuccess, + errorMessage: fetchFailed + }).then(this.initInterval); } if ( @@ -55,7 +76,10 @@ export default class Service extends React.Component { initFetch !== false && (!(api as ApiObject).sendOn || evalExpression((api as ApiObject).sendOn as string, store.data)) ) { - store.fetchInitData(api, store.data).then(this.initInterval); + store.fetchInitData(api, store.data, { + successMessage: fetchSuccess, + errorMessage: fetchFailed + }).then(this.initInterval); } } @@ -63,11 +87,24 @@ export default class Service extends React.Component { const props = this.props; const store = props.store; + const { + messages: { + fetchSuccess, + fetchFailed + } + } = props; + isApiOutdated(prevProps.api, props.api, prevProps.data, props.data) && - store.fetchData(props.api as Api, store.data).then(this.initInterval); + store.fetchData(props.api as Api, store.data, { + successMessage: fetchSuccess, + errorMessage: fetchFailed + }).then(this.initInterval); isApiOutdated(prevProps.schemaApi, props.schemaApi, prevProps.data, props.data) && - store.fetchSchema(props.schemaApi as Api, store.data).then(this.initInterval); + store.fetchSchema(props.schemaApi as Api, store.data, { + successMessage: fetchSuccess, + errorMessage: fetchFailed + }).then(this.initInterval); } componentWillUnmount() { @@ -90,7 +127,10 @@ export default class Service extends React.Component { return this.receive(query); } - const {schemaApi, fetchSchema, api, fetch, store} = this.props; + const {schemaApi, fetchSchema, api, fetch, store, messages: { + fetchSuccess, + fetchFailed + }} = this.props; clearTimeout(this.timer); @@ -99,7 +139,10 @@ export default class Service extends React.Component { fetchSchema !== false && (!(schemaApi as ApiObject).sendOn || evalExpression((schemaApi as ApiObject).sendOn as string, store.data)) ) { - store.fetchSchema(schemaApi, store.data).then(this.initInterval); + store.fetchSchema(schemaApi, store.data, { + successMessage: fetchSuccess, + errorMessage: fetchFailed + }).then(this.initInterval); } if ( @@ -110,6 +153,8 @@ export default class Service extends React.Component { store .fetchData(api, store.data, { silent, + successMessage: fetchSuccess, + errorMessage: fetchFailed }) .then(this.initInterval); } @@ -163,16 +208,16 @@ export default class Service extends React.Component { {store.loading ? render( - 'info', - { - type: 'spinner', - overlay: true, - }, - { - key: 'info', - size: 'lg', - } - ) + 'info', + { + type: 'spinner', + overlay: true, + }, + { + key: 'info', + size: 'lg', + } + ) : null} );