Merge branch 'master' into 'didam'

# Conflicts:
#   src/router/index.js

package-lock.json

@@ -6030,6 +6030,11 @@
       "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.12.1.tgz",
       "integrity": "sha512-tmRv0AVuR7ZyouUHLeNSiO6pqulF7dYa3s19c6t+wz9LD69/uSzdMxJ2S91nTI9U3rt/IldxpzMOFejp6f0hjg=="
     },
+    "font-awesome": {
+      "version": "4.7.0",
+      "resolved": "https://registry.npmjs.org/font-awesome/-/font-awesome-4.7.0.tgz",
+      "integrity": "sha1-j6jPBBGhoxr9B7BtKQK7n8gVoTM="
+    },
     "for-in": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/for-in/-/for-in-1.0.2.tgz",

package.json

@@ -9,6 +9,7 @@
     "@testing-library/react": "^9.5.0",
     "@testing-library/user-event": "^7.2.1",
     "apisauce": "^1.1.2",
+    "font-awesome": "^4.7.0",
     "react": "^16.13.1",
     "react-dom": "^16.13.1",
     "react-router-dom": "^5.2.0",

src/assets/Images.js

@@ -11,6 +11,8 @@ const Images = {
     manajemenDokumen: require('./docmanagement.svg'),
     laporanBulanan: require('./laporanbulanan.svg'),
     laporan: require('./laporan.svg'),
+    editCopy: require('./edit-copy.svg'),
+    editCopy2: require('./edit-copy-2.svg'),
 
     //Image
     triputra: require('./triputra.png'),

src/assets/edit-copy-2.svg

+<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32">
+    <g fill="none" fill-rule="evenodd">
+        <circle cx="16" cy="16" r="16" fill="#FEAA2D"/>
+        <g fill="#FFF" fill-rule="nonzero">
+            <path d="M15.898 4.814C15.755 4.618 12.35.026 8 .026S.244 4.618.102 4.814c-.136.185-.136.437 0 .622.142.196 3.548 4.788 7.898 4.788s7.755-4.592 7.898-4.788c.136-.185.136-.437 0-.622zM8 9.169c-3.204 0-5.98-3.048-6.8-4.044C2.02 4.127 4.788 1.08 8 1.08c3.204 0 5.979 3.047 6.8 4.044-.82.998-3.59 4.044-6.8 4.044z" transform="translate(8 11)"/>
+            <path d="M8 1.96c-1.745 0-3.165 1.42-3.165 3.165S6.255 8.29 8 8.29s3.165-1.42 3.165-3.165S9.745 1.96 8 1.96zm0 5.275c-1.164 0-2.11-.947-2.11-2.11 0-1.163.947-2.11 2.11-2.11 1.163 0 2.11.947 2.11 2.11 0 1.163-.947 2.11-2.11 2.11z" transform="translate(8 11)"/>
+        </g>
+    </g>
+</svg>

src/assets/edit-copy.svg

+<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32">
+    <g fill="none" fill-rule="evenodd">
+        <circle cx="16" cy="16" r="16" fill="#4CAF51"/>
+        <path fill="#FFF" fill-rule="nonzero" d="M23.472 9.943l-1.447-1.447c-.661-.661-1.737-.661-2.398 0L8.86 19.263c-.068.067-.113.157-.13.245l-.723 3.908c-.028.151.02.307.129.416.11.109.265.157.416.129l3.907-.724c.09-.016.18-.062.246-.129l10.766-10.767c.662-.662.663-1.735 0-2.398zM9.052 22.917l.437-2.364 1.926 1.926-2.363.438zm3.323-.801l-2.522-2.522 9.207-9.208 2.522 2.522-9.207 9.208zM22.81 11.68l-.566.566-2.522-2.522.566-.566c.297-.297.779-.297 1.075 0l1.447 1.447c.297.297.297.778 0 1.075z"/>
+    </g>
+</svg>

src/container/HomePage.js

+import React, { Component } from 'react';
+import { Typography, CircularProgress } from '@material-ui/core';
+import Images from '../assets/Images';
+
+class HomePage extends Component {
+    render() {
+        const columns = ["#", "Nama Perusahaan", "Revisi", "Status", {
+            name: "Action",
+            options: {
+                customBodyRender: (val, tableMeta) => {
+                    return (
+                        <div style={{ display: 'flex' }}>
+                            <button
+                                style={{
+                                    backgroundColor: 'transparent',
+                                    cursor: 'pointer',
+                                    borderColor: 'transparent'
+                                }}
+                                onClick={() => null}
+                            >
+                                <img src={Images.editCopy2} />
+                            </button>
+                            <button
+                                style={{
+                                    backgroundColor: 'transparent',
+                                    cursor: 'pointer',
+                                    borderColor: 'transparent'
+                                }}
+                                onClick={() => null}
+                            >
+                                <img src={Images.editCopy} />
+                            </button>
+                        </div >
+                    );
+                }
+            }
+        }]
+        const data = [
+            ["1", "TRIPUTRA AGRO PERSADA", "Laporan Bulanan - September 2020", "1 (20 Oktober 2020)", "Belum Disetujui"],
+            ["2", "DAYA GROUP", "Laporan Bulanan - September 2020", "1 (20 Oktober 2020)", "Belum Disetujui"],
+            ["3", "PUNINAR INFINITE RAYA", "Budget Tahunan 2021", "0 (20 Oktober 2020)", "Belum Disetujui"],
+            ["4", "DHARMA GROUP", "Laporan Bulanan - September 2020", "0 (20 Oktober 2020)", "Belum Disetujui"],
+            ["5", "PUNINAR INFINITE RAYA", "Budget Tahunan 2021", "0 (20 Oktober 2020)", "Belum Disetujui"],
+        ]
+        const options = {
+            filter: false,
+            sort: false,
+            responsive: "scroll",
+            print: false,
+            download: false,
+            selectableRows: false,
+            viewColumns: false,
+            rowsPerPage: 5
+        }
+        return (
+            <div style={{ flex: 1, height: '100vh' }}>
+                <div style={{ height: 78, backgroundColor: '#354960', flex: 1, display: 'flex', alignItems: 'center', paddingLeft: 20 }}>
+                    <Typography style={{ fontSize: '24px', color: 'white' }}>Selamat Datang, John!</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>
+                    </div>
+
+                </div>
+                <div style={{ flex: 1, padding: 20, width: '100%' }}>
+                    <div>
+                    </div>
+                    <div style={{ marginTop: 20 }}>
+                        <Typography style={{ color: '#656565', fontSize: '16px', fontWeight: 'bold' }}>Status Laporan</Typography>
+                        <CircularProgress variant="static" value={[10,30]} />
+                    </div>
+                </div>
+
+            </div>
+        );
+    }
+}
+
+export default HomePage;
\ No newline at end of file

src/container/Login.js

 import React, { Component } from 'react';
+import Images from '../assets/Images';
 
 class Login extends Component {
   render() {
     return (
-      <div> textInComponent </div>
+      <div style={{ flex: 1, display: 'flex'}}> 
+        <div style={{width: '50%', height: '100vh', display: 'flex'}}>
+        <img src={Images.tia} alt="React Logo" style={{ height: 59, width: 100 }} />
+        </div>
+        <div style={{width: '50%', height: '100vh', backgroundColor: '#51c6ea'}}></div>
+      </div>
     );
   }
 }

src/container/Menu/MenuData.js

@@ -8,7 +8,7 @@ const MenuData = [
     },
     {
         name: 'Budget Tahunan',
-        path: '/profile',
+        path: '/budget-tahunan',
         icon: <img src={Images.budgetTahunan} style={{ width: 18, height: 18 }} />
     },
     {

src/index.js

 import React from 'react';
 import ReactDOM from 'react-dom';
 import './index.css';
+import '../node_modules/font-awesome/css/font-awesome.min.css'; 
 import App from './App';
 import * as serviceWorker from './serviceWorker';