Skip to content

T
Tia-dev
Commit a2a0b476 authored by Deni Rinaldi's avatar Deni Rinaldi
Browse files
Options

Merge branch 'faisal' into 'master' 

kloset

See merge request !651
parents c1719732 e8f99028
Show whitespace changes
Inline Side-by-side
Showing with 1675 additions and 329 deletions
src/container/BudgetTahunan/FixedAssetsMovement.js
View file @ a2a0b476
......@@ -544,7 +544,7 @@ export default class FixedAssetsMovement extends Component {
if (Bfr !== undefined) {
let data = 24
let period = Number(this.props.periode) - 1
console.log(dataTable2[tableMeta.rowIndex][data])
// console.log(dataTable2[tableMeta.rowIndex][data])
anjay.push(0)
let indexID = dataTable2[tableMeta.rowIndex][data].findIndex((val) => val.item_formula == String(`@${item}`) && val.periode == period)
if (indexID !== -1) {
......@@ -951,7 +951,46 @@ export default class FixedAssetsMovement extends Component {
customBodyRender: (value, tableMeta, updateValue) => {
return (
<div style={{ textAlign: 'right' }}>
{tableMeta.rowData[0] === 3 ?
{
this.props.status === 'CLOSED' ?
tableMeta.rowData[0] === 4 || tableMeta.rowData[0] === 1 ?
null
:
tableMeta.rowData[0] === 3 ?
<div style={{ flex: 1 }}>
<FormControlLabel
style={{ margin: 0 }}
value={value}
control={
<NumberFormat
thousandSeparator={true}
style={{ color: "#5198ea", fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
type="text"
placeholder=""
disabled={true}
value={Number(value).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)}
/>
}
/>
</div>
:
tableMeta.rowData[0] === 3 ?
<div style={{ flex: 1 }}>
<FormControlLabel
style={{ margin: 0 }}
......@@ -997,28 +1036,7 @@ export default class FixedAssetsMovement extends Component {
value={Number(handleValueFormula(value, tableMeta)).toFixed(1)}
/>
:
tableMeta.rowData[0] === 5 ?
// <NumberFormat
// thousandSeparator={true}
// style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
// type="text"
// placeholder=""
// disabled={true}
// value={handleFormula(value, tableMeta)}
// />
null
:
tableMeta.rowData[0] === 1 ?
// value === "" ?
// null :
// <NumberFormat
// thousandSeparator={true}
// style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
// type="text"
// placeholder=""
// disabled={true}
// value={Number(value)}
// />
null
:
null
......@@ -1039,7 +1057,46 @@ export default class FixedAssetsMovement extends Component {
customBodyRender: (value, tableMeta, updateValue) => {
return (
<div style={{ textAlign: 'right' }}>
{tableMeta.rowData[0] === 3 ?
{
this.props.status === 'CLOSED' ?
tableMeta.rowData[0] === 4 || tableMeta.rowData[0] === 1 ?
null
:
tableMeta.rowData[0] === 3 ?
<div style={{ flex: 1 }}>
<FormControlLabel
style={{ margin: 0 }}
value={value}
control={
<NumberFormat
thousandSeparator={true}
style={{ color: "#5198ea", fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
type="text"
placeholder=""
disabled={true}
value={Number(value).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)}
/>
}
/>
</div>
:
tableMeta.rowData[0] === 3 ?
<div style={{ flex: 1 }}>
<FormControlLabel
style={{ margin: 0 }}
......@@ -1086,28 +1143,7 @@ export default class FixedAssetsMovement extends Component {
value={Number(handleValueFormula(value, tableMeta)).toFixed(1)}
/>
:
tableMeta.rowData[0] === 5 ?
// <NumberFormat
// thousandSeparator={true}
// style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
// type="text"
// placeholder=""
// disabled={true}
// value={handleFormula(value, tableMeta)}
// />
null
:
tableMeta.rowData[0] === 1 ?
// value === "" ?
// null :
// <NumberFormat
// thousandSeparator={true}
// style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
// type="text"
// placeholder=""
// disabled={true}
// value={Number(value)}
// />
null
:
null
......@@ -1128,7 +1164,46 @@ export default class FixedAssetsMovement extends Component {
customBodyRender: (value, tableMeta, updateValue) => {
return (
<div style={{ textAlign: 'right' }}>
{tableMeta.rowData[0] === 3 ?
{
this.props.status === 'CLOSED' ?
tableMeta.rowData[0] === 4 || tableMeta.rowData[0] === 1 ?
null
:
tableMeta.rowData[0] === 3 ?
<div style={{ flex: 1 }}>
<FormControlLabel
style={{ margin: 0 }}
value={value}
control={
<NumberFormat
thousandSeparator={true}
style={{ color: "#5198ea", fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
type="text"
placeholder=""
disabled={true}
value={Number(value).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)}
/>
}
/>
</div>
:
tableMeta.rowData[0] === 3 ?
<div style={{ flex: 1 }}>
<FormControlLabel
style={{ margin: 0 }}
......@@ -1175,28 +1250,7 @@ export default class FixedAssetsMovement extends Component {
value={Number(handleValueFormula(value, tableMeta)).toFixed(1)}
/>
:
tableMeta.rowData[0] === 5 ?
// <NumberFormat
// thousandSeparator={true}
// style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
// type="text"
// placeholder=""
// disabled={true}
// value={handleFormula(value, tableMeta)}
// />
null
:
tableMeta.rowData[0] === 1 ?
// value === "" ?
// null :
// <NumberFormat
// thousandSeparator={true}
// style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
// type="text"
// placeholder=""
// disabled={true}
// value={Number(value)}
// />
null
:
null
......@@ -1217,7 +1271,46 @@ export default class FixedAssetsMovement extends Component {
customBodyRender: (value, tableMeta, updateValue) => {
return (
<div style={{ textAlign: 'right' }}>
{tableMeta.rowData[0] === 3 ?
{
this.props.status === 'CLOSED' ?
tableMeta.rowData[0] === 4 || tableMeta.rowData[0] === 1 ?
null
:
tableMeta.rowData[0] === 3 ?
<div style={{ flex: 1 }}>
<FormControlLabel
style={{ margin: 0 }}
value={value}
control={
<NumberFormat
thousandSeparator={true}
style={{ color: "#5198ea", fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
type="text"
placeholder=""
disabled={true}
value={Number(value).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)}
/>
}
/>
</div>
:
tableMeta.rowData[0] === 3 ?
<div style={{ flex: 1 }}>
<FormControlLabel
style={{ margin: 0 }}
......@@ -1264,28 +1357,7 @@ export default class FixedAssetsMovement extends Component {
value={Number(handleValueFormula(value, tableMeta)).toFixed(1)}
/>
:
tableMeta.rowData[0] === 5 ?
// <NumberFormat
// thousandSeparator={true}
// style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
// type="text"
// placeholder=""
// disabled={true}
// value={handleFormula(value, tableMeta)}
// />
null
:
tableMeta.rowData[0] === 1 ?
// value === "" ?
// null :
// <NumberFormat
// thousandSeparator={true}
// style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
// type="text"
// placeholder=""
// disabled={true}
// value={Number(value)}
// />
null
:
null
......@@ -1306,7 +1378,46 @@ export default class FixedAssetsMovement extends Component {
customBodyRender: (value, tableMeta, updateValue) => {
return (
<div style={{ textAlign: 'right' }}>
{tableMeta.rowData[0] === 3 ?
{
this.props.status === 'CLOSED' ?
tableMeta.rowData[0] === 4 || tableMeta.rowData[0] === 1 ?
null
:
tableMeta.rowData[0] === 3 ?
<div style={{ flex: 1 }}>
<FormControlLabel
style={{ margin: 0 }}
value={value}
control={
<NumberFormat
thousandSeparator={true}
style={{ color: "#5198ea", fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
type="text"
placeholder=""
disabled={true}
value={Number(value).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)}
/>
}
/>
</div>
:
tableMeta.rowData[0] === 3 ?
<div style={{ flex: 1 }}>
<FormControlLabel
style={{ margin: 0 }}
......@@ -1353,28 +1464,7 @@ export default class FixedAssetsMovement extends Component {
value={Number(handleValueFormula(value, tableMeta)).toFixed(1)}
/>
:
tableMeta.rowData[0] === 5 ?
// <NumberFormat
// thousandSeparator={true}
// style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
// type="text"
// placeholder=""
// disabled={true}
// value={handleFormula(value, tableMeta)}
// />
null
:
tableMeta.rowData[0] === 1 ?
// value === "" ?
// null :
// <NumberFormat
// thousandSeparator={true}
// style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
// type="text"
// placeholder=""
// disabled={true}
// value={Number(value)}
// />
null
:
null
......@@ -1395,7 +1485,46 @@ export default class FixedAssetsMovement extends Component {
customBodyRender: (value, tableMeta, updateValue) => {
return (
<div style={{ textAlign: 'right' }}>
{tableMeta.rowData[0] === 3 ?
{
this.props.status === 'CLOSED' ?
tableMeta.rowData[0] === 4 || tableMeta.rowData[0] === 1 ?
null
:
tableMeta.rowData[0] === 3 ?
<div style={{ flex: 1 }}>
<FormControlLabel
style={{ margin: 0 }}
value={value}
control={
<NumberFormat
thousandSeparator={true}
style={{ color: "#5198ea", fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
type="text"
placeholder=""
disabled={true}
value={Number(value).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)}
/>
}
/>
</div>
:
tableMeta.rowData[0] === 3 ?
<div style={{ flex: 1 }}>
<FormControlLabel
style={{ margin: 0 }}
......@@ -1442,28 +1571,114 @@ export default class FixedAssetsMovement extends Component {
value={Number(handleValueFormula(value, tableMeta)).toFixed(1)}
/>
:
tableMeta.rowData[0] === 1 ?
null
:
null
}
</div>
)
}
}
}, {
name: `Jul ${this.props.periode}`,
options: {
customHeadRender: (columnMeta) => (
<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>
),
setCellProps: () => ({ style2 }),
customBodyRender: (value, tableMeta, updateValue) => {
return (
<div style={{ textAlign: 'right' }}>
{
this.props.status === 'CLOSED' ?
tableMeta.rowData[0] === 4 || tableMeta.rowData[0] === 1 ?
null
:
tableMeta.rowData[0] === 3 ?
<div style={{ flex: 1 }}>
<FormControlLabel
style={{ margin: 0 }}
value={value}
control={
<NumberFormat
thousandSeparator={true}
style={{ color: "#5198ea", fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
type="text"
placeholder=""
disabled={true}
value={Number(value).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)}
/>
}
/>
</div>
:
tableMeta.rowData[0] === 3 ?
<div style={{ flex: 1 }}>
<FormControlLabel
style={{ margin: 0 }}
value={value}
control={
<NumberFormat
thousandSeparator={true}
style={{ color: "#5198ea", fontSize: 12, textAlign: 'right', 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)}
value={Number(value).toFixed(1)}
onBlur={(event) => {
// updateValue(event.target.value)
handleChange(event.target.value, tableMeta)
// // console.log(dataTable2)
}}
/>
}
/>
</div> :
tableMeta.rowData[0] === 5 ?
// <NumberFormat
// thousandSeparator={true}
// style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
// type="text"
// placeholder=""
// disabled={true}
// value={handleFormula(value, tableMeta)}
// />
<span style={{ fontSize: 12, textAlign: 'right' }}>
<NumberFormat
thousandSeparator={true}
style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
type="text"
placeholder=""
disabled={true}
value={Number(handleValueFormula(value, tableMeta)).toFixed(1)}
/>
</span>
:
tableMeta.rowData[0] === 4 ?
null
:
tableMeta.rowData[0] === 6 ?
<NumberFormat
thousandSeparator={true}
style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
type="text"
placeholder=""
disabled={true}
value={Number(handleValueFormula(value, tableMeta)).toFixed(1)}
/>
:
tableMeta.rowData[0] === 1 ?
// value === "" ?
// null :
// <NumberFormat
// thousandSeparator={true}
// style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
// type="text"
// placeholder=""
// disabled={true}
// value={Number(value)}
// />
null
:
null
......@@ -1473,7 +1688,7 @@ export default class FixedAssetsMovement extends Component {
}
}
}, {
name: `Jul ${this.props.periode}`,
name: `Aug ${this.props.periode}`,
options: {
customHeadRender: (columnMeta) => (
<TableCell style={{ ...style2, top: 0, zIndex: 99, backgroundColor: '#1c71b8', width: 96 }}>
......@@ -1484,7 +1699,46 @@ export default class FixedAssetsMovement extends Component {
customBodyRender: (value, tableMeta, updateValue) => {
return (
<div style={{ textAlign: 'right' }}>
{tableMeta.rowData[0] === 3 ?
{
this.props.status === 'CLOSED' ?
tableMeta.rowData[0] === 4 || tableMeta.rowData[0] === 1 ?
null
:
tableMeta.rowData[0] === 3 ?
<div style={{ flex: 1 }}>
<FormControlLabel
style={{ margin: 0 }}
value={value}
control={
<NumberFormat
thousandSeparator={true}
style={{ color: "#5198ea", fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
type="text"
placeholder=""
disabled={true}
value={Number(value).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)}
/>
}
/>
</div>
:
tableMeta.rowData[0] === 3 ?
<div style={{ flex: 1 }}>
<FormControlLabel
style={{ margin: 0 }}
......@@ -1531,28 +1785,7 @@ export default class FixedAssetsMovement extends Component {
value={Number(handleValueFormula(value, tableMeta)).toFixed(1)}
/>
:
tableMeta.rowData[0] === 5 ?
// <NumberFormat
// thousandSeparator={true}
// style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
// type="text"
// placeholder=""
// disabled={true}
// value={handleFormula(value, tableMeta)}
// />
null
:
tableMeta.rowData[0] === 1 ?
// value === "" ?
// null :
// <NumberFormat
// thousandSeparator={true}
// style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
// type="text"
// placeholder=""
// disabled={true}
// value={Number(value)}
// />
null
:
null
......@@ -1562,7 +1795,7 @@ export default class FixedAssetsMovement extends Component {
}
}
}, {
name: `Aug ${this.props.periode}`,
name: `Sep ${this.props.periode}`,
options: {
customHeadRender: (columnMeta) => (
<TableCell style={{ ...style2, top: 0, zIndex: 99, backgroundColor: '#1c71b8', width: 96 }}>
......@@ -1573,7 +1806,12 @@ export default class FixedAssetsMovement extends Component {
customBodyRender: (value, tableMeta, updateValue) => {
return (
<div style={{ textAlign: 'right' }}>
{tableMeta.rowData[0] === 3 ?
{
this.props.status === 'CLOSED' ?
tableMeta.rowData[0] === 4 || tableMeta.rowData[0] === 1 ?
null
:
tableMeta.rowData[0] === 3 ?
<div style={{ flex: 1 }}>
<FormControlLabel
style={{ margin: 0 }}
......@@ -1584,85 +1822,30 @@ export default class FixedAssetsMovement extends Component {
style={{ color: "#5198ea", fontSize: 12, textAlign: 'right', 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)}
disabled={true}
value={Number(value).toFixed(1)}
onBlur={(event) => {
// updateValue(event.target.value)
handleChange(event.target.value, tableMeta)
// // console.log(dataTable2)
}}
/>
}
/>
</div> :
tableMeta.rowData[0] === 5 ?
<span style={{ fontSize: 12, textAlign: 'right' }}>
<NumberFormat
thousandSeparator={true}
style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
type="text"
placeholder=""
disabled={true}
value={Number(handleValueFormula(value, tableMeta)).toFixed(1)}
/>
</span>
:
tableMeta.rowData[0] === 4 ?
null
:
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=""
disabled={true}
value={Number(handleValueFormula(value, tableMeta)).toFixed(1)}
value={Number(value).toFixed(1)}
/>
:
tableMeta.rowData[0] === 5 ?
// <NumberFormat
// thousandSeparator={true}
// style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
// type="text"
// placeholder=""
// disabled={true}
// value={handleFormula(value, tableMeta)}
// />
null
:
tableMeta.rowData[0] === 1 ?
// value === "" ?
// null :
// <NumberFormat
// thousandSeparator={true}
// style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
// type="text"
// placeholder=""
// disabled={true}
// value={Number(value)}
// />
null
:
null
}
/>
</div>
)
}
}
}, {
name: `Sep ${this.props.periode}`,
options: {
customHeadRender: (columnMeta) => (
<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>
),
setCellProps: () => ({ style2 }),
customBodyRender: (value, tableMeta, updateValue) => {
return (
<div style={{ textAlign: 'right' }}>
{tableMeta.rowData[0] === 3 ?
:
tableMeta.rowData[0] === 3 ?
<div style={{ flex: 1 }}>
<FormControlLabel
style={{ margin: 0 }}
......@@ -1709,28 +1892,7 @@ export default class FixedAssetsMovement extends Component {
value={Number(handleValueFormula(value, tableMeta)).toFixed(1)}
/>
:
tableMeta.rowData[0] === 5 ?
// <NumberFormat
// thousandSeparator={true}
// style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
// type="text"
// placeholder=""
// disabled={true}
// value={handleFormula(value, tableMeta)}
// />
null
:
tableMeta.rowData[0] === 1 ?
// value === "" ?
// null :
// <NumberFormat
// thousandSeparator={true}
// style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
// type="text"
// placeholder=""
// disabled={true}
// value={Number(value)}
// />
null
:
null
......@@ -1751,7 +1913,46 @@ export default class FixedAssetsMovement extends Component {
customBodyRender: (value, tableMeta, updateValue) => {
return (
<div style={{ textAlign: 'right' }}>
{tableMeta.rowData[0] === 3 ?
{
this.props.status === 'CLOSED' ?
tableMeta.rowData[0] === 4 || tableMeta.rowData[0] === 1 ?
null
:
tableMeta.rowData[0] === 3 ?
<div style={{ flex: 1 }}>
<FormControlLabel
style={{ margin: 0 }}
value={value}
control={
<NumberFormat
thousandSeparator={true}
style={{ color: "#5198ea", fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
type="text"
placeholder=""
disabled={true}
value={Number(value).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)}
/>
}
/>
</div>
:
tableMeta.rowData[0] === 3 ?
<div style={{ flex: 1 }}>
<FormControlLabel
style={{ margin: 0 }}
......@@ -1798,28 +1999,7 @@ export default class FixedAssetsMovement extends Component {
value={Number(handleValueFormula(value, tableMeta)).toFixed(1)}
/>
:
tableMeta.rowData[0] === 5 ?
// <NumberFormat
// thousandSeparator={true}
// style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
// type="text"
// placeholder=""
// disabled={true}
// value={handleFormula(value, tableMeta)}
// />
null
:
tableMeta.rowData[0] === 1 ?
// value === "" ?
// null :
// <NumberFormat
// thousandSeparator={true}
// style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
// type="text"
// placeholder=""
// disabled={true}
// value={Number(value)}
// />
null
:
null
......@@ -1840,7 +2020,46 @@ export default class FixedAssetsMovement extends Component {
customBodyRender: (value, tableMeta, updateValue) => {
return (
<div style={{ textAlign: 'right' }}>
{tableMeta.rowData[0] === 3 ?
{
this.props.status === 'CLOSED' ?
tableMeta.rowData[0] === 4 || tableMeta.rowData[0] === 1 ?
null
:
tableMeta.rowData[0] === 3 ?
<div style={{ flex: 1 }}>
<FormControlLabel
style={{ margin: 0 }}
value={value}
control={
<NumberFormat
thousandSeparator={true}
style={{ color: "#5198ea", fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
type="text"
placeholder=""
disabled={true}
value={Number(value).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)}
/>
}
/>
</div>
:
tableMeta.rowData[0] === 3 ?
<div style={{ flex: 1 }}>
<FormControlLabel
style={{ margin: 0 }}
......@@ -1887,28 +2106,7 @@ export default class FixedAssetsMovement extends Component {
value={Number(handleValueFormula(value, tableMeta)).toFixed(1)}
/>
:
tableMeta.rowData[0] === 5 ?
// <NumberFormat
// thousandSeparator={true}
// style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
// type="text"
// placeholder=""
// disabled={true}
// value={handleFormula(value, tableMeta)}
// />
null
:
tableMeta.rowData[0] === 1 ?
// value === "" ?
// null :
// <NumberFormat
// thousandSeparator={true}
// style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
// type="text"
// placeholder=""
// disabled={true}
// value={Number(value)}
// />
null
:
null
......@@ -1929,7 +2127,46 @@ export default class FixedAssetsMovement extends Component {
customBodyRender: (value, tableMeta, updateValue) => {
return (
<div style={{ textAlign: 'right' }}>
{tableMeta.rowData[0] === 3 ?
{
this.props.status === 'CLOSED' ?
tableMeta.rowData[0] === 4 || tableMeta.rowData[0] === 1 ?
null
:
tableMeta.rowData[0] === 3 ?
<div style={{ flex: 1 }}>
<FormControlLabel
style={{ margin: 0 }}
value={value}
control={
<NumberFormat
thousandSeparator={true}
style={{ color: "#5198ea", fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
type="text"
placeholder=""
disabled={true}
value={Number(value).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)}
/>
}
/>
</div>
:
tableMeta.rowData[0] === 3 ?
<div style={{ flex: 1 }}>
<FormControlLabel
style={{ margin: 0 }}
......@@ -1976,28 +2213,7 @@ export default class FixedAssetsMovement extends Component {
value={Number(handleValueFormula(value, tableMeta)).toFixed(1)}
/>
:
tableMeta.rowData[0] === 5 ?
// <NumberFormat
// thousandSeparator={true}
// style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
// type="text"
// placeholder=""
// disabled={true}
// value={handleFormula(value, tableMeta)}
// />
null
:
tableMeta.rowData[0] === 1 ?
// value === "" ?
// null :
// <NumberFormat
// thousandSeparator={true}
// style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
// type="text"
// placeholder=""
// disabled={true}
// value={Number(value)}
// />
null
:
null
......@@ -2056,7 +2272,46 @@ export default class FixedAssetsMovement extends Component {
customBodyRender: (value, tableMeta, updateValue) => {
return (
<div style={{ textAlign: 'right' }}>
{tableMeta.rowData[0] === 3 ?
{
this.props.status === 'CLOSED' ?
tableMeta.rowData[0] === 4 || tableMeta.rowData[0] === 1 ?
null
:
tableMeta.rowData[0] === 3 ?
<div style={{ flex: 1 }}>
<FormControlLabel
style={{ margin: 0 }}
value={value}
control={
<NumberFormat
thousandSeparator={true}
style={{ color: "#5198ea", fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
type="text"
placeholder=""
disabled={true}
value={Number(value).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)}
/>
}
/>
</div>
:
tableMeta.rowData[0] === 3 ?
<div style={{ flex: 1 }}>
<FormControlLabel
style={{ margin: 0 }}
......@@ -2104,16 +2359,6 @@ export default class FixedAssetsMovement extends Component {
/>
:
tableMeta.rowData[0] === 1 ?
// value === "" ?
// null :
// <NumberFormat
// thousandSeparator={true}
// style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
// type="text"
// placeholder=""
// disabled={true}
// value={Number(value)}
// />
null
:
null
......@@ -2134,7 +2379,46 @@ export default class FixedAssetsMovement extends Component {
customBodyRender: (value, tableMeta, updateValue) => {
return (
<div style={{ textAlign: 'right' }}>
{tableMeta.rowData[0] === 3 ?
{
this.props.status === 'CLOSED' ?
tableMeta.rowData[0] === 4 || tableMeta.rowData[0] === 1 ?
null
:
tableMeta.rowData[0] === 3 ?
<div style={{ flex: 1 }}>
<FormControlLabel
style={{ margin: 0 }}
value={value}
control={
<NumberFormat
thousandSeparator={true}
style={{ color: "#5198ea", fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
type="text"
placeholder=""
disabled={true}
value={Number(value).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)}
/>
}
/>
</div>
:
tableMeta.rowData[0] === 3 ?
<div style={{ flex: 1 }}>
<FormControlLabel
style={{ margin: 0 }}
......@@ -2182,16 +2466,6 @@ export default class FixedAssetsMovement extends Component {
/>
:
tableMeta.rowData[0] === 1 ?
// value === "" ?
// null :
// <NumberFormat
// thousandSeparator={true}
// style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
// type="text"
// placeholder=""
// disabled={true}
// value={Number(value)}
// />
null
:
null
......
src/container/MonthlyReport.js
View file @ a2a0b476
......@@ -5,8 +5,6 @@ import Images from '../assets/Images';
import api from '../api';
import Autocomplete from '@material-ui/lab/Autocomplete';
import { titleCase } from '../library/Utils';
import FixedAssetsMovement from './BudgetTahunan/FixedAssetsMovement';
import CorporateAnnualTarget from './BudgetTahunan/CorporateAnnualTarget';
import { ExcelRenderer } from 'react-excel-renderer';
import UploadFile from "../library/Upload";
import { format } from 'date-fns';
......@@ -19,6 +17,7 @@ import { PropagateLoader } from 'react-spinners';
import MuiAlert from '@material-ui/lab/Alert';
import Constant from '../library/Constant';
import OperatingIndicatorMR from './MonthlyReport/OperatingIndicatorMR';
import CorporateAnnualTargetMR from './MonthlyReport/CorporateAnnualTargetMR';
var ct = require("../library/CustomTable");
const getMuiTheme = () => createMuiTheme(ct.customTable());
......@@ -283,7 +282,7 @@ export default class MonthlyReport extends Component {
let payload = {
"company_id": this.state.company.company_id,
"periode": this.state.periode.periode,
"month": this.state.month.month_id
"months": this.state.month.month_id
}
api.create().getMonthlyReportID(payload).then(response => {
console.log(response);
......@@ -795,12 +794,13 @@ export default class MonthlyReport extends Component {
company={this.state.company}
revision={this.state.revisionTable}
periode={this.state.periode.periode}
submissionID={this.state.submissionID}
monthlyReportId={this.state.monthlyReportId}
month={this.state.month}
onClickClose={() => this.setState({ visibleFAM: false, visibleMonthlyReport: true })}
/>
)}
{this.state.visibleCAT && (
<CorporateAnnualTarget
<CorporateAnnualTargetMR
open={this.props.open}
report_id={this.state.report_id}
height={this.props.height}
......@@ -808,7 +808,8 @@ export default class MonthlyReport extends Component {
company={this.state.company}
revision={this.state.revisionTable}
periode={this.state.periode.periode}
submissionID={this.state.submissionID}
monthlyReportId={this.state.monthlyReportId}
month={this.state.month}
onClickClose={() => this.setState({ visibleCAT: false, visibleMonthlyReport: true })}
/>
)}
......
src/container/MonthlyReport/CorporateAnnualTargetMR.js 0 → 100644
View file @ a2a0b476
import { Typography, Paper, createMuiTheme, ThemeProvider, MuiThemeProvider, TableCell, FormControlLabel, TextField, Input, withStyles, makeStyles, Snackbar } from '@material-ui/core';
import MUIDataTable from 'mui-datatables';
import React, { Component } from 'react'
import ReactTooltip from 'react-tooltip';
import Images from '../../assets/Images';
import api from '../../api';
import { titleCase } from '../../library/Utils';
import Tooltip from '@material-ui/core/Tooltip';
import NumberFormat from 'react-number-format';
const LightTooltip = withStyles((theme) => ({
tooltip: {
backgroundColor: theme.palette.common.white,
color: 'rgba(0, 0, 0, 0.87)',
boxShadow: theme.shadows[1],
fontSize: 11,
},
}))(Tooltip);
var ct = require("../../library/CustomTable");
const getMuiTheme = () => createMuiTheme(ct.customTable3());
const options = ct.customOptionsFixedColumn();
const style = {
position: "sticky",
left: 0,
background: "white",
zIndex: 101,
};
const style2 = {
position: "sticky",
background: "white",
zIndex: 100,
top: 0
};
const theme = createMuiTheme({
overrides: {
// Style sheet name ⚛️
MuiInputBase: {
input: {
color: '#5198ea'
}
}
},
});
export default class CorporateAnnualTargetMR extends Component {
constructor(props) {
super(props)
this.state = {
dataTables: [],
loading: true
}
}
componentDidMount() {
this.getItemHierarki()
}
getItemHierarki() {
let payload = {
"report_id": this.props.report_id,
"revision": Number(this.props.revision),
"periode": this.props.periode,
"company_id": this.props.company.company_id,
"monthly_report_id": this.props.monthlyReportId,
"month": this.props.month
}
api.create().getDetailReportMB(payload).then(response => {
let dataTable = []
let dataCustomerPrs = []
let dataInternalBsn = []
console.log(response);
if (response.data) {
let res = response.data.data
const handlePushChild = (item) => {
let indexIDzz = dataTable.findIndex((val) => val[1] === item.id)
if (indexIDzz === -1) {
let parentTrue = item.parent_name == 'INTERNAL BUSINESS PROCESS PERSPECTIVE' || item.parent_name == 'CUSTOMER PERSPECTIVE'
if (item.parent_name == 'INTERNAL BUSINESS PROCESS PERSPECTIVE') {
if (item.type_report_id !== 4) {
dataInternalBsn.push({
id: item.id,
name: item.description,
check: false
})
}
}
if (item.parent_name == 'CUSTOMER PERSPECTIVE') {
if (item.type_report_id !== 4) {
dataCustomerPrs.push({
id: item.id,
name: item.description,
check: false
})
}
}
dataTable.push([
item.type_report_id,
item.id,
item.parent,
item.formula,
item.level,
"",
item.description,
item.type_report_id == 1 ? `${Number(item.weight) * 100}%` : (String(item.cat.weight).indexOf(".") == -1 ? item.cat.weight : `${Number(item.weight) * 100}%`),
parentTrue ? item.cat.uom : item.uom,
parentTrue ? item.cat.kpi_type == "" ? null : { value: item.cat.kpi_type } : item.kpi_type == "" ? null : { value: item.kpi_type },
parentTrue ? item.cat.max_ach == "" ? null : { value: titleCase(item.cat.max_ach) } : item.max_ach == "" ? null : { value: titleCase(item.max_ach) },
parentTrue ? item.cat.formula == "" ? null : { value: item.cat.formula } : item.formula_ytd == "" ? null : { value: item.formula_ytd },
item.cat.total_actual_before == "" ? item.cat.total_actual_before : String(item.cat.total_actual_before).indexOf(".") == -1 ? Number(item.cat.total_actual_before) : Number(item.cat.total_actual_before).toFixed(1),
item.cat.january == "" ? item.cat.january : String(item.cat.january).indexOf(".") == -1 ? Number(item.cat.january) : Number(item.cat.january).toFixed(1),
item.cat.february == "" ? item.cat.february : String(item.cat.february).indexOf(".") == -1 ? Number(item.cat.february) : Number(item.cat.february).toFixed(1),
item.cat.march == "" ? item.cat.march : String(item.cat.march).indexOf(".") == -1 ? Number(item.cat.march) : Number(item.cat.march).toFixed(1),
item.cat.april == "" ? item.cat.april : String(item.cat.april).indexOf(".") == -1 ? Number(item.cat.april) : Number(item.cat.april).toFixed(1),
item.cat.may == "" ? item.cat.may : String(item.cat.may).indexOf(".") == -1 ? Number(item.cat.may) : Number(item.cat.may).toFixed(1),
item.cat.june == "" ? item.cat.june : String(item.cat.june).indexOf(".") == -1 ? Number(item.cat.june) : Number(item.cat.june).toFixed(1),
item.cat.july == "" ? item.cat.july : String(item.cat.july).indexOf(".") == -1 ? Number(item.cat.july) : Number(item.cat.july).toFixed(1),
item.cat.august == "" ? item.cat.august : String(item.cat.august).indexOf(".") == -1 ? Number(item.cat.august) : Number(item.cat.august).toFixed(1),
item.cat.september == "" ? item.cat.september : String(item.cat.september).indexOf(".") == -1 ? Number(item.cat.september) : Number(item.cat.september).toFixed(1),
item.cat.october == "" ? item.cat.october : String(item.cat.october).indexOf(".") == -1 ? Number(item.cat.october) : Number(item.cat.october).toFixed(1),
item.cat.november == "" ? item.cat.november : String(item.cat.november).indexOf(".") == -1 ? Number(item.cat.november) : Number(item.cat.november).toFixed(1),
item.cat.december == "" ? item.cat.december : String(item.cat.december).indexOf(".") == -1 ? Number(item.cat.december) : Number(item.cat.december).toFixed(1),
item.cat.total_current_year == "" ? item.cat.total_current_year : String(item.cat.total_current_year).indexOf(".") == -1 ? Number(item.cat.total_current_year) : Number(item.cat.total_current_year).toFixed(1),
item.cat.total_next_year == "" ? item.cat.total_next_year : String(item.cat.total_next_year).indexOf(".") == -1 ? Number(item.cat.total_next_year) : Number(item.cat.total_next_year).toFixed(1),
item.cat.total_more_year == "" ? item.cat.total_more_year : String(item.cat.total_more_year).indexOf(".") == -1 ? Number(item.cat.total_more_year) : Number(item.cat.total_more_year).toFixed(1),
item.cat.strategic,
item.cat.pic
])
}
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.type_report_id == 1 ? `${Number(item.weight) * 100}%` : item.cat.weight,
item.cat.uom,
item.kpi_type == "" ? null : { value: item.kpi_type },
item.max_ach == "" ? null : { value: titleCase(item.max_ach) },
item.formula == "" ? null : { value: item.formula_ytd },
item.cat.total_actual_before == "" ? item.cat.total_actual_before : String(item.cat.total_actual_before).indexOf(".") == -1 ? Number(item.cat.total_actual_before) : Number(item.cat.total_actual_before).toFixed(1),
item.cat.january == "" ? item.cat.january : String(item.cat.january).indexOf(".") == -1 ? Number(item.cat.january) : Number(item.cat.january).toFixed(1),
item.cat.february == "" ? item.cat.february : String(item.cat.february).indexOf(".") == -1 ? Number(item.cat.february) : Number(item.cat.february).toFixed(1),
item.cat.march == "" ? item.cat.march : String(item.cat.march).indexOf(".") == -1 ? Number(item.cat.march) : Number(item.cat.march).toFixed(1),
item.cat.april == "" ? item.cat.april : String(item.cat.april).indexOf(".") == -1 ? Number(item.cat.april) : Number(item.cat.april).toFixed(1),
item.cat.may == "" ? item.cat.may : String(item.cat.may).indexOf(".") == -1 ? Number(item.cat.may) : Number(item.cat.may).toFixed(1),
item.cat.june == "" ? item.cat.june : String(item.cat.june).indexOf(".") == -1 ? Number(item.cat.june) : Number(item.cat.june).toFixed(1),
item.cat.july == "" ? item.cat.july : String(item.cat.july).indexOf(".") == -1 ? Number(item.cat.july) : Number(item.cat.july).toFixed(1),
item.cat.august == "" ? item.cat.august : String(item.cat.august).indexOf(".") == -1 ? Number(item.cat.august) : Number(item.cat.august).toFixed(1),
item.cat.september == "" ? item.cat.september : String(item.cat.september).indexOf(".") == -1 ? Number(item.cat.september) : Number(item.cat.september).toFixed(1),
item.cat.october == "" ? item.cat.october : String(item.cat.october).indexOf(".") == -1 ? Number(item.cat.october) : Number(item.cat.october).toFixed(1),
item.cat.november == "" ? item.cat.november : String(item.cat.november).indexOf(".") == -1 ? Number(item.cat.november) : Number(item.cat.november).toFixed(1),
item.cat.december == "" ? item.cat.december : String(item.cat.december).indexOf(".") == -1 ? Number(item.cat.december) : Number(item.cat.december).toFixed(1),
item.cat.total_current_year == "" ? item.cat.total_current_year : String(item.cat.total_current_year).indexOf(".") == -1 ? Number(item.cat.total_current_year) : Number(item.cat.total_current_year).toFixed(1),
item.cat.total_next_year == "" ? item.cat.total_next_year : String(item.cat.total_next_year).indexOf(".") == -1 ? Number(item.cat.total_next_year) : Number(item.cat.total_next_year).toFixed(1),
item.cat.total_more_year == "" ? item.cat.total_more_year : String(item.cat.total_more_year).indexOf(".") == -1 ? Number(item.cat.total_more_year) : Number(item.cat.total_more_year).toFixed(1),
item.cat.strategic,
item.cat.pic
])
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, dataCustomerPrs, dataInternalBsn }, () => {
// console.log(dataCustomerPrs)
})
}
console.log(dataTable);
})
}
render() {
let dataTable2 = this.state.dataTable
let dataDelete = this.state.dataDelete
const handleChange = (value, tableMeta) => {
let val = String(value).split(",").join("")
// let total = 0
// let lastValz = 0
dataTable2[tableMeta.rowIndex][tableMeta.columnIndex] = Number(val)
// dataTable2[tableMeta.rowIndex].map((item, index) => {
// if (index >= 13 && index <= 24) {
// let valItem = item == undefined || item == "" ? 0 : item
// total += Number(valItem)
// if (index == 24) {
// lastValz += Number(valItem)
// }
// }
// })
// let valz = dataTable2[tableMeta.rowIndex][11] == null ? 'SUM' : dataTable2[tableMeta.rowIndex][11].value
// dataTable2[tableMeta.rowIndex][25] = (valz == 'SUM' ? total : (valz == 'AVG' ? (total / 12) : lastValz))
// // // console.log(dataTable2[tableMeta.rowIndex])
}
const handleChangeDropdown = (value, tableMeta) => {
dataTable2[tableMeta.rowIndex][tableMeta.columnIndex] = value
let valz = value.value
let total = 0
let lastValz = 0
if (valz == 'SUM' || valz == 'AVG' || valz == 'LAST') {
dataTable2[tableMeta.rowIndex].map((item, index) => {
if (index >= 13 && index <= 24) {
let valItem = item == undefined || item == "" ? 0 : item
total += Number(valItem)
if (index == 24) {
lastValz += Number(valItem)
}
}
})
dataTable2[tableMeta.rowIndex][25] = (valz == 'SUM' ? total : (valz == 'AVG' ? (total / 12) : lastValz))
}
}
const handleValueDropdown = (value, type, tableMeta) => {
let data = type == 'KPI'? this.state.kpiTypeList.options : (type == 'MAX'? this.state.maxAchList.options : this.state.formulaYtdList.options)
let index = 0
if (value == null) {
index = -1
} else {
index = data.findIndex((val) => val.value == value.value)
}
// // console.log(value)
// // console.log(data)
// // console.log(index)
if (index == -1) {
dataTable2[tableMeta.rowIndex][tableMeta.columnIndex] = null
return null
} else {
dataTable2[tableMeta.rowIndex][tableMeta.columnIndex] = value
return value
}
}
const handleChangePercentage = (value, tableMeta) => {
// let valueReal = value.replace('%', '')
// let indexParentDatatable = dataTable2.findIndex((val) => val[1] == tableMeta.rowData[2])
// let indexParentReal = this.state.dataReal.findIndex((val) => val.id == tableMeta.rowData[2])
// let valParent = dataTable2[indexParentDatatable][7]
// valParent.replace('%', '')
// let valChild = 0
// dataTable2.map((item, index) => {
// if (item[2] == dataTable2[indexParentDatatable][1] && item[1] !== tableMeta.rowData[1]) {
// let weightItem = item[7] == "" ? 0 : item[7].replace('%', '')
// // // console.log(weightItem)
// valChild += Number(weightItem)
// }
// })
// let endVal = ''
// if ((Number(valueReal) + Number(valChild)) > Number(valParent.replace('%', ''))) {
// endVal = `${Number(valParent.replace('%', '')) - (Number(valChild))}%`
// // // console.log(endVal)
// } else {
// endVal = `${Number(valueReal)}%`
// // // console.log(endVal)
// }
// // // // console.log(endVal)
// dataTable2[tableMeta.rowIndex][tableMeta.columnIndex] = endVal
dataTable2[tableMeta.rowIndex][tableMeta.columnIndex] = value
}
const handleChangeText = (value, tableMeta) => {
// // console.log(value)
dataTable2[tableMeta.rowIndex][tableMeta.columnIndex] = value
// this.setState({dataTable: dataTable2})
}
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) {
let indexsss = dataTable2.findIndex((val) => val[1] == idParent)
if (dataTable2[indexsss][6] == 'CUSTOMER PERSPECTIVE' || dataTable2[indexsss][6] == 'INTERNAL BUSINESS PROCESS PERSPECTIVE') {
return true
} else {
return false
}
} else {
if (typeReport == null || typeReport == 3) {
return true
} else if (tableMeta !== undefined && tableMeta.rowData[0] == 1) {
let indexID = dataTable2.findIndex((val) => val[2] == tableMeta.rowData[1])
if (indexID !== -1) {
return false
} else {
return true
}
} else {
return false
}
}
} else {
return false
}
}
}
const handleTambah = (data, rowIndex) => {
// console.log(dataTable2)
let newData = []
dataTable2.map((item, index) => {
newData.push(item)
if (index == rowIndex) {
newData.push([
null,
"",
item[2] == null || item[2] == ""? item[1] : item[2],
item[3],
item[4],
"",
"",
"",
"",
null,
null,
null,
"",
"",
"",
"",
"",
"",
"",
"",
"",
"",
"",
"",
"",
"",
"",
"",
"",
""
])
}
})
dataTable2 = newData
this.setState({ dataTable: dataTable2 }, () => {
setTimeout(() => {
this.setState({ loading: false })
// console.log(dataTable2)
}, 500)
})
}
const handleDelete = (index) => {
if (dataTable2[index][1] !== "") {
dataDelete.push(dataTable2[index][1])
}
dataTable2.splice(index, 1)
this.setState({ dataTable: dataTable2, dataDelete }, () => {
setTimeout(() => {
this.setState({ loading: false })
}, 100)
})
}
const handleTotal = (tableMeta) => {
// let val = String(value).split(",").join("")
let total = 0
let lastValz = 0
dataTable2[tableMeta.rowIndex].map((item, index) => {
if (index >= 13 && index <= 24) {
let valItem = item == undefined || item == "" ? 0 : item
total += Number(valItem)
if (index == 24) {
lastValz += Number(valItem)
}
}
})
let valz = dataTable2[tableMeta.rowIndex][11] == null ? 'SUM' : dataTable2[tableMeta.rowIndex][11].value
dataTable2[tableMeta.rowIndex][tableMeta.columnIndex] = (valz == 'SUM' ? total : (valz == 'AVG' ? (total / 12) : lastValz))
return (valz == 'SUM' ? total : (valz == 'AVG' ? (total / 12) : lastValz))
}
let columns = [
// {
// name: "",
// options: {
// display: false
// }
// },
// {
// name: "",
// options: {
// display: false
// }
// },
// {
// name: "",
// options: {
// display: false
// }
// },
// {
// name: "",
// options: {
// display: false
// }
// },
// {
// name: "",
// options: {
// display: false
// }
// },
{
name: "Key Performance Indicator",
options: {
customHeadRender: (columnMeta) => (
<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>
</TableCell>
),
setCellProps: () => ({ style }),
customBodyRender: (val, tableMeta) => {
return (
// handleAction(tableMeta.rowData[2], tableMeta.rowData[0], tableMeta) && (tableMeta.rowData[1] == "" || String(this.props.status).toLocaleLowerCase() == 'draft' || String(this.props.status).toLocaleLowerCase() == 'submitted' || String(this.props.status).toLocaleLowerCase() == 'revision')?
// <div style={{ textAlign: 'left', paddingLeft: 20 * Number(tableMeta.rowData[4]) }}>
// {!this.state.loading && <FormControlLabel
// style={{ margin: 0 }}
// control={
// <Input
// disableUnderline={true}
// style={{ color: tableMeta.rowData[1] == "" ? "#5198ea" : "black", fontSize: 12, textAlign: 'left', borderColor: 'transparent', margin: 0, backgroundColor: 'transparent' }}
// type="text"
// placeholder=""
// defaultValue={val}
// // disabled={!handleAction(tableMeta.rowData[2])}
// onBlur={(event) => {
// // // console.log(event.target.value)
// handleChangeText(event.target.value, tableMeta)
// // console.log(dataTable2)
// }}
// />
// }
// />}
// </div>
// :
// <div style={{ width: 300 }}>
// {tableMeta.rowData[30] ?
// tableMeta.rowData[30].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>
// :
// tableMeta.rowData[1] == null ?
// <div style={{ paddingLeft: 20 }}>
// <span style={{ fontSize: 12 }}>{tableMeta.rowData[0] === 4 ? "" : val}</span>
// </div>
// :
// <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>
// :
// tableMeta.rowData[1] == null ?
// <div style={{ paddingLeft: 20 }}>
// <span style={{ fontSize: 12 }}>{tableMeta.rowData[0] === 4 ? "" : val}</span>
// </div>
// :
// <div style={{ paddingLeft: 20 * Number(tableMeta.rowData[4]) }}>
// <span style={{ fontSize: 12 }}>{tableMeta.rowData[0] === 4 ? "" : val}</span>
// </div>
// }
// </div>
<div style={{ width: 300 }}>
{val}
</div>
)
}
}
}, {
name: "Weight",
options: {
customHeadRender: (columnMeta) => (
<TableCell style={{ ...style2, top: 0, zIndex: 99, backgroundColor: '#1c71b8', width: 60, borderLeft: '1px #fff solid' }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
</TableCell>
),
setCellProps: () => ({ style2 }),
customBodyRender: (value, tableMeta, updateValue) => {
return (
<div style={{ textAlign: 'center' }}>
{tableMeta.rowData[0] === 2 || tableMeta.rowData[0] === 4 ?
null :
tableMeta.rowData[0] === 1 ?
value
:
<div style={{ flex: 1 }}>
<FormControlLabel
style={{ margin: 0 }}
value={value}
control={
<NumberFormat
thousandSeparator={true}
suffix="%"
style={{ color: "#5198ea", fontSize: 12, textAlign: 'center', borderColor: 'transparent', margin: 0, width: 60, backgroundColor: 'transparent' }}
type="text"
placeholder=""
value={value}
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)}
maxLength={4}
onBlur={(event) => {
// updateValue(some)
handleChangePercentage(event.target.value, tableMeta)
}}
/>
}
/>
</div>
}
</div>
)
}
}
}, {
name: "UOM",
options: {
customHeadRender: (columnMeta) => (
<TableCell style={{ ...style2, top: 0, zIndex: 99, backgroundColor: '#1c71b8', borderLeft: '1px #fff solid' }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
</TableCell>
),
customBodyRender: (value, tableMeta, updateValue) => {
return (
<div style={{ textAlign: 'center' }}>
{/* {tableMeta.rowData[0] === 1 || tableMeta.rowData[0] === 2 || tableMeta.rowData[0] === 4 ?
null :
<FormControlLabel
style={{ margin: 0 }}
// value={value}
control={
!handleAction(tableMeta.rowData[2], tableMeta.rowData[0]) ?
<Input
disableUnderline={true}
style={{ fontSize: 12, textAlign: 'center', borderColor: 'transparent', margin: 0, width: 60, backgroundColor: 'transparent', marginTop: -10 }}
type="text"
placeholder=""
defaultValue={value}
color={"#5198ea"}
disabled={true}
onBlur={(event) => {
// // console.log(event.target.value)
// updateValue(event.target.value)
handleChangeText(event.target.value, tableMeta)
// // console.log(dataTable2)
}}
/> :
<ThemeProvider theme={theme}>
<Input
disableUnderline={true}
style={{ fontSize: 12, textAlign: 'center', borderColor: 'transparent', margin: 0, width: 60, backgroundColor: 'transparent', marginBottom: -5 }}
type="text"
placeholder=""
defaultValue={value}
color={"#5198ea"}
// disabled={this.props.isApprover ? true : ((this.props.lastStatus == 'SUBMIT' || this.props.lastStatus == 'REVISION') && this.props.prevRevision === false ? false : !handleAction(tableMeta.rowData[2]))}
onBlur={(event) => {
// // console.log(event.target.value)
// updateValue(event.target.value)
handleChangeText(event.target.value, tableMeta)
// // console.log(dataTable2)
}}
/>
</ThemeProvider>
}
/>
} */}
<div style={{ textAlign: 'center', width: 60 }}>
{value}
</div>
</div>
)
}
}
}, {
name: "KPI Type",
options: {
customHeadRender: (columnMeta) => (
<TableCell style={{ ...style2, top: 0, zIndex: 99, backgroundColor: '#1c71b8', width: 96, borderLeft: '1px #fff solid' }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
</TableCell>
),
customBodyRender: (val, tableMeta) => {
return (
<div style={{ width: 96 }}>
{/* {tableMeta.rowData[0] === 1 || tableMeta.rowData[0] === 2 || tableMeta.rowData[0] === 4 ?
null :
<Autocomplete
{...this.state.kpiTypeList}
id="kpiType"
onChange={(event, newInputValue) => handleChangeDropdown(newInputValue, tableMeta)}
debug
disableClearable
disabled={!handleAction(tableMeta.rowData[2], tableMeta.rowData[0])}
value={handleValueDropdown(val, 'KPI', tableMeta)}
style={{ padding: 0, margin: 0 }}
renderInput={(params) =>
<div ref={params.InputProps.ref} style={{ padding: 0, margin: 0 }}>
<input style={{ borderColor: 'white', width: 96, textAlign: 'center', padding: 0, margin: 0, color: handleAction(tableMeta.rowData[2], tableMeta.rowData[0]) ? "#5198ea" : "black" }} type="text" {...params.inputProps} />
</div>
}
/>
} */}
<div style={{ textAlign: 'center', width: 90 }}>
{val}
</div>
</div>
)
}
}
}, {
name: "Max Ach.",
options: {
customHeadRender: (columnMeta) => (
<TableCell style={{ ...style2, top: 0, zIndex: 99, backgroundColor: '#1c71b8', width: 60, borderLeft: '1px #fff solid' }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
</TableCell>
),
customBodyRender: (val, tableMeta) => {
return (
<div style={{ textAlign: 'center', width: 60 }}>
{/* {tableMeta.rowData[0] === 1 || tableMeta.rowData[0] === 2 || tableMeta.rowData[0] === 4 ?
null :
<Autocomplete
{...this.state.maxAchList}
id="maxAchList"
onChange={(event, newInputValue) => handleChangeDropdown(newInputValue, tableMeta)}
debug
disableClearable
value={handleValueDropdown(val, 'MAX', tableMeta)}
style={{ padding: 0, margin: 0 }}
disabled={!handleAction(tableMeta.rowData[2], tableMeta.rowData[0])}
renderInput={(params) =>
<div ref={params.InputProps.ref} style={{ padding: 0, margin: 0 }}>
<input style={{ borderColor: 'white', width: 96, textAlign: 'center', padding: 0, margin: 0, color: handleAction(tableMeta.rowData[2], tableMeta.rowData[0]) ? "#5198ea" : "black" }} type="text" {...params.inputProps} />
</div>
}
// value={this.state.parent}
/>
} */}
{val}
</div>
)
}
}
}, {
name: "Formula YTD",
options: {
customHeadRender: (columnMeta) => (
<TableCell style={{ ...style2, top: 0, zIndex: 99, backgroundColor: '#1c71b8', width: 60, borderLeft: '1px #fff solid' }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
</TableCell>
),
customBodyRender: (val, tableMeta, updateValue) => {
return (
<div style={{ width: 60 }}>
{/* {tableMeta.rowData[0] === 1 || tableMeta.rowData[0] === 2 || tableMeta.rowData[0] === 4 ?
null :
<Autocomplete
{...this.state.formulaYtdList}
id="formulaYtdList"
onChange={(event, newInputValue) => {
// updateValue(newInputValue)
handleChangeDropdown(newInputValue, tableMeta)
}
}
debug
disableClearable
value={handleValueDropdown(val, 'FORMULA', tableMeta)}
disabled={!handleAction(tableMeta.rowData[2], tableMeta.rowData[0])}
style={{ padding: 0, margin: 0 }}
renderInput={(params) =>
<div ref={params.InputProps.ref} style={{ padding: 0, margin: 0 }}>
<input style={{ borderColor: 'white', width: 96, textAlign: 'center', padding: 0, margin: 0, color: handleAction(tableMeta.rowData[2], tableMeta.rowData[0]) ? "#5198ea" : "black" }} type="text" {...params.inputProps} />
</div>
}
// value={this.state.parent}
/>
} */}
{val}
</div>
)
}
}
}, {
name: `Actual ${this.props.month.month_value} ${Number(this.props.periode)}`,
options: {
customHeadRender: (columnMeta) => (
<TableCell style={{ ...style2, top: 0, zIndex: 99, backgroundColor: '#37b5e6', width: 60, borderLeft: '1px #fff solid' }}>
<Typography style={{ color: '#fff', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
</TableCell>
),
customBodyRender: (value, tableMeta) => {
return (
<div style={{ width: 60 }}>
{tableMeta.rowData[0] === 1 || tableMeta.rowData[0] === 2 || tableMeta.rowData[0] === 4 ?
null
:
<div style={{ flex: 1 }}>
<FormControlLabel
style={{ margin: 0 }}
value={value}
control={
<NumberFormat
thousandSeparator={true}
style={{ color: "#5198ea", fontSize: 12, borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
type="text"
placeholder=""
value={Number(value).toFixed(1)}
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)}
decimalScale={1}
onBlur={(event) => {
// updateValue(event.target.value)
handleChange(event.target.value, tableMeta)
// // console.log(dataTable2)
}}
/>
}
/>
</div>
}
</div>
)
}
}
}, {
name: `Target ${this.props.month.month_value} ${Number(this.props.periode)}`,
options: {
customHeadRender: (columnMeta) => (
<TableCell style={{ ...style2, top: 0, zIndex: 99, backgroundColor: '#1c71b8', width: 60, borderLeft: '1px #fff solid' }}>
<Typography style={{ color: '#000', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
</TableCell>
),
customBodyRender: (value, tableMeta) => {
return (
<div style={{ width: 60 }}>
{/* {tableMeta.rowData[0] === 1 || tableMeta.rowData[0] === 2 || tableMeta.rowData[0] === 4 ?
null :
<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(handleTotal(tableMeta)).toFixed(1)}
decimalScale={1}
disabled={true}
// onBlur={(event) => {
// // updateValue(event.target.value)
// handleChange(event.target.value, tableMeta)
// // // console.log(dataTable2)
// }}
/>
}
/>
} */}
{value}
</div>
)
}
}
}, {
name: `Achivement ${this.props.month.month_value} ${Number(this.props.periode)} (%)`,
options: {
customHeadRender: (columnMeta) => (
<TableCell style={{ ...style2, top: 0, zIndex: 99, backgroundColor: '#1c71b8', width: 60, borderLeft: '1px #fff solid' }}>
<Typography style={{ color: '#000', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
</TableCell>
),
customBodyRender: (value, tableMeta) => {
return (
<div style={{ width: 60 }}>
{/* {tableMeta.rowData[0] === 1 || tableMeta.rowData[0] === 2 || tableMeta.rowData[0] === 4 ?
null :
<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(handleTotal(tableMeta)).toFixed(1)}
decimalScale={1}
disabled={true}
// onBlur={(event) => {
// // updateValue(event.target.value)
// handleChange(event.target.value, tableMeta)
// // // console.log(dataTable2)
// }}
/>
}
/>
} */}
{value}
</div>
)
}
}
}, {
name: `Score (Scale 1-5)`,
options: {
customHeadRender: (columnMeta) => (
<TableCell style={{ ...style2, top: 0, zIndex: 99, backgroundColor: '#1c71b8', width: 60, borderLeft: '1px #fff solid' }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
</TableCell>
),
customBodyRender: (value, tableMeta) => {
return (
<div style={{ width: 60 }}>
{/* {tableMeta.rowData[0] === 1 || tableMeta.rowData[0] === 2 || tableMeta.rowData[0] === 4 ?
null :
<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(handleTotal(tableMeta)).toFixed(1)}
decimalScale={1}
disabled={true}
// onBlur={(event) => {
// // updateValue(event.target.value)
// handleChange(event.target.value, tableMeta)
// // // console.log(dataTable2)
// }}
/>
}
/>
} */}
{value}
</div>
)
}
}
}, {
name: `Score x Weight`,
options: {
customHeadRender: (columnMeta) => (
<TableCell style={{ ...style2, top: 0, zIndex: 99, backgroundColor: '#1c71b8', width: 60, borderLeft: '1px #fff solid' }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
</TableCell>
),
customBodyRender: (value, tableMeta) => {
return (
<div style={{ width: 60 }}>
{/* {tableMeta.rowData[0] === 1 || tableMeta.rowData[0] === 2 || tableMeta.rowData[0] === 4 ?
null :
<FormControlLabel
style={{ margin: 0 }}
value={value}
control={
<NumberFormat
thousandSeparator={true}
style={{ fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 60, backgroundColor: 'transparent' }}
type="text"
placeholder=""
value={Number(handleTotal(tableMeta)).toFixed(1)}
decimalScale={1}
disabled={true}
// onBlur={(event) => {
// // updateValue(event.target.value)
// handleChange(event.target.value, tableMeta)
// // // console.log(dataTable2)
// }}
/>
}
/>
} */}
{value}
</div>
)
}
}
}, {
name: `Notes`,
options: {
customHeadRender: (columnMeta) => (
<TableCell style={{ ...style2, top: 0, zIndex: 99, backgroundColor: '#37b5e6', width: 60, borderLeft: '1px #fff solid' }}>
<Typography style={{ color: '#fff', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
</TableCell>
),
customBodyRender: (value, tableMeta) => {
return (
<div style={{ width: 60 }}>
{tableMeta.rowData[0] === 1 || tableMeta.rowData[0] === 2 || tableMeta.rowData[0] === 4 ?
null
:
<div style={{ flex: 1 }}>
<FormControlLabel
style={{ margin: 0 }}
value={value}
control={
<NumberFormat
thousandSeparator={true}
style={{ color: "#5198ea", fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 60, backgroundColor: 'transparent' }}
type="text"
placeholder=""
value={Number(value).toFixed(1)}
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)}
decimalScale={1}
onBlur={(event) => {
// updateValue(event.target.value)
handleChange(event.target.value, tableMeta)
// // console.log(dataTable2)
}}
/>
}
/>
</div>
}
</div>
)
}
}
}
]
let data = [
["Total Assets", "1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12" ],
// ["Total Assets", "11", "12", "13", "14", "15", "16", "17", "18", "19", "20", "21", "22" ]
]
return (
<div style={{ height: this.props.height, backgroundColor: '#f8f8f8', marginBottom: 100, minHeight: 1000 }}>
<div className={"main-color"} style={{ height: 78, flex: 1, display: 'flex', alignItems: 'center', paddingLeft: 20 }}>
<Typography style={{ fontSize: '16px', color: 'white' }}>Monthly Report</Typography>
</div>
<div style={{ flex: 1, padding: 20, width: '100%' }}>
<Paper style={{ paddingTop: 10, paddingBottom: 20 }}>
<div style={{ borderBottom: 'solid 1px #c4c4c4' }} >
<Typography style={{ fontSize: '12px', color: '#4b4b4b', margin: 10 }}>Monthly Report - Corporate Annual Target - Performance</Typography>
</div>
<div style={{ padding: 20 }}>
<div style={{ display: 'flex', justifyContent: 'space-between' }}>
<div>
<Typography style={{ fontSize: '11px', color: '#4b4b4b' }}>{this.props.company.company_name}</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>
</div>
<div style={{ width: '50%' }}>
<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={() => null}
>
<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={() => null}
>
<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={() => null}
>
<img src={Images.download} />
</button>
</a>
<ReactTooltip border={true} id="download" place="bottom" type="light" effect="solid" />
</div>
</div>
</div>
<div style={{ marginTop: 20, width: this.props.width - (this.props.open === true ? 400 : 150) }}>
<MuiThemeProvider theme={getMuiTheme()}>
<MUIDataTable
data={data}
columns={columns}
options={options}
/>
</MuiThemeProvider>
</div>
</div>
<div className="grid grid-2x" style={{ marginTop: 20 }}>
<div className="col-1">
<button
type="button"
onClick={() => this.setState({ loading: true }, () => {
setTimeout(() => {
this.props.onClickClose()
}, 100);
})}
style={{
backgroundColor: 'transparent',
cursor: 'pointer',
borderColor: 'transparent',
outline: 'none'
}}
>
<div style={{ backgroundColor: '#019ce5', width: 105, height: 25, borderRadius: 3, justifyContent: 'center', display: 'flex', alignItems: 'center' }}>
<Typography style={{ fontSize: '11px', color: '#fff', textAlign: 'center' }}>Back</Typography>
</div>
</button>
</div>
</div>
</Paper>
</div>
</div>
)
}
}
\ No newline at end of file
src/container/MonthlyReport/FixedAssetsMovementMR.js
View file @ a2a0b476
......@@ -45,13 +45,14 @@ export default class FixedAssetsMovementMR extends Component {
this.getItemHierarki()
}
async getItemHierarki() {
getItemHierarki() {
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
"monthly_report_id": this.props.monthlyReportId,
"month": this.props.month
}
api.create().getDetailReportMB(payload).then(response => {
// console.log(response);
......@@ -348,7 +349,7 @@ export default class FixedAssetsMovementMR extends Component {
]
let data = [
["Total Assets", { a: "2", b: "3", c: "4" }, "5", { a: "6", b: "7", c: "8", d: "9", e: "10", f: "11" }],
["Total Assets", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11"]
["Total Assets", { a: "12", b: "13", c: "14" }, "15", { a: "16", b: "17", c: "18", d: "19", e: "110", f: "111" }]
]
return (
......
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