Merge branch 'dev/riri' into 'ENV-DEV'

issue

See merge request !1740

src/container/ProgressReport/ProgressReport.js

 import React, { Component } from 'react';
-import { Typography, Paper, TextField, Snackbar} from '@material-ui/core';
+import { Typography, Paper, TextField, Snackbar, withStyles} from '@material-ui/core';
 import Images from '../../assets/Images';
 import Constant from '../../library/Constant';
 import api from '../../api';
@@ -7,8 +7,11 @@ import { PropagateLoader } from 'react-spinners';
 import { format } from 'date-fns';
 import Autocomplete from '@material-ui/lab/Autocomplete';
 import TableProgressReport from './TableProgressReport'
-import { Alert } from '@material-ui/lab';
 import ReactTooltip from "react-tooltip";
+import MuiAlert from '@material-ui/lab/Alert';
+
+const Alert = withStyles({
+})((props) => <MuiAlert elevation={6} variant="filled" {...props} />);
 
 class ReportProgress extends Component {
     constructor(props) {
@@ -35,7 +38,10 @@ class ReportProgress extends Component {
             month: null,
             periodeMB: null,
             reportType: null,
-            dataTable: []
+            dataTable: [],
+            alert: false,
+            tipeAlert: '',
+            messageAlert: '',
         }
     }
 

src/container/ProgressReport/TableProgressReport.js

 import React, { Component } from "react";
-import { createMuiTheme, FormControlLabel, Input, MuiThemeProvider, TableCell, Typography } from "@material-ui/core";
+import { createMuiTheme, FormControlLabel, Input, MuiThemeProvider, Snackbar, TableCell, Typography, withStyles } from "@material-ui/core";
 import MUIDataTable from "mui-datatables";
 import api from '../../api';
 import Constant from '../../library/Constant';
 import { PropagateLoader } from "react-spinners";
 import Images from "../../assets/Images";
+import MuiAlert from '@material-ui/lab/Alert';
 
+const Alert = withStyles({
+})((props) => <MuiAlert elevation={6} variant="filled" {...props} />);
 
 var ct = require("../../library/CustomTable");
 const getMuiTheme = () => createMuiTheme(ct.customTable3());
@@ -31,12 +34,14 @@ export default class TableProgressReport extends Component {
             idCompany: null,
             companyName: "",
             month: "",
+            alert: false,
+            tipeAlert: '',
+            messageAlert: '',
         }
     }
 
     handleShowPopup(id, data) {
         let item = this.props
-        console.log(item);
         let bulan = item.month == 1 ? "Jan" : item.month == 2 ? "Feb" : item.month == 3 ? "Mar" : item.month == 4 ? "Apr" : item.month == 5 ? "May" : item.month == 6 ? "Jun" : item.month == 7 ? "Jul" : item.month == 8 ? "Aug" : item.month == 9 ? "Sep" : item.month == 10 ? "Oct" : item.month == 11 ? "Nov" : item.month == 12 ? "Dec" : null
         this.setState({ visiblePopup: true, idCompany: id, companyName: data[0], month: bulan })
     }
@@ -60,15 +65,10 @@ export default class TableProgressReport extends Component {
                 if (response.ok) {
                     this.setState({ loading: false })
                     if (response.data.status == 'success') {
-                        this.setState({ alert: true, messageAlert: response.data.message, tipeAlert: 'success' }, () => {
-                            setTimeout(() => {
-                                this.setState({ loading: false })
-                                this.getData()
-                            }, 2000);
-                        })
+                        this.setState({ loading: false, visiblePopup: false, alert: true, messageAlert: response.data.message, tipeAlert: 'success' })
                         // this.setState({ alert: true, messageAlert: response.data.message, tipeAlert: 'success' })
                     } else {
-                        this.setState({ alert: true, messageAlert: response.data.message, tipeAlert: 'warning' }, () => {
+                        this.setState({ alert: true, messageAlert: response.data.message, tipeAlert: 'warning', loading: false}, () => {
                             if (response.data.message.includes("Someone Logged In") || response.data.message.includes("Token Expired")) {
                                 setTimeout(() => {
                                     localStorage.removeItem(Constant.TOKEN)
@@ -78,14 +78,18 @@ export default class TableProgressReport extends Component {
                         })
                     }
                 } else {
-                    this.setState({ alert: true, messageAlert: response.data.message, tipeAlert: 'error' })
+                    this.setState({ alert: true, messageAlert: response.data.message, tipeAlert: 'error', loading: false})
                 }
             } else {
-                this.setState({ alert: true, messageAlert: response.problem, tipeAlert: 'error' })
+                this.setState({ alert: true, messageAlert: response.data.message, tipeAlert: 'error', loading: false })
             }
         })
     }
 
+    closeAlert() {
+        this.setState({ alert: false })
+    }
+
     render() {
 
         let dataTable2 = this.props.dataTable;
@@ -717,6 +721,11 @@ export default class TableProgressReport extends Component {
 
         return (
             <div>
+                <Snackbar open={this.state.alert} autoHideDuration={6000} onClose={() => this.closeAlert()}>
+                    <Alert onClose={() => this.closeAlert()} severity={this.state.tipeAlert}>
+                        {this.state.messageAlert}
+                    </Alert>
+                </Snackbar>
                 <div style={{ padding: "0px 20px 20px 20px", width: this.props.width - (this.props.open === true ? 350 : 100) }}>
                     {this.state.loading && loadingComponent}
                     <MuiThemeProvider theme={getMuiTheme()}>