loding

src/container/BudgetTahunan.js

@@ -75,7 +75,9 @@ export default class BudgetTahunan extends Component {
     scrollToMyRef = () => window.scrollTo(0, this.myRef.current.offsetTop)
 
     componentDidMount() {
-        this.setState({ loading: true })
+        this.setState({ loading: true }, ()=> {
+            document.body.style.overflow = 'hidden';
+        })
         this.props.selectIndex('Master Budget & CAT')
         if (this.props.location.state !== undefined) {
             // console.log(this.props);
@@ -87,6 +89,10 @@ export default class BudgetTahunan extends Component {
         }
     }
 
+    componentWillUnmount() {
+        document.body.style.overflow = 'unset';
+    }
+
     checkApprover() {
         api.create().checkApprover().then(response => {
             // console.log(response);
@@ -131,7 +137,9 @@ export default class BudgetTahunan extends Component {
                             // 
                         })
                     } else {
-                        this.setState({ listRevision: null, revision: null, dataTable: [], checkApprover: false, lastRevision: "", visibleTableHistory: false, loading: false })
+                        this.setState({ listRevision: null, revision: null, dataTable: [], checkApprover: false, lastRevision: "", visibleTableHistory: false, loading: false }, ()=> {
+                            document.body.style.overflow = 'unset';
+                        })
                     }
                 } else {
                     this.setState({ alert: true, messageAlert: response.data.message, tipeAlert: 'warning' }, () => {
@@ -195,10 +203,14 @@ export default class BudgetTahunan extends Component {
                         ]
                     })
                     // console.log(dataTable);
-                    this.setState({ dataTable, loading: false, dataTableRevision, dataForRevision: response.data.data })
+                    this.setState({ dataTable, loading: false, dataTableRevision, dataForRevision: response.data.data }, ()=> {
+                        document.body.style.overflow = 'unset';
+                    })
                 }
             } else {
-                this.setState({ loading: false })
+                this.setState({ loading: false }, ()=> {
+                    document.body.style.overflow = 'unset';
+                })
             }
         })
     }
@@ -368,7 +380,9 @@ export default class BudgetTahunan extends Component {
     }
 
     getSubmission() {
-        this.setState({ loading: true })
+        this.setState({ loading: true }, ()=> {
+            document.body.style.overflow = 'hidden';
+        })
         let payload = {
             "company_id": this.state.company.company_id,
             "periode": this.state.periode.periode,
@@ -400,7 +414,9 @@ export default class BudgetTahunan extends Component {
                         })
                     })
                 } else {
-                    this.setState({ submissionID: null, loading: false })
+                    this.setState({ submissionID: null, loading: false }, ()=> {
+                        document.body.style.overflow = 'unset';
+                    })
                 }
             }
         })
@@ -430,7 +446,9 @@ export default class BudgetTahunan extends Component {
 
     approvalSubmission(type) {
         this.scrollToMyRef()
-        this.setState({ loading: true })
+        this.setState({ loading: true }, ()=> {
+            document.body.style.overflow = 'hidden';
+        })
         let body = {
             "approval_id": this.props.location.state == undefined ? this.state.approverID : this.state.rawData.approval_id,
             "status": type,
@@ -590,7 +608,9 @@ export default class BudgetTahunan extends Component {
     }
 
     saveToMasterBudget(data) {
-        this.setState({ loading: true })
+        this.setState({ loading: true }, ()=> {
+            document.body.style.overflow = 'hidden';
+        })
         // console.log(JSON.stringify(data));
         api.create('UPLOAD').createSubmitReport(data).then(response => {
             // console.log(response);
@@ -600,11 +620,13 @@ export default class BudgetTahunan extends Component {
                 } else {
                     this.setState({ loading: false }, () => {
                         this.getSubmission()
+                        document.body.style.overflow = 'unset';
                     })
                 }
             } else {
                 this.setState({ loading: false }, () => {
                     this.getSubmission()
+                    document.body.style.overflow = 'unset';
                 })
             }
         })
@@ -620,7 +642,9 @@ export default class BudgetTahunan extends Component {
             `https://tia.eksad.com/tia-reporting-dev/public/transaction/master_budget/download_attachment?fileName=${fileurl}&&fileType=${fileType}`
         )
         res = await res.blob()
-        this.setState({ loading: false })
+        this.setState({ loading: false }, ()=> {
+            document.body.style.overflow = 'unset';
+        })
         if (res.size > 0) {
             let url = window.URL.createObjectURL(res);
             let a = document.createElement('a');
@@ -631,7 +655,9 @@ export default class BudgetTahunan extends Component {
     }
 
     validate() {
-        this.setState({ loading: true })
+        this.setState({ loading: true }, ()=> {
+            document.body.style.overflow = 'hidden';
+        })
         let array = []
         let canSubmit = true
         this.state.dataTable.map(item => {
@@ -660,7 +686,9 @@ export default class BudgetTahunan extends Component {
                 }
             })
         } else {
-            this.setState({ alert: true, messageAlert: 'Data Is Not Complete', tipeAlert: 'warning', loading: false })
+            this.setState({ alert: true, messageAlert: 'Data Is Not Complete', tipeAlert: 'warning', loading: false }, ()=> {
+                document.body.style.overflow = 'unset';
+            })
         }
         // if (array.includes("not-yet" || "draft")) {
         //     console.log('gagal');
@@ -916,7 +944,7 @@ export default class BudgetTahunan extends Component {
             search: false
         }
         const loadingComponent = (
-            <div style={{ position: 'absolute', zIndex: 110, top: 0, left: 0, width: '100%', height: '100%', display: 'flex', justifyContent: 'center', alignItems: 'center', background: 'rgba(255,255,255,0.8)' }}>
+            <div style={{ position: 'fixed', zIndex: 110, top: 0, left: 0, width: '100%', height: '100%', display: 'flex', justifyContent: 'center', alignItems: 'center', background: 'rgba(255,255,255,0.8)' }}>
                 <PropagateLoader
                     // css={override}
                     size={20}