test/amis
1
0
Fork 0
mirror of https://gitee.com/baidu/amis.git synced 2024-12-02 11:58:10 +08:00
Code Issues Actions 2 Packages Projects Releases Wiki Activity

Merge branch 'master' of https://github.com/baidu/amis

Browse Source
This commit is contained in:
liaoxuezhi 2019-06-10 21:01:09 +08:00
commit cc89515a6f
16 changed files with 67 additions and 40 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
docs/renderers/CRUD.md
View File

@ -11,7 +11,7 @@ CRUD 支持三种模式：`table`、`cards`、`list`，默认为 `table`。
| title | `string` | `""` | 可设置成空，当设置成空时，没有标题栏 |
| className | `string` | | 表格外层 Dom 的类名 |
| api | [Api](./Types.md#Api) | | CRUD 用来获取列表数据的 api。 |
| filter | [Form](./Form.md) | | 设置过滤器，当该表单提交后，会把数据带给当前 Action.md 刷新列表。 |
| filter | [Form](./Form/Form.md) | | 设置过滤器，当该表单提交后，会把数据带给当前 [Action](./Action.md) 刷新列表。 |
| filterTogglable | `boolean` | `false` | 是否可显隐过滤器 |
| filterDefaultVisible | `boolean` | `true` | 设置过滤器默认是否可见。 |
| initFetch | `boolean` | `true` | 是否初始化的时候拉取数据, 只针对有 filter 的情况, 没有 filter 初始都会拉取数据 |

2
docs/renderers/Card.md
View File

@ -16,7 +16,7 @@
| header.avatarClassName | `string` | `"pull-left thumb avatar b-3x m-r"` | 图片类名 |
| body | `Array` 或者 [Field](./Field.md) | | 内容容器，主要用来放置 [Field](./Field.md) |
| bodyClassName | `string` | `"padder m-t-sm m-b-sm"` | 内容区域类名 |
| actions | Array Of [Button](./Button.md) | | 按钮区域 |
| actions | Array Of [Button](./Form/Button.md) | | 按钮区域 |
```schema:height="300" scope="body"
{

2
docs/renderers/Chart.md
View File

@ -1,6 +1,6 @@
## Chart
图表渲染器，采用 echarts 渲染，配置格式跟 echarts 相同，配置文档[文档](http://echarts.baidu.com/option.html#title)
图表渲染器，采用 echarts 渲染，配置格式跟 echarts 相同，[echarts配置文档](http://echarts.baidu.com/option.html#title)
| 属性名 | 类型 | 默认值 | 说明 |
| --------- | --------------------------------- | --------- | ------------------------------------------------------------------ |

23
docs/renderers/Drawer.md
View File

@ -2,17 +2,18 @@
Drawer 由 [Action](./Action.md) 触发。
| 属性名 | 类型 | 默认值 | 说明 |
| ------------- | ----------------------------------------------- | ------------ | ------------------------------------------------ |
| type | `string` | | `"drawer"` 指定为 Drawer 渲染器 |
| title | `string` 或者 [Container](./Types.md#Container) | | 弹出层标题 |
| body | [Container](./Types.md#Container) | | 往 Dialog 内容区加内容 |
| size | `string` | | 指定 dialog 大小，支持: `xs`、`sm`、`md`、`lg` |
| bodyClassName | `string` | `modal-body` | Dialog body 区域的样式类名 |
| closeOnEsc | `boolean` | `false` | 是否支持按 `Esc` 关闭 Dialog |
| overlay | `boolean` | `true` | 是否显示蒙层 |
| resizable | `boolean` | `false` | 是否可通过拖拽改变 Drawer 大小 |
| actions | Array Of [Action](./Action.md) | | 可以不设置，默认只有【确认】和【取消】两个按钮。 |
| 属性名 | 类型 | 默认值 | 说明 |
| -------------- | ----------------------------------------------- | ------------ | ------------------------------------------------ |
| type | `string` | | `"drawer"` 指定为 Drawer 渲染器 |
| title | `string` 或者 [Container](./Types.md#Container) | | 弹出层标题 |
| body | [Container](./Types.md#Container) | | 往 Drawer 内容区加内容 |
| size | `string` | | 指定 Drawer 大小，支持: `xs`、`sm`、`md`、`lg` |
| bodyClassName | `string` | `modal-body` | Drawer body 区域的样式类名 |
| closeOnEsc | `boolean` | `false` | 是否支持按 `Esc` 关闭 Drawer |
| closeOnOutside | `boolean` | `false` | 点击内容区外是否关闭 Drawer |
| overlay | `boolean` | `true` | 是否显示蒙层 |
| resizable | `boolean` | `false` | 是否可通过拖拽改变 Drawer 大小 |
| actions | Array Of [Action](./Action.md) | | 可以不设置，默认只有【确认】和【取消】两个按钮。 |
```schema:height="200"
{

4
docs/renderers/Field.md
View File

@ -84,8 +84,8 @@
- `quickEdit` 配置后在内容区增加一个编辑按钮，点击后弹出一个编辑框。
`boolean` 简单的开启或者关闭
`Object` 快速编辑详情，请参考 [FormItem](./FormItem.md) 配置。
`.mode` 模式如果设置为 `inline` 模式，则直接展示输入框，而不需要点击按钮后展示。
`.saveImmediately` 开启后，直接保存，而不是等全部操作完后批量保存。
`mode` 模式如果设置为 `inline` 模式，则直接展示输入框，而不需要点击按钮后展示。
`saveImmediately` 开启后，直接保存，而不是等全部操作完后批量保存。
- `copyable` 配置后会在内容区增加一个复制按钮，点击后把内容复制到剪切板。
todo

6
docs/renderers/Form/Email.md
View File

@ -7,13 +7,15 @@ Email 输入框。
- `addOn.type` 请选择 `text` 、`button` 或者 `submit`。
- `addOn.label` 文字说明
- `addOn.xxx` 其他参数请参考按钮配置部分。
- `hint` 当输入框获得焦点的时候显示，用来提示用户输入内容。
- `trimContents` 是否去除首尾空白。
- `clearable` 在有值的时候是否显示一个删除图标在右侧。
- `resetValue` 默认为 `""`, 删除后设置此配置项给定的值。
- `options` 可选，选项配置，类型为数组，成员格式如下，配置后用户输入内容时会作为选项提示辅助输入。
- `label` 文字
- `value` 值
- `source` 通过 options 只能配置静态数据，如果设置了 source 则会从接口拉取，实现动态效果。
- `autoComplete` 跟 source 不同的是，每次用户输入都会去接口获取提示。
- `source` 通过 `options` 只能配置静态数据，如果设置了 `source` 则会从接口拉取，实现动态效果。
- `autoComplete` 跟 `source` 不同的是，每次用户输入都会去接口获取提示。
- `multiple` 默认为 `false`, 设置成 `true` 表示可多选。
- 更多配置请参考 [FormItem](./FormItem.md)

1
docs/renderers/Form/Password.md
View File

@ -7,6 +7,7 @@
- `addOn.type` 请选择 `text` 、`button` 或者 `submit`。
- `addOn.label` 文字说明
- `addOn.xxx` 其他参数请参考按钮配置部分。
- `hint` 当输入框获得焦点的时候显示，用来提示用户输入内容。
- `clearable` 在有值的时候是否显示一个删除图标在右侧。
- `resetValue` 默认为 `""`, 删除后设置此配置项给定的值。
- 更多配置请参考 [FormItem](./FormItem.md)

6
docs/renderers/Form/Text.md
View File

@ -7,13 +7,15 @@
- `addOn.type` 请选择 `text` 、`button` 或者 `submit`。
- `addOn.label` 文字说明
- `addOn.xxx` 其他参数请参考按钮配置部分。
- `hint` 当输入框获得焦点的时候显示，用来提示用户输入内容。
- `trimContents` 是否去除首尾空白。
- `clearable` 在有值的时候是否显示一个删除图标在右侧。
- `resetValue` 默认为 `""`, 删除后设置此配置项给定的值。
- `options` 可选，选项配置，类型为数组，成员格式如下，配置后用户输入内容时会作为选项提示辅助输入。
- `label` 文字
- `value` 值
- `source` 通过 options 只能配置静态数据，如果设置了 source 则会从接口拉取，实现动态效果。
- `autoComplete` 跟 source 不同的是，每次用户输入都会去接口获取提示。
- `source` 通过 `options` 只能配置静态数据，如果设置了 `source` 则会从接口拉取，实现动态效果。
- `autoComplete` 跟 `source` 不同的是，每次用户输入都会去接口获取提示。
- `multiple` 默认为 `false`, 设置成 `true` 表示可多选。
- 更多配置请参考 [FormItem](./FormItem.md)

4
docs/renderers/Form/Textarea.md
View File

@ -3,6 +3,10 @@
多行文本输入框。
- `type` 请设置成 `textarea`
- `minRows` 最小行数
- `maxRows` 最大行数
- `hint` 当输入框获得焦点的时候显示，用来提示用户输入内容。
- `trimContents` 是否去除首尾空白。
- 更多配置请参考 [FormItem](./FormItem.md)
```schema:height="200" scope="form-item"

6
docs/renderers/Form/Url.md
View File

@ -7,13 +7,15 @@ URL 输入框。
- `addOn.type` 请选择 `text` 、`button` 或者 `submit`。
- `addOn.label` 文字说明
- `addOn.xxx` 其他参数请参考按钮配置部分。
- `hint` 当输入框获得焦点的时候显示，用来提示用户输入内容。
- `trimContents` 是否去除首尾空白。
- `clearable` 在有值的时候是否显示一个删除图标在右侧。
- `resetValue` 默认为 `""`, 删除后设置此配置项给定的值。
- `options` 可选，选项配置，类型为数组，成员格式如下，配置后用户输入内容时会作为选项提示辅助输入。
- `label` 文字
- `value` 值
- `source` 通过 options 只能配置静态数据，如果设置了 source 则会从接口拉取，实现动态效果。
- `autoComplete` 跟 source 不同的是，每次用户输入都会去接口获取提示。
- `source` 通过 `options` 只能配置静态数据，如果设置了 `source` 则会从接口拉取，实现动态效果。
- `autoComplete` 跟 `source` 不同的是，每次用户输入都会去接口获取提示。
- `multiple` 默认为 `false`, 设置成 `true` 表示可多选。
- 更多配置请参考 [FormItem](./FormItem.md)

2
docs/renderers/Table.md
View File

@ -15,7 +15,7 @@
| headerClassName | `string` | `Action.md-table-header` | 顶部外层 CSS 类名 |
| footerClassName | `string` | `Action.md-table-footer` | 底部外层 CSS 类名 |
| toolbarClassName | `string` | `Action.md-table-toolbar` | 工具栏 CSS 类名 |
| columns | Array of [Column](.Column.md) | | 用来设置列信息 |
| columns | Array of [Column](./Column.md) | | 用来设置列信息 |
```schema:height="700" scope="body"
{

14
examples/components/Dialog/Drawer.jsx
View File

@ -394,7 +394,19 @@ export default {
}
]
}
}
},
{
type: 'button',
label: '可拉拽调整大小',
actionType: 'drawer',
level: 'danger',
drawer: {
title: '提示',
closeOnEsc: true,
resizable: true,
body: '这是个简单的弹框',
}
},
]
}
],

1
package.json
View File

@ -62,7 +62,6 @@
"react-dropzone": "4.2.1",
"react-input-range": "1.2.1",
"react-json-tree": "0.11.0",
"react-onclickoutside": "6.7.0",
"react-progress-2": "^4.4.2",
"react-select": "1.2.1",
"react-textarea-autosize": "5.1.0",

3
scss/components/_button-group.scss
View File

@ -16,7 +16,8 @@
&:focus,
&:active,
&.active {
&.active,
&.is-active {
z-index: 1;
}
}

29
src/components/Drawer.tsx
View File

@ -10,10 +10,8 @@ import {Portal} from 'react-overlays';
import {closeIcon} from './icons';
import * as cx from 'classnames';
import {current, addModal, removeModal} from './ModalManager';
import onClickOutside from 'react-onclickoutside';
import {classPrefix, classnames} from '../themes/default';
import {ClassNamesFn, themeable} from '../theme';
import {noop} from '../utils/helper';
import {noop, autobind} from '../utils/helper';
type DrawerPosition = 'top' | 'right' | 'bottom' | 'left';
@ -47,13 +45,13 @@ export class Drawer extends React.Component<DrawerProps, DrawerState> {
DrawerProps,
'container' | 'position' | 'size' | 'overlay' | 'disableOnClickOutside' | 'enableOnClickOutside'
> = {
container: document.body,
position: 'left',
size: 'md',
overlay: true,
disableOnClickOutside: noop,
enableOnClickOutside: noop,
};
container: document.body,
position: 'left',
size: 'md',
overlay: true,
disableOnClickOutside: noop,
enableOnClickOutside: noop,
};
contentDom: any;
@ -93,8 +91,12 @@ export class Drawer extends React.Component<DrawerProps, DrawerState> {
}
};
handleClickOutside() {
const {closeOnOutside, onHide} = this.props;
@autobind
handleWidgetClick(e: React.MouseEvent) {
const {classPrefix: ns, closeOnOutside, onHide} = this.props;
if ((e.target as HTMLElement).closest(`.${ns}Drawer-content`)) {
return;
}
closeOnOutside && onHide && onHide();
}
@ -143,6 +145,7 @@ export class Drawer extends React.Component<DrawerProps, DrawerState> {
},
className
)}
onClick={this.handleWidgetClick} // 其实不需要插件，直接写逻辑吧
>
{overlay ? <div className={cx(`${ns}Drawer-overlay`, fadeStyles[status])} /> : null}
<div ref={this.contentRef} className={cx(`${ns}Drawer-content`, fadeStyles[status])}>
@ -160,4 +163,4 @@ export class Drawer extends React.Component<DrawerProps, DrawerState> {
}
}
export default themeable(onClickOutside(Drawer));
export default themeable(Drawer);

2
src/renderers/Table.tsx
View File

@ -1288,7 +1288,7 @@ export default class Table extends React.Component<TableProps, object> {
height = heights[rowIndex];
top += heights.header;
for (let i = rowIndex - 1; i >= 0; i--) {
top += heights[i];
top += heights[i] + 1;
}
}