apdet

src/container/Home.js

@@ -26,7 +26,7 @@ import {
   Route,
   Link,
   useParams,
-  useRouteMatch
+  useRouteMatch, useLocation
 } from "react-router-dom";
 import Images from '../assets/Images';
 import { FadeMenu, Footer, UseWindowDimensions } from '../Utils/Index';
@@ -144,6 +144,7 @@ const useStyles = makeStyles((theme) => ({
 }));
 
 export default function MiniDrawer() {
+  let location = useLocation();
   const classes = useStyles();
   const theme = useTheme();
   const [open, setOpen] = React.useState(false);
@@ -401,6 +402,7 @@ export default function MiniDrawer() {
   const selectIndex = (e) => {
     setSelectSub("")
     setSelectedIndex(e)
+    // alert(e)
     // if (open === false) {
     // setOpen(true)
     // }
@@ -652,7 +654,8 @@ export default function MiniDrawer() {
                   key={index}
                   path={route.path}
                   // exact={route.exact}
-                  children={<route.main height={height} width={width} open={open} />}
+                  location={location}
+                  children={<route.main height={height} width={width} open={open} location={location} selectIndex={selectIndex.bind(this)}/>}
                 />
               ))}
             </Switch>

src/container/HomePage.js

@@ -5,6 +5,7 @@ import Images from '../assets/Images';
 import DonutChart from 'react-d3-donut';
 import Constant from '../library/Constant';
 import api from '../api';
+import { Link } from 'react-router-dom';
 
 var ct = require("../library/CustomTable");
 const getMuiTheme = () => createMuiTheme(ct.customTable());
@@ -32,6 +33,13 @@ class HomePage extends Component {
         this.getDashboard()
     }
 
+    componentDidUpdate(){    
+        window.onpopstate = e => {
+           //your code...
+           this.props.selectIndex('Home')
+        }
+    }
+
     getDashboard() {
         let listDashboard = []
         api.create().getDashboard().then((response) => {
@@ -52,6 +60,7 @@ class HomePage extends Component {
                 customBodyRender: (val, tableMeta) => {
                     return (
                         <div style={{ display: 'flex' }}>
+                            <Link to={{pathname: `/home/master-budget/`, state: {userType: 'approver'}}}>
                                 <button
                                     style={{
                                         backgroundColor: 'transparent',
@@ -63,16 +72,7 @@ class HomePage extends Component {
                                 >
                                     <img src={Images.editCopy2} />
                                 </button>
-                            <button
-                                style={{
-                                    backgroundColor: 'transparent',
-                                    cursor: 'pointer',
-                                    borderColor: 'transparent'
-                                }}
-                                onClick={() => null}
-                            >
-                                <img src={Images.editCopy} />
-                            </button>
+                            </Link>
                         </div >
                     );
                 }
@@ -126,11 +126,11 @@ class HomePage extends Component {
         return (
             <div style={{ flex: 1, backgroundColor: '#f8f8f8' }}>
                 <div className={"main-color"} style={{ height: 78, flex: 1, display: 'flex', alignItems: 'center', paddingLeft: 20 }}>
-                    <Typography style={{ fontSize: '24px', color: 'white' }}>{this.state.userData === null? '' : `Selamat Datang, ${this.state.userData.fullname} !`}</Typography>
+                    <Typography style={{ fontSize: '24px', color: 'white' }}>{this.state.userData === null? '' : `Welcome, ${this.state.userData.fullname} !`}</Typography>
                 </div>
                 <div style={{ flex: 1, padding: 20, width: '100%' }}>
                     <div style={{ display: 'flex' }}>
-                        <Typography style={{ color: '#656565', fontSize: '16px', fontWeight: 'bold' }}>Menunggu Persetujuan Anda</Typography>
+                        <Typography style={{ color: '#656565', fontSize: '16px', fontWeight: 'bold' }}>Waiting Your Submission</Typography>
                     </div>
 
                 </div>
@@ -138,7 +138,7 @@ class HomePage extends Component {
                     <div>
                         <MuiThemeProvider theme={getMuiTheme()}>
                             <MUIDataTable
-                                data={this.state.listDashboard}
+                                data={data}
                                 columns={columns}
                                 options={options}
                             />