Add form blocking + spinner to the upload form

This commit is contained in:
Kailash Nadh 2018-11-05 23:06:38 +05:30
parent f75f1cdd61
commit d09a16d514
1 changed files with 5 additions and 2 deletions

View File

@ -12,6 +12,7 @@ class TheFormDef extends React.PureComponent {
state = { state = {
confirmDirty: false, confirmDirty: false,
fileList: [], fileList: [],
formLoading: false,
mode: "subscribe" mode: "subscribe"
} }
@ -39,17 +40,19 @@ class TheFormDef extends React.PureComponent {
return return
} }
this.setState({ formLoading: true })
let params = new FormData() let params = new FormData()
params.set("params", JSON.stringify(values)) params.set("params", JSON.stringify(values))
params.append("file", this.state.fileList[0]) params.append("file", this.state.fileList[0])
this.props.request(cs.Routes.UploadRouteImport, cs.MethodPost, params).then(() => { this.props.request(cs.Routes.UploadRouteImport, cs.MethodPost, params).then(() => {
notification["info"]({ placement: cs.MsgPosition, notification["info"]({ placement: cs.MsgPosition,
message: "File uploaded", message: "File uploaded",
description: "Please wait while the import is running" }) description: "Please wait while the import is running" })
this.props.fetchimportState() this.props.fetchimportState()
this.setState({ formLoading: false })
}).catch(e => { }).catch(e => {
notification["error"]({ placement: cs.MsgPosition, message: "Error", description: e.message }) notification["error"]({ placement: cs.MsgPosition, message: "Error", description: e.message })
this.setState({ formLoading: false })
}) })
} }
@ -77,7 +80,7 @@ class TheFormDef extends React.PureComponent {
} }
return ( return (
<Spin spinning={false}> <Spin spinning={ this.state.formLoading }>
<Form onSubmit={this.handleSubmit}> <Form onSubmit={this.handleSubmit}>
<Form.Item {...formItemLayout} label="Mode"> <Form.Item {...formItemLayout} label="Mode">
{getFieldDecorator("mode", { rules: [{ required: true }], initialValue: "subscribe" })( {getFieldDecorator("mode", { rules: [{ required: true }], initialValue: "subscribe" })(