import React, { Component } from 'react'; import { Typography, Paper, createMuiTheme, MuiThemeProvider, TableCell, FormControlLabel, TextField, Input, Tooltip, withStyles, Snackbar } from '@material-ui/core'; import MUIDataTable from 'mui-datatables'; import NumberFormat from 'react-number-format'; import api from '../../api'; import AddIcon from '@material-ui/icons/Add'; import { values } from 'ramda'; import PropagateLoader from "react-spinners/PropagateLoader" import Images from '../../assets/Images'; import ReactTooltip from 'react-tooltip'; import UploadFile from "../../library/Upload"; import { ExcelRenderer } from 'react-excel-renderer'; import { Alert } from '@material-ui/lab'; import * as R from 'ramda'; 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, zIndex: 101, background: "white", }; const style2 = { position: "sticky", background: "white", zIndex: 100, top: 0 }; export default class DBTP extends Component { constructor(props) { super(props) this.state = { dataTable: [], loading: false, } } componentDidMount() { // this.getItemHierarki() } closeAlert() { this.setState({ alert: false }) } render() { const columnDBTP = [ { name: "Account", options: { customHeadRender: (columnMeta) => ( {columnMeta.name} ), setCellProps: () => ({ style }), customBodyRender: (val, tableMeta) => { return (
{ tableMeta.rowData[4] == 0 ? {String(tableMeta.rowData[0] === 4 ? "" : val).toUpperCase()} :
{tableMeta.rowData[0] === 4 ? "" : val}
}
) } } }, { name: `MB ${this.props.periode} (Trial Balance - Fiscal)`, options: { customHeadRender: (columnMeta) => ( {/* {columnMeta.name} */}
{columnMeta.name}
{"1"}
{"2"}
{"3"}
{"4"}
{"5"}
{"6"}
{"7"}
{"8"}
{"9"}
{"10"}
{"11"}
{"12"}
), setCellProps: () => ({ style2 }), customBodyRender: (value, tableMeta, updateValue) => { console.log(tableMeta) return (
{tableMeta.rowData[0] === 4 ? null : tableMeta.rowData[0] === 1 ? null :
} />
}
{tableMeta.rowData[0] === 4 ? null : tableMeta.rowData[0] === 1 ? null :
} />
}
{tableMeta.rowData[0] === 4 ? null : tableMeta.rowData[0] === 1 ? null :
} />
}
{tableMeta.rowData[0] === 4 ? null : tableMeta.rowData[0] === 1 ? null :
} />
}
{tableMeta.rowData[0] === 4 ? null : tableMeta.rowData[0] === 1 ? null :
} />
}
{tableMeta.rowData[0] === 4 ? null : tableMeta.rowData[0] === 1 ? null :
} />
}
{tableMeta.rowData[0] === 4 ? null : tableMeta.rowData[0] === 1 ? null :
} />
}
{tableMeta.rowData[0] === 4 ? null : tableMeta.rowData[0] === 1 ? null :
} />
}
{tableMeta.rowData[0] === 4 ? null : tableMeta.rowData[0] === 1 ? null :
} />
}
{tableMeta.rowData[0] === 4 ? null : tableMeta.rowData[0] === 1 ? null :
} />
}
{tableMeta.rowData[0] === 4 ? null : tableMeta.rowData[0] === 1 ? null :
} />
}
{tableMeta.rowData[0] === 4 ? null : tableMeta.rowData[0] === 1 ? null :
} />
}
) } } }, { name: `ACTUAL ${this.props.periode}`, options: { customHeadRender: (columnMeta) => ( {/* {columnMeta.name} */}
{columnMeta.name}
{"1"}
{"2"}
{"3"}
{"4"}
{"5"}
{"6"}
{"7"}
{"8"}
{"9"}
{"10"}
{"11"}
{"12"}
{"FY"}
), setCellProps: () => ({ style2 }), customBodyRender: (value, tableMeta, updateValue) => { console.log(tableMeta) return (
{tableMeta.rowData[0] === 4 ? null : tableMeta.rowData[0] === 1 ? null :
} />
}
{tableMeta.rowData[0] === 4 ? null : tableMeta.rowData[0] === 1 ? null :
} />
}
{tableMeta.rowData[0] === 4 ? null : tableMeta.rowData[0] === 1 ? null :
} />
}
{tableMeta.rowData[0] === 4 ? null : tableMeta.rowData[0] === 1 ? null :
} />
}
{tableMeta.rowData[0] === 4 ? null : tableMeta.rowData[0] === 1 ? null :
} />
}
{tableMeta.rowData[0] === 4 ? null : tableMeta.rowData[0] === 1 ? null :
} />
}
{tableMeta.rowData[0] === 4 ? null : tableMeta.rowData[0] === 1 ? null :
} />
}
{tableMeta.rowData[0] === 4 ? null : tableMeta.rowData[0] === 1 ? null :
} />
}
{tableMeta.rowData[0] === 4 ? null : tableMeta.rowData[0] === 1 ? null :
} />
}
{tableMeta.rowData[0] === 4 ? null : tableMeta.rowData[0] === 1 ? null :
} />
}
{tableMeta.rowData[0] === 4 ? null : tableMeta.rowData[0] === 1 ? null :
} />
}
{tableMeta.rowData[0] === 4 ? null : tableMeta.rowData[0] === 1 ? null :
} />
}
{tableMeta.rowData[0] === 4 ? null : tableMeta.rowData[0] === 1 ? null :
} />
}
) } } } ] let datas = [ ["ABCD", { a: "2", b: "3", c: "4", d: "5" }, { a: "2", b: "3", c: "4", d: "5" }, { a: "2", b: "3", c: "4", d: "5" }, { a: "2", b: "3", c: "4", d: "5" }, { a: "2", b: "3", c: "4", d: "5" }, { a: "2", b: "3", c: "4", d: "5" }], ["Total Assets", { a: "6", b: "7", c: "8", d: "9" }, { a: "6", b: "7", c: "8", d: "9" }, { a: "6", b: "7", c: "8", d: "9" }, { a: "6", b: "7", c: "8", d: "9" }, { a: "6", b: "7", c: "8", d: "9" }, { a: "6", b: "7", c: "8", d: "9" }] ] const loadingComponent = (
); return (
FINANCIAL SUMMARY OF TRIPUTRA GROUP
this.closeAlert()}> this.closeAlert()} severity={this.state.tipeAlert}> {this.state.messageAlert} {/* {this.state.loading && loadingComponent} */}
{/* {this.state.visibleTP === true ? */}
Sub Holding Report
Tax Planning - Monthly (Database) Period : 2021 in IDR mn
{this.state.dataTable.length == 0 ? null : 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')) && ( )} {((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')) && ( )}
}
{this.state.loading && loadingComponent}
Last Updated by : {this.state.updateBy}
{this.props.isApprover === true || this.state.dataTable.length == 0 ? null : (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') ?
: null }
); } }