Commit 3938b5f2 authored by EKSAD's avatar EKSAD

Update

parent 87848a42
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
import apisauce from 'apisauce' import apisauce from 'apisauce'
// our "constructor" // our "constructor"
const create = (baseURL = '') => { const create = (baseURL = 'https://trftia.eksad.com/tia-reporting-dev/public/') => {
// ------ // ------
// STEP 1 // STEP 1
// ------ // ------
...@@ -26,8 +26,8 @@ const create = (baseURL = '') => { ...@@ -26,8 +26,8 @@ const create = (baseURL = '') => {
var token var token
try { try {
// const res = await AsyncStorage.getItem("TOKEN") // const res = await AsyncStorage.getItem("TOKEN")
if (res != null) { if (token != null) {
token = res token = token
// alert(url) // alert(url)
// api.setBaseURL(`${url}/api/`) // api.setBaseURL(`${url}/api/`)
} else { } else {
...@@ -59,6 +59,7 @@ const create = (baseURL = '') => { ...@@ -59,6 +59,7 @@ const create = (baseURL = '') => {
// way at this level. // way at this level.
// //
const getRoot = () => api.get('') const getRoot = () => api.get('')
const login = (body) => api.post('auth/login', body)
// ------ // ------
// STEP 3 // STEP 3
// ------ // ------
...@@ -74,6 +75,7 @@ const create = (baseURL = '') => { ...@@ -74,6 +75,7 @@ const create = (baseURL = '') => {
return { return {
// a list of the API functions from step 2 // a list of the API functions from step 2
getRoot, getRoot,
login,
} }
} }
......
...@@ -24,6 +24,7 @@ const Images = { ...@@ -24,6 +24,7 @@ const Images = {
download: require('./download.svg'), download: require('./download.svg'),
visualisasi: require('./visualisasi.svg'), visualisasi: require('./visualisasi.svg'),
add: require('./add.svg'), add: require('./add.svg'),
searchBlack: require('./search-black.svg'),
//Image //Image
triputra: require('./triputra.png'), triputra: require('./triputra.png'),
......
<svg xmlns="http://www.w3.org/2000/svg" width="14" height="13" viewBox="0 0 14 13">
<g fill="none" fill-rule="evenodd">
<path d="M0 0H24V24H0z" transform="translate(-5 -5)"/>
<g transform="translate(-5 -5) translate(5 5)">
<circle cx="5.5" cy="5.5" r="4.5" stroke="#4B4B4B" stroke-width="2"/>
<rect width="2" height="5" x="10" y="8" fill="#4B4B4B" rx="1" transform="rotate(-45 11 10.5)"/>
</g>
</g>
</svg>
import React, { Component } from 'react';
import { Typography, InputAdornment, IconButton } from '@material-ui/core';
import TextField from "@material-ui/core/TextField";
import Images from '../assets/Images';
import MUIDataTable from "mui-datatables";
import SearchIcon from '@material-ui/icons/Search';
class ItemLaporan extends Component {
render() {
const columns = [{
name: "Action",
options: {
customBodyRender: (val, tableMeta) => {
return (
<div style={{ display: 'flex' }}>
<button
style={{
backgroundColor: 'transparent',
cursor: 'pointer',
borderColor: 'transparent'
}}
onClick={() => null}
>
<img src={Images.editCopy} />
</button>
</div >
);
}
}
}, "ID", "Tipe Persetujuan", "Order", "Nama Pemberi Persetujuan", "Operator", "Status"]
const data = [
["", "1", "Yearly", "1", "John Doe", "-", "Aktif"],
["", "2", "Yearly", "2", "John Doe", "-", "Aktif"],
["", "3", "Yearly", "2", "John Doe", "AND", "Aktif"],
["", "4", "Yearly", "2", "John Doe", "AND", "Non Aktif"],
["", "5", "Yearly", "3", "John Doe", "-", "Non Aktif"],
]
const options = {
filter: false,
sort: false,
responsive: "scroll",
print: false,
download: false,
selectableRows: false,
viewColumns: false,
rowsPerPage: 5,
search: false
}
return (
<div style={{ flex: 1 }}>
<div style={{ height: 150, width: '100%', backgroundColor: '#354960', padding: 24, paddingTop: 30 }}>
<div style={{ display: 'flex' }}>
<Typography style={{ paddingTop: 8, paddingBottom: 7, fontSize: '16px', color: 'white' }}>Master Data - Approval Matrix</Typography>
<form style={{ marginLeft: 110}}>
<TextField
id="search"
label=""
variant="outlined"
size="small"
placeholder="Search"
style={{ width: 423, backgroundColor: 'white', borderRadius: 6 }}
InputProps={{
startAdornment: <InputAdornment position="start"><img src={Images.searchBlack} style={{marginRight: 6}} /></InputAdornment>,
}}
/>
</form>
<div style={{ display: 'flex' }}>
<button
style={{
backgroundColor: 'transparent',
cursor: 'pointer',
borderColor: 'transparent',
marginLeft: 82,
padding: 0
}}
onClick={() => null}
>
<img src={Images.template} />
</button>
<button
style={{
backgroundColor: 'transparent',
cursor: 'pointer',
borderColor: 'transparent',
marginLeft: 16,
padding:0
}}
onClick={() => null}
>
<img src={Images.upload} />
</button>
<button
style={{
backgroundColor: 'transparent',
cursor: 'pointer',
borderColor: 'transparent',
marginLeft: 16,
padding:0
}}
onClick={() => null}
>
<img src={Images.download} />
</button>
<button
style={{
backgroundColor: 'transparent',
cursor: 'pointer',
borderColor: 'transparent',
marginLeft: 16,
padding:0
}}
onClick={() => null}
>
<img src={Images.visualisasi} />
</button>
<button
style={{
backgroundColor: 'transparent',
cursor: 'pointer',
borderColor: 'transparent',
marginLeft: 16,
padding:0
}}
onClick={() => null}
>
<img src={Images.add} />
</button>
</div >
</div>
</div>
<div style={{ flex: 1, padding: 20, width: '100%' }}>
<div>
<MUIDataTable
data={data}
columns={columns}
options={options}
/>
</div>
</div>
</div>
);
}
}
export default ItemLaporan;
\ No newline at end of file
...@@ -4,6 +4,7 @@ import { Checkbox, Button, InputAdornment, TextField, InputLabel, Typography, Ic ...@@ -4,6 +4,7 @@ import { Checkbox, Button, InputAdornment, TextField, InputLabel, Typography, Ic
import { withStyles } from '@material-ui/core/styles'; import { withStyles } from '@material-ui/core/styles';
import Visibility from '@material-ui/icons/Visibility'; import Visibility from '@material-ui/icons/Visibility';
import VisibilityOff from '@material-ui/icons/VisibilityOff'; import VisibilityOff from '@material-ui/icons/VisibilityOff';
import api from '../api';
const CustomCheckbox = withStyles({ const CustomCheckbox = withStyles({
root: { root: {
...@@ -36,6 +37,16 @@ class Login extends Component { ...@@ -36,6 +37,16 @@ class Login extends Component {
} }
login() {
let payload = {
"username": this.state.username,
"password": "admin"
}
api.create().login(payload).then((response) => {
console.log(response.data)
})
}
render() { render() {
return ( return (
<div style={{ flex: 1, display: 'flex' }}> <div style={{ flex: 1, display: 'flex' }}>
...@@ -70,7 +81,7 @@ class Login extends Component { ...@@ -70,7 +81,7 @@ class Login extends Component {
name={"password"} name={"password"}
variant="outlined" variant="outlined"
error={false} error={false}
style={{ width: '100%', height: 51, marginTop: 12 }} style={{ width: '100%', height: 51, marginTop: 20 }}
helperText="" helperText=""
InputProps={{ InputProps={{
endAdornment: <InputAdornment position="end"> endAdornment: <InputAdornment position="end">
...@@ -91,7 +102,7 @@ class Login extends Component { ...@@ -91,7 +102,7 @@ class Login extends Component {
<span style={{ color: 'rgba(0, 0, 0, 0.5)' }}>Remember Me</span> <span style={{ color: 'rgba(0, 0, 0, 0.5)' }}>Remember Me</span>
<span style={{marginLeft: 30, color: '#51c6ea', cursor: 'pointer' }}>Lupa Kata Sandi?</span> <span style={{marginLeft: 30, color: '#51c6ea', cursor: 'pointer' }}>Lupa Kata Sandi?</span>
</div> </div>
<Button variant="contained" style={{ marginTop: 23, width: '100%', height: 35, borderRadius: 4 }} disabled> <Button variant="contained" onClick={() => this.login()} style={{ marginTop: 23, width: '100%', height: 35, borderRadius: 4 }}>
<Typography style={{fontSize: 12}}>Login</Typography> <Typography style={{fontSize: 12}}>Login</Typography>
</Button> </Button>
</div> </div>
......
...@@ -22,7 +22,7 @@ class ResetPassword extends Component { ...@@ -22,7 +22,7 @@ class ResetPassword extends Component {
render() { render() {
return ( return (
<div style={{ flex: 1, display: 'flex', backgroundColor: '#51c6ea', height: '100vh', justifyContent: 'center', alignItems: 'center' }}> <div style={{ flex: 1, display: 'flex', backgroundColor: '#51c6ea', height: '100vh', justifyContent: 'center', alignItems: 'center' }}>
<div style={{padding: 60, display: 'flex', flexDirection: 'column', width: 318, height: 351, borderRadius: 12, boxShadow: '0 2 4 0 rgba(0, 0, 0, 0.2)', backgroundColor: '#ffffff' }}> <div style={{padding: 60, display: 'flex', flexDirection: 'column', width: 318, height: 250, borderRadius: 12, boxShadow: '0 2 4 0 rgba(0, 0, 0, 0.2)', backgroundColor: '#ffffff', justifyContent: 'center', alignItems: 'center' }}>
<img src={Images.tia} /> <img src={Images.tia} />
<TextField <TextField
...@@ -34,16 +34,22 @@ class ResetPassword extends Component { ...@@ -34,16 +34,22 @@ class ResetPassword extends Component {
onChange={(username) => this.setState({username: username.target.value})} onChange={(username) => this.setState({username: username.target.value})}
variant="outlined" variant="outlined"
error={false} error={false}
style={{ width: 250, height: 51, margin: 32, fontSize: 14 }} style={{ width: '90%', height: 51, marginTop: 32, fontSize: 14 }}
helperText="" helperText=""
InputProps={{ InputProps={{
endAdornment: <InputAdornment position="end"><img src={Images.email} /></InputAdornment>, endAdornment: <InputAdornment position="end"><img src={Images.email} /></InputAdornment>,
}} }}
/> />
<Button variant="contained" style={{ width: 250, height: 51, marginLeft: 32, marginBottom: 24, borderRadius: 4 }} disabled> <Button variant="contained" style={{ marginTop: 23, width: '90%', height: 30, borderRadius: 4 }} disabled>
<Typography style={{fontSize: 12}}>Lanjut</Typography> <Typography style={{fontSize: 12}}>Lanjut</Typography>
</Button> </Button>
<div style={{ marginTop: 24}}>
<span style={{ color: '#51c6ea', cursor: 'pointer' }}>
<Typography style={{fontSize: 14}}>Kembali Ke Login</Typography>
</span>
</div>
</div> </div>
</div> </div>
); );
......
...@@ -69,7 +69,7 @@ const arraySide = [ ...@@ -69,7 +69,7 @@ const arraySide = [
{ {
img: '', img: '',
label: 'Item Laporan', label: 'Item Laporan',
path: 'beranda', path: 'itemlaporan',
}, },
{ {
img: '', img: '',
......
...@@ -6,6 +6,7 @@ import BudgetTahunan from '../container/BudgetTahunan'; ...@@ -6,6 +6,7 @@ import BudgetTahunan from '../container/BudgetTahunan';
import HomePage from '../container/HomePage'; import HomePage from '../container/HomePage';
import BalanceSheet from '../container/BudgetTahunan/BalanceSheet'; import BalanceSheet from '../container/BudgetTahunan/BalanceSheet';
import Profile from '../container/Profile'; import Profile from '../container/Profile';
import ItemLaporan from '../container/ItemLaporan';
const routes = [ const routes = [
{ {
...@@ -20,6 +21,10 @@ const routes = [ ...@@ -20,6 +21,10 @@ const routes = [
path: "/home/approval", path: "/home/approval",
main: ApprovalMatrix main: ApprovalMatrix
}, },
{
path: "/home/itemlaporan",
main: ItemLaporan
},
{ {
path: "/home/budget-tahunan", path: "/home/budget-tahunan",
main: BalanceSheet main: BalanceSheet
......
...@@ -34,7 +34,7 @@ export default function BasicExample() { ...@@ -34,7 +34,7 @@ export default function BasicExample() {
/> />
</Route> </Route>
<Route path="/login" component={Login} /> <Route path="/login" component={Login} />
<Route path="/reset" component={ResetPassword} /> <Route path="/resetpassword" component={ResetPassword} />
<Route path="/register" component={Register}/> <Route path="/register" component={Register}/>
<PrivateRoute path="/home" component={Home} /> <PrivateRoute path="/home" component={Home} />
<Route path="*"> <Route path="*">
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment