Skip to content

T
Tia-dev
Commit 7ef4b9a7 authored by Dida Adams Arizona's avatar Dida Adams Arizona
Browse files
Options

Merge branch 'GGMAC' into 'master' 

Ggmac

See merge request !1504
parents 7fcd3a61 0265703b
Show whitespace changes
Inline Side-by-side
Showing with 72 additions and 25 deletions
src/container/Laporan/DashboardFinancial.js
View file @ 7ef4b9a7
......@@ -514,8 +514,8 @@ export default class DashboardFinancial extends React.Component {
type: 'value',
name: '(Rp mn)',
min: minRev,
max: maxRev,
interval: intervalRev,
// max: maxRev,
// interval: intervalRev,
axisLabel: {
interval: 0,
// rotate: 10,
......@@ -533,8 +533,8 @@ export default class DashboardFinancial extends React.Component {
type: 'value',
name: '(Rp mn)',
min: minRev,
max: maxRev,
interval: intervalRev,
// max: maxRev,
// interval: intervalRev,
axisLabel: {
interval: 0,
textStyle: {
......@@ -549,7 +549,7 @@ export default class DashboardFinancial extends React.Component {
name: '(%)',
min: 0,
max: 100,
interval: 20,
// interval: 20,
axisLabel: {
formatter: '{value}%',
interval: 0,
......@@ -646,8 +646,8 @@ export default class DashboardFinancial extends React.Component {
type: 'value',
name: '(Rp mn)',
min: minTPAT,
max: maxTPAT,
interval: intervalTPAT
// max: maxTPAT,
// interval: intervalTPAT
}
] :
[
......@@ -655,8 +655,8 @@ export default class DashboardFinancial extends React.Component {
type: 'value',
name: '(Rp mn)',
min: minTPAT,
max: maxTPAT,
interval: intervalTPAT,
// max: maxTPAT,
// interval: intervalTPAT,
axisLabel: {
interval: 0,
textStyle: {
......@@ -771,8 +771,8 @@ export default class DashboardFinancial extends React.Component {
type: 'value',
name: '(Rp mn)',
min: minEBITDA,
max: maxEBITDA,
interval: intervalEBITDA,
// max: maxEBITDA,
// interval: intervalEBITDA,
axisLabel: {
interval: 0,
textStyle: {
......@@ -788,8 +788,8 @@ export default class DashboardFinancial extends React.Component {
type: 'value',
name: '(Rp mn)',
min: minEBITDA,
max: maxEBITDA,
interval: intervalEBITDA,
// max: maxEBITDA,
// interval: intervalEBITDA,
axisLabel: {
interval: 0,
textStyle: {
......@@ -900,8 +900,8 @@ export default class DashboardFinancial extends React.Component {
type: 'value',
name: '(Rp mn)',
min: minTA,
max: maxTA,
interval: intervalTA
// max: maxTA,
// interval: intervalTA
}
]
,
......
src/container/Laporan/KPIs.js
View file @ 7ef4b9a7
......@@ -21,7 +21,7 @@ export default class StrategiMap extends Component {
}
componentDidMount() {
this.setState({loading: true})
this.setState({ loading: true })
this.olahDataKPI()
}
......@@ -88,7 +88,7 @@ export default class StrategiMap extends Component {
sortMin = [minYOY]
sortMax = [maxYOY]
}
arrayNodes.push({ ...itemz, trends: {act, mbv, yoy, minACT, maxACT, minMBV, maxMBV, minYOY, maxYOY, sortMin, sortMax} })
arrayNodes.push({ ...itemz, trends: { act, mbv, yoy, minACT, maxACT, minMBV, maxMBV, minYOY, maxYOY, sortMin, sortMax } })
})
arrayNew.push({ ...item, nodes: arrayNodes })
})
......@@ -151,6 +151,49 @@ export default class StrategiMap extends Component {
.map(w => w[0].toUpperCase() + w.substr(1).toLowerCase())
.join(' ')
}
const handleIsHigher = (item) => {
let actMo = 0
let prevMo = 0
let isHigh = 'false'
let trends = [...item.trends.act]
let trendsLength = trends.length
if (trendsLength < 2) {
actMo = trends[0]
} else {
actMo = trends[trendsLength-1]
prevMo = trends[trendsLength-2]
}
if (actMo > prevMo) {
isHigh = 'true'
} else if (actMo == prevMo) {
isHigh = 'same'
} else {
isHigh = 'false'
}
return isHigh
}
const handleColorAch = (item) => {
let actMR = 0
let actMB = 0
let isHigh = false
let trendsAct = [...item.trends.act]
let trendsMB = [...item.trends.mbv]
let trendsActLength = trendsAct.length
let trendsMBLength = trendsMB.length
actMR = trendsAct[trendsActLength-1]
actMB = trendsMB[trendsMBLength-1]
if (actMR < actMB) {
isHigh = false
} else {
isHigh = true
}
return isHigh
}
return (
<div style={{ padding: 20, width: this.props.width }}>
<Paper style={{ borderRadius: 10, boxShadow: '0 0 4px 0 rgba(0, 0, 0, 0.5)', padding: 20 }}>
......@@ -180,7 +223,7 @@ export default class StrategiMap extends Component {
loading: true,
}, () => {
setTimeout(() => {
this.setState({loading: false})
this.setState({ loading: false })
}, 500);
})
}}
......@@ -222,7 +265,7 @@ export default class StrategiMap extends Component {
}, () => {
this.setState({ checkAll: this.state.checkYoy && this.state.checkAB && this.state.checkYTD }, () => {
setTimeout(() => {
this.setState({loading: false})
this.setState({ loading: false })
}, 500);
})
})
......@@ -241,7 +284,7 @@ export default class StrategiMap extends Component {
this.setState({ checkAB: !this.state.checkAB, loading: true }, () => {
this.setState({ checkAll: this.state.checkYoy && this.state.checkAB && this.state.checkYTD }, () => {
setTimeout(() => {
this.setState({loading: false})
this.setState({ loading: false })
}, 500);
})
})
......@@ -260,7 +303,7 @@ export default class StrategiMap extends Component {
this.setState({ checkYoy: !this.state.checkYoy, loading: true }, () => {
this.setState({ checkAll: this.state.checkYoy && this.state.checkAB && this.state.checkYTD }, () => {
setTimeout(() => {
this.setState({loading: false})
this.setState({ loading: false })
}, 500);
})
})
......@@ -491,18 +534,22 @@ export default class StrategiMap extends Component {
{/* <Typography style={{ color: '#656565', fontWeight: 'bold', fontSize: 12 }}>{item.current_value}</Typography> */}
</div>
<div style={{ width: '10%', display: 'flex', justifyContent: 'center', alignItems: 'center' }}>
<div style={{ display: 'flex', justifyContent: 'center', alignItems: 'center', backgroundColor: item.achievement == '-' || item.achievement == "" ? 'transparent' : item.is_higher == false ? '#ff0000' : 'green', height: 70, width: 105, marginRight: 20 }}>
<div style={{ display: 'flex', justifyContent: 'center', alignItems: 'center', backgroundColor: item.achievement == '-' || item.achievement == "" ? 'transparent' : handleColorAch(item) ? 'green' : '#ff0000', height: 70, width: 105, marginRight: 20 }}>
{item.achievement == '-' || item.achievement == "" ?
<Typography style={{ color: '#fff', fontWeight: 'bold', fontSize: 12 }}>{item.achievement}</Typography>
<Typography style={{ color: '#fff', fontWeight: 'bold', fontSize: 12 }}>-</Typography>
:
<Typography style={{ color: '#fff', fontWeight: 'bold', fontSize: 12 }}><NumberFormat value={this.handleAch(item.achievement)} displayType={'text'} thousandSeparator={true} suffix={'%'} /></Typography>}
</div>
</div>
<div style={{ width: '5%', display: 'grid', alignContent: 'center' }}>
{item.is_higher == '-' ?
{item.trends.act.length == 0 ?
<Typography style={{ color: '#656565', fontWeight: 'bold', fontSize: 12 }}>-</Typography>
:
(handleIsHigher(item) == 'same' ?
<Typography style={{ color: '#656565', fontWeight: 'bold', fontSize: 12 }}>-</Typography>
:
<img src={item.is_higher == false ? Images.down : Images.up} />
<img src={handleIsHigher(item) == 'true' ? Images.up : Images.down} />
)
}
</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