Skip to content

T
Tia-dev
Commit 41421ad8 authored by Faisal Hamdi's avatar Faisal Hamdi
Browse files
Options

Merge branch 'faisal' into 'master' 

faisal!

See merge request !1515
parents 63ebc792 9d931a59
Show whitespace changes
Inline Side-by-side
Showing with 168 additions and 228 deletions
package-lock.json
View file @ 41421ad8
......@@ -4223,9 +4223,9 @@
}
},
"caniuse-lite": {
"version": "1.0.30001179",
"resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001179.tgz",
"integrity": "sha512-blMmO0QQujuUWZKyVrD1msR4WNDAqb/UPO1Sw2WWsQ7deoM5bJiicKnWJ1Y0NS/aGINSnKPIWBMw5luX+NDUCA=="
"version": "1.0.30001237",
"resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001237.tgz",
"integrity": "sha512-pDHgRndit6p1NR2GhzMbQ6CkRrp4VKuSsqbcLeOQppYPKOYkKT/6ZvZDvKJUqcmtyWIAHuZq3SVS2vc1egCZzw=="
},
"capture-exit": {
"version": "2.0.0",
......
src/container/Progress/ProgressReport.js
View file @ 41421ad8
......@@ -47,6 +47,8 @@ class ReportProgress extends Component {
componentDidMount() {
this.getMonth()
this.getReportType()
// console.log(this.state.listCategory);
// console.log(this.state.category);
}
getReportType() {
......@@ -54,31 +56,32 @@ class ReportProgress extends Component {
{
name: 'Master Budget',
value: 0
},{
}, {
name: 'Monthly Report',
value: 1
},{
}, {
name: 'Operating Indicator',
value: 2
},{
}, {
name: 'Rolling Outlook',
value: 3
},
]
let arrayReportTypeFinal = this.state.category.value.includes('status')? arrayReportType : arrayReportType.filter((val) => val.value != 2)
let arrayReportTypeFinal = this.state.category.value.includes('status') ? arrayReportType : arrayReportType.filter((val) => val.value != 2)
let defaultProps = {
options: arrayReportTypeFinal,
getOptionLabel: (option) => option.name,
};
this.setState({listReportType: defaultProps, reportType: arrayReportTypeFinal[0]}, () => {
this.setState({ listReportType: defaultProps, reportType: arrayReportTypeFinal[0] }, () => {
console.log(this.state.listReportType)
console.log(this.state.reportType)
})
}
getMonth() {
this.setState({loading: true})
this.setState({ loading: true })
api.create().getMonthTransaction().then(response => {
let dateNow = new Date()
dateNow.setMonth(dateNow.getMonth() - 1);
......@@ -158,11 +161,18 @@ class ReportProgress extends Component {
render() {
const dataTable = [
const dataTableMB = [
['Tax Planning', '2', 'ABA: Anugerah Buminusantara Abadi', '2021-05-03'],
['CAT', '1', 'ABA: Anugerah Buminusantara Abadi', '2021-05-03' ],
['CAT', '1', 'ABA: Anugerah Buminusantara Abadi', '2021-05-03'],
['Profit Loss', '0', 'ABA: Anugerah Buminusantara Abadi', '2021-05-03']
]
const dataTableMBStatus = [
['ABA: Anugerah Buminusantara Abadi', '2021', 'approved', '2', 'Sudah Approved', 'Sudah Approved', 'Sudah Approved', 'Sudah Approved', 'Sudah Approved', 'Sudah Approved'],
['ABA: Anugerah Buminusantara Abadi', '2021', 'approved', '1', 'Sudah Approved', 'Sudah Approved', 'Sudah Approved', 'Sudah Approved', 'Sudah Approved', 'Sudah Approved'],
['ABA: Anugerah Buminusantara Abadi', '2021', 'approved', '0', 'Sudah Approved', 'Sudah Approved', 'Sudah Approved', 'Sudah Approved', 'Sudah Approved', 'Sudah Approved']
]
const loadingComponent = (
<div style={{ position: 'fixed', zIndex: 110, top: 0, left: 0, width: '100%', height: '100%', display: 'flex', justifyContent: 'center', alignItems: 'center', background: 'rgba(255,255,255,0.8)' }}>
<PropagateLoader
......@@ -181,7 +191,7 @@ class ReportProgress extends Component {
<Typography style={{ fontSize: '16px', color: 'white' }}>Report Status & Approval Progress Monitoring</Typography>
</div>
<div style={{ padding: 20, width: '100%' }}>
<Paper style={{ paddingTop: 10, paddingBottom: 50}}>
<Paper style={{ paddingTop: 10, paddingBottom: 50 }}>
<div style={{ borderBottom: 'solid 1px #c4c4c4' }} >
<Typography style={{ fontSize: '12px', color: '#4b4b4b', margin: 10 }}>Report Status & Approval Progress</Typography>
</div>
......@@ -193,7 +203,7 @@ class ReportProgress extends Component {
onChange={(event, newInputValue) => this.setState({ category: newInputValue, loading: true }, () => {
// this.getListUserSubcoRO()
this.getReportType()
this.setState({loading: false})
this.setState({ loading: false })
})}
disableClearable
style={{ minWidth: 210, marginRight: 20 }}
......@@ -205,7 +215,7 @@ class ReportProgress extends Component {
id="report-type"
onChange={(event, newInputValue) => this.setState({ reportType: newInputValue, loading: true }, () => {
// this.getListUserSubcoRO()
this.setState({loading: false})
this.setState({ loading: false })
})}
disableClearable
style={{ minWidth: 210, marginRight: 20 }}
......@@ -221,7 +231,7 @@ class ReportProgress extends Component {
id="periode"
onChange={(event, newInputValue) => this.setState({ periodeMB: newInputValue, loading: true }, () => {
// this.getListUserSubcoRO()
this.setState({loading: false})
this.setState({ loading: false })
})}
disableClearable
style={{ minWidth: 210, marginRight: 20 }}
......@@ -233,7 +243,7 @@ class ReportProgress extends Component {
id="month"
onChange={(event, newInputValue) => this.setState({ month: newInputValue, loading: true }, () => {
// this.getListUserSubcoRO()
this.setState({loading: false})
this.setState({ loading: false })
})}
disableClearable
style={{ minWidth: 210, marginRight: 20 }}
......@@ -245,7 +255,7 @@ class ReportProgress extends Component {
id="quarter"
onChange={(event, newInputValue) => this.setState({ quarter: newInputValue, loading: true }, () => {
// this.getListUserSubcoRO()
this.setState({loading: false})
this.setState({ loading: false })
})}
disableClearable
style={{ minWidth: 210, marginRight: 20 }}
......@@ -288,8 +298,9 @@ class ReportProgress extends Component {
height={this.props.height}
open={this.props.open}
// month={this.state.month.month_value}
type={this.state.report ? this.state.report.value : 1}
dataTable={dataTable}
category={this.state.category ? this.state.category.value : 1}
reportType={this.state.reportType ? this.state.reportType.value : 0}
dataTable={this.state.category ? dataTableMBStatus : dataTableMB}
// dataTable={this.state.dataTable}
periode={this.state.periode ? this.state.periode.periode : null}
quarter={this.state.quarter.name}
......
src/container/Progress/TableProgressReport.js
View file @ 41421ad8
import { createMuiTheme, FormControlLabel, Input, MuiThemeProvider, TableCell, Typography } from '@material-ui/core'
import MUIDataTable from 'mui-datatables';
import React, { Component } from 'react'
import NumberFormat from 'react-number-format';
import * as R from 'ramda'
import { createMuiTheme, FormControlLabel, Input, MuiThemeProvider, TableCell, Typography } from "@material-ui/core";
import MUIDataTable from "mui-datatables";
import React, { Component } from "react";
import NumberFormat from "react-number-format";
import * as R from "ramda";
var ct = require("../../library/CustomTable");
const getMuiTheme = () => createMuiTheme(ct.customTable3());
......@@ -18,146 +17,117 @@ const style = {
const style2 = {
position: "sticky",
background: "white",
zIndex: 100
zIndex: 100,
};
export default class TableProgressReport extends Component {
render() {
let dataTable2 = this.props.dataTable
// console.log(this.props);
let dataTable2 = this.props.dataTable;
console.log(this.props);
const columnMB = [
{
name: "Report Type",
options: {
customHeadRender: (columnMeta) => (
<TableCell key={columnMeta.index} style={{ ...style, top: 0, zIndex: 103, backgroundColor: '#1c71b8', width: 300 }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'left' }}>{columnMeta.name}</Typography>
<TableCell key={columnMeta.index} style={{ ...style, top: 0, zIndex: 103, backgroundColor: "#1c71b8", width: 300 }}>
<Typography style={{ color: "white", fontSize: 12, fontWeight: "bold", textAlign: "left" }}>{columnMeta.name}</Typography>
</TableCell>
),
setCellProps: () => ({ style }),
customBodyRender: (val, tableMeta) => {
return (
<div style={{ width: 300 }}>
return <div style={{ width: 300 }}>{val}</div>;
},
},
},
{
// tableMeta.rowData[4] == 0 ?
// <span style={{ fontSize: 12, fontWeight: 'bold' }}>{String(tableMeta.rowData[0] === 4 ? "" : val).toUpperCase()}</span>
// :
// <div style={{ paddingLeft: 20 * Number(tableMeta.rowData[4]) }}>
// <span style={{ fontSize: 12 }}>{tableMeta.rowData[0] === 4 ? "" : val}</span>
// </div>
val
}
</div>
)
}
}
}, {
name: "Revision",
options: {
customHeadRender: (columnMeta) => (
<TableCell style={{ ...style2, top: 0, zIndex: 99, backgroundColor: '#1c71b8', borderRight: '1px solid #fff', borderLeft: '1px solid #fff', width: 100 }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
<TableCell style={{ ...style2, top: 0, zIndex: 99, backgroundColor: "#1c71b8", borderRight: "1px solid #fff", borderLeft: "1px solid #fff", width: 100 }}>
<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' }}>
return <div style={{ textAlign: "center" }}>{value}</div>;
},
},
},
{
value
}
</div>
)
}
}
}, {
name: "Company",
options: {
customHeadRender: (columnMeta) => (
<TableCell style={{ ...style2, top: 0, zIndex: 99, backgroundColor: '#1c71b8', borderRight: '1px solid #fff', borderLeft: '1px solid #fff' }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
<TableCell style={{ ...style2, top: 0, zIndex: 99, backgroundColor: "#1c71b8", borderRight: "1px solid #fff", borderLeft: "1px solid #fff" }}>
<Typography style={{ color: "white", fontSize: 12, fontWeight: "bold", textAlign: "center" }}>{columnMeta.name}</Typography>
</TableCell>
),
setCellProps: () => ({ style2 }),
customBodyRender: (value, tableMeta, updateValue) => {
return (
<div style={{ width: 300, textAlign: 'center' }}>
return <div style={{ width: 300, textAlign: "center" }}>{value}</div>;
},
},
},
{
value
}
</div>
)
}
}
}, {
name: "Last Update",
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 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={{ textAlign: 'center', width: 100 }}>
{
val
}
</div>
)
}
}
}]
return <div style={{ textAlign: "center", width: 100 }}>{val}</div>;
},
},
},
];
const columnMBStatus = [
{
name: "Company",
options: {
customHeadRender: (columnMeta) => (
<TableCell key={columnMeta.index} style={{ ...style, top: 0, zIndex: 103, backgroundColor: '#1c71b8', width: 300 }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'left' }}>{columnMeta.name}</Typography>
<TableCell key={columnMeta.index} style={{ ...style, top: 0, zIndex: 103, backgroundColor: "#1c71b8", width: 300 }}>
<Typography style={{ color: "white", fontSize: 12, fontWeight: "bold", textAlign: "left" }}>{columnMeta.name}</Typography>
</TableCell>
),
setCellProps: () => ({ style }),
customBodyRender: (val, tableMeta) => {
return (
<div style={{ width: 300 }}>
{
tableMeta.rowData[4] == 0 ?
<span style={{ fontSize: 12, fontWeight: 'bold' }}>{String(tableMeta.rowData[0] === 4 ? "" : val).toUpperCase()}</span>
:
{tableMeta.rowData[4] == 0 ? (
<span style={{ fontSize: 12, fontWeight: "bold" }}>{String(tableMeta.rowData[0] === 4 ? "" : val).toUpperCase()}</span>
) : (
<div style={{ paddingLeft: 20 * Number(tableMeta.rowData[4]) }}>
<span style={{ fontSize: 12 }}>{tableMeta.rowData[0] === 4 ? "" : val}</span>
</div>
}
)}
</div>
)
}
}
}, {
);
},
},
},
{
name: "Periode",
options: {
customHeadRender: (columnMeta) => (
<TableCell style={{ ...style2, top: 0, zIndex: 99, backgroundColor: '#1c71b8', borderRight: '1px solid #fff', borderLeft: '1px solid #fff' }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
<TableCell style={{ ...style2, top: 0, zIndex: 99, backgroundColor: "#1c71b8", borderRight: "1px solid #fff", borderLeft: "1px solid #fff" }}>
<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 :
<div style={{ textAlign: "center" }}>
{tableMeta.rowData[0] === 2 || tableMeta.rowData[0] === 4 ? null : (
<FormControlLabel
style={{ margin: 0 }}
value={value}
control={
<NumberFormat
thousandSeparator={true}
style={{ color: "black", fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
style={{ color: "black", fontSize: 12, textAlign: "right", borderColor: "transparent", margin: 0, width: 96, backgroundColor: "transparent" }}
type="text"
placeholder=""
suffix={"%"}
......@@ -168,188 +138,147 @@ export default class TableProgressReport extends Component {
/>
}
/>
}
)}
</div>
)
}
}
}, {
);
},
},
},
{
name: "Current Status",
options: {
customHeadRender: (columnMeta) => (
<TableCell style={{ ...style2, top: 0, zIndex: 99, backgroundColor: '#1c71b8', borderRight: '1px solid #fff', borderLeft: '1px solid #fff' }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
<TableCell style={{ ...style2, top: 0, zIndex: 99, backgroundColor: "#1c71b8", borderRight: "1px solid #fff", borderLeft: "1px solid #fff" }}>
<Typography style={{ color: "white", fontSize: 12, fontWeight: "bold", textAlign: "center" }}>{columnMeta.name}</Typography>
</TableCell>
),
setCellProps: () => ({ style2 }),
customBodyRender: (value, tableMeta, updateValue) => {
return (
<div style={{ width: 90, textAlign: 'center' }}>
{tableMeta.rowData[0] === 1 || tableMeta.rowData[0] === 4 ?
null :
<div style={{ width: 90, textAlign: "center" }}>
{tableMeta.rowData[0] === 1 || tableMeta.rowData[0] === 4 ? null : (
<div>
<span style={{ fontSize: 12 }}>{tableMeta.rowData[0] === 4 ? "" : value}</span>
</div>
}
)}
</div>
)
}
}
}, {
);
},
},
},
{
name: "Revision",
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 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={{ textAlign: 'center', width: 60 }}>
{tableMeta.rowData[0] === 1 || tableMeta.rowData[0] === 2 || tableMeta.rowData[0] === 4 ?
null :
val
}
</div>
)
}
}
}, {
return <div style={{ textAlign: "center", width: 60 }}>{tableMeta.rowData[0] === 1 || tableMeta.rowData[0] === 2 || tableMeta.rowData[0] === 4 ? null : val}</div>;
},
},
},
{
name: "Approver",
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 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 :
val
}
</div>
)
}
}
}, {
return <div style={{ textAlign: "center", width: 60 }}>{tableMeta.rowData[0] === 1 || tableMeta.rowData[0] === 2 || tableMeta.rowData[0] === 4 ? null : val}</div>;
},
},
},
{
name: "Approver 2",
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 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={{ textAlign: 'center', width: 60 }}>
{tableMeta.rowData[0] === 1 || tableMeta.rowData[0] === 2 || tableMeta.rowData[0] === 4 ?
null :
val
}
</div>
)
}
}
}, {
return <div style={{ textAlign: "center", width: 60 }}>{tableMeta.rowData[0] === 1 || tableMeta.rowData[0] === 2 || tableMeta.rowData[0] === 4 ? null : val}</div>;
},
},
},
{
name: "Approver 3",
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 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={{ textAlign: 'center', width: 60 }}>
{tableMeta.rowData[0] === 1 || tableMeta.rowData[0] === 2 || tableMeta.rowData[0] === 4 ?
null :
val
}
</div>
)
}
}
}, {
return <div style={{ textAlign: "center", width: 60 }}>{tableMeta.rowData[0] === 1 || tableMeta.rowData[0] === 2 || tableMeta.rowData[0] === 4 ? null : val}</div>;
},
},
},
{
name: "Approver 4",
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 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={{ textAlign: 'center', width: 60 }}>
{tableMeta.rowData[0] === 1 || tableMeta.rowData[0] === 2 || tableMeta.rowData[0] === 4 ?
null :
val
}
</div>
)
}
}
}, {
return <div style={{ textAlign: "center", width: 60 }}>{tableMeta.rowData[0] === 1 || tableMeta.rowData[0] === 2 || tableMeta.rowData[0] === 4 ? null : val}</div>;
},
},
},
{
name: "Approver 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 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={{ textAlign: 'center', width: 60 }}>
{tableMeta.rowData[0] === 1 || tableMeta.rowData[0] === 2 || tableMeta.rowData[0] === 4 ?
null :
val
}
</div>
)
}
}
}, {
return <div style={{ textAlign: "center", width: 60 }}>{tableMeta.rowData[0] === 1 || tableMeta.rowData[0] === 2 || tableMeta.rowData[0] === 4 ? null : val}</div>;
},
},
},
{
name: "Approver 6",
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 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={{ textAlign: 'center', width: 60 }}>
{tableMeta.rowData[0] === 1 || tableMeta.rowData[0] === 2 || tableMeta.rowData[0] === 4 ?
null :
val
}
</div>
)
}
}
},{
return <div style={{ textAlign: "center", width: 60 }}>{tableMeta.rowData[0] === 1 || tableMeta.rowData[0] === 2 || tableMeta.rowData[0] === 4 ? null : val}</div>;
},
},
},
{
name: "",
options: {
display: false
}
}]
display: false,
},
},
];
const columns = []
const columns = [];
return (
<div>
<div style={{ padding: '0px 20px 20px 20px', width: this.props.width - (this.props.open === true ? 350 : 100) }}>
<div style={{ padding: "0px 20px 20px 20px", width: this.props.width - (this.props.open === true ? 350 : 100) }}>
<MuiThemeProvider theme={getMuiTheme()}>
<MUIDataTable
data={dataTable2}
columns={this.props.type === 0 ? columnMBStatus : this.props.type === 1 ? columnMB : columns}
// columns={this.props.type === 1 ? columnMB : this.props.type === 2 ? columnMR : this.props.type === 3 ? columnOI : this.props.type === 4 ? columnRO : columns}
columns={this.props.category === "report-status" ? columnMBStatus : this.props.category === "approval-progress" ? columnMB : columns}
options={options}
/>
</MuiThemeProvider>
</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