otorisasi

src/assets/Images.js

@@ -18,6 +18,7 @@ const Images = {
     green: require('./green.svg'),
     red: require('./red.svg'),
     ceklis: require('./ceklis.png'),
+    check: require('./check.svg'),
     approval: require('./approval.svg'),
     template: require('./template.svg'),
     upload: require('./upload.svg'),

src/assets/check.svg

+<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16">
+    <g fill="none" fill-rule="evenodd" transform="translate(-4 -4)">
+        <path d="M0 0H24V24H0z"/>
+        <rect width="15" height="15" x="4.5" y="4.5" fill="#47B6AD" stroke="#47B6AD" rx="3"/>
+        <path stroke="#FFF" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15.8 9L10.605 14.423 8 11.711"/>
+    </g>
+</svg>

src/container/BudgetTahunan/BalanceSheet.js

@@ -15,7 +15,7 @@ const style = {
 };
 const style2 = {
     position: "sticky",
-    left: 448,
+    left: 420,
     background: "white",
     zIndex: 101
 };
@@ -56,7 +56,7 @@ export default class BalanceSheet extends Component {
                 setCellProps: () => ({
                     style: {
                         position: "sticky",
-                        left: 448,
+                        left: 420,
                         background: "white",
                         zIndex: 101
                     }
@@ -253,7 +253,7 @@ export default class BalanceSheet extends Component {
             ["Trade Receivables - Third Party", "142,668", "77,480"],
         ]
         return (
-            <div style={{ flex: 1, backgroundColor: '#f8f8f8' }}>
+            <div style={{ height: this.props.height, backgroundColor: '#f8f8f8', marginBottom: 100, minHeight: 1000 }}>
                 <div style={{ height: 78, backgroundColor: '#354960', flex: 1, display: 'flex', alignItems: 'center', paddingLeft: 20 }}>
                     <Typography style={{ fontSize: '16px', color: 'white' }}>Pengajuan Budget Tahunan</Typography>
                 </div>
@@ -269,7 +269,7 @@ export default class BalanceSheet extends Component {
                                 <Typography style={{ fontSize: '11px', color: '#4b4b4b' }}>in IDR mn</Typography>
                             </div>
 
-                            <div style={{ marginTop: 20, width: 1350 }}>
+                            <div style={{ marginTop: 20, width: '100%' }}>
                                 <MuiThemeProvider theme={getMuiTheme()}>
                                     <MUIDataTable
                                         data={dataTable}

src/container/Profile.js

 import React, { Component } from 'react';
 import { Typography, AppBar, Tabs, Tab, TextField } from '@material-ui/core';
 import HomePage from './HomePage';
+import Images from '../assets/Images';
 
 export default class Profile extends Component {
     constructor(props) {
@@ -14,7 +15,7 @@ export default class Profile extends Component {
     }
     render() {
         return (
-            <div style={{ flex: 1}}>
+            <div style={{ height: this.props.height, backgroundColor: '#f8f8f8', marginBottom: 100, minHeight: 1000 }}>
                 <div style={{ height: 203, backgroundColor: '#354960', flex: 1, display: 'flex', alignItems: 'flex-end', padding: 20 }}>
                     <div style={{ display: 'flex', alignItems: 'center' }}>
                         <div style={{ height: 72, width: 72, backgroundColor: 'white', borderRadius: 40, marginRight: 20 }} />
@@ -67,9 +68,31 @@ export default class Profile extends Component {
                                 </div>
                             </div>
                         </div> :
-                        <div style={{ padding: 20 }}>
-                            ini tab 1
+                        <div style={{ padding: 20, marginTop: 10, marginBottom: 100 }}>
+                        <div style={{ width: 432, borderRadius: 6, boxShadow: '0 1px 4px 0 rgba(0, 0, 0, 0.25)' }}>
+                            <div style={{ width: '100%', height: 64, backgroundColor: '#354960', display: 'flex', paddingLeft: 20, borderTopLeftRadius: 6, borderTopRightRadius: 6, alignItems: 'center' }}>
+                                <Typography style={{ fontSize: '13px', color: 'white', fontWeight: 'bold' }}>Otorisasi Perusahaan</Typography>
+                            </div>
+                            <div style={{ padding: 20 }}>
+                                <div style={{ display: 'flex'}}>
+                                    <img src={Images.check} style={{ marginRight: 10}}/>
+                                    <Typography style={{fontSize: 14, opacity: .5, color: '#4b4b4b'}}>Agro PersadaTriputra </Typography>
+                                </div>
+                                <div style={{ display: 'flex', marginTop: 20}}>
+                                    <img src={Images.check} style={{ marginRight: 10}}/>
+                                    <Typography style={{fontSize: 14, opacity: .5, color: '#4b4b4b'}}>Dharma Group</Typography>
+                                </div>
+                                <div style={{ display: 'flex', marginTop: 20, paddingLeft: 20}}>
+                                    <img src={Images.check} style={{ marginRight: 10}}/>
+                                    <Typography style={{fontSize: 14, opacity: .5, color: '#4b4b4b'}}>Dharma Polimetal</Typography>
+                                </div>
+                                <div style={{ display: 'flex', marginTop: 20, paddingLeft: 20}}>
+                                    <img src={Images.check} style={{ marginRight: 10}}/>
+                                    <Typography style={{fontSize: 14, opacity: .5, color: '#4b4b4b'}}>Dharma Poliplast</Typography>
+                                </div>
+                            </div>
                         </div>
+                    </div>
                     }
                 </div>
             </div>