Skip to content

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

BISMILLAH_FIX_FINAL

parent 550e0882
Show whitespace changes
Inline Side-by-side
Showing with 650 additions and 106 deletions
src/container/BudgetTahunan.js
View file @ 32de7146
...@@ -1345,8 +1345,11 @@ export default class BudgetTahunan extends Component { ...@@ -1345,8 +1345,11 @@ export default class BudgetTahunan extends Component {
periode={this.state.periode.periode} periode={this.state.periode.periode}
submissionID={this.state.submissionID} submissionID={this.state.submissionID}
saveToMasterBudget={this.saveToMasterBudget.bind(this)} saveToMasterBudget={this.saveToMasterBudget.bind(this)}
onClickClose={() => this.setState({ visibleCF: false, visibleBudgetTahunan: true })} onClickClose={() => this.setState({ visibleCAT: false, visibleBudgetTahunan: true })}
getReport={this.getSubmission.bind(this)} getReport={this.getSubmission.bind(this)}
isApprover={this.state.isApprover}
status={this.state.status}
lastStatus={this.state.lastStatus}
prevRevision={this.state.isSubmit ? this.state.prevRevision : true} prevRevision={this.state.isSubmit ? this.state.prevRevision : true}
/> />
)} )}
......
src/container/BudgetTahunan/CashFlow.js
View file @ 32de7146
import { createMuiTheme, MuiThemeProvider, Paper, TableCell, Typography } from '@material-ui/core' import { createMuiTheme, FormControlLabel, MuiThemeProvider, Paper, TableCell, Tooltip, Typography, withStyles } from '@material-ui/core'
import MUIDataTable from 'mui-datatables'; import MUIDataTable from 'mui-datatables';
import React, { Component } from 'react' import React, { Component } from 'react'
import NumberFormat from 'react-number-format';
import ReactTooltip from 'react-tooltip'; import ReactTooltip from 'react-tooltip';
import api from '../../api';
import Images from '../../assets/Images'; import Images from '../../assets/Images';
var ct = require("../../library/CustomTable"); var ct = require("../../library/CustomTable");
const getMuiTheme = () => createMuiTheme(ct.customTable3()); const getMuiTheme = () => createMuiTheme(ct.customTable3());
...@@ -19,21 +21,142 @@ const style2 = { ...@@ -19,21 +21,142 @@ const style2 = {
zIndex: 100 zIndex: 100
}; };
const LightTooltip = withStyles((theme) => ({
tooltip: {
backgroundColor: theme.palette.common.white,
color: 'rgba(0, 0, 0, 0.87)',
boxShadow: theme.shadows[1],
fontSize: 11,
},
}))(Tooltip);
export default class CashFlow extends Component { export default class CashFlow extends Component {
constructor(props) { constructor(props) {
super(props) super(props)
this.state = { this.state = {
dataTable: ["Cashflow", {title: 'MB 2021', data : {3: '3', 4: '4', 5: '5', 6: '6', 7: '7', 8: '8', 9: '9', 10: '10', 11: '11', 12: '12'}}, null, "2022", "2023" ] dataTable: []
} }
} }
componentDidMount() { componentDidMount() {
this.setState({loading: true}) this.setState({loading: true})
this.getItemHierarki()
}
getItemHierarki() {
this.setState({ loading: true })
let payload = {
"report_id": this.props.report_id,
"revision": Number(this.props.revision),
"periode": this.props.periode,
"company_id": this.props.company.company_id,
"submission_id": this.props.submissionID
}
// console.log(JSON.stringify(payload))
api.create().getDetailReportMB(payload).then(response => {
let dataTable = []
console.log(response)
let res = response.data.data
const handlePushChild = (item) => {
dataTable.push([
item.type_report_id,
item.id,
item.parent,
item.formula,
item.level,
item.description,
item.cash_flow.total_actual_before === null ? "0" : item.cash_flow.total_actual_before === "" ? "0" : item.cash_flow.total_actual_before,
item.type_report_id == 5 || item.type_report_id == 6 ? { value: item.cash_flow.january, formula: item.cash_flow.january_formula } : item.cash_flow.january,
item.type_report_id == 5 || item.type_report_id == 6 ? { value: item.cash_flow.february, formula: item.cash_flow.february_formula } : item.cash_flow.february,
item.type_report_id == 5 || item.type_report_id == 6 ? { value: item.cash_flow.march, formula: item.cash_flow.march_formula } : item.cash_flow.march,
item.type_report_id == 5 || item.type_report_id == 6 ? { value: item.cash_flow.april, formula: item.cash_flow.april_formula } : item.cash_flow.april,
item.type_report_id == 5 || item.type_report_id == 6 ? { value: item.cash_flow.may, formula: item.cash_flow.may_formula } : item.cash_flow.may,
item.type_report_id == 5 || item.type_report_id == 6 ? { value: item.cash_flow.june, formula: item.cash_flow.june_formula } : item.cash_flow.june,
item.type_report_id == 5 || item.type_report_id == 6 ? { value: item.cash_flow.july, formula: item.cash_flow.july_formula } : item.cash_flow.july,
item.type_report_id == 5 || item.type_report_id == 6 ? { value: item.cash_flow.august, formula: item.cash_flow.august_formula } : item.cash_flow.august,
item.type_report_id == 5 || item.type_report_id == 6 ? { value: item.cash_flow.september, formula: item.cash_flow.september_formula } : item.cash_flow.september,
item.type_report_id == 5 || item.type_report_id == 6 ? { value: item.cash_flow.october, formula: item.cash_flow.october_formula } : item.cash_flow.october,
item.type_report_id == 5 || item.type_report_id == 6 ? { value: item.cash_flow.november, formula: item.cash_flow.november_formula } : item.cash_flow.november,
item.type_report_id == 5 || item.type_report_id == 6 ? { value: item.cash_flow.december, formula: item.cash_flow.december_formula } : item.cash_flow.december,
item.cash_flow.total_current_year,
item.type_report_id == 5 || item.type_report_id == 6 ? 0 : item.cash_flow.total_next_year,
item.type_report_id == 5 || item.type_report_id == 6 ? 0 : item.cash_flow.total_more_year,
item.order
])
if (item.children !== null) {
if (item.children.length > 0) {
item.children.map((items, indexs) => {
handlePushChild(items)
})
}
}
}
res.map((item, index) => {
dataTable.push([
item.type_report_id,
item.id,
item.parent,
item.formula,
item.level,
item.description,
item.cash_flow.total_actual_before === null ? "0" : item.cash_flow.total_actual_before === "" ? "0" : item.cash_flow.total_actual_before,
item.type_report_id == 5 || item.type_report_id == 6 ? { value: item.cash_flow.january, formula: item.cash_flow.january_formula } : item.cash_flow.january,
item.type_report_id == 5 || item.type_report_id == 6 ? { value: item.cash_flow.february, formula: item.cash_flow.february_formula } : item.cash_flow.february,
item.type_report_id == 5 || item.type_report_id == 6 ? { value: item.cash_flow.march, formula: item.cash_flow.march_formula } : item.cash_flow.march,
item.type_report_id == 5 || item.type_report_id == 6 ? { value: item.cash_flow.april, formula: item.cash_flow.april_formula } : item.cash_flow.april,
item.type_report_id == 5 || item.type_report_id == 6 ? { value: item.cash_flow.may, formula: item.cash_flow.may_formula } : item.cash_flow.may,
item.type_report_id == 5 || item.type_report_id == 6 ? { value: item.cash_flow.june, formula: item.cash_flow.june_formula } : item.cash_flow.june,
item.type_report_id == 5 || item.type_report_id == 6 ? { value: item.cash_flow.july, formula: item.cash_flow.july_formula } : item.cash_flow.july,
item.type_report_id == 5 || item.type_report_id == 6 ? { value: item.cash_flow.august, formula: item.cash_flow.august_formula } : item.cash_flow.august,
item.type_report_id == 5 || item.type_report_id == 6 ? { value: item.cash_flow.september, formula: item.cash_flow.september_formula } : item.cash_flow.september,
item.type_report_id == 5 || item.type_report_id == 6 ? { value: item.cash_flow.october, formula: item.cash_flow.october_formula } : item.cash_flow.october,
item.type_report_id == 5 || item.type_report_id == 6 ? { value: item.cash_flow.november, formula: item.cash_flow.november_formula } : item.cash_flow.november,
item.type_report_id == 5 || item.type_report_id == 6 ? { value: item.cash_flow.december, formula: item.cash_flow.december_formula } : item.cash_flow.december,
item.cash_flow.total_current_year,
item.type_report_id == 5 || item.type_report_id == 6 ? 0 : item.cash_flow.total_next_year,
item.type_report_id == 5 || item.type_report_id == 6 ? 0 : item.cash_flow.total_more_year,
item.order
])
if (item.children !== null) {
if (item.children.length > 0) {
item.children.map((items, indexs) => {
handlePushChild(items)
})
}
}
})
this.setState({ dataTable, loading: false, dataReal: res, editable: true }, () => console.log(dataTable))
})
} }
render() { render() {
let dataTable2 = this.state.dataTable let dataTable2 = this.state.dataTable
let columns = [ let columns = [{
name: "",
options: {
display: false
}
}, {
name: "",
options: {
display: false
}
}, {
name: "",
options: {
display: false
}
}, {
name: "",
options: {
display: false
}
}, {
name: "",
options: {
display: false
}
},
{ {
name: "(In Rupiah million)", name: "(In Rupiah million)",
options: { options: {
...@@ -46,116 +169,238 @@ export default class CashFlow extends Component { ...@@ -46,116 +169,238 @@ export default class CashFlow extends Component {
customBodyRender: (val, tableMeta) => { customBodyRender: (val, tableMeta) => {
return ( return (
<div style={{ width: 300 }}> <div style={{ width: 300 }}>
{val} {tableMeta.rowData[24] ?
tableMeta.rowData[24].length > 0 ?
<div style={{ paddingLeft: 20 * Number(tableMeta.rowData[4]) }}>
<LightTooltip title={"Report Items Not Registered"} arrow>
<span style={{ fontSize: 12, color: 'red' }}>{tableMeta.rowData[0] === 4 ? "" : val}</span>
</LightTooltip>
</div>
:
tableMeta.rowData[4] == 0 ?
<span style={{ fontSize: 12, fontWeight: 'bold' }}>{String(tableMeta.rowData[0] === 4 ? "" : val).toUpperCase()}</span>
:
<div style={{ paddingLeft: 20 * Number(tableMeta.rowData[4]) }}>
<span style={{ fontSize: 12 }}>{tableMeta.rowData[0] === 4 ? "" : val}</span>
</div>
:
tableMeta.rowData[4] == 0 ?
<span style={{ fontSize: 12, fontWeight: 'bold' }}>{String(tableMeta.rowData[0] === 4 ? "" : val).toUpperCase()}</span>
:
<div style={{ paddingLeft: 20 * Number(tableMeta.rowData[4]) }}>
<span style={{ fontSize: 12 }}>{tableMeta.rowData[0] === 4 ? "" : val}</span>
</div>
}
</div> </div>
) )
} }
} }
}, },
// {
// name: `MB 2021`,
// options: {
// customHeadRender: (columnMeta) => (
// <th style={{ ...style2, color: '#fff', backgroundColor: '#07a7d0', fontSize: 13, fontWeight: 1, width: 150, borderRight: "1px solid rgb(255, 255, 255)", padding: 0 }} >
// {/* <TableCell style={{ ...style2, top: 0, zIndex: 99, backgroundColor: '#1c71b8', width: 96 }}>
// <Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
// </TableCell> */}
// <div style={{ borderBottom: "1px #fff solid", backgroundColor: '#1c71b8', textAlign: 'center', fontSize: 12, fontWeight: 'bold', padding: 5 }}>{columnMeta.name}</div>
// <div className="grid grid-3x" style={{ ...style2, color: '#fff', fontSize: 12, fontWeight: 'bold', position: "sticky" }}>
// <div className="column-1 grid grid-4x" style={{ placeSelf: 'center', textAlign: 'center', backgroundColor: '#07a7d0' }}>
// <div className="column-1" style={{ placeSelf: 'center', textAlign: 'center', padding: 5, borderRight: "1px #fff solid", backgroundColor: '#07a7d0' }}>
// <span>{"1"}</span>
// </div>
// <div className="column-2" style={{ placeSelf: 'center', textAlign: 'center', padding: 5, borderRight: "1px #fff solid", backgroundColor: '#07a7d0' }}>
// <span>{"2"}</span>
// </div>
// <div className="column-3" style={{ placeSelf: 'center', textAlign: 'center', padding: 5, borderRight: "1px #fff solid", backgroundColor: '#07a7d0' }}>
// <span>{"3"}</span>
// </div>
// <div className="column-4" style={{ placeSelf: 'center', textAlign: 'center', padding: 5, borderRight: "1px #fff solid", backgroundColor: '#07a7d0' }}>
// <span>{"4"}</span>
// </div>
// </div>
// <div className="column-2 grid grid-4x" style={{ placeSelf: 'center', textAlign: 'center', backgroundColor: '#07a7d0' }}>
// <div className="column-1" style={{ placeSelf: 'center', textAlign: 'center', padding: 5, borderRight: "1px #fff solid", backgroundColor: '#07a7d0' }}>
// <span>{"5"}</span>
// </div>
// <div className="column-2" style={{ placeSelf: 'center', textAlign: 'center', padding: 5, borderRight: "1px #fff solid", backgroundColor: '#07a7d0' }}>
// <span>{"6"}</span>
// </div>
// <div className="column-3" style={{ placeSelf: 'center', textAlign: 'center', padding: 5, borderRight: "1px #fff solid", backgroundColor: '#07a7d0' }}>
// <span>{"7"}</span>
// </div>
// <div className="column-4" style={{ placeSelf: 'center', textAlign: 'center', padding: 5, borderRight: "1px #fff solid", backgroundColor: '#07a7d0' }}>
// <span>{"8"}</span>
// </div>
// </div>
// <div className="column-3 grid grid-4x" style={{ placeSelf: 'center', textAlign: 'center', backgroundColor: '#07a7d0' }}>
// <div className="column-1" style={{ placeSelf: 'center', textAlign: 'center', padding: 5, borderRight: "1px #fff solid", backgroundColor: '#07a7d0' }}>
// <span>{"9"}</span>
// </div>
// <div className="column-2" style={{ placeSelf: 'center', textAlign: 'center', padding: 5, borderRight: "1px #fff solid", backgroundColor: '#07a7d0' }}>
// <span>{"10"}</span>
// </div>
// <div className="column-3" style={{ placeSelf: 'center', textAlign: 'center', padding: 5, borderRight: "1px #fff solid", backgroundColor: '#07a7d0' }}>
// <span>{"11"}</span>
// </div>
// <div className="column-4" style={{ placeSelf: 'center', textAlign: 'center', padding: 5, backgroundColor: '#07a7d0' }}>
// <span>{"12"}</span>
// </div>
// </div>
// </div>
// </th>
// ),
// setCellProps: () => ({ style2 }),
// customBodyRender: (val, tableMeta, updateValue) => {
// return (
// <div>
// <div className="grid grid-3x content-center">
// <div className="grid grid-4x content-center">
// <div className="col-1">
// <div style={{ textAlign: 'right', width: 90 }}>
// {/* {val.a} */}
// </div>
// </div>
// <div className="col-2">
// <div style={{ textAlign: 'right', width: 90 }}>
// {/* {val.b} */}
// </div>
// </div>
// <div className="col-3">
// <div style={{ textAlign: 'right', width: 90 }}>
// {/* {val.c} */}
// </div>
// </div>
// <div className="col-4">
// <div style={{ textAlign: 'right', width: 90 }}>
// {/* {val.c} */}
// </div>
// </div>
// </div>
// <div className="grid grid-4x content-center">
// <div className="col-1">
// <div style={{ textAlign: 'right', width: 90 }}>
// {/* {val.a} */}
// </div>
// </div>
// <div className="col-2">
// <div style={{ textAlign: 'right', width: 90 }}>
// {/* {val.b} */}
// </div>
// </div>
// <div className="col-3">
// <div style={{ textAlign: 'right', width: 90 }}>
// {/* {val.c} */}
// </div>
// </div>
// <div className="col-4">
// <div style={{ textAlign: 'right', width: 90 }}>
// {/* {val.c} */}
// </div>
// </div>
// </div>
// <div className="grid grid-4x content-center">
// <div className="col-1">
// <div style={{ textAlign: 'right', width: 90 }}>
// {/* {val.a} */}
// </div>
// </div>
// <div className="col-2">
// <div style={{ textAlign: 'right', width: 90 }}>
// {/* {val.b} */}
// </div>
// </div>
// <div className="col-3">
// <div style={{ textAlign: 'right', width: 90 }}>
// {/* {val.c} */}
// </div>
// </div>
// <div className="col-4">
// <div style={{ textAlign: 'right', width: 90 }}>
// {/* {val.c} */}
// </div>
// </div>
// </div>
// </div>
// </div>
// )
// }
// }
// },
{ {
name: `MB 2021`, name: `${Number(this.props.periode) + 1}`,
options: { options: {
customHeadRender: (columnMeta) => ( customHeadRender: (columnMeta) => (
<th style={{ ...style2, color: '#fff', backgroundColor: '#07a7d0', fontSize: 13, fontWeight: 1, width: 150, borderRight: "1px solid rgb(255, 255, 255)", padding: 0 }} > <th style={{ ...style2, color: '#fff', backgroundColor: '#07a7d0', top: 0, zIndex: 102, fontSize: 13, fontWeight: 1, width: 150, borderRight: "1px solid rgb(255, 255, 255)", padding: 0 }} >
{/* <TableCell style={{ ...style2, top: 0, zIndex: 99, backgroundColor: '#1c71b8', width: 96 }}> {/* <TableCell style={{ ...style2, top: 0, zIndex: 99, backgroundColor: '#1c71b8', width: 96 }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography> <Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
</TableCell> */} </TableCell> */}
<div style={{ borderBottom: "1px #fff solid", backgroundColor: '#1c71b8', textAlign: 'center', fontSize: 12, fontWeight: 'bold', padding: 5 }}>{columnMeta.name}</div> <div style={{ borderBottom: "1px #fff solid", backgroundColor: '#1c71b8', textAlign: 'center', fontSize: 12, fontWeight: 'bold', padding: 5 }}>{columnMeta.name}</div>
<div className="grid grid-10x" style={{ ...style2, color: '#fff', fontSize: 12, fontWeight: 'bold', position: "sticky" }}> <div className="grid grid-1x" style={{ ...style2, color: '#fff', fontSize: 12, fontWeight: 'bold', position: "sticky" }}>
<div className="column-1" style={{ placeSelf: 'center', textAlign: 'center', padding: 5, borderRight: "1px #fff solid", backgroundColor: '#07a7d0' }}> <div className="column-1" style={{ placeSelf: 'center', textAlign: 'center', padding: 5, backgroundColor: '#07a7d0' }}>
<span>{"Master Budget (MB)"}</span> <span>{"ForeCast"}</span>
</div>
<div className="column-2" style={{ placeSelf: 'center', textAlign: 'center', padding: 5, borderRight: "1px #fff solid", backgroundColor: '#07a7d0' }}>
<span>{"Rolling Budget (RB)"}</span>
</div>
<div className="column-3" style={{ placeSelf: 'center', textAlign: 'center', padding: 5, borderRight: "1px #fff solid", backgroundColor: '#07a7d0' }}>
<span>{"Rolling Budget (RB)"}</span>
</div>
<div className="column-4" style={{ placeSelf: 'center', textAlign: 'center', padding: 5, borderRight: "1px #fff solid", backgroundColor: '#07a7d0' }}>
<span>{"Rolling Budget (RB)"}</span>
</div>
<div className="column-5" style={{ placeSelf: 'center', textAlign: 'center', padding: 5, borderRight: "1px #fff solid", backgroundColor: '#07a7d0' }}>
<span>{"Rolling Budget (RB)"}</span>
</div>
<div className="column-6" style={{ placeSelf: 'center', textAlign: 'center', padding: 5, borderRight: "1px #fff solid", backgroundColor: '#07a7d0' }}>
<span>{"Rolling Budget (RB)"}</span>
</div>
<div className="column-7" style={{ placeSelf: 'center', textAlign: 'center', padding: 5, borderRight: "1px #fff solid", backgroundColor: '#07a7d0' }}>
<span>{"Rolling Budget (RB)"}</span>
</div>
<div className="column-8" style={{ placeSelf: 'center', textAlign: 'center', padding: 5, borderRight: "1px #fff solid", backgroundColor: '#07a7d0' }}>
<span>{"Rolling Budget (RB)"}</span>
</div>
<div className="column-9" style={{ placeSelf: 'center', textAlign: 'center', padding: 5, borderRight: "1px #fff solid", backgroundColor: '#07a7d0' }}>
<span>{"Rolling Budget (RB)"}</span>
</div>
<div className="column-10" style={{ placeSelf: 'center', textAlign: 'center', padding: 5, borderRight: "1px #fff solid", backgroundColor: '#07a7d0' }}>
<span>{"Rolling Budget (RB)"}</span>
</div> </div>
</div> </div>
</th> </th>
), ),
setCellProps: () => ({ style2 }), setCellProps: () => ({ style2 }),
customBodyRender: (val, tableMeta, updateValue) => { customBodyRender: (value, tableMeta, updateValue) => {
return ( return (
<div> <div style={{ textAlign: 'right' }}>
<div className="grid grid-3x content-center"> {tableMeta.rowData[0] === 4 || tableMeta.rowData[0] === 1 ?
<div className="col-1"> null
<div style={{ textAlign: 'right', width: 90 }}> :
{/* {val.a} */} <div style={{ flex: 1 }}>
</div> <FormControlLabel
</div> style={{ margin: 0 }}
<div className="col-2"> value={value}
<div style={{ textAlign: 'right', width: 90 }}> control={
{/* {val.b} */} <NumberFormat
</div> thousandSeparator={true}
</div> style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
<div className="col-3"> type="text"
<div style={{ textAlign: 'right', width: 90 }}> placeholder=""
{/* {val.c} */} value={Number(tableMeta[22]).toFixed(1)}
</div> disabled={true}
</div> decimalScale={1}
</div> onBlur={(event) => {
// updateValue(event.target.value)
// handleChange(event.target.value, tableMeta)
console.log(dataTable2)
}}
/>
}
/>
</div>}
</div> </div>
) )
} }
} }
}, },
{ {
name: "YTD Actual", name: `${Number(this.props.periode) + 2}`,
options: { options: {
customHeadRender: (columnMeta) => ( customHeadRender: (columnMeta) => (
<th style={{ ...style2, color: '#fff', backgroundColor: '#07a7d0', fontSize: 13, fontWeight: 1, width: 150, borderRight: "1px solid rgb(255, 255, 255)", padding: 0 }} > <th style={{ ...style2, color: '#fff', backgroundColor: '#07a7d0', fontSize: 13, top: 0, zIndex: 102, fontWeight: 1, width: 150, borderRight: "1px solid rgb(255, 255, 255)", padding: 0 }} >
{/* <TableCell style={{ ...style2, top: 0, zIndex: 99, backgroundColor: '#1c71b8', width: 96 }}> {/* <TableCell style={{ ...style2, top: 0, zIndex: 99, backgroundColor: '#1c71b8', width: 96 }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography> <Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
</TableCell> */} </TableCell> */}
<div style={{ borderBottom: "1px #fff solid", backgroundColor: '#1c71b8', textAlign: 'center', fontSize: 12, fontWeight: 'bold', padding: 5 }}>{columnMeta.name}</div> <div style={{ borderBottom: "1px #fff solid", backgroundColor: '#1c71b8', textAlign: 'center', fontSize: 12, fontWeight: 'bold', padding: 5 }}>{columnMeta.name}</div>
<div style={{ borderBottom: "1px #fff solid", backgroundColor: '#1c71b8', textAlign: 'center', fontSize: 12, fontWeight: 'bold', padding: 5 }}>{columnMeta.name}</div> <div className="grid grid-1x" style={{ ...style2, color: '#fff', fontSize: 12, fontWeight: 'bold', position: "sticky" }}>
</th> <div className="column-1" style={{ placeSelf: 'center', textAlign: 'center', padding: 5, backgroundColor: '#07a7d0' }}>
), <span>{"ForeCast"}</span>
setCellProps: () => ({ style2 }),
customBodyRender: (val, tableMeta, updateValue) => {
return (
<div style={{ textAlign: 'right', width: 90 }}>
{val}
</div> </div>
) </div>
} </th>
}
},
{
name: "Actual Previous Month",
options: {
customHeadRender: (columnMeta) => (
<TableCell style={{ ...style2, top: 0, zIndex: 99, backgroundColor: '#37b5e6', width: 96 }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
</TableCell>
), ),
setCellProps: () => ({ style2 }), setCellProps: () => ({ style2 }),
customBodyRender: (val, tableMeta, updateValue) => { customBodyRender: (val, tableMeta, updateValue) => {
return ( return (
<div style={{ textAlign: 'right', width: 90 }}> <div>
{val} {/* {val} */}
</div> </div>
) )
} }
......
src/container/BudgetTahunan/CorporateAnnualTarget.js
View file @ 32de7146
...@@ -916,6 +916,10 @@ export default class CorporateAnnualTarget extends Component { ...@@ -916,6 +916,10 @@ export default class CorporateAnnualTarget extends Component {
} }
const handleAction = (idParent, typeReport, tableMeta) => { const handleAction = (idParent, typeReport, tableMeta) => {
if (this.props.isApprover) {
return false
} else {
if ((this.props.lastStatus == 'SUBMIT' || this.props.lastStatus == 'REVISION') && this.props.prevRevision === false && (this.props.status === 'revision' || this.props.status === 'not-yet' || this.props.status === 'draft' || this.props.status === 'submitted')) {
if (idParent !== null) { if (idParent !== null) {
let indexsss = dataTable2.findIndex((val) => val[1] == idParent) let indexsss = dataTable2.findIndex((val) => val[1] == idParent)
if (dataTable2[indexsss][6] == 'CUSTOMER PERSPECTIVE' || dataTable2[indexsss][6] == 'INTERNAL BUSINESS PROCESS PERSPECTIVE') { if (dataTable2[indexsss][6] == 'CUSTOMER PERSPECTIVE' || dataTable2[indexsss][6] == 'INTERNAL BUSINESS PROCESS PERSPECTIVE') {
...@@ -937,6 +941,11 @@ export default class CorporateAnnualTarget extends Component { ...@@ -937,6 +941,11 @@ export default class CorporateAnnualTarget extends Component {
return false return false
} }
} }
} else {
return false
}
}
} }
const handleTambah = (data, rowIndex) => { const handleTambah = (data, rowIndex) => {
...@@ -1048,7 +1057,7 @@ export default class CorporateAnnualTarget extends Component { ...@@ -1048,7 +1057,7 @@ export default class CorporateAnnualTarget extends Component {
name: "", name: "",
options: { options: {
filter: false, filter: false,
display: this.props.isApprover ? false : true, display: this.props.isApprover ? false : ((this.props.lastStatus == 'SUBMIT' || this.props.lastStatus == 'REVISION') && this.props.prevRevision === false && (this.props.status === 'revision' || this.props.status === 'not-yet' || this.props.status === 'draft' || this.props.status === 'submitted') ? true : false),
customHeadRender: (columnMeta) => ( customHeadRender: (columnMeta) => (
<TableCell key={columnMeta.index} style={{ ...style, top: 0, zIndex: 102, backgroundColor: '#dbdbdb' }}> <TableCell key={columnMeta.index} style={{ ...style, top: 0, zIndex: 102, backgroundColor: '#dbdbdb' }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'left' }}>{columnMeta.name}</Typography> <Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'left' }}>{columnMeta.name}</Typography>
...@@ -1112,7 +1121,7 @@ export default class CorporateAnnualTarget extends Component { ...@@ -1112,7 +1121,7 @@ export default class CorporateAnnualTarget extends Component {
return ( return (
tableMeta.rowData[1] == "" ? tableMeta.rowData[1] == "" ?
<div style={{ textAlign: 'left', paddingLeft: 20 * Number(tableMeta.rowData[4]) }}> <div style={{ textAlign: 'left', paddingLeft: 20 * Number(tableMeta.rowData[4]) }}>
<FormControlLabel {!this.state.loading && <FormControlLabel
style={{ margin: 0 }} style={{ margin: 0 }}
control={ control={
<Input <Input
...@@ -1129,7 +1138,7 @@ export default class CorporateAnnualTarget extends Component { ...@@ -1129,7 +1138,7 @@ export default class CorporateAnnualTarget extends Component {
}} }}
/> />
} }
/> />}
</div> </div>
: :
<div style={{ width: 300 }}> <div style={{ width: 300 }}>
...@@ -1426,9 +1435,10 @@ export default class CorporateAnnualTarget extends Component { ...@@ -1426,9 +1435,10 @@ export default class CorporateAnnualTarget extends Component {
</TableCell> </TableCell>
), ),
customBodyRender: (value, tableMeta) => { customBodyRender: (value, tableMeta) => {
// console.log(tableMeta.rowData[0])
return ( return (
<div style={{ width: 96 }}> <div style={{ width: 96 }}>
{tableMeta.rowData[0] === 1 || tableMeta.rowData[0] === 2 || tableMeta.rowData[0] === 4 ? {tableMeta.rowData[0] === 1 || tableMeta.rowData[0] === 2|| tableMeta.rowData[0] === 4 ?
null null
: :
<div style={{ flex: 1 }}> <div style={{ flex: 1 }}>
...@@ -1447,7 +1457,7 @@ export default class CorporateAnnualTarget extends Component { ...@@ -1447,7 +1457,7 @@ export default class CorporateAnnualTarget extends Component {
onBlur={(event) => { onBlur={(event) => {
// updateValue(event.target.value) // updateValue(event.target.value)
handleChange(event.target.value, tableMeta) handleChange(event.target.value, tableMeta)
// console.log(dataTable2) // console.log(tableMeta.rowData[0])
}} }}
/> />
} }
......
src/container/OprIndicator/OperatingIndicatorDetail.js
View file @ 32de7146
...@@ -477,6 +477,21 @@ export default class BalanceSheet extends Component { ...@@ -477,6 +477,21 @@ export default class BalanceSheet extends Component {
return total return total
} }
const handleParent = (tableMeta) => {
console.log(tableMeta)
let total = Number(tableMeta.columnIndex == ""? 0 : tableMeta.columnIndex)
dataTable2.map((item, index) => {
if (item[2] == tableMeta.rowData[1]) {
console.log('masuk')
total += Number(item[tableMeta.columnIndex])
}
})
dataTable2[tableMeta.rowIndex][tableMeta.columnIndex] = total
return total
}
const handleFormula = (tableMeta) => { const handleFormula = (tableMeta) => {
let arrayFormula = tableMeta.rowData[3].match(/[a-zA-Z]+|[0-9]+|[-!$%^&*()_+|~=`{}\[\]:";'<>?,.\/]+(?:\.[0-9]+@|)/g) let arrayFormula = tableMeta.rowData[3].match(/[a-zA-Z]+|[0-9]+|[-!$%^&*()_+|~=`{}\[\]:";'<>?,.\/]+(?:\.[0-9]+@|)/g)
let arrayFormulaConvert = [] let arrayFormulaConvert = []
...@@ -689,6 +704,25 @@ export default class BalanceSheet extends Component { ...@@ -689,6 +704,25 @@ export default class BalanceSheet extends Component {
{tableMeta.rowData[0] === 4 || tableMeta.rowData[0] === 1 ? {tableMeta.rowData[0] === 4 || tableMeta.rowData[0] === 1 ?
null null
: :
tableMeta.rowData[0] == 2?
<div style={{ flex: 1 }}>
<FormControlLabel
style={{ margin: 0 }}
value={value}
control={
<NumberFormat
thousandSeparator={true}
style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
type="text"
placeholder=""
value={Number(handleParent(tableMeta)).toFixed(1)}
disabled={true}
decimalScale={1}
/>
}
/>
</div>
:
(tableMeta.rowData[0] == 5 || tableMeta.rowData[0] == 6? (tableMeta.rowData[0] == 5 || tableMeta.rowData[0] == 6?
<div style={{ flex: 1 }}> <div style={{ flex: 1 }}>
<FormControlLabel <FormControlLabel
...@@ -756,6 +790,25 @@ export default class BalanceSheet extends Component { ...@@ -756,6 +790,25 @@ export default class BalanceSheet extends Component {
{tableMeta.rowData[0] === 4 || tableMeta.rowData[0] === 1 ? {tableMeta.rowData[0] === 4 || tableMeta.rowData[0] === 1 ?
null null
: :
tableMeta.rowData[0] == 2?
<div style={{ flex: 1 }}>
<FormControlLabel
style={{ margin: 0 }}
value={value}
control={
<NumberFormat
thousandSeparator={true}
style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
type="text"
placeholder=""
value={Number(handleParent(tableMeta)).toFixed(1)}
disabled={true}
decimalScale={1}
/>
}
/>
</div>
:
(tableMeta.rowData[0] == 5 || tableMeta.rowData[0] == 6? (tableMeta.rowData[0] == 5 || tableMeta.rowData[0] == 6?
<div style={{ flex: 1 }}> <div style={{ flex: 1 }}>
<FormControlLabel <FormControlLabel
...@@ -822,6 +875,25 @@ export default class BalanceSheet extends Component { ...@@ -822,6 +875,25 @@ export default class BalanceSheet extends Component {
{tableMeta.rowData[0] === 4 || tableMeta.rowData[0] === 1 ? {tableMeta.rowData[0] === 4 || tableMeta.rowData[0] === 1 ?
null null
: :
tableMeta.rowData[0] == 2?
<div style={{ flex: 1 }}>
<FormControlLabel
style={{ margin: 0 }}
value={value}
control={
<NumberFormat
thousandSeparator={true}
style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
type="text"
placeholder=""
value={Number(handleParent(tableMeta)).toFixed(1)}
disabled={true}
decimalScale={1}
/>
}
/>
</div>
:
(tableMeta.rowData[0] == 5 || tableMeta.rowData[0] == 6? (tableMeta.rowData[0] == 5 || tableMeta.rowData[0] == 6?
<div style={{ flex: 1 }}> <div style={{ flex: 1 }}>
<FormControlLabel <FormControlLabel
...@@ -888,6 +960,25 @@ export default class BalanceSheet extends Component { ...@@ -888,6 +960,25 @@ export default class BalanceSheet extends Component {
{tableMeta.rowData[0] === 4 || tableMeta.rowData[0] === 1 ? {tableMeta.rowData[0] === 4 || tableMeta.rowData[0] === 1 ?
null null
: :
tableMeta.rowData[0] == 2?
<div style={{ flex: 1 }}>
<FormControlLabel
style={{ margin: 0 }}
value={value}
control={
<NumberFormat
thousandSeparator={true}
style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
type="text"
placeholder=""
value={Number(handleParent(tableMeta)).toFixed(1)}
disabled={true}
decimalScale={1}
/>
}
/>
</div>
:
(tableMeta.rowData[0] == 5 || tableMeta.rowData[0] == 6? (tableMeta.rowData[0] == 5 || tableMeta.rowData[0] == 6?
<div style={{ flex: 1 }}> <div style={{ flex: 1 }}>
<FormControlLabel <FormControlLabel
...@@ -954,6 +1045,25 @@ export default class BalanceSheet extends Component { ...@@ -954,6 +1045,25 @@ export default class BalanceSheet extends Component {
{tableMeta.rowData[0] === 4 || tableMeta.rowData[0] === 1 ? {tableMeta.rowData[0] === 4 || tableMeta.rowData[0] === 1 ?
null null
: :
tableMeta.rowData[0] == 2?
<div style={{ flex: 1 }}>
<FormControlLabel
style={{ margin: 0 }}
value={value}
control={
<NumberFormat
thousandSeparator={true}
style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
type="text"
placeholder=""
value={Number(handleParent(tableMeta)).toFixed(1)}
disabled={true}
decimalScale={1}
/>
}
/>
</div>
:
(tableMeta.rowData[0] == 5 || tableMeta.rowData[0] == 6? (tableMeta.rowData[0] == 5 || tableMeta.rowData[0] == 6?
<div style={{ flex: 1 }}> <div style={{ flex: 1 }}>
<FormControlLabel <FormControlLabel
...@@ -1020,6 +1130,25 @@ export default class BalanceSheet extends Component { ...@@ -1020,6 +1130,25 @@ export default class BalanceSheet extends Component {
{tableMeta.rowData[0] === 4 || tableMeta.rowData[0] === 1 ? {tableMeta.rowData[0] === 4 || tableMeta.rowData[0] === 1 ?
null null
: :
tableMeta.rowData[0] == 2?
<div style={{ flex: 1 }}>
<FormControlLabel
style={{ margin: 0 }}
value={value}
control={
<NumberFormat
thousandSeparator={true}
style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
type="text"
placeholder=""
value={Number(handleParent(tableMeta)).toFixed(1)}
disabled={true}
decimalScale={1}
/>
}
/>
</div>
:
(tableMeta.rowData[0] == 5 || tableMeta.rowData[0] == 6? (tableMeta.rowData[0] == 5 || tableMeta.rowData[0] == 6?
<div style={{ flex: 1 }}> <div style={{ flex: 1 }}>
<FormControlLabel <FormControlLabel
...@@ -1086,6 +1215,25 @@ export default class BalanceSheet extends Component { ...@@ -1086,6 +1215,25 @@ export default class BalanceSheet extends Component {
{tableMeta.rowData[0] === 4 || tableMeta.rowData[0] === 1 ? {tableMeta.rowData[0] === 4 || tableMeta.rowData[0] === 1 ?
null null
: :
tableMeta.rowData[0] == 2?
<div style={{ flex: 1 }}>
<FormControlLabel
style={{ margin: 0 }}
value={value}
control={
<NumberFormat
thousandSeparator={true}
style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
type="text"
placeholder=""
value={Number(handleParent(tableMeta)).toFixed(1)}
disabled={true}
decimalScale={1}
/>
}
/>
</div>
:
(tableMeta.rowData[0] == 5 || tableMeta.rowData[0] == 6? (tableMeta.rowData[0] == 5 || tableMeta.rowData[0] == 6?
<div style={{ flex: 1 }}> <div style={{ flex: 1 }}>
<FormControlLabel <FormControlLabel
...@@ -1152,6 +1300,25 @@ export default class BalanceSheet extends Component { ...@@ -1152,6 +1300,25 @@ export default class BalanceSheet extends Component {
{tableMeta.rowData[0] === 4 || tableMeta.rowData[0] === 1 ? {tableMeta.rowData[0] === 4 || tableMeta.rowData[0] === 1 ?
null null
: :
tableMeta.rowData[0] == 2?
<div style={{ flex: 1 }}>
<FormControlLabel
style={{ margin: 0 }}
value={value}
control={
<NumberFormat
thousandSeparator={true}
style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
type="text"
placeholder=""
value={Number(handleParent(tableMeta)).toFixed(1)}
disabled={true}
decimalScale={1}
/>
}
/>
</div>
:
(tableMeta.rowData[0] == 5 || tableMeta.rowData[0] == 6? (tableMeta.rowData[0] == 5 || tableMeta.rowData[0] == 6?
<div style={{ flex: 1 }}> <div style={{ flex: 1 }}>
<FormControlLabel <FormControlLabel
...@@ -1218,6 +1385,25 @@ export default class BalanceSheet extends Component { ...@@ -1218,6 +1385,25 @@ export default class BalanceSheet extends Component {
{tableMeta.rowData[0] === 4 || tableMeta.rowData[0] === 1 ? {tableMeta.rowData[0] === 4 || tableMeta.rowData[0] === 1 ?
null null
: :
tableMeta.rowData[0] == 2?
<div style={{ flex: 1 }}>
<FormControlLabel
style={{ margin: 0 }}
value={value}
control={
<NumberFormat
thousandSeparator={true}
style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
type="text"
placeholder=""
value={Number(handleParent(tableMeta)).toFixed(1)}
disabled={true}
decimalScale={1}
/>
}
/>
</div>
:
(tableMeta.rowData[0] == 5 || tableMeta.rowData[0] == 6? (tableMeta.rowData[0] == 5 || tableMeta.rowData[0] == 6?
<div style={{ flex: 1 }}> <div style={{ flex: 1 }}>
<FormControlLabel <FormControlLabel
...@@ -1284,6 +1470,25 @@ export default class BalanceSheet extends Component { ...@@ -1284,6 +1470,25 @@ export default class BalanceSheet extends Component {
{tableMeta.rowData[0] === 4 || tableMeta.rowData[0] === 1 ? {tableMeta.rowData[0] === 4 || tableMeta.rowData[0] === 1 ?
null null
: :
tableMeta.rowData[0] == 2?
<div style={{ flex: 1 }}>
<FormControlLabel
style={{ margin: 0 }}
value={value}
control={
<NumberFormat
thousandSeparator={true}
style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
type="text"
placeholder=""
value={Number(handleParent(tableMeta)).toFixed(1)}
disabled={true}
decimalScale={1}
/>
}
/>
</div>
:
(tableMeta.rowData[0] == 5 || tableMeta.rowData[0] == 6? (tableMeta.rowData[0] == 5 || tableMeta.rowData[0] == 6?
<div style={{ flex: 1 }}> <div style={{ flex: 1 }}>
<FormControlLabel <FormControlLabel
...@@ -1350,6 +1555,25 @@ export default class BalanceSheet extends Component { ...@@ -1350,6 +1555,25 @@ export default class BalanceSheet extends Component {
{tableMeta.rowData[0] === 4 || tableMeta.rowData[0] === 1 ? {tableMeta.rowData[0] === 4 || tableMeta.rowData[0] === 1 ?
null null
: :
tableMeta.rowData[0] == 2?
<div style={{ flex: 1 }}>
<FormControlLabel
style={{ margin: 0 }}
value={value}
control={
<NumberFormat
thousandSeparator={true}
style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
type="text"
placeholder=""
value={Number(handleParent(tableMeta)).toFixed(1)}
disabled={true}
decimalScale={1}
/>
}
/>
</div>
:
(tableMeta.rowData[0] == 5 || tableMeta.rowData[0] == 6? (tableMeta.rowData[0] == 5 || tableMeta.rowData[0] == 6?
<div style={{ flex: 1 }}> <div style={{ flex: 1 }}>
<FormControlLabel <FormControlLabel
...@@ -1416,6 +1640,25 @@ export default class BalanceSheet extends Component { ...@@ -1416,6 +1640,25 @@ export default class BalanceSheet extends Component {
{tableMeta.rowData[0] === 4 || tableMeta.rowData[0] === 1 ? {tableMeta.rowData[0] === 4 || tableMeta.rowData[0] === 1 ?
null null
: :
tableMeta.rowData[0] == 2?
<div style={{ flex: 1 }}>
<FormControlLabel
style={{ margin: 0 }}
value={value}
control={
<NumberFormat
thousandSeparator={true}
style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
type="text"
placeholder=""
value={Number(handleParent(tableMeta)).toFixed(1)}
disabled={true}
decimalScale={1}
/>
}
/>
</div>
:
(tableMeta.rowData[0] == 5 || tableMeta.rowData[0] == 6? (tableMeta.rowData[0] == 5 || tableMeta.rowData[0] == 6?
<div style={{ flex: 1 }}> <div style={{ flex: 1 }}>
<FormControlLabel <FormControlLabel
...@@ -1482,6 +1725,49 @@ export default class BalanceSheet extends Component { ...@@ -1482,6 +1725,49 @@ export default class BalanceSheet extends Component {
{tableMeta.rowData[0] === 4 || tableMeta.rowData[0] === 1 ? {tableMeta.rowData[0] === 4 || tableMeta.rowData[0] === 1 ?
null null
: :
tableMeta.rowData[0] == 2?
<div style={{ flex: 1 }}>
<FormControlLabel
style={{ margin: 0 }}
value={value}
control={
<NumberFormat
thousandSeparator={true}
style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
type="text"
placeholder=""
value={Number(handleParent(tableMeta)).toFixed(1)}
disabled={true}
decimalScale={1}
/>
}
/>
</div>
:
(tableMeta.rowData[0] == 5 || tableMeta.rowData[0] == 6?
<div style={{ flex: 1 }}>
<FormControlLabel
style={{ margin: 0 }}
value={value}
control={
<NumberFormat
thousandSeparator={true}
style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
type="text"
placeholder=""
value={Number(handleFormula(tableMeta)).toFixed(1)}
disabled={true}
decimalScale={1}
onBlur={(event) => {
// updateValue(event.target.value)
handleChange(event.target.value, tableMeta)
console.log(dataTable2)
}}
/>
}
/>
</div>
:
<div style={{ flex: 1 }}> <div style={{ flex: 1 }}>
<FormControlLabel <FormControlLabel
style={{ margin: 0 }} style={{ margin: 0 }}
...@@ -1492,9 +1778,9 @@ export default class BalanceSheet extends Component { ...@@ -1492,9 +1778,9 @@ export default class BalanceSheet extends Component {
style={{ color: "#5198ea", fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }} style={{ color: "#5198ea", fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
type="text" type="text"
placeholder="" placeholder=""
value={Number(value).toFixed(1)}
decimalScale={1} decimalScale={1}
disabled={!this.props.permission.create || !this.props.permission.edit || !this.props.isSubmit} disabled={!this.props.permission.create || !this.props.permission.edit || !this.props.isSubmit}
value={Number(value).toFixed(1)}
onBlur={(event) => { onBlur={(event) => {
// updateValue(event.target.value) // updateValue(event.target.value)
handleChange(event.target.value, tableMeta) handleChange(event.target.value, tableMeta)
...@@ -1503,7 +1789,7 @@ export default class BalanceSheet extends Component { ...@@ -1503,7 +1789,7 @@ export default class BalanceSheet extends Component {
/> />
} }
/> />
</div> </div>)
} }
</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