Skip to content

T
Tia-dev
Commit eab60727 authored by d.arizona's avatar d.arizona
Browse files
Options

update issue CAT

parent ac2ecfd3
Hide whitespace changes
Inline Side-by-side
Showing with 72 additions and 25 deletions
src/container/Laporan/DashboardFinancial.js
View file @ eab60727
......@@ -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 @ eab60727
......@@ -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>
:
<img src={item.is_higher == false ? Images.down : Images.up} />
(handleIsHigher(item) == 'same' ?
<Typography style={{ color: '#656565', fontWeight: 'bold', fontSize: 12 }}>-</Typography>
:
<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