mirror of
https://gitee.com/baidu/amis.git
synced 2024-11-29 18:48:45 +08:00
Merge remote-tracking branch 'baidu/master'
This commit is contained in:
2betop
commit
9b2e811b3c
@ -1101,6 +1101,10 @@ echarts 的 config 一般是静态配置的，支持简单的数据映射。如
|
||||
|
||||
### reload
|
||||
|
||||
#### 只做刷新
|
||||
|
||||
重新发送`api`请求，刷新 Chart 时，只配置`componentId`目标组件 ID 即可。
|
||||
|
||||
```schema: scope="body"
|
||||
[
|
||||
{
|
||||
@ -1147,8 +1151,77 @@ echarts 的 config 一般是静态配置的，支持简单的数据映射。如
|
||||
]
|
||||
```
|
||||
|
||||
#### 发送数据并刷新
|
||||
|
||||
刷新 Chart 组件时，如果配置了`data`，将发送`data`给目标组件，并将该数据合并到目标组件的数据域中。
|
||||
|
||||
```schema: scope="body"
|
||||
[
|
||||
{
|
||||
"type": "button",
|
||||
"label": "刷新请求",
|
||||
"onEvent": {
|
||||
"click": {
|
||||
"actions": [
|
||||
{
|
||||
"componentId": "chart01",
|
||||
"actionType": "reload",
|
||||
"data": {
|
||||
"xAxis": [
|
||||
"周一",
|
||||
"周二",
|
||||
"周三",
|
||||
"周四",
|
||||
"周五",
|
||||
"周六"
|
||||
]
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "chart",
|
||||
"id": "chart01",
|
||||
"data": {
|
||||
"xAxis": [
|
||||
"Mon",
|
||||
"Tue",
|
||||
"Wed",
|
||||
"Thu",
|
||||
"Fri",
|
||||
"Sat"
|
||||
]
|
||||
},
|
||||
"api": "/api/mock2/chart/chartData",
|
||||
"config": {
|
||||
"xAxis": {
|
||||
"type": "category",
|
||||
"data": "${xAxis}"
|
||||
},
|
||||
"yAxis": {
|
||||
"type": "value"
|
||||
},
|
||||
"series": [
|
||||
{
|
||||
"data": "${line || []}",
|
||||
"type": "line"
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
]
|
||||
```
|
||||
|
||||
### setValue
|
||||
|
||||
通过`setValue`更新指定图表的数据。
|
||||
|
||||
#### 合并数据
|
||||
|
||||
默认`setValue`会将新数据与目标组件数据进行合并。
|
||||
|
||||
```schema: scope="body"
|
||||
[
|
||||
{
|
||||
@ -1161,7 +1234,9 @@ echarts 的 config 一般是静态配置的，支持简单的数据映射。如
|
||||
"componentId": "chart02",
|
||||
"actionType": "setValue",
|
||||
"args": {
|
||||
"value": {"line":[98,41,51,2,90,40]}
|
||||
"value": {
|
||||
"line":[98,41,51,2,90,40]
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
@ -1171,11 +1246,8 @@ echarts 的 config 一般是静态配置的，支持简单的数据映射。如
|
||||
{
|
||||
"type": "chart",
|
||||
"id": "chart02",
|
||||
"api": "/api/mock2/chart/chartData",
|
||||
"config": {
|
||||
"xAxis": {
|
||||
"type": "category",
|
||||
"data": [
|
||||
"data": {
|
||||
"xAxis": [
|
||||
"Mon",
|
||||
"Tue",
|
||||
"Wed",
|
||||
@ -1183,6 +1255,71 @@ echarts 的 config 一般是静态配置的，支持简单的数据映射。如
|
||||
"Fri",
|
||||
"Sat"
|
||||
]
|
||||
},
|
||||
"api": "/api/mock2/chart/chartData",
|
||||
"config": {
|
||||
"xAxis": {
|
||||
"type": "category",
|
||||
"data": "${xAxis}"
|
||||
},
|
||||
"yAxis": {
|
||||
"type": "value"
|
||||
},
|
||||
"series": [
|
||||
{
|
||||
"data": "${line || []}",
|
||||
"type": "line"
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
]
|
||||
```
|
||||
|
||||
#### 覆盖数据
|
||||
|
||||
可以通过`"dataMergeMode": "override"`来覆盖目标组件数据。
|
||||
|
||||
```schema: scope="body"
|
||||
[
|
||||
{
|
||||
"type": "button",
|
||||
"label": "更新数据",
|
||||
"onEvent": {
|
||||
"click": {
|
||||
"actions": [
|
||||
{
|
||||
"componentId": "chart02",
|
||||
"actionType": "setValue",
|
||||
"args": {
|
||||
"value": {
|
||||
"line":[98,41,51,2,90,40]
|
||||
}
|
||||
},
|
||||
"dataMergeMode": "override"
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "chart",
|
||||
"id": "chart02",
|
||||
"data": {
|
||||
"xAxis": [
|
||||
"Mon",
|
||||
"Tue",
|
||||
"Wed",
|
||||
"Thu",
|
||||
"Fri",
|
||||
"Sat"
|
||||
]
|
||||
},
|
||||
"api": "/api/mock2/chart/chartData",
|
||||
"config": {
|
||||
"xAxis": {
|
||||
"type": "category",
|
||||
"data": "${xAxis}"
|
||||
},
|
||||
"yAxis": {
|
||||
"type": "value"
|
||||
|
||||
@ -4269,102 +4269,236 @@ value 结构说明：
|
||||
|
||||
### setValue
|
||||
|
||||
通过`setValue`更新指定CRUD的数据。
|
||||
|
||||
#### 合并数据
|
||||
|
||||
默认`setValue`会将新数据与目标组件数据进行合并。
|
||||
|
||||
```schema: scope="body"
|
||||
[
|
||||
{
|
||||
"type": "button",
|
||||
"label": "更新数据，记录总数被更新为20",
|
||||
"onEvent": {
|
||||
"click": {
|
||||
"actions": [
|
||||
{
|
||||
"actionType": "setValue",
|
||||
"componentId": "crud_setvalue",
|
||||
"args": {
|
||||
"value": {
|
||||
"count": 20
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "crud",
|
||||
"id": "crud_setvalue",
|
||||
"syncLocation": false,
|
||||
"api": "/api/mock2/sample",
|
||||
"quickSaveApi": "/api/mock2/sample/bulkUpdate",
|
||||
"headerToolbar": [
|
||||
{
|
||||
"type": "tpl",
|
||||
"tpl": "记录总数：${count}"
|
||||
}
|
||||
],
|
||||
"columns": [
|
||||
{
|
||||
"name": "id",
|
||||
"label": "ID",
|
||||
"id": "u:3db3f2b1b99e"
|
||||
},
|
||||
{
|
||||
"name": "engine",
|
||||
"label": "engine",
|
||||
"id": "u:0b9be99f3403"
|
||||
},
|
||||
{
|
||||
"name": "version",
|
||||
"label": "version",
|
||||
"id": "u:4868d7db0139"
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
```
|
||||
|
||||
#### 覆盖数据
|
||||
|
||||
可以通过`"dataMergeMode": "override"`来覆盖目标组件数据。
|
||||
|
||||
```schema: scope="body"
|
||||
[
|
||||
{
|
||||
"type": "button",
|
||||
"label": "更新数据，列表记录更新为两条，记录总数被删除",
|
||||
"onEvent": {
|
||||
"click": {
|
||||
"actions": [
|
||||
{
|
||||
"actionType": "setValue",
|
||||
"componentId": "crud_setvalue",
|
||||
"args": {
|
||||
"value": {
|
||||
"items": [
|
||||
{
|
||||
"engine": "Trident - f12fj",
|
||||
"browser": "Internet Explorer 4.0",
|
||||
"platform": "Win 95+",
|
||||
"version": "4",
|
||||
"grade": "X",
|
||||
"badgeText": "默认",
|
||||
"id": 1
|
||||
},
|
||||
{
|
||||
"engine": "Trident - oqvc0e",
|
||||
"browser": "Internet Explorer 5.0",
|
||||
"platform": "Win 95+",
|
||||
"version": "5",
|
||||
"grade": "C",
|
||||
"badgeText": "危险",
|
||||
"id": 2
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
"dataMergeMode": "override"
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "crud",
|
||||
"id": "crud_setvalue",
|
||||
"syncLocation": false,
|
||||
"api": "/api/mock2/sample",
|
||||
"quickSaveApi": "/api/mock2/sample/bulkUpdate",
|
||||
"headerToolbar": [
|
||||
{
|
||||
"type": "tpl",
|
||||
"tpl": "记录总数：${count}"
|
||||
}
|
||||
],
|
||||
"columns": [
|
||||
{
|
||||
"name": "id",
|
||||
"label": "ID",
|
||||
"id": "u:3db3f2b1b99e"
|
||||
},
|
||||
{
|
||||
"name": "engine",
|
||||
"label": "engine",
|
||||
"id": "u:0b9be99f3403"
|
||||
},
|
||||
{
|
||||
"name": "version",
|
||||
"label": "version",
|
||||
"id": "u:4868d7db0139"
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
```
|
||||
#### 更新列表记录
|
||||
|
||||
```schema: scope="body"
|
||||
{
|
||||
"type": "crud",
|
||||
"id": "crud_setvalue",
|
||||
"syncLocation": false,
|
||||
"api": "/api/mock2/sample",
|
||||
"quickSaveApi": "/api/mock2/sample/bulkUpdate",
|
||||
"headerToolbar": [
|
||||
{
|
||||
"type": "button",
|
||||
"label": "更新列表记录",
|
||||
"onEvent": {
|
||||
"click": {
|
||||
"actions": [
|
||||
[
|
||||
{
|
||||
"type": "button",
|
||||
"label": "更新列表记录",
|
||||
"onEvent": {
|
||||
"click": {
|
||||
"actions": [
|
||||
{
|
||||
"actionType": "setValue",
|
||||
"componentId": "crud_setvalue",
|
||||
"args": {
|
||||
"value": {
|
||||
"count": 2,
|
||||
"items": [
|
||||
{
|
||||
"actionType": "setValue",
|
||||
"componentId": "crud_setvalue",
|
||||
"args": {
|
||||
"value": {
|
||||
"total": 2,
|
||||
"items": [
|
||||
{
|
||||
"engine": "Trident - f12fj",
|
||||
"browser": "Internet Explorer 4.0",
|
||||
"platform": "Win 95+",
|
||||
"version": "4",
|
||||
"grade": "X",
|
||||
"badgeText": "默认",
|
||||
"id": 1
|
||||
},
|
||||
{
|
||||
"engine": "Trident - oqvc0e",
|
||||
"browser": "Internet Explorer 5.0",
|
||||
"platform": "Win 95+",
|
||||
"version": "5",
|
||||
"grade": "C",
|
||||
"badgeText": "危险",
|
||||
"id": 2
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
{
|
||||
"type": "button",
|
||||
"label": "清空数据",
|
||||
"onEvent": {
|
||||
"click": {
|
||||
"actions": [
|
||||
"engine": "Trident - f12fj",
|
||||
"browser": "Internet Explorer 4.0",
|
||||
"platform": "Win 95+",
|
||||
"version": "4",
|
||||
"grade": "X",
|
||||
"badgeText": "默认",
|
||||
"id": 1
|
||||
},
|
||||
{
|
||||
"actionType": "setValue",
|
||||
"componentId": "crud_setvalue",
|
||||
"args": {
|
||||
"value": {
|
||||
"items": []
|
||||
}
|
||||
}
|
||||
"engine": "Trident - oqvc0e",
|
||||
"browser": "Internet Explorer 5.0",
|
||||
"platform": "Win 95+",
|
||||
"version": "5",
|
||||
"grade": "C",
|
||||
"badgeText": "危险",
|
||||
"id": 2
|
||||
}
|
||||
]
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
],
|
||||
"bulkActions": [
|
||||
{
|
||||
"label": "批量删除",
|
||||
"actionType": "ajax",
|
||||
"api": "delete:/api/mock2/sample/${ids|raw}",
|
||||
"confirmText": "确定要批量删除?"
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "button",
|
||||
"label": "清空数据",
|
||||
"onEvent": {
|
||||
"click": {
|
||||
"actions": [
|
||||
{
|
||||
"actionType": "setValue",
|
||||
"componentId": "crud_setvalue",
|
||||
"args": {
|
||||
"value": {
|
||||
"items": []
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
],
|
||||
"columns": [
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "crud",
|
||||
"id": "crud_setvalue",
|
||||
"syncLocation": false,
|
||||
"api": "/api/mock2/sample",
|
||||
"quickSaveApi": "/api/mock2/sample/bulkUpdate",
|
||||
"headerToolbar": [
|
||||
{
|
||||
"name": "id",
|
||||
"label": "ID",
|
||||
"id": "u:3db3f2b1b99e"
|
||||
"type": "tpl",
|
||||
"tpl": "记录总数：${count}"
|
||||
}
|
||||
],
|
||||
"columns": [
|
||||
{
|
||||
"name": "id",
|
||||
"label": "ID",
|
||||
"id": "u:3db3f2b1b99e"
|
||||
},
|
||||
{
|
||||
"name": "engine",
|
||||
"label": "engine",
|
||||
"id": "u:0b9be99f3403"
|
||||
"name": "engine",
|
||||
"label": "engine",
|
||||
"id": "u:0b9be99f3403"
|
||||
},
|
||||
{
|
||||
"name": "version",
|
||||
"label": "version",
|
||||
"id": "u:4868d7db0139"
|
||||
"name": "version",
|
||||
"label": "version",
|
||||
"id": "u:4868d7db0139"
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
```
|
||||
|
||||
#### 行记录中字段赋值
|
||||
|
||||
@ -1020,3 +1020,265 @@ feedback 反馈弹框是指，在 ajax 请求后，可以显示一个弹框，
|
||||
| confirm | - | 确认（提交） |
|
||||
| cancel | - | 取消（关闭） |
|
||||
| setValue | `value: object` 更新的数据 | 更新数据 |
|
||||
|
||||
### confirm 动作
|
||||
|
||||
```schema: scope="body"
|
||||
{
|
||||
"type": "button",
|
||||
"label": "弹个表单",
|
||||
"actionType": "dialog",
|
||||
"dialog": {
|
||||
"title": "在弹框中的表单",
|
||||
"id": "dialog_confirm",
|
||||
"body": {
|
||||
"type": "form",
|
||||
"api": "/api/mock2/form/saveForm?waitSeconds=2",
|
||||
"body": [
|
||||
{
|
||||
"type": "input-text",
|
||||
"name": "username",
|
||||
"required": true,
|
||||
"placeholder": "请输入用户名",
|
||||
"label": "用户名"
|
||||
},
|
||||
{
|
||||
"type": "input-password",
|
||||
"name": "password",
|
||||
"label": "密码",
|
||||
"required": true,
|
||||
"placeholder": "请输入密码"
|
||||
},
|
||||
{
|
||||
"type": "checkbox",
|
||||
"name": "rememberMe",
|
||||
"label": "记住登录"
|
||||
}
|
||||
]
|
||||
},
|
||||
"actions": [
|
||||
{
|
||||
"type": "button",
|
||||
"label": "触发确认",
|
||||
"onEvent": {
|
||||
"click": {
|
||||
"actions": [
|
||||
{
|
||||
"actionType": "confirm",
|
||||
"componentId": "dialog_confirm"
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
### cancel 动作
|
||||
|
||||
```schema: scope="body"
|
||||
{
|
||||
"type": "button",
|
||||
"label": "弹个表单",
|
||||
"actionType": "dialog",
|
||||
"dialog": {
|
||||
"title": "在弹框中的表单",
|
||||
"id": "dialog_cancel",
|
||||
"body": {
|
||||
"type": "form",
|
||||
"api": "/api/mock2/form/saveForm?waitSeconds=2",
|
||||
"body": [
|
||||
{
|
||||
"type": "input-text",
|
||||
"name": "username",
|
||||
"required": true,
|
||||
"placeholder": "请输入用户名",
|
||||
"label": "用户名"
|
||||
},
|
||||
{
|
||||
"type": "input-password",
|
||||
"name": "password",
|
||||
"label": "密码",
|
||||
"required": true,
|
||||
"placeholder": "请输入密码"
|
||||
},
|
||||
{
|
||||
"type": "checkbox",
|
||||
"name": "rememberMe",
|
||||
"label": "记住登录"
|
||||
}
|
||||
]
|
||||
},
|
||||
"actions": [
|
||||
{
|
||||
"type": "button",
|
||||
"label": "触发取消",
|
||||
"onEvent": {
|
||||
"click": {
|
||||
"actions": [
|
||||
{
|
||||
"actionType": "cancel",
|
||||
"componentId": "dialog_cancel"
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
### setValue 动作
|
||||
|
||||
通过`setValue`更新指定弹窗的数据。
|
||||
|
||||
#### 合并数据
|
||||
|
||||
默认`setValue`会将新数据与目标组件数据进行合并。
|
||||
|
||||
```schema: scope="body"
|
||||
{
|
||||
"type": "button",
|
||||
"label": "弹个表单",
|
||||
"actionType": "dialog",
|
||||
"dialog": {
|
||||
"title": "在弹框中的表单",
|
||||
"id": "dialog_setvalue",
|
||||
"data": {
|
||||
"username": "amis",
|
||||
"password": "amis@baidu.com"
|
||||
},
|
||||
"body": [
|
||||
{
|
||||
"type": "alert",
|
||||
"body": "初始化时，弹窗的数据data为{username: 'amis', password: 'fex'}，表单内或者表单外都可以读取这些数据，当点击【更新弹窗数据】按钮后，弹窗的数据被更新为{username: 'aisuda', password: 'aisuda@baidu.com'}"
|
||||
},
|
||||
{
|
||||
"type": "input-text",
|
||||
"label": "表单外的密码",
|
||||
"name": "password"
|
||||
},
|
||||
{
|
||||
"type": "form",
|
||||
"debug": true,
|
||||
"api": "/api/mock2/form/saveForm?waitSeconds=2",
|
||||
"body": [
|
||||
{
|
||||
"type": "input-text",
|
||||
"name": "username",
|
||||
"required": true,
|
||||
"placeholder": "请输入用户名",
|
||||
"label": "用户名"
|
||||
},
|
||||
{
|
||||
"type": "input-password",
|
||||
"name": "password",
|
||||
"label": "密码",
|
||||
"required": true,
|
||||
"placeholder": "请输入密码"
|
||||
}
|
||||
]
|
||||
}
|
||||
],
|
||||
"actions": [
|
||||
{
|
||||
"type": "button",
|
||||
"label": "更新弹窗数据",
|
||||
"onEvent": {
|
||||
"click": {
|
||||
"actions": [
|
||||
{
|
||||
"actionType": "setValue",
|
||||
"componentId": "dialog_setvalue",
|
||||
"args": {
|
||||
"value": {
|
||||
"username": "aisuda",
|
||||
"password": "aisuda@baidu.com"
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
#### 覆盖数据
|
||||
|
||||
可以通过`"dataMergeMode": "override"`来覆盖目标组件数据。
|
||||
|
||||
```schema: scope="body"
|
||||
{
|
||||
"type": "button",
|
||||
"label": "弹个表单",
|
||||
"actionType": "dialog",
|
||||
"dialog": {
|
||||
"title": "在弹框中的表单",
|
||||
"id": "dialog_setvalue2",
|
||||
"data": {
|
||||
"username": "amis",
|
||||
"password": "amis@baidu.com"
|
||||
},
|
||||
"body": [
|
||||
{
|
||||
"type": "alert",
|
||||
"body": "初始化时，弹窗的数据data为{username: 'amis', password: 'fex'}，表单内或者表单外都可以读取这些数据，当点击【更新弹窗数据】按钮后，弹窗的数据被更新为{username: 'aisuda'}，即password将被删除"
|
||||
},
|
||||
{
|
||||
"type": "input-text",
|
||||
"label": "表单外的密码",
|
||||
"name": "password"
|
||||
},
|
||||
{
|
||||
"type": "form",
|
||||
"debug": true,
|
||||
"api": "/api/mock2/form/saveForm?waitSeconds=2",
|
||||
"body": [
|
||||
{
|
||||
"type": "input-text",
|
||||
"name": "username",
|
||||
"required": true,
|
||||
"placeholder": "请输入用户名",
|
||||
"label": "用户名"
|
||||
},
|
||||
{
|
||||
"type": "input-password",
|
||||
"name": "password",
|
||||
"label": "密码",
|
||||
"required": true,
|
||||
"placeholder": "请输入密码"
|
||||
}
|
||||
]
|
||||
}
|
||||
],
|
||||
"actions": [
|
||||
{
|
||||
"type": "button",
|
||||
"label": "更新弹窗数据",
|
||||
"onEvent": {
|
||||
"click": {
|
||||
"actions": [
|
||||
{
|
||||
"actionType": "setValue",
|
||||
"componentId": "dialog_setvalue2",
|
||||
"args": {
|
||||
"value": {
|
||||
"username": "aisuda"
|
||||
}
|
||||
},
|
||||
"dataMergeMode": "override"
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
@ -550,3 +550,265 @@ order: 43
|
||||
| confirm | - | 确认（提交） |
|
||||
| cancel | - | 取消（关闭） |
|
||||
| setValue | `value: object` 更新的数据 | 更新数据 |
|
||||
|
||||
### confirm 动作
|
||||
|
||||
```schema: scope="body"
|
||||
{
|
||||
"type": "button",
|
||||
"label": "弹个表单",
|
||||
"actionType": "drawer",
|
||||
"drawer": {
|
||||
"title": "在弹框中的表单",
|
||||
"id": "drawer_confirm",
|
||||
"body": {
|
||||
"type": "form",
|
||||
"api": "/api/mock2/form/saveForm?waitSeconds=2",
|
||||
"body": [
|
||||
{
|
||||
"type": "input-text",
|
||||
"name": "username",
|
||||
"required": true,
|
||||
"placeholder": "请输入用户名",
|
||||
"label": "用户名"
|
||||
},
|
||||
{
|
||||
"type": "input-password",
|
||||
"name": "password",
|
||||
"label": "密码",
|
||||
"required": true,
|
||||
"placeholder": "请输入密码"
|
||||
},
|
||||
{
|
||||
"type": "checkbox",
|
||||
"name": "rememberMe",
|
||||
"label": "记住登录"
|
||||
}
|
||||
]
|
||||
},
|
||||
"actions": [
|
||||
{
|
||||
"type": "button",
|
||||
"label": "触发确认",
|
||||
"onEvent": {
|
||||
"click": {
|
||||
"actions": [
|
||||
{
|
||||
"actionType": "confirm",
|
||||
"componentId": "drawer_confirm"
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
### cancel 动作
|
||||
|
||||
```schema: scope="body"
|
||||
{
|
||||
"type": "button",
|
||||
"label": "弹个表单",
|
||||
"actionType": "drawer",
|
||||
"drawer": {
|
||||
"title": "在弹框中的表单",
|
||||
"id": "drawer_cancel",
|
||||
"body": {
|
||||
"type": "form",
|
||||
"api": "/api/mock2/form/saveForm?waitSeconds=2",
|
||||
"body": [
|
||||
{
|
||||
"type": "input-text",
|
||||
"name": "username",
|
||||
"required": true,
|
||||
"placeholder": "请输入用户名",
|
||||
"label": "用户名"
|
||||
},
|
||||
{
|
||||
"type": "input-password",
|
||||
"name": "password",
|
||||
"label": "密码",
|
||||
"required": true,
|
||||
"placeholder": "请输入密码"
|
||||
},
|
||||
{
|
||||
"type": "checkbox",
|
||||
"name": "rememberMe",
|
||||
"label": "记住登录"
|
||||
}
|
||||
]
|
||||
},
|
||||
"actions": [
|
||||
{
|
||||
"type": "button",
|
||||
"label": "触发取消",
|
||||
"onEvent": {
|
||||
"click": {
|
||||
"actions": [
|
||||
{
|
||||
"actionType": "cancel",
|
||||
"componentId": "drawer_cancel"
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
### setValue 动作
|
||||
|
||||
通过`setValue`更新指定弹窗的数据。
|
||||
|
||||
#### 合并数据
|
||||
|
||||
默认`setValue`会将新数据与目标组件数据进行合并。
|
||||
|
||||
```schema: scope="body"
|
||||
{
|
||||
"type": "button",
|
||||
"label": "弹个表单",
|
||||
"actionType": "drawer",
|
||||
"drawer": {
|
||||
"title": "在弹框中的表单",
|
||||
"id": "drawer_setvalue",
|
||||
"data": {
|
||||
"username": "amis",
|
||||
"password": "amis@baidu.com"
|
||||
},
|
||||
"body": [
|
||||
{
|
||||
"type": "alert",
|
||||
"body": "初始化时，弹窗的数据data为{username: 'amis', password: 'fex'}，表单内或者表单外都可以读取这些数据，当点击【更新弹窗数据】按钮后，弹窗的数据被更新为{username: 'aisuda', password: 'aisuda@baidu.com'}"
|
||||
},
|
||||
{
|
||||
"type": "input-text",
|
||||
"label": "表单外的密码",
|
||||
"name": "password"
|
||||
},
|
||||
{
|
||||
"type": "form",
|
||||
"debug": true,
|
||||
"api": "/api/mock2/form/saveForm?waitSeconds=2",
|
||||
"body": [
|
||||
{
|
||||
"type": "input-text",
|
||||
"name": "username",
|
||||
"required": true,
|
||||
"placeholder": "请输入用户名",
|
||||
"label": "用户名"
|
||||
},
|
||||
{
|
||||
"type": "input-password",
|
||||
"name": "password",
|
||||
"label": "密码",
|
||||
"required": true,
|
||||
"placeholder": "请输入密码"
|
||||
}
|
||||
]
|
||||
}
|
||||
],
|
||||
"actions": [
|
||||
{
|
||||
"type": "button",
|
||||
"label": "更新弹窗数据",
|
||||
"onEvent": {
|
||||
"click": {
|
||||
"actions": [
|
||||
{
|
||||
"actionType": "setValue",
|
||||
"componentId": "drawer_setvalue",
|
||||
"args": {
|
||||
"value": {
|
||||
"username": "aisuda",
|
||||
"password": "aisuda@baidu.com"
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
#### 覆盖数据
|
||||
|
||||
可以通过`"dataMergeMode": "override"`来覆盖目标组件数据。
|
||||
|
||||
```schema: scope="body"
|
||||
{
|
||||
"type": "button",
|
||||
"label": "弹个表单",
|
||||
"actionType": "drawer",
|
||||
"drawer": {
|
||||
"title": "在弹框中的表单",
|
||||
"id": "drawer_setvalue2",
|
||||
"data": {
|
||||
"username": "amis",
|
||||
"password": "amis@baidu.com"
|
||||
},
|
||||
"body": [
|
||||
{
|
||||
"type": "alert",
|
||||
"body": "初始化时，弹窗的数据data为{username: 'amis', password: 'fex'}，表单内或者表单外都可以读取这些数据，当点击【更新弹窗数据】按钮后，弹窗的数据被更新为{username: 'aisuda'}，即password将被删除"
|
||||
},
|
||||
{
|
||||
"type": "input-text",
|
||||
"label": "表单外的密码",
|
||||
"name": "password"
|
||||
},
|
||||
{
|
||||
"type": "form",
|
||||
"debug": true,
|
||||
"api": "/api/mock2/form/saveForm?waitSeconds=2",
|
||||
"body": [
|
||||
{
|
||||
"type": "input-text",
|
||||
"name": "username",
|
||||
"required": true,
|
||||
"placeholder": "请输入用户名",
|
||||
"label": "用户名"
|
||||
},
|
||||
{
|
||||
"type": "input-password",
|
||||
"name": "password",
|
||||
"label": "密码",
|
||||
"required": true,
|
||||
"placeholder": "请输入密码"
|
||||
}
|
||||
]
|
||||
}
|
||||
],
|
||||
"actions": [
|
||||
{
|
||||
"type": "button",
|
||||
"label": "更新弹窗数据",
|
||||
"onEvent": {
|
||||
"click": {
|
||||
"actions": [
|
||||
{
|
||||
"actionType": "setValue",
|
||||
"componentId": "drawer_setvalue2",
|
||||
"args": {
|
||||
"value": {
|
||||
"username": "aisuda"
|
||||
}
|
||||
},
|
||||
"dataMergeMode": "override"
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
@ -1645,7 +1645,11 @@ Form 支持轮询初始化接口，步骤如下：
|
||||
|
||||
### setValue
|
||||
|
||||
通过`setValue`来更新表单数据，其中`value`中的数据将和目标表单的数据做合并，即同名覆盖。
|
||||
通过`setValue`更新指定表单的数据。
|
||||
|
||||
#### 合并数据
|
||||
|
||||
默认`setValue`会将新数据与目标组件数据进行合并。
|
||||
|
||||
```schema: scope="body"
|
||||
[
|
||||
@ -1661,8 +1665,8 @@ Form 支持轮询初始化接口，步骤如下：
|
||||
"componentId": "form_setvalue",
|
||||
"args": {
|
||||
"value": {
|
||||
"name": "amis",
|
||||
"email": "amis@baidu.com"
|
||||
"name": "aisuda",
|
||||
"email": "aisuda@baidu.com"
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -1673,6 +1677,60 @@ Form 支持轮询初始化接口，步骤如下：
|
||||
{
|
||||
"type": "form",
|
||||
"id": "form_setvalue",
|
||||
"data": {
|
||||
"name": "amis",
|
||||
"email": "amis@baidu.com"
|
||||
},
|
||||
"body": [
|
||||
{
|
||||
"type": "input-text",
|
||||
"name": "name",
|
||||
"label": "姓名："
|
||||
},
|
||||
{
|
||||
"name": "email",
|
||||
"type": "input-text",
|
||||
"label": "邮箱："
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
```
|
||||
|
||||
#### 覆盖数据
|
||||
|
||||
可以通过`"dateMergeMode": "override"`来覆盖目标组件数据。
|
||||
|
||||
```schema: scope="body"
|
||||
[
|
||||
{
|
||||
"type": "button",
|
||||
"label": "修改表单数据",
|
||||
className: "mb-2",
|
||||
"onEvent": {
|
||||
"click": {
|
||||
"actions": [
|
||||
{
|
||||
"actionType": "setValue",
|
||||
"componentId": "form_setvalue",
|
||||
"args": {
|
||||
"value": {
|
||||
"name": "aisuda"
|
||||
}
|
||||
},
|
||||
"dataMergeMode": "override"
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "form",
|
||||
"id": "form_setvalue",
|
||||
"data": {
|
||||
"name": "amis",
|
||||
"email": "amis@baidu.com"
|
||||
},
|
||||
"body": [
|
||||
{
|
||||
"type": "input-text",
|
||||
|
||||
@ -413,6 +413,12 @@ Page 默认将页面分为几个区域，分别是**内容区（`body`）**、**
|
||||
|
||||
### setValue
|
||||
|
||||
通过`setValue`更新指定页面组件的数据。
|
||||
|
||||
#### 合并数据
|
||||
|
||||
默认`setValue`会将新数据与目标组件数据进行合并。
|
||||
|
||||
```schema
|
||||
{
|
||||
"type": "page",
|
||||
@ -439,7 +445,44 @@ Page 默认将页面分为几个区域，分别是**内容区（`body`）**、**
|
||||
},
|
||||
{
|
||||
"type": "tpl",
|
||||
"tpl": "当前时间是：${date}"
|
||||
"tpl": "标题：${title} 当前时间是：${date}"
|
||||
}
|
||||
]
|
||||
}
|
||||
```
|
||||
|
||||
#### 覆盖数据
|
||||
|
||||
可以通过`"dataMergeMode": "override"`来覆盖目标组件数据。
|
||||
|
||||
```schema
|
||||
{
|
||||
"type": "page",
|
||||
"id": "page02",
|
||||
"initApi": "/api/mock2/page/initData",
|
||||
"body": [
|
||||
{
|
||||
"type": "button",
|
||||
"label": "更新数据",
|
||||
"className": "mb-2",
|
||||
"onEvent": {
|
||||
"click": {
|
||||
"actions": [
|
||||
{
|
||||
"componentId": "page02",
|
||||
"actionType": "setValue",
|
||||
"args": {
|
||||
"value": {"date": "2023-05-01"}
|
||||
},
|
||||
"dataMergeMode": "override"
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "tpl",
|
||||
"tpl": "标题：${title|default:'-'} 当前时间是：${date}"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
@ -997,7 +997,11 @@ schemaApi 接口请求完成。
|
||||
|
||||
### setValue
|
||||
|
||||
更新数据域。
|
||||
通过`setValue`更新指定 Service 的数据。
|
||||
|
||||
#### 合并数据
|
||||
|
||||
默认`setValue`会将新数据与目标组件数据进行合并。
|
||||
|
||||
```schema: scope="body"
|
||||
[
|
||||
@ -1012,9 +1016,8 @@ schemaApi 接口请求完成。
|
||||
"componentId": "service-setvalue",
|
||||
"args": {
|
||||
"value": {
|
||||
"language": [
|
||||
"🇨🇳 中国"
|
||||
]
|
||||
"name": "aisuda",
|
||||
"email": "aisuda@baidu.com"
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -1027,18 +1030,59 @@ schemaApi 接口请求完成。
|
||||
"id": "service-setvalue",
|
||||
"name": "service-setvalue",
|
||||
"data": {
|
||||
"language": [
|
||||
"🇺🇸 美国"
|
||||
]
|
||||
"name": "amis",
|
||||
"email": "amis@baidu.com"
|
||||
},
|
||||
"body": {
|
||||
"type": "each",
|
||||
"name": "language",
|
||||
"items": {
|
||||
"body": [
|
||||
{
|
||||
"type": "tpl",
|
||||
"tpl": "<span class='label label-default m-l-sm'><%= data.item %></span> "
|
||||
"tpl": "名字：${name|default:'-'}，邮箱：${email|default:'-'}"
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
```
|
||||
|
||||
#### 覆盖数据
|
||||
|
||||
可以通过`"dataMergeMode": "override"`来覆盖目标组件数据。
|
||||
|
||||
```schema: scope="body"
|
||||
[
|
||||
{
|
||||
"type": "button",
|
||||
"label": "更新数据",
|
||||
"onEvent": {
|
||||
"click": {
|
||||
"actions": [
|
||||
{
|
||||
"actionType": "setValue",
|
||||
"componentId": "service-setvalue",
|
||||
"args": {
|
||||
"value": {
|
||||
"name": "aisuda"
|
||||
}
|
||||
},
|
||||
"dataMergeMode": "override"
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "service",
|
||||
"id": "service-setvalue",
|
||||
"name": "service-setvalue",
|
||||
"data": {
|
||||
"name": "amis",
|
||||
"email": "amis@baidu.com"
|
||||
},
|
||||
"body": [
|
||||
{
|
||||
"type": "tpl",
|
||||
"tpl": "名字：${name|default:'-'}，邮箱：${email|default:'-'}"
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
```
|
||||
|
||||
@ -2077,7 +2077,7 @@ export class FormRenderer extends Form {
|
||||
|
||||
setData(values: object, replace?: boolean) {
|
||||
const {onChange, store} = this.props;
|
||||
super.setValues(values);
|
||||
super.setValues(values, replace);
|
||||
// 触发表单change
|
||||
onChange &&
|
||||
onChange(store.data, difference(store.data, store.pristine), this.props);
|
||||
|
||||
@ -639,7 +639,7 @@ export class ChartRenderer extends Chart {
|
||||
const {store} = this.props;
|
||||
store.updateData(values, undefined, replace);
|
||||
// 重新渲染
|
||||
this.renderChart(this.props.config, values);
|
||||
this.renderChart(this.props.config, store.data);
|
||||
}
|
||||
|
||||
getData() {
|
||||
|
||||
@ -1065,8 +1065,8 @@ export class DialogRenderer extends Dialog {
|
||||
scoped.close(target);
|
||||
}
|
||||
|
||||
setData(values: object) {
|
||||
return this.props.store.updateData(values);
|
||||
setData(values: object, replace?: boolean) {
|
||||
return this.props.store.updateData(values, undefined, replace);
|
||||
}
|
||||
|
||||
getData() {
|
||||
|
||||
@ -979,8 +979,8 @@ export class DrawerRenderer extends Drawer {
|
||||
scoped.close(target);
|
||||
}
|
||||
|
||||
setData(values: object) {
|
||||
return this.props.store.updateData(values);
|
||||
setData(values: object, replace?: boolean) {
|
||||
return this.props.store.updateData(values, undefined, replace);
|
||||
}
|
||||
|
||||
getData() {
|
||||
|
||||
@ -680,6 +680,7 @@ export default class TextControl extends React.PureComponent<
|
||||
creatable,
|
||||
borderMode,
|
||||
showCounter,
|
||||
data,
|
||||
maxLength,
|
||||
minLength,
|
||||
translate: __,
|
||||
@ -733,6 +734,8 @@ export default class TextControl extends React.PureComponent<
|
||||
});
|
||||
}
|
||||
|
||||
const filteredPlaceholder = filter(placeholder, data);
|
||||
|
||||
return (
|
||||
<div
|
||||
className={cx(
|
||||
@ -749,12 +752,12 @@ export default class TextControl extends React.PureComponent<
|
||||
onClick={this.handleClick}
|
||||
>
|
||||
<>
|
||||
{placeholder &&
|
||||
{filteredPlaceholder &&
|
||||
!selectedOptions.length &&
|
||||
!this.state.inputValue &&
|
||||
!this.state.isFocused ? (
|
||||
<div className={cx('TextControl-placeholder')}>
|
||||
{placeholder}
|
||||
{filteredPlaceholder}
|
||||
</div>
|
||||
) : null}
|
||||
|
||||
@ -938,7 +941,7 @@ export default class TextControl extends React.PureComponent<
|
||||
) : null}
|
||||
<Input
|
||||
name={name}
|
||||
placeholder={placeholder}
|
||||
placeholder={filter(placeholder, data)}
|
||||
ref={this.inputRef}
|
||||
disabled={disabled}
|
||||
readOnly={readOnly}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user