Skip to content

T
Tia-dev
Commit 06f35954 authored by Riri Novita's avatar Riri Novita
Browse files
Options

Merge branch 'riri' into 'master' 

apdet

See merge request !1234
parents 7a6c07b5 0bb05dc5
Hide whitespace changes
Inline Side-by-side
Showing with 730 additions and 611 deletions
src/container/RollingOutlook.js
View file @ 06f35954
...@@ -1224,6 +1224,7 @@ export default class RollingOutlook extends Component { ...@@ -1224,6 +1224,7 @@ export default class RollingOutlook extends Component {
periode={this.state.periode.periode} periode={this.state.periode.periode}
rollingOutlookID={this.state.rollingOutlookID} rollingOutlookID={this.state.rollingOutlookID}
onClickClose={() => this.setState({ visiblePL: false, visibleRollingOutlook: true })} onClickClose={() => this.setState({ visiblePL: false, visibleRollingOutlook: true })}
isApprover={'false'}
/> />
)} )}
......
src/container/RollingOutlook/ProfitLossRO.js
View file @ 06f35954
...@@ -58,13 +58,12 @@ export default class ProfitLossRO extends Component { ...@@ -58,13 +58,12 @@ export default class ProfitLossRO extends Component {
dataTable: [], dataTable: [],
loading: true, loading: true,
get_for: "view", get_for: "view",
visiblePLRO: true, notesUpdate: '-',
updateBy: '-',
judulColumn: null, judulColumn: null,
handleTekTekTek: 0,
saveDraft: true, saveDraft: true,
buttonError: true, buttonError: true,
viewOnly: true, viewOnly: true,
visibleUpload: false
} }
// this.handleValue = this.handleValue.bind(this) // this.handleValue = this.handleValue.bind(this)
// this.fileHandler = this.fileHandler.bind(this); // this.fileHandler = this.fileHandler.bind(this);
...@@ -72,6 +71,7 @@ export default class ProfitLossRO extends Component { ...@@ -72,6 +71,7 @@ export default class ProfitLossRO extends Component {
componentDidMount() { componentDidMount() {
this.getItemHierarki() this.getItemHierarki()
console.log(this.props.isApprover)
// this.handleViewOnly() // this.handleViewOnly()
} }
...@@ -207,7 +207,7 @@ export default class ProfitLossRO extends Component { ...@@ -207,7 +207,7 @@ export default class ProfitLossRO extends Component {
} }
}) })
// console.log(dataTable) // console.log(dataTable)
this.setState({ dataTable, loading: false, buttonError: true, editable: true }) this.setState({ dataTable, loading: false, buttonError: true, saveDraft: true, refresh: false })
} else { } else {
this.setState({ loading: false, alert: true, messageAlert: response.data.message, tipeAlert: 'warning' }, () => { this.setState({ loading: false, alert: true, messageAlert: response.data.message, tipeAlert: 'warning' }, () => {
if (response.data.message.includes("Someone Logged In")) { if (response.data.message.includes("Someone Logged In")) {
...@@ -219,10 +219,49 @@ export default class ProfitLossRO extends Component { ...@@ -219,10 +219,49 @@ export default class ProfitLossRO extends Component {
}) })
} }
} else { } else {
this.setState({ dataTable, loading: false, buttonError: true, editable: true }) this.setState({ dataTable, loading: false, buttonError: true, saveDraft: true, refresh: false})
} }
}) })
} }
downloadTemplate = async () => {
alert('Coming Soon ...')
// let res = await fetch(
// `${process.env.REACT_APP_URL_MAIN_BE}/public/transaction/profit_loss/monthly_report/download_template?report_id=${this.props.report_id}&&company_id=${this.props.company.company_id}&&year=${this.props.periode}`
// )
// res = await res.blob()
// // console.log(res)
// if (res.size > 0) {
// let url = window.URL.createObjectURL(res);
// let a = document.createElement('a');
// a.href = url;
// a.download = 'Template Monthly Report Profit Loss.xlsx';
// a.click();
// }
}
async downloadAllData() {
alert('Coming Soon ...')
// let url = `${process.env.REACT_APP_URL_MAIN_BE}/public/transaction/profit_loss/monthly_report/export_monthly_report?monthly_report_id=${this.props.monthlyReportId}&&report_id=${this.props.report_id}&&company_id=${this.props.company.company_id}&&year=${this.props.periode}&&revision=${this.props.revision}&&months=${this.props.month.month_id}`
// console.log(url);
// let res = await fetch(
// `${process.env.REACT_APP_URL_MAIN_BE}/public/transaction/profit_loss/monthly_report/export_monthly_report?monthly_report_id=${this.props.monthlyReportId === null ? "" : this.props.monthlyReportId}&&report_id=${this.props.report_id}&&company_id=${this.props.company.company_id}&&year=${this.props.periode}&&revision=${this.props.revision}&&months=${this.props.month.month_id}`
// )
// res = await res.blob()
// this.setState({ loading: false })
// if (res.size > 0) {
// let url = window.URL.createObjectURL(res);
// let a = document.createElement('a');
// a.href = url;
// a.download = 'Monthly Report Profit Loss.xlsx';
// a.click();
// }
}
closeAlert() {
this.setState({ alert: false })
}
render() { render() {
let dataTable2 = this.state.dataTable let dataTable2 = this.state.dataTable
...@@ -363,225 +402,167 @@ export default class ProfitLossRO extends Component { ...@@ -363,225 +402,167 @@ export default class ProfitLossRO extends Component {
} }
}, },
{ {
name: "Account", name: "Account",
options: { options: {
customHeadRender: (columnMeta) => ( customHeadRender: (columnMeta) => (
<TableCell key={columnMeta.index} style={{ ...style, top: 0, zIndex: 102, backgroundColor: '#1c71b8', width: 300 }}> <TableCell key={columnMeta.index} style={{ ...style, top: 0, zIndex: 102, backgroundColor: '#1c71b8', width: 300 }}>
<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>
</TableCell> </TableCell>
), ),
setCellProps: () => ({ style }), setCellProps: () => ({ style }),
customBodyRender: (val, tableMeta) => { customBodyRender: (val, tableMeta) => {
return ( return (
<div style={{ width: 300 }}> <div style={{ width: 300 }}>
{tableMeta.rowData[0] === null ? {tableMeta.rowData[0] === null ?
tableMeta.rowData[4] == 0 ? tableMeta.rowData[4] == 0 ?
<LightTooltip title={"Report Items Not Registered"} arrow>
<span style={{ fontSize: 12, fontWeight: 'bold', color: 'red' }}>{String(val).toUpperCase()}</span>
</LightTooltip> :
<div style={{ paddingLeft: 20 * Number(tableMeta.rowData[4]) }}>
<LightTooltip title={"Report Items Not Registered"} arrow> <LightTooltip title={"Report Items Not Registered"} arrow>
<span style={{ fontSize: 12, color: 'red' }}>{tableMeta.rowData[0] === 4 ? "" : val}</span> <span style={{ fontSize: 12, fontWeight: 'bold', color: 'red' }}>{String(val).toUpperCase()}</span>
</LightTooltip> </LightTooltip> :
</div> <div style={{ paddingLeft: 20 * Number(tableMeta.rowData[4]) }}>
: <LightTooltip title={"Report Items Not Registered"} arrow>
tableMeta.rowData[4] == 0 ? <span style={{ fontSize: 12, color: 'red' }}>{tableMeta.rowData[0] === 4 ? "" : val}</span>
<span style={{ fontSize: 12, fontWeight: 'bold' }}>{String(tableMeta.rowData[0] === 4 ? "" : val).toUpperCase()}</span> </LightTooltip>
</div>
: :
<div style={{ paddingLeft: 20 * Number(tableMeta.rowData[4]) }}> tableMeta.rowData[4] == 0 ?
<span style={{ fontSize: 12 }}>{tableMeta.rowData[0] === 4 ? "" : val}</span> <span style={{ fontSize: 12, fontWeight: 'bold' }}>{String(tableMeta.rowData[0] === 4 ? "" : val).toUpperCase()}</span>
</div> :
} <div style={{ paddingLeft: 20 * Number(tableMeta.rowData[4]) }}>
</div> <span style={{ fontSize: 12 }}>{tableMeta.rowData[0] === 4 ? "" : val}</span>
) </div>
} }
} </div>
}, { )
name: "Notes",
options: {
customHeadRender: (columnMeta) => (
dataTable2.length > 0 ?
<TableCell style={{ ...stylenotes, top: 0, zIndex: 102, backgroundColor: '#1c71b8', width: 96 }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
</TableCell> :
<TableCell style={{ ...styleNotesEmpty, top: 0, zIndex: 102, backgroundColor: '#1c71b8', width: 96 }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
</TableCell>
),
setCellProps: () => ({
style: {
position: "sticky",
background: "white",
zIndex: 101,
left: 350
} }
}), }
customBodyRender: (value, tableMeta, updateValue) => { }, {
return ( name: "Notes",
<div style={{ textAlign: 'right' }}> options: {
<div style={{ flex: 1 }}> customHeadRender: (columnMeta) => (
{tableMeta.rowData[0] === 4 ? null : tableMeta.rowData[4] === 0 ? null : tableMeta.rowData[4] === 1 ? null : dataTable2.length > 0 ?
// this.state.get_for == 'view' ? value : <TableCell style={{ ...stylenotes, top: 0, zIndex: 102, backgroundColor: '#1c71b8', width: 96 }}>
<FormControlLabel <Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
style={{ margin: 0 }} </TableCell> :
// value={value} <TableCell style={{ ...styleNotesEmpty, top: 0, zIndex: 102, backgroundColor: '#1c71b8', width: 96 }}>
control={ <Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
<Input </TableCell>
disableUnderline={true} ),
style={{ color: "#5198ea", fontSize: 12, textAlign: 'left', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }} setCellProps: () => ({
type="text" style: {
placeholder="" position: "sticky",
defaultValue={value} background: "white",
inputProps={{ zIndex: 101,
style: { left: 350
color: "#5198ea" }
} }),
}} customBodyRender: (value, tableMeta, updateValue) => {
onBlur={(event) => { return (
// updateValue(event.target.value) <div style={{ textAlign: 'right' }}>
handleNotes(event.target.value, tableMeta) <div style={{ flex: 1 }}>
// console.log(dataTable2) {tableMeta.rowData[0] === 4 ? null : tableMeta.rowData[4] === 0 ? null : tableMeta.rowData[4] === 1 ? null :
}} this.state.get_for == 'view' ? value :
/> <FormControlLabel
} style={{ margin: 0 }}
/>} // value={value}
control={
<Input
disableUnderline={true}
style={{ color: "#5198ea", fontSize: 12, textAlign: 'left', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
type="text"
placeholder=""
// disabled={this.props.isApprover ? true : ((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') ? false : true)}
defaultValue={value}
inputProps={{
style: {
color: "#5198ea"
}
}}
onBlur={(event) => {
// updateValue(event.target.value)
handleNotes(event.target.value, tableMeta)
// console.log(dataTable2)
}}
/>
}
/>}
</div>
</div> </div>
</div> )
) }
} }
} }, {
}, { name: `31 Dec ${Number(this.props.periode) - 1 } Actual`,
name: `31 Dec ${Number(this.props.periode) - 1 } Actual`, options: {
options: { customHeadRender: (columnMeta) => (
customHeadRender: (columnMeta) => ( <TableCell style={{ ...style2, top: 0, zIndex: 99, backgroundColor: '#1c71b8', width: 96, borderRight: '1px #fff solid' }}>
<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> ),
), setCellProps: () => ({ style2 }),
setCellProps: () => ({ style2 }), customBodyRender: (val, tableMeta, updateValue) => {
customBodyRender: (value, tableMeta, updateValue) => { return (
return ( <div style={{ textAlign: 'right' }}>
<div style={{ textAlign: 'right' }}> {tableMeta.rowData[0] === 4 || tableMeta.rowData[0] === 1 ?
{tableMeta.rowData[0] === 4 || tableMeta.rowData[0] === 1 ? null :
null this.state.get_for == 'view' ?
: <NumberFormat
// this.state.get_for == 'view' ? thousandSeparator={true}
// <NumberFormat style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
// thousandSeparator={true} type="text"
// style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }} placeholder=""
// type="text" disabled={true}
// placeholder="" value={Number(val).toFixed(1)}
// disabled={true} />
// value={Number(value).toFixed(1)} :
// decimalScale={1} <div style={{ flex: 1 }}>
// /> <FormControlLabel
// : style={{ margin: 0 }}
tableMeta.rowData[0] === 3 ? value={val}
<div style={{ flex: 1 }}> control={
<FormControlLabel
style={{ margin: 0 }}
value={tableMeta.rowData[10]}
control={
<NumberFormat
thousandSeparator={true}
style={{ color: this.props.isApprover || this.state.get_for == 'view' ? 'black' : "#5198ea", fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
type="text"
placeholder=""
disabled={this.props.isApprover ? true : (this.state.get_for == 'view' ? true : false)}
value={Number(tableMeta.rowData[10]).toFixed(1)}
decimalScale={1}
fixedDecimalScale={1}
onBlur={(event) => {
handleChange(event.target.value, tableMeta, "actual")
}}
/>
}
/>
</div> :
tableMeta.rowData[0] === 2 ?
<span style={{ fontSize: 12, textAlign: 'right' }}>
<NumberFormat <NumberFormat
thousandSeparator={true} thousandSeparator={true}
style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }} style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
type="text" type="text"
placeholder="" placeholder=""
disabled={true} disabled={true}
decimalScale={1} value={Number(val).toFixed(1)}
value={Number(handleValue(value, tableMeta)).toFixed(1)}
// value={Number(handleValue(tableMeta, 2)).toFixed(1)}
/> />
</span> : }
tableMeta.rowData[0] === 6 || tableMeta.rowData[0] === 5 ? />
<div style={{ flex: 1 }}> </div>
<FormControlLabel }
style={{ margin: 0 }} </div>
value={tableMeta.rowData[10]} )
decimalScale={1} }
control={
<NumberFormat
thousandSeparator={true}
style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
type="text"
placeholder=""
disabled={true}
value={Number(handleFormula(value, tableMeta, 2)).toFixed(1)}
/>
}
/>
</div>
:
<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=""
disabled={true}
value={Number(value).toFixed(1)}
decimalScale={1}
/>
}
/>
</div>
}
</div>
)
} }
} }, {
}, { name: `Jan ${this.props.periode}`,
name: `Jan 2021`, options: {
options: { customHeadRender: (columnMeta) => (
customHeadRender: (columnMeta) => ( <TableCell style={{ ...style2, top: 0, zIndex: 99, backgroundColor: '#1c71b8', width: 96, borderRight: '1px #fff solid' }}>
<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> ),
), setCellProps: () => ({ style2 }),
setCellProps: () => ({ style2 }), customBodyRender: (val, tableMeta, updateValue) => {
customBodyRender: (value, tableMeta, updateValue) => { return (
return ( <div style={{ textAlign: 'right' }}>
<div style={{ textAlign: 'right' }}> {tableMeta.rowData[0] === 4 || tableMeta.rowData[0] === 1 ?
{tableMeta.rowData[0] === 4 || tableMeta.rowData[0] === 1 ? null :
null this.state.get_for == 'view' ?
: <NumberFormat
this.state.get_for == 'view' ? thousandSeparator={true}
<NumberFormat style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
thousandSeparator={true} type="text"
style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }} placeholder=""
type="text" disabled={true}
placeholder="" value={Number(val).toFixed(1)}
disabled={true} />
value={Number(value).toFixed(1)}
decimalScale={1}
/>
: :
<div style={{ flex: 1 }}> <div style={{ flex: 1 }}>
<FormControlLabel <FormControlLabel
style={{ margin: 0 }} style={{ margin: 0 }}
value={value} value={val}
control={ control={
<NumberFormat <NumberFormat
thousandSeparator={true} thousandSeparator={true}
...@@ -589,47 +570,44 @@ export default class ProfitLossRO extends Component { ...@@ -589,47 +570,44 @@ export default class ProfitLossRO extends Component {
type="text" type="text"
placeholder="" placeholder=""
disabled={true} disabled={true}
value={Number(value).toFixed(1)} value={Number(val).toFixed(1)}
decimalScale={1}
/> />
} }
/> />
</div> </div>
} }
</div> </div>
) )
}
} }
} }, {
}, { name: `Feb ${this.props.periode}`,
name: `Feb 2021`, options: {
options: { customHeadRender: (columnMeta) => (
customHeadRender: (columnMeta) => ( <TableCell style={{ ...style2, top: 0, zIndex: 99, backgroundColor: '#1c71b8', width: 96, borderRight: '1px #fff solid' }}>
<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> ),
), setCellProps: () => ({ style2 }),
setCellProps: () => ({ style2 }), customBodyRender: (val, tableMeta, updateValue) => {
customBodyRender: (value, tableMeta, updateValue) => { return (
return ( <div style={{ textAlign: 'right' }}>
<div style={{ textAlign: 'right' }}> {tableMeta.rowData[0] === 4 || tableMeta.rowData[0] === 1 ?
{tableMeta.rowData[0] === 4 || tableMeta.rowData[0] === 1 ? null :
null this.state.get_for == 'view' ?
: <NumberFormat
this.state.get_for == 'view' ? thousandSeparator={true}
<NumberFormat style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
thousandSeparator={true} type="text"
style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }} placeholder=""
type="text" disabled={true}
placeholder="" value={Number(val).toFixed(1)}
disabled={true} />
value={Number(value).toFixed(1)}
decimalScale={1}
/>
: :
<div style={{ flex: 1 }}> <div style={{ flex: 1 }}>
<FormControlLabel <FormControlLabel
style={{ margin: 0 }} style={{ margin: 0 }}
value={value} value={val}
control={ control={
<NumberFormat <NumberFormat
thousandSeparator={true} thousandSeparator={true}
...@@ -637,47 +615,44 @@ export default class ProfitLossRO extends Component { ...@@ -637,47 +615,44 @@ export default class ProfitLossRO extends Component {
type="text" type="text"
placeholder="" placeholder=""
disabled={true} disabled={true}
value={Number(value).toFixed(1)} value={Number(val).toFixed(1)}
decimalScale={1}
/> />
} }
/> />
</div> </div>
} }
</div> </div>
) )
}
} }
} }, {
}, { name: `Mar ${this.props.periode}`,
name: `Mar 2021`, options: {
options: { customHeadRender: (columnMeta) => (
customHeadRender: (columnMeta) => ( <TableCell style={{ ...style2, top: 0, zIndex: 99, backgroundColor: '#1c71b8', width: 96, borderRight: '1px #fff solid' }}>
<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> ),
), setCellProps: () => ({ style2 }),
setCellProps: () => ({ style2 }), customBodyRender: (val, tableMeta, updateValue) => {
customBodyRender: (value, tableMeta, updateValue) => { return (
return ( <div style={{ textAlign: 'right' }}>
<div style={{ textAlign: 'right' }}> {tableMeta.rowData[0] === 4 || tableMeta.rowData[0] === 1 ?
{tableMeta.rowData[0] === 4 || tableMeta.rowData[0] === 1 ? null :
null this.state.get_for == 'view' ?
: <NumberFormat
this.state.get_for == 'view' ? thousandSeparator={true}
<NumberFormat style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
thousandSeparator={true} type="text"
style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }} placeholder=""
type="text" disabled={true}
placeholder="" value={Number(val).toFixed(1)}
disabled={true} />
value={Number(value).toFixed(1)}
decimalScale={1}
/>
: :
<div style={{ flex: 1 }}> <div style={{ flex: 1 }}>
<FormControlLabel <FormControlLabel
style={{ margin: 0 }} style={{ margin: 0 }}
value={value} value={val}
control={ control={
<NumberFormat <NumberFormat
thousandSeparator={true} thousandSeparator={true}
...@@ -685,47 +660,44 @@ export default class ProfitLossRO extends Component { ...@@ -685,47 +660,44 @@ export default class ProfitLossRO extends Component {
type="text" type="text"
placeholder="" placeholder=""
disabled={true} disabled={true}
value={Number(value).toFixed(1)} value={Number(val).toFixed(1)}
decimalScale={1}
/> />
} }
/> />
</div> </div>
} }
</div> </div>
) )
}
} }
} }, {
}, { name: `Apr ${this.props.periode}`,
name: `Apr 2021`, options: {
options: { customHeadRender: (columnMeta) => (
customHeadRender: (columnMeta) => ( <TableCell style={{ ...style2, top: 0, zIndex: 99, backgroundColor: '#1c71b8', width: 96, borderRight: '1px #fff solid' }}>
<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> ),
), setCellProps: () => ({ style2 }),
setCellProps: () => ({ style2 }), customBodyRender: (val, tableMeta, updateValue) => {
customBodyRender: (value, tableMeta, updateValue) => { return (
return ( <div style={{ textAlign: 'right' }}>
<div style={{ textAlign: 'right' }}> {tableMeta.rowData[0] === 4 || tableMeta.rowData[0] === 1 ?
{tableMeta.rowData[0] === 4 || tableMeta.rowData[0] === 1 ? null :
null this.state.get_for == 'view' ?
: <NumberFormat
this.state.get_for == 'view' ? thousandSeparator={true}
<NumberFormat style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
thousandSeparator={true} type="text"
style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }} placeholder=""
type="text" disabled={true}
placeholder="" value={Number(val).toFixed(1)}
disabled={true} />
value={Number(value).toFixed(1)}
decimalScale={1}
/>
: :
<div style={{ flex: 1 }}> <div style={{ flex: 1 }}>
<FormControlLabel <FormControlLabel
style={{ margin: 0 }} style={{ margin: 0 }}
value={value} value={val}
control={ control={
<NumberFormat <NumberFormat
thousandSeparator={true} thousandSeparator={true}
...@@ -733,47 +705,44 @@ export default class ProfitLossRO extends Component { ...@@ -733,47 +705,44 @@ export default class ProfitLossRO extends Component {
type="text" type="text"
placeholder="" placeholder=""
disabled={true} disabled={true}
value={Number(value).toFixed(1)} value={Number(val).toFixed(1)}
decimalScale={1}
/> />
} }
/> />
</div> </div>
} }
</div> </div>
) )
}
} }
} }, {
}, { name: `May ${this.props.periode}`,
name: `May 2021`, options: {
options: { customHeadRender: (columnMeta) => (
customHeadRender: (columnMeta) => ( <TableCell style={{ ...style2, top: 0, zIndex: 99, backgroundColor: '#1c71b8', width: 96, borderRight: '1px #fff solid' }}>
<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> ),
), setCellProps: () => ({ style2 }),
setCellProps: () => ({ style2 }), customBodyRender: (val, tableMeta, updateValue) => {
customBodyRender: (value, tableMeta, updateValue) => { return (
return ( <div style={{ textAlign: 'right' }}>
<div style={{ textAlign: 'right' }}> {tableMeta.rowData[0] === 4 || tableMeta.rowData[0] === 1 ?
{tableMeta.rowData[0] === 4 || tableMeta.rowData[0] === 1 ? null :
null this.state.get_for == 'view' ?
: <NumberFormat
this.state.get_for == 'view' ? thousandSeparator={true}
<NumberFormat style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
thousandSeparator={true} type="text"
style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }} placeholder=""
type="text" disabled={true}
placeholder="" value={Number(val).toFixed(1)}
disabled={true} />
value={Number(value).toFixed(1)}
decimalScale={1}
/>
: :
<div style={{ flex: 1 }}> <div style={{ flex: 1 }}>
<FormControlLabel <FormControlLabel
style={{ margin: 0 }} style={{ margin: 0 }}
value={value} value={val}
control={ control={
<NumberFormat <NumberFormat
thousandSeparator={true} thousandSeparator={true}
...@@ -781,47 +750,44 @@ export default class ProfitLossRO extends Component { ...@@ -781,47 +750,44 @@ export default class ProfitLossRO extends Component {
type="text" type="text"
placeholder="" placeholder=""
disabled={true} disabled={true}
value={Number(value).toFixed(1)} value={Number(val).toFixed(1)}
decimalScale={1}
/> />
} }
/> />
</div> </div>
} }
</div> </div>
) )
}
} }
} }, {
}, { name: `Jun ${this.props.periode}`,
name: `Jun 2021`, options: {
options: { customHeadRender: (columnMeta) => (
customHeadRender: (columnMeta) => ( <TableCell style={{ ...style2, top: 0, zIndex: 99, backgroundColor: '#1c71b8', width: 96, borderRight: '1px #fff solid' }}>
<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> ),
), setCellProps: () => ({ style2 }),
setCellProps: () => ({ style2 }), customBodyRender: (val, tableMeta, updateValue) => {
customBodyRender: (value, tableMeta, updateValue) => { return (
return ( <div style={{ textAlign: 'right' }}>
<div style={{ textAlign: 'right' }}> {tableMeta.rowData[0] === 4 || tableMeta.rowData[0] === 1 ?
{tableMeta.rowData[0] === 4 || tableMeta.rowData[0] === 1 ? null :
null this.state.get_for == 'view' ?
: <NumberFormat
this.state.get_for == 'view' ? thousandSeparator={true}
<NumberFormat style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
thousandSeparator={true} type="text"
style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }} placeholder=""
type="text" disabled={true}
placeholder="" value={Number(val).toFixed(1)}
disabled={true} />
value={Number(value).toFixed(1)}
decimalScale={1}
/>
: :
<div style={{ flex: 1 }}> <div style={{ flex: 1 }}>
<FormControlLabel <FormControlLabel
style={{ margin: 0 }} style={{ margin: 0 }}
value={value} value={val}
control={ control={
<NumberFormat <NumberFormat
thousandSeparator={true} thousandSeparator={true}
...@@ -829,47 +795,44 @@ export default class ProfitLossRO extends Component { ...@@ -829,47 +795,44 @@ export default class ProfitLossRO extends Component {
type="text" type="text"
placeholder="" placeholder=""
disabled={true} disabled={true}
value={Number(value).toFixed(1)} value={Number(val).toFixed(1)}
decimalScale={1}
/> />
} }
/> />
</div> </div>
} }
</div> </div>
) )
}
} }
} }, {
}, { name: `Jul ${this.props.periode}`,
name: `Jul 2021`, options: {
options: { customHeadRender: (columnMeta) => (
customHeadRender: (columnMeta) => ( <TableCell style={{ ...style2, top: 0, zIndex: 99, backgroundColor: '#1c71b8', width: 96, borderRight: '1px #fff solid' }}>
<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> ),
), setCellProps: () => ({ style2 }),
setCellProps: () => ({ style2 }), customBodyRender: (val, tableMeta, updateValue) => {
customBodyRender: (value, tableMeta, updateValue) => { return (
return ( <div style={{ textAlign: 'right' }}>
<div style={{ textAlign: 'right' }}> {tableMeta.rowData[0] === 4 || tableMeta.rowData[0] === 1 ?
{tableMeta.rowData[0] === 4 || tableMeta.rowData[0] === 1 ? null :
null this.state.get_for == 'view' ?
: <NumberFormat
this.state.get_for == 'view' ? thousandSeparator={true}
<NumberFormat style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
thousandSeparator={true} type="text"
style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }} placeholder=""
type="text" disabled={true}
placeholder="" value={Number(val).toFixed(1)}
disabled={true} />
value={Number(value).toFixed(1)}
decimalScale={1}
/>
: :
<div style={{ flex: 1 }}> <div style={{ flex: 1 }}>
<FormControlLabel <FormControlLabel
style={{ margin: 0 }} style={{ margin: 0 }}
value={value} value={val}
control={ control={
<NumberFormat <NumberFormat
thousandSeparator={true} thousandSeparator={true}
...@@ -877,47 +840,44 @@ export default class ProfitLossRO extends Component { ...@@ -877,47 +840,44 @@ export default class ProfitLossRO extends Component {
type="text" type="text"
placeholder="" placeholder=""
disabled={true} disabled={true}
value={Number(value).toFixed(1)} value={Number(val).toFixed(1)}
decimalScale={1}
/> />
} }
/> />
</div> </div>
} }
</div> </div>
) )
}
} }
} }, {
}, { name: `Aug ${this.props.periode}`,
name: `Aug 2021`, options: {
options: { customHeadRender: (columnMeta) => (
customHeadRender: (columnMeta) => ( <TableCell style={{ ...style2, top: 0, zIndex: 99, backgroundColor: '#1c71b8', width: 96, borderRight: '1px #fff solid' }}>
<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> ),
), setCellProps: () => ({ style2 }),
setCellProps: () => ({ style2 }), customBodyRender: (val, tableMeta, updateValue) => {
customBodyRender: (value, tableMeta, updateValue) => { return (
return ( <div style={{ textAlign: 'right' }}>
<div style={{ textAlign: 'right' }}> {tableMeta.rowData[0] === 4 || tableMeta.rowData[0] === 1 ?
{tableMeta.rowData[0] === 4 || tableMeta.rowData[0] === 1 ? null :
null this.state.get_for == 'view' ?
: <NumberFormat
this.state.get_for == 'view' ? thousandSeparator={true}
<NumberFormat style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
thousandSeparator={true} type="text"
style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }} placeholder=""
type="text" disabled={true}
placeholder="" value={Number(val).toFixed(1)}
disabled={true} />
value={Number(value).toFixed(1)}
decimalScale={1}
/>
: :
<div style={{ flex: 1 }}> <div style={{ flex: 1 }}>
<FormControlLabel <FormControlLabel
style={{ margin: 0 }} style={{ margin: 0 }}
value={value} value={val}
control={ control={
<NumberFormat <NumberFormat
thousandSeparator={true} thousandSeparator={true}
...@@ -925,47 +885,44 @@ export default class ProfitLossRO extends Component { ...@@ -925,47 +885,44 @@ export default class ProfitLossRO extends Component {
type="text" type="text"
placeholder="" placeholder=""
disabled={true} disabled={true}
value={Number(value).toFixed(1)} value={Number(val).toFixed(1)}
decimalScale={1}
/> />
} }
/> />
</div> </div>
} }
</div> </div>
) )
}
} }
} }, {
}, { name: `Sep ${this.props.periode}`,
name: `Sep 2021`, options: {
options: { customHeadRender: (columnMeta) => (
customHeadRender: (columnMeta) => ( <TableCell style={{ ...style2, top: 0, zIndex: 99, backgroundColor: '#1c71b8', width: 96, borderRight: '1px #fff solid' }}>
<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> ),
), setCellProps: () => ({ style2 }),
setCellProps: () => ({ style2 }), customBodyRender: (val, tableMeta, updateValue) => {
customBodyRender: (value, tableMeta, updateValue) => { return (
return ( <div style={{ textAlign: 'right' }}>
<div style={{ textAlign: 'right' }}> {tableMeta.rowData[0] === 4 || tableMeta.rowData[0] === 1 ?
{tableMeta.rowData[0] === 4 || tableMeta.rowData[0] === 1 ? null :
null this.state.get_for == 'view' ?
: <NumberFormat
this.state.get_for == 'view' ? thousandSeparator={true}
<NumberFormat style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
thousandSeparator={true} type="text"
style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }} placeholder=""
type="text" disabled={true}
placeholder="" value={Number(val).toFixed(1)}
disabled={true} />
value={Number(value).toFixed(1)}
decimalScale={1}
/>
: :
<div style={{ flex: 1 }}> <div style={{ flex: 1 }}>
<FormControlLabel <FormControlLabel
style={{ margin: 0 }} style={{ margin: 0 }}
value={value} value={val}
control={ control={
<NumberFormat <NumberFormat
thousandSeparator={true} thousandSeparator={true}
...@@ -973,47 +930,44 @@ export default class ProfitLossRO extends Component { ...@@ -973,47 +930,44 @@ export default class ProfitLossRO extends Component {
type="text" type="text"
placeholder="" placeholder=""
disabled={true} disabled={true}
value={Number(value).toFixed(1)} value={Number(val).toFixed(1)}
decimalScale={1}
/> />
} }
/> />
</div> </div>
} }
</div> </div>
) )
}
} }
} }, {
}, { name: `Oct ${this.props.periode}`,
name: `Oct 2021`, options: {
options: { customHeadRender: (columnMeta) => (
customHeadRender: (columnMeta) => ( <TableCell style={{ ...style2, top: 0, zIndex: 99, backgroundColor: '#1c71b8', width: 96, borderRight: '1px #fff solid' }}>
<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> ),
), setCellProps: () => ({ style2 }),
setCellProps: () => ({ style2 }), customBodyRender: (val, tableMeta, updateValue) => {
customBodyRender: (value, tableMeta, updateValue) => { return (
return ( <div style={{ textAlign: 'right' }}>
<div style={{ textAlign: 'right' }}> {tableMeta.rowData[0] === 4 || tableMeta.rowData[0] === 1 ?
{tableMeta.rowData[0] === 4 || tableMeta.rowData[0] === 1 ? null :
null this.state.get_for == 'view' ?
: <NumberFormat
this.state.get_for == 'view' ? thousandSeparator={true}
<NumberFormat style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
thousandSeparator={true} type="text"
style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }} placeholder=""
type="text" disabled={true}
placeholder="" value={Number(val).toFixed(1)}
disabled={true} />
value={Number(value).toFixed(1)}
decimalScale={1}
/>
: :
<div style={{ flex: 1 }}> <div style={{ flex: 1 }}>
<FormControlLabel <FormControlLabel
style={{ margin: 0 }} style={{ margin: 0 }}
value={value} value={val}
control={ control={
<NumberFormat <NumberFormat
thousandSeparator={true} thousandSeparator={true}
...@@ -1021,47 +975,44 @@ export default class ProfitLossRO extends Component { ...@@ -1021,47 +975,44 @@ export default class ProfitLossRO extends Component {
type="text" type="text"
placeholder="" placeholder=""
disabled={true} disabled={true}
value={Number(value).toFixed(1)} value={Number(val).toFixed(1)}
decimalScale={1}
/> />
} }
/> />
</div> </div>
} }
</div> </div>
) )
}
} }
} }, {
}, { name: `Nov ${this.props.periode}`,
name: `Nov 2021`, options: {
options: { customHeadRender: (columnMeta) => (
customHeadRender: (columnMeta) => ( <TableCell style={{ ...style2, top: 0, zIndex: 99, backgroundColor: '#1c71b8', width: 96, borderRight: '1px #fff solid' }}>
<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> ),
), setCellProps: () => ({ style2 }),
setCellProps: () => ({ style2 }), customBodyRender: (val, tableMeta, updateValue) => {
customBodyRender: (value, tableMeta, updateValue) => { return (
return ( <div style={{ textAlign: 'right' }}>
<div style={{ textAlign: 'right' }}> {tableMeta.rowData[0] === 4 || tableMeta.rowData[0] === 1 ?
{tableMeta.rowData[0] === 4 || tableMeta.rowData[0] === 1 ? null :
null this.state.get_for == 'view' ?
: <NumberFormat
this.state.get_for == 'view' ? thousandSeparator={true}
<NumberFormat style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
thousandSeparator={true} type="text"
style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }} placeholder=""
type="text" disabled={true}
placeholder="" value={Number(val).toFixed(1)}
disabled={true} />
value={Number(value).toFixed(1)}
decimalScale={1}
/>
: :
<div style={{ flex: 1 }}> <div style={{ flex: 1 }}>
<FormControlLabel <FormControlLabel
style={{ margin: 0 }} style={{ margin: 0 }}
value={value} value={val}
control={ control={
<NumberFormat <NumberFormat
thousandSeparator={true} thousandSeparator={true}
...@@ -1069,47 +1020,44 @@ export default class ProfitLossRO extends Component { ...@@ -1069,47 +1020,44 @@ export default class ProfitLossRO extends Component {
type="text" type="text"
placeholder="" placeholder=""
disabled={true} disabled={true}
value={Number(value).toFixed(1)} value={Number(val).toFixed(1)}
decimalScale={1}
/> />
} }
/> />
</div> </div>
} }
</div> </div>
) )
}
} }
} }, {
}, { name: `Dec ${this.props.periode}`,
name: `Dec 2021`, options: {
options: { customHeadRender: (columnMeta) => (
customHeadRender: (columnMeta) => ( <TableCell style={{ ...style2, top: 0, zIndex: 99, backgroundColor: '#1c71b8', width: 96, borderRight: '1px #fff solid' }}>
<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> ),
), setCellProps: () => ({ style2 }),
setCellProps: () => ({ style2 }), customBodyRender: (val, tableMeta, updateValue) => {
customBodyRender: (value, tableMeta, updateValue) => { return (
return ( <div style={{ textAlign: 'right' }}>
<div style={{ textAlign: 'right' }}> {tableMeta.rowData[0] === 4 || tableMeta.rowData[0] === 1 ?
{tableMeta.rowData[0] === 4 || tableMeta.rowData[0] === 1 ? null :
null this.state.get_for == 'view' ?
: <NumberFormat
this.state.get_for == 'view' ? thousandSeparator={true}
<NumberFormat style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
thousandSeparator={true} type="text"
style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }} placeholder=""
type="text" disabled={true}
placeholder="" value={Number(val).toFixed(1)}
disabled={true} />
value={Number(value).toFixed(1)}
decimalScale={1}
/>
: :
<div style={{ flex: 1 }}> <div style={{ flex: 1 }}>
<FormControlLabel <FormControlLabel
style={{ margin: 0 }} style={{ margin: 0 }}
value={value} value={val}
control={ control={
<NumberFormat <NumberFormat
thousandSeparator={true} thousandSeparator={true}
...@@ -1117,47 +1065,44 @@ export default class ProfitLossRO extends Component { ...@@ -1117,47 +1065,44 @@ export default class ProfitLossRO extends Component {
type="text" type="text"
placeholder="" placeholder=""
disabled={true} disabled={true}
value={Number(value).toFixed(1)} value={Number(val).toFixed(1)}
decimalScale={1}
/> />
} }
/> />
</div> </div>
} }
</div> </div>
) )
}
} }
} }, {
}, { name: `${this.props.periode} Outlook`,
name: `2021 Outlook`, options: {
options: { customHeadRender: (columnMeta) => (
customHeadRender: (columnMeta) => ( <TableCell style={{ ...style2, top: 0, zIndex: 99, backgroundColor: '#1c71b8', width: 96, borderRight: '1px #fff solid' }}>
<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> ),
), setCellProps: () => ({ style2 }),
setCellProps: () => ({ style2 }), customBodyRender: (val, tableMeta, updateValue) => {
customBodyRender: (value, tableMeta, updateValue) => { return (
return ( <div style={{ textAlign: 'right' }}>
<div style={{ textAlign: 'right' }}> {tableMeta.rowData[0] === 4 || tableMeta.rowData[0] === 1 ?
{tableMeta.rowData[0] === 4 || tableMeta.rowData[0] === 1 ? null :
null this.state.get_for == 'view' ?
: <NumberFormat
this.state.get_for == 'view' ? thousandSeparator={true}
<NumberFormat style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
thousandSeparator={true} type="text"
style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }} placeholder=""
type="text" disabled={true}
placeholder="" value={Number(val).toFixed(1)}
disabled={true} />
value={Number(value).toFixed(1)}
decimalScale={1}
/>
: :
<div style={{ flex: 1 }}> <div style={{ flex: 1 }}>
<FormControlLabel <FormControlLabel
style={{ margin: 0 }} style={{ margin: 0 }}
value={value} value={val}
control={ control={
<NumberFormat <NumberFormat
thousandSeparator={true} thousandSeparator={true}
...@@ -1165,18 +1110,17 @@ export default class ProfitLossRO extends Component { ...@@ -1165,18 +1110,17 @@ export default class ProfitLossRO extends Component {
type="text" type="text"
placeholder="" placeholder=""
disabled={true} disabled={true}
value={Number(value).toFixed(1)} value={Number(val).toFixed(1)}
decimalScale={1}
/> />
} }
/> />
</div> </div>
} }
</div> </div>
) )
}
} }
} },
},
] ]
const loadingComponent = ( const loadingComponent = (
...@@ -1208,21 +1152,100 @@ export default class ProfitLossRO extends Component { ...@@ -1208,21 +1152,100 @@ export default class ProfitLossRO extends Component {
<Typography style={{ fontSize: '11px', color: '#4b4b4b' }}>Period : {this.props.periode} (rev.{this.props.revision})</Typography> <Typography style={{ fontSize: '11px', color: '#4b4b4b' }}>Period : {this.props.periode} (rev.{this.props.revision})</Typography>
<Typography style={{ fontSize: '11px', color: '#4b4b4b' }}>in IDR mn</Typography> <Typography style={{ fontSize: '11px', color: '#4b4b4b' }}>in IDR mn</Typography>
</div> </div>
<div style={{ width: '50%' }}>
{this.props.isApprover === true || this.state.get_for == 'view'?
<div style={{ justifyContent: 'flex-end', display: 'flex', flexFlow: 'wrap' }}>
<a data-tip={'Download'} data-for="download">
<button
style={{
backgroundColor: 'transparent',
cursor: 'pointer',
borderColor: 'transparent',
margin: 5
}}
onClick={() =>
this.setState({ loading: true }, () => {
setTimeout(() => {
this.downloadAllData()
}, 100);
})}
>
<img src={Images.download} />
</button>
</a>
<ReactTooltip border={true} id="download" place="bottom" type="light" effect="solid" />
</div> :
<div style={{ justifyContent: 'flex-end', display: 'flex', flexFlow: 'wrap' }}>
<a data-tip={'Download Template'} data-for="template">
<button
style={{
backgroundColor: 'transparent',
cursor: 'pointer',
borderColor: 'transparent',
margin: 5
}}
onClick={() => this.downloadTemplate()}
>
<img src={Images.template} />
</button>
</a>
<ReactTooltip border={true} id="template" place="bottom" type="light" effect="solid" />
<a data-tip={'Upload'} data-for="upload">
<button
style={{
backgroundColor: 'transparent',
cursor: 'pointer',
borderColor: 'transparent',
margin: 5
}}
onClick={() => this.setState({ visibleUpload: true })}
>
<img src={Images.upload} />
</button>
</a>
<ReactTooltip border={true} id="upload" place="bottom" type="light" effect="solid" />
<a data-tip={'Download'} data-for="download">
<button
style={{
backgroundColor: 'transparent',
cursor: 'pointer',
borderColor: 'transparent',
margin: 5
}}
onClick={() =>
this.setState({ loading: true }, () => {
setTimeout(() => {
this.downloadAllData()
}, 100);
})}
>
<img src={Images.download} />
</button>
</a>
<ReactTooltip border={true} id="download" place="bottom" type="light" effect="solid" />
</div>
}
</div>
</div> </div>
<div style={{ marginTop: 20, width: this.props.width - (this.props.open === true ? 400 : 150) }}> <div style={{ marginTop: 20, width: this.props.width - (this.props.open === true ? 400 : 150) }}>
{!this.state.loading && ( {!this.state.loading && (
<MuiThemeProvider theme={getMuiTheme()}> <MuiThemeProvider theme={getMuiTheme()}>
<MUIDataTable <MUIDataTable
data={dataTable2} data={dataTable2}
columns={columns} columns={columns}
options={options} options={options}
/> />
</MuiThemeProvider> </MuiThemeProvider>
)} )}
</div> </div>
<Typography style={{ fontSize: '11px', color: '#4b4b4b', marginTop: 20 }}>Last Updated by : {this.state.updateBy}</Typography>
<Typography style={{ fontSize: '11px', color: '#4b4b4b' }}>Notes : {this.state.notes}</Typography>
</div> </div>
<div className="grid grid-2x" style={{ marginTop: 20 }}> <div className="grid grid-2x" style={{ padding: 20 }}>
<div className="col-1"> <div className="col-1" style={{ paddingLeft: 0 }}>
<button <button
type="button" type="button"
onClick={() => this.setState({ loading: true }, () => { onClick={() => this.setState({ loading: true }, () => {
...@@ -1234,14 +1257,109 @@ export default class ProfitLossRO extends Component { ...@@ -1234,14 +1257,109 @@ export default class ProfitLossRO extends Component {
backgroundColor: 'transparent', backgroundColor: 'transparent',
cursor: 'pointer', cursor: 'pointer',
borderColor: 'transparent', borderColor: 'transparent',
outline: 'none' outline: 'none',
}} }}
> >
<div style={{ backgroundColor: '#019ce5', width: 105, height: 25, borderRadius: 3, justifyContent: 'center', display: 'flex', alignItems: 'center' }}> <div style={{ backgroundColor: '#019ce5', width: 105, height: 25, borderRadius: 3, justifyContent: 'center', display: 'flex', alignItems: 'center' }}>
<Typography style={{ fontSize: '11px', color: '#fff', textAlign: 'center' }}>Cancel</Typography> <Typography style={{ fontSize: '11px', color: '#fff', textAlign: 'center' }}>Back</Typography>
</div> </div>
</button> </button>
</div> </div>
{this.props.isApprover === true ?
<div className="col-2">
</div> :
<div className="col-2" style={{ display: 'flex', justifyContent: 'flex-end', maxWidth: '100%', paddingRight: 5 }}>
{this.state.get_for == 'view' && this.state.viewOnly &&
<button
className="button"
type="button"
style={{
backgroundColor: 'transparent',
cursor: 'pointer',
borderColor: 'transparent',
outline: 'none',
}}
onClick={() => {
this.setState({loading: true}, () => {
this.handleGetFor('edit')
})
}}
>
<div style={{ backgroundColor: '#fff', width: 105, height: 25, borderRadius: 3, justifyContent: 'center', display: 'flex', alignItems: 'center', border: 'solid 1px #354960' }}>
<Typography style={{ fontSize: '11px', color: '#354960', textAlign: 'center' }}>Edit</Typography>
</div>
</button>
}
{this.state.get_for == 'edit' && <button
className="button"
type="button"
style={{
backgroundColor: 'transparent',
cursor: 'pointer',
borderColor: 'transparent',
outline: 'none',
marginRight: 20
}}
onClick={() => {
this.setState({ loading: true, dataTable: dataTable2 }, () => {
setTimeout(() => {
this.handleValidate()
}, 100);
})
}}
>
<div style={{ backgroundColor: '#fff', width: 105, height: 25, borderRadius: 3, justifyContent: 'center', display: 'flex', alignItems: 'center', border: 'solid 1px #354960' }}>
<Typography style={{ fontSize: '11px', color: '#354960', textAlign: 'center' }}>Calculate</Typography>
</div>
</button>}
{this.state.get_for === 'edit' && <button
className="button"
type="button"
style={{
backgroundColor: 'transparent',
cursor: 'pointer',
borderColor: 'transparent',
outline: 'none',
marginRight: 20
}}
onClick={() =>
this.state.saveDraft ?
this.setState({ alert: true, messageAlert: 'Data Incomplete !', tipeAlert: 'error' })
:
this.state.handleTekTekTek == 1 ? null :
this.setState({ handleTekTekTek: 1, loading: true }, () => {
this.backToMonthlyReport('draft')
})
}
>
<div style={{ backgroundColor: '#354960', width: 105, height: 25, borderRadius: 3, justifyContent: 'center', display: 'flex', alignItems: 'center' }}>
<Typography style={{ fontSize: '11px', color: '#fff', textAlign: 'center' }}>Save as Draft</Typography>
</div>
</button>}
{this.state.get_for === 'edit' && <button
type="button"
// disabled={this.state.buttonError}
onClick={() =>
this.state.buttonError ?
this.setState({ alert: true, messageAlert: 'Data incomplete !', tipeAlert: 'error' })
:
this.state.handleTekTekTek == 1 ? null :
this.setState({ handleTekTekTek: 1 }, () => {
this.backToMonthlyReport('submitted')
})}
style={{
backgroundColor: 'transparent',
cursor: 'pointer',
borderColor: 'transparent',
outline: 'none',
}}
>
<div style={{ backgroundColor: '#354960', width: 105, height: 25, borderRadius: 3, justifyContent: 'center', display: 'flex', alignItems: 'center' }}>
<Typography style={{ fontSize: '11px', color: '#fff', textAlign: 'center' }}>Save & Complete</Typography>
</div>
</button>}
</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