Skip to content

T
Tia-dev
Commit 9a432228 authored by EKSAD's avatar EKSAD
Browse files
Options

Merge branch 'master' of http://103.44.149.204/d.arizona/tia-dev into riri

parents ff78c795 9af58de8
Expand all Show whitespace changes
Inline Side-by-side
Showing with 472 additions and 39 deletions
package.json
View file @ 9a432228
...@@ -24,6 +24,7 @@ ...@@ -24,6 +24,7 @@
"react": "^16.13.1", "react": "^16.13.1",
"react-bootstrap": "^1.3.0", "react-bootstrap": "^1.3.0",
"react-d3-donut": "^1.1.2", "react-d3-donut": "^1.1.2",
"react-d3-speedometer": "^0.12.0",
"react-dom": "^16.13.1", "react-dom": "^16.13.1",
"react-draggable-list": "^4.0.3", "react-draggable-list": "^4.0.3",
"react-dropzone": "^11.0.2", "react-dropzone": "^11.0.2",
......
src/api/index.js
View file @ 9a432228
...@@ -84,6 +84,7 @@ const create = (baseURL = 'https://tia.eksad.com/tia-reporting-dev/public/') => ...@@ -84,6 +84,7 @@ const create = (baseURL = 'https://tia.eksad.com/tia-reporting-dev/public/') =>
const updateUnitBisnis = (body) => api.post('/business_unit/update_business_unit', body) const updateUnitBisnis = (body) => api.post('/business_unit/update_business_unit', body)
const searchUnitBisnis = (body) => api.post('/business_unit/search_business_unit', body) const searchUnitBisnis = (body) => api.post('/business_unit/search_business_unit', body)
const checkUploadUnitBisnis = (body) => api.post('/business_unit/check_import', body) const checkUploadUnitBisnis = (body) => api.post('/business_unit/check_import', body)
const uploadUnitBisnis = (body) => api.post('/business_unit/import_business_unit', body)
// Perusahaan // Perusahaan
const getPerusahaan = () => api.get('company/get_all_company') const getPerusahaan = () => api.get('company/get_all_company')
...@@ -104,6 +105,8 @@ const create = (baseURL = 'https://tia.eksad.com/tia-reporting-dev/public/') => ...@@ -104,6 +105,8 @@ const create = (baseURL = 'https://tia.eksad.com/tia-reporting-dev/public/') =>
const updateUser = (body) => api.get('user/update_user', body) const updateUser = (body) => api.get('user/update_user', body)
const deleteUser = (userId) => api.get(`user/delete_user/${userId}`) const deleteUser = (userId) => api.get(`user/delete_user/${userId}`)
const changePassword = (body) => api.post('/user/change_password', body)
//Template //Template
const downloadTemplate = (fileName,fileType) => api.get(`attachment/download_file?fileName=${fileName}&&fileType=${fileType}`) const downloadTemplate = (fileName,fileType) => api.get(`attachment/download_file?fileName=${fileName}&&fileType=${fileType}`)
// ------ // ------
...@@ -150,7 +153,9 @@ const create = (baseURL = 'https://tia.eksad.com/tia-reporting-dev/public/') => ...@@ -150,7 +153,9 @@ const create = (baseURL = 'https://tia.eksad.com/tia-reporting-dev/public/') =>
updateUser, updateUser,
deleteUser, deleteUser,
downloadTemplate, downloadTemplate,
checkUploadUnitBisnis checkUploadUnitBisnis,
uploadUnitBisnis,
changePassword
} }
} }
......
src/assets/Images.js
View file @ 9a432228
...@@ -30,6 +30,8 @@ const Images = { ...@@ -30,6 +30,8 @@ const Images = {
add: require('./add.svg'), add: require('./add.svg'),
searchBlack: require('./search-black.svg'), searchBlack: require('./search-black.svg'),
berhasil: require('./berhasil.svg'), berhasil: require('./berhasil.svg'),
up: require('./up.svg'),
down: require('./down.svg'),
//Image //Image
triputra: require('./triputra.png'), triputra: require('./triputra.png'),
......
src/assets/down.svg 0 → 100644
View file @ 9a432228
<svg xmlns="http://www.w3.org/2000/svg" width="40" height="23" viewBox="0 0 40 23">
<g fill="none" fill-rule="evenodd">
<path fill="#E45858" d="M26.841 0L37.507 0 37.507 10.667z" transform="matrix(1 0 0 -1 2 23)"/>
<path stroke="#E45858" stroke-linecap="round" stroke-linejoin="round" stroke-width="4" d="M34.848 2.849L20.991 16.234 12.912 8.435 0 20.757" transform="matrix(1 0 0 -1 2 23)"/>
</g>
</svg>
src/assets/up.svg 0 → 100644
View file @ 9a432228
<svg xmlns="http://www.w3.org/2000/svg" width="40" height="23" viewBox="0 0 40 23">
<g fill="none" fill-rule="evenodd">
<path fill="#7CD532" d="M26.841 0L37.507 0 37.507 10.667z" transform="translate(2)"/>
<path stroke="#7CD532" stroke-linecap="round" stroke-linejoin="round" stroke-width="4" d="M34.848 2.849L20.991 16.234 12.912 8.435 0 20.757" transform="translate(2)"/>
</g>
</svg>
src/container/Laporan/DashboardCAT.js 0 → 100644
View file @ 9a432228
import React, { Component } from 'react'
import { Typography, MenuItem, TextField, AppBar, Paper, Tabs, Tab } from '@material-ui/core'
import ExceutiveScoreboard from './ExceutiveScoreboard'
export default class DashboardCAT extends Component {
constructor(props) {
super(props)
this.state = {
periode: '2020',
perusahaan: 'TAP Group',
tab: 0
}
}
selectTab = (event, newEvent) => {
this.setState({ tab: newEvent })
}
render() {
const perusahaan = [
{ value: 'TAP Group', label: 'TAP Group' },
{ value: '2019', label: '2019' },
{ value: '2018', label: '2018' },
{ value: '2017', label: '2017' },
{ value: '2016', label: '2016' },
]
const periode = [
{ value: '2020', label: '2020' },
{ value: '2019', label: '2019' },
{ value: '2018', label: '2018' },
{ value: '2017', label: '2017' },
{ value: '2016', label: '2016' },
]
return (
<div style={{ height: this.props.height }}>
<div style={{ backgroundColor: '#354960', padding: 28 }}>
<Typography style={{ fontSize: '16px', color: 'white' }}>ON CHANGE CAT</Typography>
</div>
<div className="padding-20px">
<div style={{ marginTop: 20 }}>
<TextField
style={{ width: 250, }}
id="perusahaan"
select
label="Perusahaan"
value={this.state.perusahaan}
onChange={(e) => this.setState({ perusahaan: e.target.value })}
>
{perusahaan.map((option) => (
<MenuItem key={option.value} value={option.value}>
{option.label}
</MenuItem>
))}
</TextField>
</div>
<div style={{ marginTop: 20 }}>
<TextField
style={{ width: 250, }}
id="periode"
select
label="Periode"
value={this.state.periode}
onChange={(e) => this.setState({ periode: e.target.value })}
>
{periode.map((option) => (
<MenuItem key={option.value} value={option.value}>
{option.label}
</MenuItem>
))}
</TextField>
</div>
<Paper style={{ marginTop: 20}}>
<AppBar position="static">
<Tabs indicatorColor="primary" value={this.state.tab} onChange={this.selectTab} aria-label="simple tabs example" style={{ backgroundColor: '#354960', borderColor: 'transparent' }}>
<Tab label="Executive Scoreboard" style={{ color: '#fff', fontSize: 11 }} />
<Tab label="Strategy Map" style={{ color: '#fff', fontSize: 11 }} />
<Tab label="KPIs" style={{ color: '#fff', fontSize: 11 }} />
</Tabs>
</AppBar>
{this.state.tab == 0 ?
<ExceutiveScoreboard />
:
this.state.tab == 1 ?
<span>Testt</span>
:
<span>Test2</span>
}
</Paper>
</div>
</div>
)
}
}
src/container/Laporan/ExceutiveScoreboard.js 0 → 100644
View file @ 9a432228
import React, { Component } from 'react'
import ReactSpeedometer from "react-d3-speedometer"
import { Paper, Typography } from '@material-ui/core'
import Images from '../../assets/Images'
export default class ExceutiveScoreboard extends Component {
constructor(props) {
super(props)
this.state = {
listDummy: [
{ judul: "Overall", kpi: 0, rank: 'BS', value: 3.67, status: 'up' },
{ judul: "Financial", kpi: 5, rank: 'BS', value: 3.67, status: 'up' },
{ judul: "Customer Perspective", kpi: 2, rank: 'B', value: 3.05, status: 'down' },
{ judul: "Internal Perspective", kpi: 5, rank: 'C', value: 2.61, status: 'down' },
{ judul: "Financial", kpi: 5, rank: 'B+', value: 3.52, status: 'up' },
],
selectIndex: null
}
}
render() {
let { selectIndex } = this.state
return (
<div style={{ padding: 20 }}>
<div style={{ display: 'flex', width: '100%', justifyContent: 'space-between', flexFlow: 'wrap' }}>
{this.state.listDummy.map((item, index) => {
return (
<div style={{ padding: 10, backgroundColor: this.state.selectIndex === index ? '#6885a6' : '#fff', borderRadius: 6, paddingBottom: 20, margin: 10, boxShadow: '0 1px 4px 0 rgba(0, 0, 0, 0.25)' }} onClick={() => this.setState({ selectIndex: index })}>
<span style={{ fontSize: '17px', color: this.state.selectIndex === index ? '#fff' : '#7e8085' }}>{item.judul}</span>
<div style={{ backgroundColor: 'transparent', display: 'flex', marginTop: index === 0 ? 54 : 30, placeContent: 'center' }}>
<div>
{index != 0 ?
<div>
<span style={{ textAlign: 'center', fontSize: '24px', color: selectIndex === index ? "#fff" : '#4b4b4b' }}>{item.kpi}</span>
<span style={{ textAlign: 'center', fontSize: '11px', color: selectIndex === index ? "#fff" : '#4b4b4b' }}>KPIs</span> </div> : null}
<div style={{ backgroundColor: index === 2 ? "#7cd532" : index === 3 ? "#fcff00" : index === 4 ? "#00b440" : "#00b1f7", textAlign: 'center', width: 40, height: 21 }}>
<Typography style={{ textAlign: 'center' }}>{item.rank}</Typography>
</div>
</div>
</div>
<ReactSpeedometer
maxSegmentLabels={0}
segmentColors={[
index === 2 ? "#7cd532" : index === 3 ? "#fcff00" : index === 4 ? "#00b440" : "#00b1f7",
"#d8d8d8"
]}
needleColor={this.state.selectIndex === index ? "#fff" : '#4b4b4b'}
value={item.value}
maxValue={5}
customSegmentStops={[0, item.value, 5]}
width={200}
height={140}
ringWidth={25}
textColor={selectIndex === index ? "#fff" : '#4b4b4b'}
/>
<div style={{ backgroundColor: 'transparent', display: 'flex', marginTop: 20, placeContent: 'center' }}>
<div style={{ textAlign: '-webkit-center' }}>
{item.status === "up" ?
<img src={Images.up} /> : <img src={Images.down} />}
<Typography style={{ fontSize: 16, color: this.state.selectIndex === index ? '#fff' : '#4b4b4b' }}>vs Last Month</Typography>
</div>
</div>
</div>
)
})}
</div>
</div>
)
}
}
src/container/MasterData/Perusahaan/Perusahaan.js
View file @ 9a432228
...@@ -8,7 +8,8 @@ import MUIDataTable from "mui-datatables"; ...@@ -8,7 +8,8 @@ import MUIDataTable from "mui-datatables";
import { render } from '@testing-library/react'; import { render } from '@testing-library/react';
import { TextField, InputBase } from "@material-ui/core"; import { TextField, InputBase } from "@material-ui/core";
import { ExcelRenderer } from 'react-excel-renderer'; import { ExcelRenderer } from 'react-excel-renderer';
import CreatePerusahaan from "../Perusahaan/CreatePerusahaan"; import CreatePerusahaan from "./CreatePerusahaan";
import VisualPerusahaan from "./VisualPerusahaan";
import api from "../../../api"; import api from "../../../api";
var ct = require("../../../library/CustomTable"); var ct = require("../../../library/CustomTable");
...@@ -22,6 +23,7 @@ export default class Perusahaan extends Component { ...@@ -22,6 +23,7 @@ export default class Perusahaan extends Component {
this.state = { this.state = {
visibleCreate: false, visibleCreate: false,
visibleEdit: false, visibleEdit: false,
visibleVisual: false,
dataTable: [], dataTable: [],
listData: [], listData: [],
data: [], data: [],
...@@ -319,7 +321,7 @@ export default class Perusahaan extends Component { ...@@ -319,7 +321,7 @@ export default class Perusahaan extends Component {
}} }}
onClick={() => null} onClick={() => null}
> >
<img src={Images.visualisasi} /> <img src={Images.visualisasi} onClick={() => this.setState({ visibleVisual: true, visiblePerusahaan: false })} />
</button> </button>
<button <button
style={{ style={{
...@@ -347,6 +349,12 @@ export default class Perusahaan extends Component { ...@@ -347,6 +349,12 @@ export default class Perusahaan extends Component {
</div> </div>
</div> </div>
: :
this.state.visibleVisual == true ?
<VisualPerusahaan
onClickClose={() => this.setState({ visibleVisual: false, visiblePerusahaan: true })}
height= {this.props.height}
/>
:
<div> <div>
<div style={{ display: 'flex', flexDirection: 'row', justifyContent: 'space-between', paddingRight: 25, paddingLeft: 25, marginTop: -150 }}> <div style={{ display: 'flex', flexDirection: 'row', justifyContent: 'space-between', paddingRight: 25, paddingLeft: 25, marginTop: -150 }}>
<label style={{ color: 'white', fontSize: 16, alignSelf: 'center' }}>Preview Data</label> <label style={{ color: 'white', fontSize: 16, alignSelf: 'center' }}>Preview Data</label>
......
src/container/MasterData/Perusahaan/VisualPerusahaan.js 0 → 100644
View file @ 9a432228
import React, { Component } from 'react';
import { Container, Row, Col } from "react-bootstrap";
import { makeStyles, createMuiTheme, MuiThemeProvider } from '@material-ui/core/styles';
import { TextField } from '@material-ui/core';
import MenuItem from '@material-ui/core/MenuItem';
import Perusahaan from "./Perusahaan";
import TreeView from '@material-ui/lab/TreeView';
import ExpandMoreIcon from '@material-ui/icons/ExpandMore';
import ChevronRightIcon from '@material-ui/icons/ChevronRight';
import TreeItem from '@material-ui/lab/TreeItem';
export default class VisualPerusahaan extends Component {
constructor(props) {
super(props)
this.state = {
}
}
componentDidMount() {
console.log(this.props.height)
}
render() {
return (
<div>
<div style={{ height: this.props.height }}>
<div style={{ width: '100%', backgroundColor: '#354960' }} />
<div>
<div style={{ display: 'flex', flexDirection: 'row', justifyContent: 'space-between', paddingRight: 25, paddingLeft: 25, marginTop: -150 }}>
<label style={{ color: 'white', width: '20%', fontSize: 16, paddingTop: 8 }}>Hirarki Perusahaan</label>
</div>
<div style={{ padding: 25, width: '100%' }}>
<div style={{ width: '100%', padding: 25, backgroundColor: 'white', borderRadius: 6, border: 'solid 1px #c4c4c4'}}>
<TreeView
defaultCollapseIcon={<ExpandMoreIcon />}
defaultExpandIcon={<ChevronRightIcon />}
>
<TreeItem nodeId="1" label="Triputra Investindo Arya">
<TreeItem nodeId="2" label="TAP Group" >
<TreeItem nodeId="3" label="Gawi Bandep Sawit" />
<TreeItem nodeId="4" label="Etam Buana Lestari" />
</TreeItem>
<TreeItem nodeId="11" label="Puninar Group">
<TreeItem nodeId="21" label="TAP Group" >
<TreeItem nodeId="31" label="Gawi Bandep Sawit" />
<TreeItem nodeId="41" label="Etam Buana Lestari" />
</TreeItem>
</TreeItem>
<TreeItem nodeId="12" label="Daya Group">
<TreeItem nodeId="22" label="TAP Group" >
<TreeItem nodeId="32" label="Gawi Bandep Sawit" />
<TreeItem nodeId="42" label="Etam Buana Lestari" />
</TreeItem>
</TreeItem>
</TreeItem>
<TreeItem nodeId="5" label="Documents">
<TreeItem nodeId="10" label="OSS" />
<TreeItem nodeId="6" label="Material-UI">
<TreeItem nodeId="7" label="src">
<TreeItem nodeId="8" label="index.js" />
<TreeItem nodeId="9" label="tree-view.js" />
</TreeItem>
</TreeItem>
</TreeItem>
</TreeView>
</div>
</div>
<div className="row" style={{ display: 'flex', flexDirection: 'row', justifyContent: 'space-between', paddingRight: 15, paddingLeft: 15, paddingBottom: 25 }}>
<div onClick={() => this.props.onClickClose()} style={{ width: 102, height: 30, marginLeft: 25, backgroundColor: 'dodgerblue', borderRadius: 5, alignItems: 'center', display: 'flex', justifyContent: 'center', cursor:"pointer" }}>
<span style={{ color: '#fff', fontSize: 11 }}>Kembali</span>
</div>
<div className="row" style={{ float: 'right', marginRight: 25 }}>
<div onClick={() => this.props.onClickClose()} style={{ width: 102, height: 30, border: 'solid 1px #354960', borderRadius: 5, alignItems: 'center', display: 'flex', justifyContent: 'center', cursor:"pointer" }}>
<span style={{ color: '#354960', fontSize: 11 }} >Batal</span>
</div>
<div style={{ width: 102, height: 30, marginLeft: 25, backgroundColor: '#354960', borderRadius: 5, alignItems: 'center', display: 'flex', justifyContent: 'center', cursor:"pointer" }}>
<span style={{ color: '#fff', fontSize: 11 }}>Simpan</span>
</div>
</div>
</div>
</div>
</div>
</div>
);
}
}
src/container/MasterData/UnitBisnis.js
View file @ 9a432228
...@@ -58,6 +58,7 @@ export default class UnitBisnis extends Component { ...@@ -58,6 +58,7 @@ export default class UnitBisnis extends Component {
let body = { let body = {
business_unit: payload business_unit: payload
} }
this.setState({ payload: body })
api.create().checkUploadUnitBisnis(body).then(response => { api.create().checkUploadUnitBisnis(body).then(response => {
// console.log(response); // console.log(response);
let dataRow = response.data.data.map((item, index) => { let dataRow = response.data.data.map((item, index) => {
...@@ -79,6 +80,9 @@ export default class UnitBisnis extends Component { ...@@ -79,6 +80,9 @@ export default class UnitBisnis extends Component {
let check = null let check = null
if (tableMeta.rowData[4] != null) { if (tableMeta.rowData[4] != null) {
check = tableMeta.rowData[4].findIndex((val) => val.field.includes('business_unit_name')) check = tableMeta.rowData[4].findIndex((val) => val.field.includes('business_unit_name'))
if (check > -1) {
this.setState({ buttonError: true })
}
} }
return ( return (
<div style={{ display: 'flex' }}> <div style={{ display: 'flex' }}>
...@@ -101,6 +105,9 @@ export default class UnitBisnis extends Component { ...@@ -101,6 +105,9 @@ export default class UnitBisnis extends Component {
let check = null let check = null
if (tableMeta.rowData[4] != null) { if (tableMeta.rowData[4] != null) {
check = tableMeta.rowData[4].findIndex((val) => val.field.includes('start_date')) check = tableMeta.rowData[4].findIndex((val) => val.field.includes('start_date'))
if (check > -1) {
this.setState({ buttonError: true })
}
} }
return ( return (
<div style={{ display: 'flex' }}> <div style={{ display: 'flex' }}>
...@@ -123,6 +130,9 @@ export default class UnitBisnis extends Component { ...@@ -123,6 +130,9 @@ export default class UnitBisnis extends Component {
let check = null let check = null
if (tableMeta.rowData[4] != null) { if (tableMeta.rowData[4] != null) {
check = tableMeta.rowData[4].findIndex((val) => val.field.includes('end_date')) check = tableMeta.rowData[4].findIndex((val) => val.field.includes('end_date'))
if (check > -1) {
this.setState({ buttonError: true })
}
} }
return ( return (
<div style={{ display: 'flex' }}> <div style={{ display: 'flex' }}>
...@@ -264,6 +274,14 @@ export default class UnitBisnis extends Component { ...@@ -264,6 +274,14 @@ export default class UnitBisnis extends Component {
} }
} }
uploadUnitBisnis() {
api.create().uploadUnitBisnis(this.state.payload).then(response => {
console.log(response)
this.getData()
this.setState({ visibleUnitBisnis: true })
})
}
render() { render() {
const columns = [{ const columns = [{
name: "Action", name: "Action",
...@@ -432,9 +450,28 @@ export default class UnitBisnis extends Component { ...@@ -432,9 +450,28 @@ export default class UnitBisnis extends Component {
<span style={{ color: '#354960', fontSize: 11 }}>Batal</span> <span style={{ color: '#354960', fontSize: 11 }}>Batal</span>
</div> </div>
</button> </button>
{this.state.buttonError === true ?
<a data-tip={'Terdapat Error saat import data'} data-for="button">
<button
type="button"
onClick={() => null}
style={{}}
>
<div style={{ width: 102, height: 30, backgroundColor: '#354960', borderRadius: 5, alignItems: 'center', display: 'flex', justifyContent: 'center' }}>
<span style={{ color: '#fff', fontSize: 11 }}>Simpan</span>
</div>
</button>
</a> :
<button
type="button"
onClick={() => this.uploadUnitBisnis()}
style={{}}
>
<div style={{ width: 102, height: 30, backgroundColor: '#354960', borderRadius: 5, alignItems: 'center', display: 'flex', justifyContent: 'center' }}> <div style={{ width: 102, height: 30, backgroundColor: '#354960', borderRadius: 5, alignItems: 'center', display: 'flex', justifyContent: 'center' }}>
<span style={{ color: '#fff', fontSize: 11 }}>Simpan</span> <span style={{ color: '#fff', fontSize: 11 }}>Simpan</span>
</div> </div>
</button>}
<ReactTooltip border={true} id="button" place="top" type="light" effect="solid" />
</div> </div>
</div> </div>
} }
......
src/container/Profile.js
View file @ 9a432228
This diff is collapsed.
src/library/Array.js
View file @ 9a432228
...@@ -33,7 +33,7 @@ const arraySide = [ ...@@ -33,7 +33,7 @@ const arraySide = [
{ {
img: 'beranda', img: 'beranda',
label: 'Dashboard CAT', label: 'Dashboard CAT',
path: 'beranda', path: 'dashboard-cat',
}, },
{ {
img: 'beranda', img: 'beranda',
......
src/router/homeRoutes.js
View file @ 9a432228
...@@ -11,6 +11,7 @@ import Perusahaan from '../container/MasterData/Perusahaan/Perusahaan'; ...@@ -11,6 +11,7 @@ import Perusahaan from '../container/MasterData/Perusahaan/Perusahaan';
import UnitBisnis from '../container/MasterData/UnitBisnis' import UnitBisnis from '../container/MasterData/UnitBisnis'
import ItemLaporan from '../container/MasterData/ItemLaporan' import ItemLaporan from '../container/MasterData/ItemLaporan'
import Parameter from '../container/MasterData/Parameter/Parameter' import Parameter from '../container/MasterData/Parameter/Parameter'
import DashboardCAT from '../container/Laporan/DashboardCAT'
const routes = [ const routes = [
{ {
...@@ -53,6 +54,10 @@ const routes = [ ...@@ -53,6 +54,10 @@ const routes = [
path: "/home/parameter", path: "/home/parameter",
main: Parameter main: Parameter
}, },
{
path: "/home/dashboard-cat",
main: DashboardCAT
},
{ {
path: "*", path: "*",
main: screen404 main: screen404
......
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