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

docs: ✏️ [Column](#column)

Browse Source
This commit is contained in:
SIMDD 2019-05-09 21:37:23 +08:00
parent 827b8142e1
commit 620a557bb7
12 changed files with 128 additions and 128 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
docs/renderers/Card.md
View File

@ -2,21 +2,21 @@
卡片的展示形式。
| 属性名 | 类型 | 默认值 | 说明 |
| ---------------------- | ---------------------------- | ----------------------------------- | -------------------------------------- |
| type | `string` | `"card"` | 指定为 Card 渲染器 |
| className | `string` | `"panel-default"` | 外层 Dom 的类名 |
| header | `Object` | | Card 头部内容设置 |
| header.className | `string` | | 头部类名 |
| header.title | `string` | | 标题 |
| header.subTitle | `string` | | 副标题 |
| header.desc | `string` | | 描述 |
| header.avatar | `string` | | 图片 |
| header.highlight | `boolean` | | 是否点亮 |
| header.avatarClassName | `string` | `"pull-left thumb avatar b-3x m-r"` | 图片类名 |
| body | `Array` 或者 [Field](#field) | | 内容容器，主要用来放置 [Field](#field) |
| bodyClassName | `string` | `"padder m-t-sm m-b-sm"` | 内容区域类名 |
| actions | Array Of [Button](#button) | | 按钮区域 |
| 属性名 | 类型 | 默认值 | 说明 |
| ---------------------- | -------------------------------- | ----------------------------------- | ------------------------------------------ |
| type | `string` | `"card"` | 指定为 Card 渲染器 |
| className | `string` | `"panel-default"` | 外层 Dom 的类名 |
| header | `Object` | | Card 头部内容设置 |
| header.className | `string` | | 头部类名 |
| header.title | `string` | | 标题 |
| header.subTitle | `string` | | 副标题 |
| header.desc | `string` | | 描述 |
| header.avatar | `string` | | 图片 |
| header.highlight | `boolean` | | 是否点亮 |
| 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) | | 按钮区域 |
```schema:height="300" scope="body"
{

22
docs/renderers/Cards.md
View File

@ -2,17 +2,17 @@
卡片集合。
| 属性名 | 类型 | 默认值 | 说明 |
| --------------- | ------------- | ------------------- | -------------------------- |
| type | `string` | | `"cards"` 指定为卡片集合。 |
| title | `string` | | 标题 |
| source | `string` | `${items}` | 数据源, 绑定当前环境变量 |
| placeholder | string | ‘暂无数据’ | 当没数据的时候的文字提示 |
| className | `string` | | 外层 CSS 类名 |
| headerClassName | `string` | `amis-grid-header` | 顶部外层 CSS 类名 |
| footerClassName | `string` | `amis-grid-footer` | 底部外层 CSS 类名 |
| itemClassName | `string` | `col-sm-4 col-md-3` | 卡片 CSS 类名 |
| card | [Card](#card) | | 配置卡片信息 |
| 属性名 | 类型 | 默认值 | 说明 |
| --------------- | ----------------- | ------------------- | -------------------------- |
| type | `string` | | `"cards"` 指定为卡片集合。 |
| title | `string` | | 标题 |
| source | `string` | `${items}` | 数据源, 绑定当前环境变量 |
| placeholder | string | ‘暂无数据’ | 当没数据的时候的文字提示 |
| className | `string` | | 外层 CSS 类名 |
| headerClassName | `string` | `amis-grid-header` | 顶部外层 CSS 类名 |
| footerClassName | `string` | `amis-grid-footer` | 底部外层 CSS 类名 |
| itemClassName | `string` | `col-sm-4 col-md-3` | 卡片 CSS 类名 |
| card | [Card](./Card.md) | | 配置卡片信息 |
```schema:height="450" scope="body"
{

2
docs/renderers/Column.md
View File

@ -2,7 +2,7 @@
表格中的列配置
- `type` 默认为 `text`，支持： `text`、`html`、`tpl`、`image`、`progress`、`status`、`date`、`datetime`、`time`、`json`、`mapping`参考 [Field 说明](#field)和[Operation](#operation)。
- `type` 默认为 `text`，支持： `text`、`html`、`tpl`、`image`、`progress`、`status`、`date`、`datetime`、`time`、`json`、`mapping`参考 [Field 说明](./Field.md)和[Operation](./Operation.md)。
- `name` 用来关联列表数据中的变量 `key`。
- `label` 列标题。
- `copyable` 开启后，会支持内容点击复制。

20
docs/renderers/Dialog.md
View File

@ -2,16 +2,16 @@
Dialog 由 [Action](#action) 触发。他是一个类似于 [Page](#page) 的容器模型。
| 属性名 | 类型 | 默认值 | 说明 |
| ------------- | ------------------------------------- | ------------ | ------------------------------------------------ |
| type | `string` | | `"dialog"` 指定为 Dialog 渲染器 |
| title | `string` 或者 [Container](#Container) | | 弹出层标题 |
| body | [Container](#Container) | | 往 Dialog 内容区加内容 |
| size | `string` | | 指定 dialog 大小，支持: `xs`、`sm`、`md`、`lg` |
| bodyClassName | `string` | `modal-body` | Dialog body 区域的样式类名 |
| closeOnEsc | `boolean` | `false` | 是否支持按 `Esc` 关闭 Dialog |
| disabled | `boolean` | `false` | 如果设置此属性，则该 Dialog 只读没有提交操作。 |
| actions | Array Of [Action](#action) | | 可以不设置，默认只有【确认】和【取消】两个按钮。 |
| 属性名 | 类型 | 默认值 | 说明 |
| ------------- | ----------------------------------------------- | ------------ | ------------------------------------------------ |
| type | `string` | | `"dialog"` 指定为 Dialog 渲染器 |
| 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 |
| disabled | `boolean` | `false` | 如果设置此属性，则该 Dialog 只读没有提交操作。 |
| actions | Array Of [Action](#action) | | 可以不设置，默认只有【确认】和【取消】两个按钮。 |
```schema:height="200"
{

22
docs/renderers/Drawer.md
View File

@ -2,17 +2,17 @@
Drawer 由 [Action](#action) 触发。
| 属性名 | 类型 | 默认值 | 说明 |
| ------------- | ------------------------------------- | ------------ | ------------------------------------------------ |
| type | `string` | | `"drawer"` 指定为 Drawer 渲染器 |
| title | `string` 或者 [Container](#Container) | | 弹出层标题 |
| body | [Container](#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) | | 可以不设置，默认只有【确认】和【取消】两个按钮。 |
| 属性名 | 类型 | 默认值 | 说明 |
| ------------- | ----------------------------------------------- | ------------ | ------------------------------------------------ |
| 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) | | 可以不设置，默认只有【确认】和【取消】两个按钮。 |
```schema:height="200"
{

52
docs/renderers/Grid.md
View File

@ -1,31 +1,31 @@
## Grid
| 属性名 | 类型 | 默认值 | 说明 |
| ------------------- | ----------------------- | -------- | ----------------------- |
| type | `string` | `"grid"` | 指定为 Grid 渲染器 |
| className | `string` | | 外层 Dom 的类名 |
| columns | `Array` | | 列集合 |
| columns[x] | [Container](#Container) | | 成员可以是其他渲染器 |
| columns[x].xs | `int` | | 宽度占比： 1 - 12 |
| columns[x].xsHidden | `boolean` | | 是否隐藏 |
| columns[x].xsOffset | `int` | | 偏移量 1 - 12 |
| columns[x].xsPull | `int` | | 靠左的距离占比：1 - 12 |
| columns[x].xsPush | `int` | | 靠右的距离占比： 1 - 12 |
| columns[x].sm | `int` | | 宽度占比： 1 - 12 |
| columns[x].smHidden | `boolean` | | 是否隐藏 |
| columns[x].smOffset | `int` | | 偏移量 1 - 12 |
| columns[x].smPull | `int` | | 靠左的距离占比：1 - 12 |
| columns[x].smPush | `int` | | 靠右的距离占比： 1 - 12 |
| columns[x].md | `int` | | 宽度占比： 1 - 12 |
| columns[x].mdHidden | `boolean` | | 是否隐藏 |
| columns[x].mdOffset | `int` | | 偏移量 1 - 12 |
| columns[x].mdPull | `int` | | 靠左的距离占比：1 - 12 |
| columns[x].mdPush | `int` | | 靠右的距离占比： 1 - 12 |
| columns[x].lg | `int` | | 宽度占比： 1 - 12 |
| columns[x].lgHidden | `boolean` | | 是否隐藏 |
| columns[x].lgOffset | `int` | | 偏移量 1 - 12 |
| columns[x].lgPull | `int` | | 靠左的距离占比：1 - 12 |
| columns[x].lgPush | `int` | | 靠右的距离占比： 1 - 12 |
| 属性名 | 类型 | 默认值 | 说明 |
| ------------------- | --------------------------------- | -------- | ----------------------- |
| type | `string` | `"grid"` | 指定为 Grid 渲染器 |
| className | `string` | | 外层 Dom 的类名 |
| columns | `Array` | | 列集合 |
| columns[x] | [Container](./Types.md#Container) | | 成员可以是其他渲染器 |
| columns[x].xs | `int` | | 宽度占比： 1 - 12 |
| columns[x].xsHidden | `boolean` | | 是否隐藏 |
| columns[x].xsOffset | `int` | | 偏移量 1 - 12 |
| columns[x].xsPull | `int` | | 靠左的距离占比：1 - 12 |
| columns[x].xsPush | `int` | | 靠右的距离占比： 1 - 12 |
| columns[x].sm | `int` | | 宽度占比： 1 - 12 |
| columns[x].smHidden | `boolean` | | 是否隐藏 |
| columns[x].smOffset | `int` | | 偏移量 1 - 12 |
| columns[x].smPull | `int` | | 靠左的距离占比：1 - 12 |
| columns[x].smPush | `int` | | 靠右的距离占比： 1 - 12 |
| columns[x].md | `int` | | 宽度占比： 1 - 12 |
| columns[x].mdHidden | `boolean` | | 是否隐藏 |
| columns[x].mdOffset | `int` | | 偏移量 1 - 12 |
| columns[x].mdPull | `int` | | 靠左的距离占比：1 - 12 |
| columns[x].mdPush | `int` | | 靠右的距离占比： 1 - 12 |
| columns[x].lg | `int` | | 宽度占比： 1 - 12 |
| columns[x].lgHidden | `boolean` | | 是否隐藏 |
| columns[x].lgOffset | `int` | | 偏移量 1 - 12 |
| columns[x].lgPull | `int` | | 靠左的距离占比：1 - 12 |
| columns[x].lgPush | `int` | | 靠右的距离占比： 1 - 12 |
更多使用说明，请参看 [Grid Props](https://react-bootstrap.github.io/components.html#grid-props-col)

14
docs/renderers/HBox.md
View File

@ -1,12 +1,12 @@
## HBox
| 属性名 | 类型 | 默认值 | 说明 |
| -------------------------- | ----------------------- | -------------- | -------------------- |
| type | `string` | `"hbox"` | 指定为 HBox 渲染器 |
| className | `string` | | 外层 Dom 的类名 |
| columns | `Array` | | 列集合 |
| columns[x] | [Container](#Container) | | 成员可以是其他渲染器 |
| columns[x].columnClassName | `string` | `"wrapper-xs"` | 列上类名 |
| 属性名 | 类型 | 默认值 | 说明 |
| -------------------------- | --------------------------------- | -------------- | -------------------- |
| type | `string` | `"hbox"` | 指定为 HBox 渲染器 |
| className | `string` | | 外层 Dom 的类名 |
| columns | `Array` | | 列集合 |
| columns[x] | [Container](./Types.md#Container) | | 成员可以是其他渲染器 |
| columns[x].columnClassName | `string` | `"wrapper-xs"` | 列上类名 |
```schema:height="300" scope="body"
[

36
docs/renderers/List.md
View File

@ -2,24 +2,24 @@
列表展示。
| 属性名 | 类型 | 默认值 | 说明 |
| ------------------------ | ---------------------------- | --------------------- | -------------------------------------- |
| type | `string` | | `"list"` 指定为列表展示。 |
| title | `string` | | 标题 |
| source | `string` | `${items}` | 数据源, 绑定当前环境变量 |
| placeholder | string | ‘暂无数据’ | 当没数据的时候的文字提示 |
| className | `string` | | 外层 CSS 类名 |
| headerClassName | `string` | `amis-list-header` | 顶部外层 CSS 类名 |
| footerClassName | `string` | `amis-list-footer` | 底部外层 CSS 类名 |
| listItem | `Array` | | 配置单条信息 |
| listItem.title | `string` | | 标题，支持模板语法如： \${xxx} |
| listItem.titleClassName | `string` | `h5` | 标题 CSS 类名 |
| listItem.subTitle | `string` | | 副标题，支持模板语法如： \${xxx} |
| listItem.avatar | `string` | | 图片地址，支持模板语法如： \${xxx} |
| listItem.avatarClassName | `string` | `thumb-sm avatar m-r` | 图片 CSS 类名 |
| listItem.desc | `string` | | 描述，支持模板语法如： \${xxx} |
| listItem.body | `Array` 或者 [Field](#field) | | 内容容器，主要用来放置 [Field](#field) |
| listItem.actions | Array Of [Button](#button) | | 按钮区域 |
| 属性名 | 类型 | 默认值 | 说明 |
| ------------------------ | -------------------------------- | --------------------- | ------------------------------------------ |
| type | `string` | | `"list"` 指定为列表展示。 |
| title | `string` | | 标题 |
| source | `string` | `${items}` | 数据源, 绑定当前环境变量 |
| placeholder | string | ‘暂无数据’ | 当没数据的时候的文字提示 |
| className | `string` | | 外层 CSS 类名 |
| headerClassName | `string` | `amis-list-header` | 顶部外层 CSS 类名 |
| footerClassName | `string` | `amis-list-footer` | 底部外层 CSS 类名 |
| listItem | `Array` | | 配置单条信息 |
| listItem.title | `string` | | 标题，支持模板语法如： \${xxx} |
| listItem.titleClassName | `string` | `h5` | 标题 CSS 类名 |
| listItem.subTitle | `string` | | 副标题，支持模板语法如： \${xxx} |
| listItem.avatar | `string` | | 图片地址，支持模板语法如： \${xxx} |
| listItem.avatarClassName | `string` | `thumb-sm avatar m-r` | 图片 CSS 类名 |
| listItem.desc | `string` | | 描述，支持模板语法如： \${xxx} |
| listItem.body | `Array` 或者 [Field](./Field.md) | | 内容容器，主要用来放置 [Field](./Field.md) |
| listItem.actions | Array Of [Button](./Button.md) | | 按钮区域 |
```schema:height="400" scope="body"
{

2
docs/renderers/Operation.md
View File

@ -4,4 +4,4 @@
- `type` 请设置成 `operation`。
- `label` 列标题。
- `buttons` 按钮集合，请参考[Button](#button) 按钮配置说明。
- `buttons` 按钮集合，请参考[Button](./Button.md) 按钮配置说明。

26
docs/renderers/Panel.md
View File

@ -2,19 +2,19 @@
可以把相关信息以盒子的形式展示到一块。
| 属性名 | 类型 | 默认值 | 说明 |
| ---------------- | -------------------------- | -------------------------------------- | ------------------- |
| type | `string` | `"panel"` | 指定为 Panel 渲染器 |
| className | `string` | `"panel-default"` | 外层 Dom 的类名 |
| headerClassName | `string` | `"panel-heading"` | header 区域的类名 |
| footerClassName | `string` | `"panel-footer bg-light lter wrapper"` | footer 区域的类名 |
| actionsClassName | `string` | `"panel-footer"` | actions 区域的类名 |
| bodyClassName | `string` | `"panel-body"` | body 区域的类名 |
| title | `string` | | 标题 |
| header | [Container](#container) | | 顶部容器 |
| body | [Container](#container) | | 内容容器 |
| footer | [Container](#container) | | 底部容器 |
| actions | Array Of [Button](#button) | | 按钮区域 |
| 属性名 | 类型 | 默认值 | 说明 |
| ---------------- | ------------------------------ | -------------------------------------- | ------------------- |
| type | `string` | `"panel"` | 指定为 Panel 渲染器 |
| className | `string` | `"panel-default"` | 外层 Dom 的类名 |
| headerClassName | `string` | `"panel-heading"` | header 区域的类名 |
| footerClassName | `string` | `"panel-footer bg-light lter wrapper"` | footer 区域的类名 |
| actionsClassName | `string` | `"panel-footer"` | actions 区域的类名 |
| bodyClassName | `string` | `"panel-body"` | body 区域的类名 |
| title | `string` | | 标题 |
| header | [Container](#container) | | 顶部容器 |
| body | [Container](#container) | | 内容容器 |
| footer | [Container](#container) | | 底部容器 |
| actions | Array Of [Button](./Button.md) | | 按钮区域 |
```schema:height="300" scope="body"
{

2
docs/renderers/Static.md
View File

@ -31,7 +31,7 @@
- `type` 请设置成 `static-tpl`、`static-plain`、`static-json`、`static-date`、`static-datetime`、`static-time`、`static-mapping`、`static-image`、`static-progress`、`static-status`或者`static-switch`
纯用来展示数据的，用法跟 crud 里面的[Column](#column)一样, 且支持 quickEdit 和 popOver 功能。
纯用来展示数据的，用法跟 crud 里面的[Column](.Column.md)一样, 且支持 quickEdit 和 popOver 功能。
```schema:height="250" scope="form-item"
{

28
docs/renderers/Table.md
View File

@ -2,20 +2,20 @@
表格展示。
| 属性名 | 类型 | 默认值 | 说明 |
| ---------------- | -------------------------- | ------------------------ | ------------------------------------------------------- |
| type | `string` | | `"table"` 指定为 table 渲染器 |
| title | `string` | | 标题 |
| source | `string` | `${items}` | 数据源, 绑定当前环境变量 |
| affixHeader | `boolean` | `true` | 是否固定表头 |
| columnsTogglable | `auto` 或者 `boolean` | `auto` | 展示列显示开关, 自动即：列数量大于或等于 5 个时自动开启 |
| placeholder | string | ‘暂无数据’ | 当没数据的时候的文字提示 |
| className | `string` | `panel-default` | 外层 CSS 类名 |
| tableClassName | `string` | `table-db table-striped` | 表格 CSS 类名 |
| headerClassName | `string` | `crud-table-header` | 顶部外层 CSS 类名 |
| footerClassName | `string` | `crud-table-footer` | 底部外层 CSS 类名 |
| toolbarClassName | `string` | `crud-table-toolbar` | 工具栏 CSS 类名 |
| columns | Array of [Column](#column) | | 用来设置列信息 |
| 属性名 | 类型 | 默认值 | 说明 |
| ---------------- | ----------------------------- | ------------------------ | ------------------------------------------------------- |
| type | `string` | | `"table"` 指定为 table 渲染器 |
| title | `string` | | 标题 |
| source | `string` | `${items}` | 数据源, 绑定当前环境变量 |
| affixHeader | `boolean` | `true` | 是否固定表头 |
| columnsTogglable | `auto` 或者 `boolean` | `auto` | 展示列显示开关, 自动即：列数量大于或等于 5 个时自动开启 |
| placeholder | string | ‘暂无数据’ | 当没数据的时候的文字提示 |
| className | `string` | `panel-default` | 外层 CSS 类名 |
| tableClassName | `string` | `table-db table-striped` | 表格 CSS 类名 |
| headerClassName | `string` | `crud-table-header` | 顶部外层 CSS 类名 |
| footerClassName | `string` | `crud-table-footer` | 底部外层 CSS 类名 |
| toolbarClassName | `string` | `crud-table-toolbar` | 工具栏 CSS 类名 |
| columns | Array of [Column](.Column.md) | | 用来设置列信息 |
```schema:height="700" scope="body"
{