Skip to content

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

Merge branch 'faisal' into 'master' 

update 140920

See merge request !296
parents 780d1f2a f4c5dc76
Hide whitespace changes
Inline Side-by-side
Showing with 139 additions and 68 deletions
src/container/BudgetTahunan/CorporateAnnualTarget.js
View file @ 959a2892
...@@ -3,6 +3,11 @@ import { Typography, Paper, createMuiTheme, MuiThemeProvider, TableCell, FormCon ...@@ -3,6 +3,11 @@ import { Typography, Paper, createMuiTheme, MuiThemeProvider, TableCell, FormCon
import MUIDataTable from 'mui-datatables'; import MUIDataTable from 'mui-datatables';
import NumberFormat from 'react-number-format'; import NumberFormat from 'react-number-format';
import api from '../../api'; 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';
var ct = require("../../library/CustomTable"); var ct = require("../../library/CustomTable");
const getMuiTheme = () => createMuiTheme(ct.customTable()); const getMuiTheme = () => createMuiTheme(ct.customTable());
...@@ -16,9 +21,8 @@ const style = { ...@@ -16,9 +21,8 @@ const style = {
}; };
const style2 = { const style2 = {
position: "sticky", position: "sticky",
left: 420,
background: "white", background: "white",
zIndex: 101 zIndex: 100
}; };
export default class CorporateAnnualTarget extends Component { export default class CorporateAnnualTarget extends Component {
...@@ -43,6 +47,7 @@ export default class CorporateAnnualTarget extends Component { ...@@ -43,6 +47,7 @@ export default class CorporateAnnualTarget extends Component {
} }
getItemHierarki() { getItemHierarki() {
this.setState({ loading: true })
let payload = { let payload = {
"report_id": this.props.report_id, "report_id": this.props.report_id,
"revision": Number(this.props.revision), "revision": Number(this.props.revision),
...@@ -179,32 +184,32 @@ export default class CorporateAnnualTarget extends Component { ...@@ -179,32 +184,32 @@ export default class CorporateAnnualTarget extends Component {
} }
render() { render() {
// let dataTable2 = this.state.dataTable let dataTable2 = this.state.dataTable
// const handleChange = (value, tableMeta) => { const handleChange = (value, tableMeta) => {
// let val = String(value).split(",").join("") let val = String(value).split(",").join("")
// // let data = this.state.dataTable2 // let data = this.state.dataTable2
// let indexParent = dataTable2.findIndex((val) => val[1] == dataTable2[tableMeta.rowIndex][2]) let indexParent = dataTable2.findIndex((val) => val[1] == dataTable2[tableMeta.rowIndex][2])
// if (indexParent > 0) { if (indexParent > 0) {
// // console.log(indexParent) // console.log(indexParent)
// let a = dataTable2[tableMeta.rowIndex][tableMeta.columnIndex] = Number(val) let a = dataTable2[tableMeta.rowIndex][tableMeta.columnIndex] = Number(val)
// let jagain = dataTable2[indexParent][tableMeta.columnIndex] let jagain = dataTable2[indexParent][tableMeta.columnIndex]
// a = dataTable2[indexParent][tableMeta.columnIndex] = jagain == undefined ? (0 + Number(val)) : (jagain + Number(val)) a = dataTable2[indexParent][tableMeta.columnIndex] = jagain == undefined ? (0 + Number(val)) : (jagain + Number(val))
// } else { } else {
// dataTable2[tableMeta.rowIndex][tableMeta.columnIndex] = Number(val) dataTable2[tableMeta.rowIndex][tableMeta.columnIndex] = Number(val)
// } }
// } }
// const handleValue = (data) => { const handleValue = (data) => {
// let total = 0 let total = 0
// dataTable2.map((item, index) => { dataTable2.map((item, index) => {
// if (data.rowData[1] == item[2]) { if (data.rowData[1] == item[2]) {
// total = item[data.columnIndex] == undefined ? (Number(total) + 0) : (Number(total) + Number(item[data.columnIndex])) total = item[data.columnIndex] == undefined ? (Number(total) + 0) : (Number(total) + Number(item[data.columnIndex]))
// } }
// }) })
// let indexParent = dataTable2.findIndex((val) => val[1] == dataTable2[data.rowIndex][2]) let indexParent = dataTable2.findIndex((val) => val[1] == dataTable2[data.rowIndex][2])
// let a = dataTable2[data.rowIndex][data.columnIndex] = Number(total) let a = dataTable2[data.rowIndex][data.columnIndex] = Number(total)
// // console.log(indexParent); // console.log(indexParent);
// return a return a
// } }
const columns = [{ const columns = [{
name: "", name: "",
options: { options: {
...@@ -234,14 +239,14 @@ export default class CorporateAnnualTarget extends Component { ...@@ -234,14 +239,14 @@ export default class CorporateAnnualTarget extends Component {
name: "Key Performance Indicator", name: "Key Performance Indicator",
options: { options: {
customHeadRender: (columnMeta) => ( customHeadRender: (columnMeta) => (
<TableCell key={columnMeta.index} style={{ ...style, top: 0, zIndex: 102, backgroundColor: '#354960', width: 388 }}> <TableCell key={columnMeta.index} style={{ ...style, top: 0, zIndex: 102, backgroundColor: '#1c71b8', width: 388 }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography> <Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
</TableCell> </TableCell>
), ),
setCellProps: () => ({ style }), setCellProps: () => ({ style }),
customBodyRender: (val, tableMeta) => { customBodyRender: (val, tableMeta) => {
return ( return (
<div style={{ width: 388 }}> <div style={{ width: 300 }}>
{tableMeta.rowIndex == 0 || tableMeta.rowIndex == 1 ? {tableMeta.rowIndex == 0 || tableMeta.rowIndex == 1 ?
<span style={{ fontSize: 12, fontWeight: 'bold' }}>{val}</span> <span style={{ fontSize: 12, fontWeight: 'bold' }}>{val}</span>
: :
...@@ -257,24 +262,79 @@ export default class CorporateAnnualTarget extends Component { ...@@ -257,24 +262,79 @@ export default class CorporateAnnualTarget extends Component {
name: "Weight", name: "Weight",
options: { options: {
customHeadRender: (columnMeta) => ( customHeadRender: (columnMeta) => (
<TableCell style={{ backgroundColor: '#354960', width: 96 }}> <TableCell style={{ ...style2, top: 0, zIndex: 99, backgroundColor: '#1c71b8', width: 96 }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography> <Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
</TableCell> </TableCell>
), ),
setCellProps: () => ({ setCellProps: () => ({ style2 }),
style: { customBodyRender: (value, tableMeta, updateValue) => {
position: "sticky", return (
left: 420, <div style={{ textAlign: 'right' }}>
background: "white", {tableMeta.rowData[0] === 3 ?
zIndex: 101 <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=""
value={value}
onBlur={(event) => {
// updateValue(event.target.value)
handleChange(event.target.value, tableMeta)
console.log(dataTable2)
}}
/>
}
/>
</div> :
tableMeta.rowData[0] === 2 ?
<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={handleValue(tableMeta)}
/>
</span>
:
tableMeta.rowData[0] === 4 ?
null
:
tableMeta.rowData[0] === 6 ?
<span>Formula</span>
:
tableMeta.rowData[0] === 5 ?
<span>Formula Summary</span>
:
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)}
/>
:
<span>validasi</span>
}
</div>
)
}
} }
}, { }, {
name: "UOM", name: "UOM",
options: { options: {
customHeadRender: (columnMeta) => ( customHeadRender: (columnMeta) => (
<TableCell style={{ backgroundColor: '#354960', width: 96 }}> <TableCell style={{ backgroundColor: '#1c71b8', width: 96 }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography> <Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
</TableCell> </TableCell>
), ),
...@@ -309,7 +369,7 @@ export default class CorporateAnnualTarget extends Component { ...@@ -309,7 +369,7 @@ export default class CorporateAnnualTarget extends Component {
name: "Jenis KPI", name: "Jenis KPI",
options: { options: {
customHeadRender: (columnMeta) => ( customHeadRender: (columnMeta) => (
<TableCell style={{ backgroundColor: '#354960', width: 96 }}> <TableCell style={{ backgroundColor: '#1c71b8', width: 96 }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography> <Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
</TableCell> </TableCell>
), ),
...@@ -325,7 +385,7 @@ export default class CorporateAnnualTarget extends Component { ...@@ -325,7 +385,7 @@ export default class CorporateAnnualTarget extends Component {
name: "Max Ach.", name: "Max Ach.",
options: { options: {
customHeadRender: (columnMeta) => ( customHeadRender: (columnMeta) => (
<TableCell style={{ backgroundColor: '#354960', width: 96 }}> <TableCell style={{ backgroundColor: '#1c71b8', width: 96 }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography> <Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
</TableCell> </TableCell>
), ),
...@@ -341,7 +401,7 @@ export default class CorporateAnnualTarget extends Component { ...@@ -341,7 +401,7 @@ export default class CorporateAnnualTarget extends Component {
name: "Formula YTD", name: "Formula YTD",
options: { options: {
customHeadRender: (columnMeta) => ( customHeadRender: (columnMeta) => (
<TableCell style={{ backgroundColor: '#354960', width: 96 }}> <TableCell style={{ backgroundColor: '#1c71b8', width: 96 }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography> <Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
</TableCell> </TableCell>
), ),
...@@ -357,9 +417,9 @@ export default class CorporateAnnualTarget extends Component { ...@@ -357,9 +417,9 @@ export default class CorporateAnnualTarget extends Component {
name: "2020", name: "2020",
options: { options: {
customHeadRender: (columnMeta) => ( customHeadRender: (columnMeta) => (
<TableCell style={{ backgroundColor: '#354960', width: 96 }}> <TableCell style={{ ...style2, top: 0, zIndex: 99, backgroundColor: '#37b5e6', width: 96 }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography> <Typography style={{ color: 'black', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
</TableCell> </TableCell>
), ),
customBodyRender: (val) => { customBodyRender: (val) => {
return ( return (
...@@ -373,7 +433,7 @@ export default class CorporateAnnualTarget extends Component { ...@@ -373,7 +433,7 @@ export default class CorporateAnnualTarget extends Component {
name: "Jan 2021", name: "Jan 2021",
options: { options: {
customHeadRender: (columnMeta) => ( customHeadRender: (columnMeta) => (
<TableCell style={{ backgroundColor: '#354960', width: 96 }}> <TableCell style={{ backgroundColor: '#1c71b8', width: 96 }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography> <Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
</TableCell> </TableCell>
), ),
...@@ -389,7 +449,7 @@ export default class CorporateAnnualTarget extends Component { ...@@ -389,7 +449,7 @@ export default class CorporateAnnualTarget extends Component {
name: "Feb 2021", name: "Feb 2021",
options: { options: {
customHeadRender: (columnMeta) => ( customHeadRender: (columnMeta) => (
<TableCell style={{ backgroundColor: '#354960', width: 96 }}> <TableCell style={{ backgroundColor: '#1c71b8', width: 96 }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography> <Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
</TableCell> </TableCell>
), ),
...@@ -405,7 +465,7 @@ export default class CorporateAnnualTarget extends Component { ...@@ -405,7 +465,7 @@ export default class CorporateAnnualTarget extends Component {
name: "Mar 2021", name: "Mar 2021",
options: { options: {
customHeadRender: (columnMeta) => ( customHeadRender: (columnMeta) => (
<TableCell style={{ backgroundColor: '#354960', width: 96 }}> <TableCell style={{ backgroundColor: '#1c71b8', width: 96 }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography> <Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
</TableCell> </TableCell>
), ),
...@@ -421,7 +481,7 @@ export default class CorporateAnnualTarget extends Component { ...@@ -421,7 +481,7 @@ export default class CorporateAnnualTarget extends Component {
name: "Apr 2021", name: "Apr 2021",
options: { options: {
customHeadRender: (columnMeta) => ( customHeadRender: (columnMeta) => (
<TableCell style={{ backgroundColor: '#354960', width: 96 }}> <TableCell style={{ backgroundColor: '#1c71b8', width: 96 }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography> <Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
</TableCell> </TableCell>
), ),
...@@ -437,7 +497,7 @@ export default class CorporateAnnualTarget extends Component { ...@@ -437,7 +497,7 @@ export default class CorporateAnnualTarget extends Component {
name: "May 2021", name: "May 2021",
options: { options: {
customHeadRender: (columnMeta) => ( customHeadRender: (columnMeta) => (
<TableCell style={{ backgroundColor: '#354960', width: 96 }}> <TableCell style={{ backgroundColor: '#1c71b8', width: 96 }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography> <Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
</TableCell> </TableCell>
), ),
...@@ -453,7 +513,7 @@ export default class CorporateAnnualTarget extends Component { ...@@ -453,7 +513,7 @@ export default class CorporateAnnualTarget extends Component {
name: "Jun 2021", name: "Jun 2021",
options: { options: {
customHeadRender: (columnMeta) => ( customHeadRender: (columnMeta) => (
<TableCell style={{ backgroundColor: '#354960', width: 96 }}> <TableCell style={{ backgroundColor: '#1c71b8', width: 96 }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography> <Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
</TableCell> </TableCell>
), ),
...@@ -469,7 +529,7 @@ export default class CorporateAnnualTarget extends Component { ...@@ -469,7 +529,7 @@ export default class CorporateAnnualTarget extends Component {
name: "Jul 2021", name: "Jul 2021",
options: { options: {
customHeadRender: (columnMeta) => ( customHeadRender: (columnMeta) => (
<TableCell style={{ backgroundColor: '#354960', width: 96 }}> <TableCell style={{ backgroundColor: '#1c71b8', width: 96 }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography> <Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
</TableCell> </TableCell>
), ),
...@@ -485,7 +545,7 @@ export default class CorporateAnnualTarget extends Component { ...@@ -485,7 +545,7 @@ export default class CorporateAnnualTarget extends Component {
name: "Aug 2021", name: "Aug 2021",
options: { options: {
customHeadRender: (columnMeta) => ( customHeadRender: (columnMeta) => (
<TableCell style={{ backgroundColor: '#354960', width: 96 }}> <TableCell style={{ backgroundColor: '#1c71b8', width: 96 }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography> <Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
</TableCell> </TableCell>
), ),
...@@ -501,7 +561,7 @@ export default class CorporateAnnualTarget extends Component { ...@@ -501,7 +561,7 @@ export default class CorporateAnnualTarget extends Component {
name: "Sep 2021", name: "Sep 2021",
options: { options: {
customHeadRender: (columnMeta) => ( customHeadRender: (columnMeta) => (
<TableCell style={{ backgroundColor: '#354960', width: 96 }}> <TableCell style={{ backgroundColor: '#1c71b8', width: 96 }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography> <Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
</TableCell> </TableCell>
), ),
...@@ -517,7 +577,7 @@ export default class CorporateAnnualTarget extends Component { ...@@ -517,7 +577,7 @@ export default class CorporateAnnualTarget extends Component {
name: "Oct 2021", name: "Oct 2021",
options: { options: {
customHeadRender: (columnMeta) => ( customHeadRender: (columnMeta) => (
<TableCell style={{ backgroundColor: '#354960', width: 96 }}> <TableCell style={{ backgroundColor: '#1c71b8', width: 96 }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography> <Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
</TableCell> </TableCell>
), ),
...@@ -533,7 +593,7 @@ export default class CorporateAnnualTarget extends Component { ...@@ -533,7 +593,7 @@ export default class CorporateAnnualTarget extends Component {
name: "Nop 2021", name: "Nop 2021",
options: { options: {
customHeadRender: (columnMeta) => ( customHeadRender: (columnMeta) => (
<TableCell style={{ backgroundColor: '#354960', width: 96 }}> <TableCell style={{ backgroundColor: '#1c71b8', width: 96 }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography> <Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
</TableCell> </TableCell>
), ),
...@@ -549,7 +609,7 @@ export default class CorporateAnnualTarget extends Component { ...@@ -549,7 +609,7 @@ export default class CorporateAnnualTarget extends Component {
name: "Dec 2021", name: "Dec 2021",
options: { options: {
customHeadRender: (columnMeta) => ( customHeadRender: (columnMeta) => (
<TableCell style={{ backgroundColor: '#354960', width: 96 }}> <TableCell style={{ backgroundColor: '#1c71b8', width: 96 }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography> <Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
</TableCell> </TableCell>
), ),
...@@ -565,7 +625,7 @@ export default class CorporateAnnualTarget extends Component { ...@@ -565,7 +625,7 @@ export default class CorporateAnnualTarget extends Component {
name: "2021 Total", name: "2021 Total",
options: { options: {
customHeadRender: (columnMeta) => ( customHeadRender: (columnMeta) => (
<TableCell style={{ backgroundColor: '#354960', width: 96 }}> <TableCell style={{ backgroundColor: '#1c71b8', width: 96 }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography> <Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
</TableCell> </TableCell>
), ),
...@@ -581,7 +641,7 @@ export default class CorporateAnnualTarget extends Component { ...@@ -581,7 +641,7 @@ export default class CorporateAnnualTarget extends Component {
name: "2022 Total", name: "2022 Total",
options: { options: {
customHeadRender: (columnMeta) => ( customHeadRender: (columnMeta) => (
<TableCell style={{ backgroundColor: '#354960', width: 96 }}> <TableCell style={{ backgroundColor: '#1c71b8', width: 96 }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography> <Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
</TableCell> </TableCell>
), ),
...@@ -597,7 +657,7 @@ export default class CorporateAnnualTarget extends Component { ...@@ -597,7 +657,7 @@ export default class CorporateAnnualTarget extends Component {
name: "2023 Total", name: "2023 Total",
options: { options: {
customHeadRender: (columnMeta) => ( customHeadRender: (columnMeta) => (
<TableCell style={{ backgroundColor: '#354960', width: 96 }}> <TableCell style={{ backgroundColor: '#1c71b8', width: 96 }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography> <Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
</TableCell> </TableCell>
), ),
...@@ -613,7 +673,7 @@ export default class CorporateAnnualTarget extends Component { ...@@ -613,7 +673,7 @@ export default class CorporateAnnualTarget extends Component {
name: "Strategic Initiative", name: "Strategic Initiative",
options: { options: {
customHeadRender: (columnMeta) => ( customHeadRender: (columnMeta) => (
<TableCell style={{ backgroundColor: '#354960', width: 96 }}> <TableCell style={{ backgroundColor: '#1c71b8', width: 96 }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography> <Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
</TableCell> </TableCell>
), ),
...@@ -629,7 +689,7 @@ export default class CorporateAnnualTarget extends Component { ...@@ -629,7 +689,7 @@ export default class CorporateAnnualTarget extends Component {
name: "PIC", name: "PIC",
options: { options: {
customHeadRender: (columnMeta) => ( customHeadRender: (columnMeta) => (
<TableCell style={{ backgroundColor: '#354960', width: 96 }}> <TableCell style={{ backgroundColor: '#1c71b8', width: 96 }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography> <Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
</TableCell> </TableCell>
), ),
...@@ -643,12 +703,23 @@ export default class CorporateAnnualTarget extends Component { ...@@ -643,12 +703,23 @@ export default class CorporateAnnualTarget extends Component {
} }
} }
] ]
const loadingComponent = (
<div style={{ position: 'absolute', zIndex: 110, top: 0, left: 0, width: '100%', height: '100%', display: 'flex', justifyContent: 'center', alignItems: 'center', background: 'rgba(255,255,255,0.8)' }}>
<PropagateLoader
// css={override}
size={20}
color={"#274B80"}
loading={this.state.loading}
/>
</div>
);
return ( return (
<div style={{ height: this.props.height, backgroundColor: '#f8f8f8', marginBottom: 100, minHeight: 1000 }}> <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 }}> <div className={"main-color"} style={{ height: 78, flex: 1, display: 'flex', alignItems: 'center', paddingLeft: 20 }}>
<Typography style={{ fontSize: '16px', color: 'white' }}>Pengajuan Budget Tahunan</Typography> <Typography style={{ fontSize: '16px', color: 'white' }}>Pengajuan Budget Tahunan</Typography>
</div> </div>
{/* {this.state.loading && loadingComponent} */}
<div style={{ flex: 1, padding: 20, width: '100%' }}> <div style={{ flex: 1, padding: 20, width: '100%' }}>
<Paper style={{ paddingTop: 10, paddingBottom: 20 }}> <Paper style={{ paddingTop: 10, paddingBottom: 20 }}>
<div style={{ borderBottom: 'solid 1px #c4c4c4' }} > <div style={{ borderBottom: 'solid 1px #c4c4c4' }} >
...@@ -689,10 +760,10 @@ export default class CorporateAnnualTarget extends Component { ...@@ -689,10 +760,10 @@ export default class CorporateAnnualTarget extends Component {
</button> </button>
</div> </div>
<div className="col-2" style={{ display: 'flex', justifyContent: 'flex-end', maxWidth: '100%' }}> <div className="col-2" style={{ display: 'flex', justifyContent: 'flex-end', maxWidth: '100%' }}>
<div style={{ backgroundColor: '#fff', width: 105, height: 25, borderRadius: 3, justifyContent: 'center', display: 'flex', alignItems: 'center', border: 'solid 1px #354960', marginRight: 20 }}> <div style={{ backgroundColor: '#fff', width: 105, height: 25, borderRadius: 3, justifyContent: 'center', display: 'flex', alignItems: 'center', border: 'solid 1px #1c71b8', marginRight: 20 }}>
<Typography style={{ fontSize: '11px', color: '#354960', textAlign: 'center' }}>Cancel</Typography> <Typography style={{ fontSize: '11px', color: '#1c71b8', textAlign: 'center' }}>Cancel</Typography>
</div> </div>
<div style={{ backgroundColor: '#354960', width: 105, height: 25, borderRadius: 3, justifyContent: 'center', display: 'flex', alignItems: 'center', marginRight: 20 }}> <div style={{ backgroundColor: '#1c71b8', width: 105, height: 25, borderRadius: 3, justifyContent: 'center', display: 'flex', alignItems: 'center', marginRight: 20 }}>
<Typography style={{ fontSize: '11px', color: '#fff', textAlign: 'center' }}>Save</Typography> <Typography style={{ fontSize: '11px', color: '#fff', textAlign: 'center' }}>Save</Typography>
</div> </div>
</div> </div>
......
src/container/MasterData/Perusahaan/Perusahaan.js
View file @ 959a2892
...@@ -576,7 +576,7 @@ export default class Perusahaan extends Component { ...@@ -576,7 +576,7 @@ export default class Perusahaan extends Component {
onClick={() => this.openPopUp(tableMeta.rowData, 'edit')} onClick={() => this.openPopUp(tableMeta.rowData, 'edit')}
> >
<div style={{ display: 'flex' }}> <div style={{ display: 'flex' }}>
{!tableMeta.rowData[2].includes("TIA") ? {!tableMeta.rowData[2].includes("PT TRIPUTRA INVESTINDO ARYA") ?
<img src={Images.editCopy} /> : <img src={Images.editCopy} /> :
null null
} }
...@@ -600,7 +600,7 @@ export default class Perusahaan extends Component { ...@@ -600,7 +600,7 @@ export default class Perusahaan extends Component {
onClick={() => this.openPopUp(tableMeta.rowData, 'delete')} onClick={() => this.openPopUp(tableMeta.rowData, 'delete')}
> >
<div style={{ display: 'flex' }}> <div style={{ display: 'flex' }}>
{!tableMeta.rowData[2].includes("TIA") ? {!tableMeta.rowData[2].includes("PT TRIPUTRA INVESTINDO ARYA") ?
<img src={Images.delete} /> : <img src={Images.delete} /> :
null null
} }
......
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