loading

public/react/src/modules/courses/common/ModalWrapper.js

@@ -1,5 +1,5 @@
 import React,{ Component } from "react";
-import { Modal,Input, Checkbox} from "antd";
+import { Modal,Input, Checkbox, Spin} from "antd";
 import '../css/members.css'
 
 class ModalWrapper extends Component{
@@ -23,7 +23,7 @@ class ModalWrapper extends Component{
   }
   render(){
     let {flag, visible}=this.state
-    let { onOk, cancelText, okText, title, width, className, bottomRender}=this.props;
+    let { onOk, cancelText, okText, title, width, className, bottomRender, loading}=this.props;
 
     return(
         <Modal
@@ -48,6 +48,7 @@ class ModalWrapper extends Component{
                }
              </style>:""
            }
+          <Spin spinning={!!this.props.loading}>
           <div className="newupload_conbox clearfix">
               {this.props.children}
               {this.props.checkBoxValuestype===true?<div className={"mt10 color-red"}>
@@ -59,6 +60,7 @@ class ModalWrapper extends Component{
               </div>
               { bottomRender }
           </div>
+          </Spin>
         </Modal>
     )
   }

public/react/src/modules/user/account/ChangeHeaderPicModal.js

@@ -1,5 +1,5 @@
 import React, { Component } from "react";
-import { Modal } from "antd";
+import { Spin } from "antd";
 import axios from 'axios'
 import ModalWrapper from "../../courses/common/ModalWrapper"
 import { Cropper, getUrl } from 'educoder'
@@ -13,7 +13,7 @@ class ChangeHeaderPicModal extends Component{
   constructor(props){
     super(props);
     this.state={
-      
+      uploading: false
     }
   }
   init = () => {
@@ -85,12 +85,23 @@ class ChangeHeaderPicModal extends Component{
    
 
   }
-
   onOk = () => {
+    if (this.state.uploading == true) return;
     if (this.fileUploaded != true) {
       this.props.showNotification("请先上传图片")
       return;
     }
+    console.log(new Date().getTime())
+    this.setState({ uploading: true }, () => {
+      window.setTimeout(() => {
+        console.log(new Date().getTime())
+        this._onOk()
+      }, 10)
+      
+    })
+  }
+  _onOk = () => {
+    
     var img_lg = document.getElementById(previewId);      
     // https://github.com/niklasvh/html2canvas/issues/1908     
     // 截图小的显示框内的内容          
@@ -115,9 +126,12 @@ class ChangeHeaderPicModal extends Component{
           } else {
             this.doAfterUpdated();
           }
+          this.setState({ uploading: false })
         }
       })
       .catch(function (error) {
+        this.setState({ uploading: false })
+
         console.log(error);
       });    
     });  
@@ -142,6 +156,8 @@ class ChangeHeaderPicModal extends Component{
         okText="保存"
         width={552}
         className="changeHeaderModal"
+        loading={this.state.uploading}
+        onCancel={() => this.setState({ uploading: false })}
       >
         <style>{`
             #changeHeader_imagePreview {