feat:form刷新支持inited事件&增加asyncApiFinished事件

This commit is contained in:
lvxiaojiao 2023-05-21 17:42:06 +08:00
parent 11d6c6e1de
commit 94c709614f
2 changed files with 43 additions and 19 deletions

View File

@ -989,7 +989,7 @@ Form 支持轮询初始化接口,步骤如下:
```schema: scope="body"
{
"type": "form",
"initApi": "/api/mock2/page/initData",
"api": "/api/mock2/form/saveForm",
"asyncApi": "/api/mock2/page/initData",
"title": "用户信息",
"body": [
@ -1462,6 +1462,7 @@ Form 支持轮询初始化接口,步骤如下:
| submit | `event.data: object` 当前表单数据 | 点击提交按钮或者触发表单提交动作的时候触发,配置了该事件后将不会触发表单提交时的校验、提交到 api 或者 target 等行为,所有行为需要自己配置 |
| submitSucc | `event.data.result: object` api 远程请求成功后返回的结果数据 | 提交成功时触发 |
| submitFail | `event.data.error: object` api 远程请求失败后返回的错误信息 | 提交失败时触发 |
| asyncApiFinished | `[name]: any` 当前数据域中指定字段的值 | asyncApi 远程请求轮训结束 |
## 动作表

View File

@ -491,6 +491,7 @@ export default class Form extends React.Component<FormProps, object> {
this.reload = this.reload.bind(this);
this.silentReload = this.silentReload.bind(this);
this.initInterval = this.initInterval.bind(this);
this.dispatchInited = this.dispatchInited.bind(this);
this.blockRouting = this.blockRouting.bind(this);
this.beforePageUnload = this.beforePageUnload.bind(this);
@ -604,6 +605,7 @@ export default class Form extends React.Component<FormProps, object> {
);
}
})
.then(this.dispatchInited)
.then(this.initInterval)
.then(this.onInit);
} else {
@ -637,7 +639,9 @@ export default class Form extends React.Component<FormProps, object> {
successMessage: fetchSuccess,
errorMessage: fetchFailed
}
).then(this.initInterval);
)
.then(this.dispatchInited)
.then(this.initInterval);
}
}
@ -653,6 +657,27 @@ export default class Form extends React.Component<FormProps, object> {
this.unBlockRouting?.();
}
async dispatchInited(value: any) {
const {data, store, dispatchEvent} = this.props;
if (store.fetching) {
return;
}
// 派发init事件参数为初始化数据
await dispatchEvent(
'inited',
createObject(data, {
...value?.data, // 保留,兼容历史
responseData: value?.data ?? {},
responseStatus: store.error ? 1 : 0,
responseMsg: store.msg
})
);
return value;
}
blockRouting(): any {
const store = this.props.store;
const {promptPageLeaveMessage, promptPageLeave} = this.props;
@ -708,19 +733,7 @@ export default class Form extends React.Component<FormProps, object> {
data = cloneObject(store.data);
}
// 派发init事件参数为初始化数据
const dispatcher = await dispatchEvent(
'inited',
createObject(this.props.data, {
...data, // 保留,兼容历史
responseData: data ?? {},
responseStatus: store.error ? 1 : 0,
responseMsg: store.msg
})
);
if (!dispatcher?.prevented) {
onInit && onInit(data, this.props);
}
onInit && onInit(data, this.props);
submitOnInit &&
this.handleAction(
undefined,
@ -770,7 +783,10 @@ export default class Form extends React.Component<FormProps, object> {
);
}
})
.then((result: Payload) => {
.then(async (result: Payload) => {
// 派发初始化接口请求完成事件
await this.dispatchInited(result);
if (result?.ok) {
this.initInterval(result);
store.reset(undefined, false);
@ -1112,7 +1128,6 @@ export default class Form extends React.Component<FormProps, object> {
store.openDrawer(data);
} else if (isEffectiveApi(action.api || api, values)) {
let finnalAsyncApi = action.asyncApi || asyncApi;
isEffectiveApi(finnalAsyncApi, store.data) &&
store.updateData({
[finishedField || 'finished']: false
@ -1139,10 +1154,18 @@ export default class Form extends React.Component<FormProps, object> {
}
const cbResult = until(
() => store.checkRemote(finnalAsyncApi as Api, store.data),
(ret: any) => ret && ret[finishedField || 'finished'],
(ret: any) => {
return ret && ret[finishedField || 'finished'];
},
cancel => (this.asyncCancel = cancel),
checkInterval
);
).then((value: any) => {
// 派发asyncApiFinished事件
dispatchEvent(
'asyncApiFinished',
createObject(data, store.data)
);
});
return {
cbResult,
dispatcher