Commit 73ba4332 authored by d.arizona's avatar d.arizona

push dulu

parent 0ce1f436
...@@ -281,7 +281,7 @@ const create = (type = "") => { ...@@ -281,7 +281,7 @@ const create = (type = "") => {
const getReportFRMR = (body) => api.post('/transaction/summary_ratio/monthly_report/get_report_hierarki', body) const getReportFRMR = (body) => api.post('/transaction/summary_ratio/monthly_report/get_report_hierarki', body)
const getReportFRLastMR = (body) => api.post('/transaction/summary_ratio/monthly_report_last_year/get_report_hierarki', body) const getReportFRLastMR = (body) => api.post('/transaction/summary_ratio/monthly_report_last_year/get_report_hierarki', body)
const getReportBSSuma = (body) => api.post('/transaction/summary_balance_sheet/summary/get_report_hierarki', body) const getReportBSSuma = (body) => api.post('/transaction/summary_balance_sheet/summary/get_report_hierarki', body)
const getDashboardCAT = (body) => api.post('/dashboard/cat', body) const getDashboardCAT = (body) => api.post('/transaction/dashboard/get_dashboard_cat', body)
const getHierarkiReportYtd = (body) => api.post('/transaction/summary_ytd/summary/get_report_hierarki', body) const getHierarkiReportYtd = (body) => api.post('/transaction/summary_ytd/summary/get_report_hierarki', body)
const getHierarkiReportHistorical = (body) => api.post('/transaction/summary_historical/summary/get_report_hierarki', body) const getHierarkiReportHistorical = (body) => api.post('/transaction/summary_historical/summary/get_report_hierarki', body)
const getHierarkiReportMTD = (body) => api.post('/transaction/summary_mtd/summary/get_report_hierarki', body) const getHierarkiReportMTD = (body) => api.post('/transaction/summary_mtd/summary/get_report_hierarki', body)
......
This diff is collapsed.
This diff is collapsed.
...@@ -232,15 +232,19 @@ export default class DashboardCAT extends Component { ...@@ -232,15 +232,19 @@ export default class DashboardCAT extends Component {
getDasboardCAT() { getDasboardCAT() {
let payload = { let payload = {
"company_id" : this.state.company.company_id, "company_id" : this.state.company.company_id,
"year" : this.state.periode.periode "periode" : this.state.periode.periode,
"months": this.state.month.month_id
} }
let dataDashboard = []
api.create().getDashboardCAT(payload).then((res) => { api.create().getDashboardCAT(payload).then((res) => {
if (res.data.status == 'success') { if (res.data.status == 'success') {
console.log(res) console.log(res)
this.setState({loading: false, dataDashboard: res.data.data}) // let resp = res.data.data
} else { this.setState({loading: false, dataDashboard : res.data.data})
this.setState({loading: false})
} }
// else {
// this.setState({loading: false})
// }
// conole.log(JSON.stringify(payload)) // conole.log(JSON.stringify(payload))
}) })
} }
...@@ -332,7 +336,7 @@ export default class DashboardCAT extends Component { ...@@ -332,7 +336,7 @@ export default class DashboardCAT extends Component {
</div> </div>
</div> </div>
{!this.state.loading && this.state.dataDashboard.length > 0 && <div className="padding-20px" style={{ display: 'flex' }}> {!this.state.loading && <div className="padding-20px" style={{ display: 'flex' }}>
<Paper style={{ marginTop: 10, }}> <Paper style={{ marginTop: 10, }}>
<AppBar position="static" style={{ borderTopRightRadius: 10, borderTopLeftRadius: 10 }}> <AppBar position="static" style={{ borderTopRightRadius: 10, borderTopLeftRadius: 10 }}>
<Tabs indicatorColor="primary" value={this.state.tab} onChange={this.selectTab} aria-label="simple tabs example" style={{ backgroundColor: '#354960', borderColor: 'transparent',borderTopRightRadius: 10, borderTopLeftRadius: 10 }}> <Tabs indicatorColor="primary" value={this.state.tab} onChange={this.selectTab} aria-label="simple tabs example" style={{ backgroundColor: '#354960', borderColor: 'transparent',borderTopRightRadius: 10, borderTopLeftRadius: 10 }}>
......
import React, { Component } from 'react' import React, { Component } from 'react'
import { Paper, Typography } from '@material-ui/core' // import { Paper, Typography } from '@material-ui/core'
import Images from '../../assets/Images' import Images from '../../assets/Images'
import { GridList, Paper, Typography, GridListTile } from '@material-ui/core'
export default class StrategiMap extends Component { export default class StrategiMap extends Component {
constructor(props) {
super(props)
this.state = {
dataStrategy: this.props.data.strategy_map.category
}
}
componentDidMount() {
console.log(this.props.data.strategy_map);
}
render() { render() {
return ( return (
<div style={{ padding: 20 }}> <div style={{ padding: 20 }}>
<Paper style={{ borderRadius: 10, boxShadow: '0 0 4px 0 rgba(0, 0, 0, 0.5)' }}> <Paper style={{ borderRadius: 10, boxShadow: '0 0 4px 0 rgba(0, 0, 0, 0.5)', width: '100%' }}>
<div style={{ height: 56, borderTopLeftRadius: 10, borderTopRightRadius: 10, backgroundColor: '#f1f1f1', display: 'flex' }}> <div style={{ height: 56, borderTopLeftRadius: 10, borderTopRightRadius: 10, backgroundColor: '#f1f1f1', display: 'flex' }}>
<div style={{ width: '25%', borderRight: 'solid 1px #d8d8d8', display: 'grid', alignContent: 'center', paddingLeft: 20 }}> <div style={{ width: '25%', borderRight: 'solid 1px #d8d8d8', display: 'grid', alignContent: 'center', paddingLeft: 20 }}>
<Typography style={{ color: '#656565', fontWeight: 'bold', fontSize: 12 }}>Category</Typography> <Typography style={{ color: '#656565', fontWeight: 'bold', fontSize: 12 }}>Category</Typography>
...@@ -15,49 +28,45 @@ export default class StrategiMap extends Component { ...@@ -15,49 +28,45 @@ export default class StrategiMap extends Component {
<Typography style={{ color: '#656565', fontWeight: 'bold', fontSize: 12 }}>KPI</Typography> <Typography style={{ color: '#656565', fontWeight: 'bold', fontSize: 12 }}>KPI</Typography>
</div> </div>
</div> </div>
{this.state.dataStrategy.map((item, index) => {
return (
<div style={{ display: 'flex' }}> <div style={{ display: 'flex' }}>
<div style={{ width: '25%', borderRight: 'solid 1px #d8d8d8', display: 'grid', paddingLeft: 20, paddingTop: 20 }}> <div style={{ width: '25%', borderRight: 'solid 1px #d8d8d8', display: 'grid', paddingLeft: 20, paddingTop: 20 }}>
<div style={{ borderBottom: 'solid 1px #d8d8d8' }}> <div style={{ borderBottom: 'solid 1px #d8d8d8' }}>
<Typography style={{ color: '#656565', fontWeight: 'bold', fontSize: 14, fontFamily: 'Nunito Sans, sans-serif' }}>Financial Perspective</Typography> <Typography style={{ color: '#656565', fontWeight: 'bold', fontSize: 14, fontFamily: 'Nunito Sans, sans-serif' }}>{item.category_name}</Typography>
</div> </div>
</div> </div>
<div style={{ width: '75%', borderRight: 'solid 1px #d8d8d8', paddingRight: 20 }}> <div style={{ width: '75%', borderRight: 'solid 1px #d8d8d8', paddingRight: 20 }}>
<div style={{ display: 'flex', alignContent: 'center', padding: 20, borderBottom: 'solid 1px #d8d8d8' }}> <div style={{ display: 'flex', alignContent: 'center', padding: 20, borderBottom: 'solid 1px #d8d8d8' }}>
<div style={{ display: 'flex', width: 220, borderRadius: 6 }}> <GridList cellHeight={100} cols={3}>
<div style={{ display: 'grid', alignContent: 'center', backgroundColor: '#6885a6', width: 152, borderTopLeftRadius: 6, borderBottomLeftRadius: 6 }}> {item.nodes.length < 1?
<Typography style={{ color: '#fff', fontSize: 12, justifySelf: 'center' }}>Revenue</Typography> <div style={{height: 75}}/>
</div> :
<div style={{ backgroundColor: '#cbf4a8', width: 68, borderTopRightRadius: 6, borderBottomRightRadius: 6, textAlign: 'center', paddingTop: 10, paddingBottom: 10 }}> item.nodes.map((items, indexs) => {
<img src={Images.up} /> return (
<Typography style={{ color: '#4b4b4b', fontSize: 10, textAlign: 'center' }}>{'vs'}</Typography> <GridListTile key={items} cols={item.nodes.length == 1? 3 : item.nodes.length == 2? 2 : 1} style={{}}>
<Typography style={{ color: '#4b4b4b', fontSize: 10, textAlign: 'center' }}>{'Last Month'}</Typography> <div style={{ display: 'flex', minWidth: 5, borderRadius: 6, marginLeft: 10}}>
</div> <div style={{ display: 'grid', alignContent: 'center', backgroundColor: '#6885a6', width: 5, borderTopLeftRadius: 6, borderBottomLeftRadius: 6, padding: 10 }}>
</div> <Typography style={{ color: '#fff', fontSize: 12, textAlign: 'center' }}>{items.item_name}</Typography>
<div style={{ display: 'flex', width: 220, borderRadius: 6, marginLeft: 20 }}>
<div style={{ display: 'grid', alignContent: 'center', backgroundColor: '#6885a6', width: 152, borderTopLeftRadius: 6, borderBottomLeftRadius: 6 }}>
<Typography style={{ color: '#fff', fontSize: 12, justifySelf: 'center' }}>EDITDA</Typography>
</div>
<div style={{ backgroundColor: '#cbf4a8', width: 68, borderTopRightRadius: 6, borderBottomRightRadius: 6, textAlign: 'center', paddingTop: 10, paddingBottom: 10 }}>
<img src={Images.up} />
<Typography style={{ color: '#4b4b4b', fontSize: 10, textAlign: 'center' }}>{'vs'}</Typography>
<Typography style={{ color: '#4b4b4b', fontSize: 10, textAlign: 'center' }}>{'Last Month'}</Typography>
</div>
</div>
<div style={{ display: 'flex', width: 220, borderRadius: 6, marginLeft: 20 }}>
<div style={{ display: 'grid', alignContent: 'center', backgroundColor: '#6885a6', width: 152, borderTopLeftRadius: 6, borderBottomLeftRadius: 6 }}>
<Typography style={{ color: '#fff', fontSize: 12, justifySelf: 'center' }}>TPAT</Typography>
</div> </div>
<div style={{ backgroundColor: '#faaaaa', width: 68, borderTopRightRadius: 6, borderBottomRightRadius: 6, textAlign: 'center', paddingTop: 10, paddingBottom: 10 }}> <div style={{ backgroundColor: items.is_higher ? '#cbf4a8' : '#faaaaa', width: 68, borderTopRightRadius: 6, borderBottomRightRadius: 6, textAlign: 'center', paddingTop: 10, paddingBottom: 10 }}>
<img src={Images.down} /> <img src={items.is_higher ? Images.up : Images.down} />
<Typography style={{ color: '#4b4b4b', fontSize: 10, textAlign: 'center' }}>{'vs'}</Typography> <Typography style={{ color: '#4b4b4b', fontSize: 10, textAlign: 'center' }}>{'vs'}</Typography>
<Typography style={{ color: '#4b4b4b', fontSize: 10, textAlign: 'center' }}>{'Last Month'}</Typography> <Typography style={{ color: '#4b4b4b', fontSize: 10, textAlign: 'center' }}>{'Last Month'}</Typography>
</div> </div>
</div> </div>
</GridListTile>
)
})}
</GridList>
</div> </div>
</div> </div>
</div> </div>
)
})}
<div style={{ display: 'flex' }}> {/* <div style={{ display: 'flex' }}>
<div style={{ width: '25%', borderRight: 'solid 1px #d8d8d8', display: 'grid', paddingLeft: 20, paddingTop: 20 }}> <div style={{ width: '25%', borderRight: 'solid 1px #d8d8d8', display: 'grid', paddingLeft: 20, paddingTop: 20 }}>
<div style={{ borderBottom: 'solid 1px #d8d8d8' }}> <div style={{ borderBottom: 'solid 1px #d8d8d8' }}>
<Typography style={{ color: '#656565', fontWeight: 'bold', fontSize: 14, fontFamily: 'Nunito Sans, sans-serif' }}>Customer Perspective</Typography> <Typography style={{ color: '#656565', fontWeight: 'bold', fontSize: 14, fontFamily: 'Nunito Sans, sans-serif' }}>Customer Perspective</Typography>
...@@ -149,7 +158,7 @@ export default class StrategiMap extends Component { ...@@ -149,7 +158,7 @@ export default class StrategiMap extends Component {
</div> </div>
</div> </div>
</div> </div>
</div> </div> */}
</Paper> </Paper>
</div> </div>
......
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