Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Submit feedback
Contribute to GitLab
Sign in
Toggle navigation
T
Tia-dev
Project
Project
Details
Activity
Releases
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Issues
0
Issues
0
List
Board
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
Dida Adams Arizona
Tia-dev
Commits
db7314d5
Commit
db7314d5
authored
Nov 10, 2020
by
Deni Rinaldi
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
++
parent
e03ac331
Changes
1
Hide whitespace changes
Inline
Side-by-side
Showing
1 changed file
with
262 additions
and
60 deletions
+262
-60
BalanceSheetMR.js
src/container/MonthlyReport/BalanceSheetMR.js
+262
-60
No files found.
src/container/MonthlyReport/BalanceSheetMR.js
View file @
db7314d5
import
{
createMuiTheme
,
MuiThemeProvider
,
Paper
,
TableCell
,
T
ypography
}
from
'@material-ui/core'
import
{
createMuiTheme
,
MuiThemeProvider
,
Paper
,
TableCell
,
T
ooltip
,
Typography
,
withStyles
}
from
'@material-ui/core'
import
MUIDataTable
from
'mui-datatables'
;
import
MUIDataTable
from
'mui-datatables'
;
import
React
,
{
Component
}
from
'react'
import
React
,
{
Component
}
from
'react'
import
ReactTooltip
from
'react-tooltip'
;
import
ReactTooltip
from
'react-tooltip'
;
import
Images
from
'../../assets/Images'
;
import
Images
from
'../../assets/Images'
;
import
api
from
'../../api'
;
import
api
from
'../../api'
;
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"
);
var
ct
=
require
(
"../../library/CustomTable"
);
const
getMuiTheme
=
()
=>
createMuiTheme
(
ct
.
customTable3
());
const
getMuiTheme
=
()
=>
createMuiTheme
(
ct
.
customTable3
());
...
@@ -24,8 +33,15 @@ const style2 = {
...
@@ -24,8 +33,15 @@ const style2 = {
};
};
export
default
class
BalanceSheetMR
extends
Component
{
export
default
class
BalanceSheetMR
extends
Component
{
constructor
(
props
)
{
super
(
props
)
this
.
state
=
{
dataTable
:
[],
loading
:
true
}
}
componentDidMount
(){
componentDidMount
()
{
this
.
getItemHierarki
()
this
.
getItemHierarki
()
}
}
...
@@ -39,11 +55,123 @@ export default class BalanceSheetMR extends Component {
...
@@ -39,11 +55,123 @@ export default class BalanceSheetMR extends Component {
}
}
api
.
create
().
getHierarkiMontlyReport
(
payload
).
then
(
response
=>
{
api
.
create
().
getHierarkiMontlyReport
(
payload
).
then
(
response
=>
{
console
.
log
(
response
);
console
.
log
(
response
);
let
dataTable
=
[]
if
(
response
.
data
)
{
let
res
=
response
.
data
.
data
const
handlePushChild
=
(
item
)
=>
{
let
indexIDzz
=
dataTable
.
findIndex
((
val
)
=>
val
[
1
]
===
item
.
id
)
if
(
indexIDzz
===
-
1
)
{
dataTable
.
push
([
item
.
type_report_id
,
item
.
id
,
item
.
parent
,
item
.
formula
,
item
.
level
,
item
.
description
,
item
.
balance_sheet
.
rolling_outlook
===
null
?
"0.0"
:
item
.
balance_sheet
.
rolling_outlook
===
""
?
"0.0"
:
item
.
balance_sheet
.
rolling_outlook
,
{
mb
:
item
.
balance_sheet
.
master_budget
===
""
?
"0.0"
:
item
.
balance_sheet
.
master_budget
,
rb
:
item
.
balance_sheet
.
rolling_budget
===
""
?
"0.0"
:
item
.
balance_sheet
.
rolling_budget
,
actual
:
item
.
balance_sheet
.
actual
===
""
?
"0.0"
:
item
.
balance_sheet
.
actual
},
item
.
balance_sheet
.
actual_previous_month
===
null
?
"0.0"
:
item
.
balance_sheet
.
actual_previous_month
===
""
?
"0.0"
:
item
.
balance_sheet
.
actual_previous_month
,
{
aavpm
:
item
.
balance_sheet
.
amount_act_vs_previous_month
===
""
?
"0.0"
:
item
.
balance_sheet
.
amount_act_vs_previous_month
,
pavpm
:
item
.
balance_sheet
.
percent_act_vs_previous_month
===
""
?
"0.0"
:
item
.
balance_sheet
.
percent_act_vs_previous_month
,
aavmb
:
item
.
balance_sheet
.
amount_act_vs_mb
===
""
?
"0.0"
:
item
.
balance_sheet
.
amount_act_vs_mb
,
pavmb
:
item
.
balance_sheet
.
percent_act_vs_mb
===
""
?
"0.0"
:
item
.
balance_sheet
.
percent_act_vs_mb
,
aavrb
:
item
.
balance_sheet
.
amount_act_vs_rb
===
""
?
"0.0"
:
item
.
balance_sheet
.
amount_act_vs_rb
,
pavrb
:
item
.
balance_sheet
.
percent_act_vs_rb
===
""
?
"0.0"
:
item
.
balance_sheet
.
percent_act_vs_rb
,
},
{
mtdvpm
:
item
.
balance_sheet
.
mtd_vs_previous_month
===
""
?
"0.0"
:
item
.
balance_sheet
.
mtd_vs_previous_month
,
mtdvmb
:
item
.
balance_sheet
.
mtd_vs_mb
===
""
?
"0.0"
:
item
.
balance_sheet
.
mtd_vs_mb
,
mtdvrb
:
item
.
balance_sheet
.
mtd_vs_rb
===
""
?
"0.0"
:
item
.
balance_sheet
.
mtd_vs_rb
,
}
])
}
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
.
balance_sheet
.
rolling_outlook
===
null
?
"0.0"
:
item
.
balance_sheet
.
rolling_outlook
===
""
?
"0.0"
:
item
.
balance_sheet
.
rolling_outlook
,
{
mb
:
item
.
balance_sheet
.
master_budget
===
""
?
"0.0"
:
item
.
balance_sheet
.
master_budget
,
rb
:
item
.
balance_sheet
.
rolling_budget
===
""
?
"0.0"
:
item
.
balance_sheet
.
rolling_budget
,
actual
:
item
.
balance_sheet
.
actual
===
""
?
"0.0"
:
item
.
balance_sheet
.
actual
},
item
.
balance_sheet
.
actual_previous_month
===
null
?
"0.0"
:
item
.
balance_sheet
.
actual_previous_month
===
""
?
"0.0"
:
item
.
balance_sheet
.
actual_previous_month
,
{
aavpm
:
item
.
balance_sheet
.
amount_act_vs_previous_month
===
""
?
"0.0"
:
item
.
balance_sheet
.
amount_act_vs_previous_month
,
pavpm
:
item
.
balance_sheet
.
percent_act_vs_previous_month
===
""
?
"0.0"
:
item
.
balance_sheet
.
percent_act_vs_previous_month
,
aavmb
:
item
.
balance_sheet
.
amount_act_vs_mb
===
""
?
"0.0"
:
item
.
balance_sheet
.
amount_act_vs_mb
,
pavmb
:
item
.
balance_sheet
.
percent_act_vs_mb
===
""
?
"0.0"
:
item
.
balance_sheet
.
percent_act_vs_mb
,
aavrb
:
item
.
balance_sheet
.
amount_act_vs_rb
===
""
?
"0.0"
:
item
.
balance_sheet
.
amount_act_vs_rb
,
pavrb
:
item
.
balance_sheet
.
percent_act_vs_rb
===
""
?
"0.0"
:
item
.
balance_sheet
.
percent_act_vs_rb
,
},
{
mtdvpm
:
item
.
balance_sheet
.
mtd_vs_previous_month
===
""
?
"0.0"
:
item
.
balance_sheet
.
mtd_vs_previous_month
,
mtdvmb
:
item
.
balance_sheet
.
mtd_vs_mb
===
""
?
"0.0"
:
item
.
balance_sheet
.
mtd_vs_mb
,
mtdvrb
:
item
.
balance_sheet
.
mtd_vs_rb
===
""
?
"0.0"
:
item
.
balance_sheet
.
mtd_vs_rb
,
}
])
if
(
item
.
children
!==
null
)
{
if
(
item
.
children
.
length
>
0
)
{
item
.
children
.
map
((
items
,
indexs
)
=>
{
handlePushChild
(
items
)
})
}
}
})
this
.
setState
({
dataTable
,
loading
:
false
})
}
})
})
}
}
render
()
{
render
()
{
let
columns
=
[
let
columns
=
[
{
name
:
""
,
options
:
{
display
:
false
}
},
{
name
:
""
,
options
:
{
display
:
false
}
},
{
name
:
""
,
options
:
{
display
:
false
}
},
{
name
:
""
,
options
:
{
display
:
false
}
},
{
name
:
""
,
options
:
{
display
:
false
}
},
{
{
name
:
"Account"
,
name
:
"Account"
,
options
:
{
options
:
{
...
@@ -56,7 +184,24 @@ export default class BalanceSheetMR extends Component {
...
@@ -56,7 +184,24 @@ export default class BalanceSheetMR extends Component {
customBodyRender
:
(
val
,
tableMeta
)
=>
{
customBodyRender
:
(
val
,
tableMeta
)
=>
{
return
(
return
(
<
div
style
=
{{
width
:
300
}}
>
<
div
style
=
{{
width
:
300
}}
>
{
val
}
{
tableMeta
.
rowData
[
0
]
===
null
?
tableMeta
.
rowData
[
4
]
==
0
?
<
LightTooltip
title
=
{
"Report Items Not Registered"
}
arrow
>
<
span
style
=
{{
fontSize
:
12
,
fontWeight
:
'bold'
,
color
:
'red'
}}
>
{
String
(
val
).
toUpperCase
()}
<
/span
>
<
/LightTooltip>
:
<
div
style
=
{{
paddingLeft
:
20
*
Number
(
tableMeta
.
rowData
[
4
])
}}
>
<
LightTooltip
title
=
{
"Report Items Not Registered"
}
arrow
>
<
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
>
:
<
div
style
=
{{
paddingLeft
:
20
*
Number
(
tableMeta
.
rowData
[
4
])
}}
>
<
span
style
=
{{
fontSize
:
12
}}
>
{
tableMeta
.
rowData
[
0
]
===
4
?
""
:
val
}
<
/span
>
<
/div
>
}
<
/div
>
<
/div
>
)
)
}
}
...
@@ -74,7 +219,10 @@ export default class BalanceSheetMR extends Component {
...
@@ -74,7 +219,10 @@ export default class BalanceSheetMR extends Component {
customBodyRender
:
(
val
,
tableMeta
,
updateValue
)
=>
{
customBodyRender
:
(
val
,
tableMeta
,
updateValue
)
=>
{
return
(
return
(
<
div
style
=
{{
textAlign
:
'right'
,
width
:
90
}}
>
<
div
style
=
{{
textAlign
:
'right'
,
width
:
90
}}
>
{
val
}
{
tableMeta
.
rowData
[
0
]
===
4
?
null
:
val
}
<
/div
>
<
/div
>
)
)
}
}
...
@@ -84,42 +232,57 @@ export default class BalanceSheetMR extends Component {
...
@@ -84,42 +232,57 @@ export default class BalanceSheetMR extends Component {
name
:
`Month To Date (MTD)`
,
name
:
`Month To Date (MTD)`
,
options
:
{
options
:
{
customHeadRender
:
(
columnMeta
)
=>
(
customHeadRender
:
(
columnMeta
)
=>
(
<
th
style
=
{{
...
style2
,
color
:
'#fff'
,
backgroundColor
:
'#1c71b8'
,
fontSize
:
13
,
fontWeight
:
1
,
width
:
150
,
borderRight
:
"1px solid rgb(255, 255, 255)"
,
padding
:
0
}}
>
<
th
style
=
{{
...
style2
,
color
:
'#fff'
,
backgroundColor
:
'#1c71b8'
,
fontSize
:
13
,
fontWeight
:
1
,
width
:
150
,
borderRight
:
"1px solid rgb(255, 255, 255)"
,
padding
:
0
}}
>
{
/* <TableCell style={{ ...style2, top: 0, zIndex: 99, backgroundColor: '#1c71b8', 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> */
}
<
div
style
=
{{
borderBottom
:
"1px #fff solid"
,
backgroundColor
:
'#1c71b8'
,
justifyContent
:
'center'
,
display
:
'flex'
,
alignItems
:
'center'
,
height
:
50
,
fontSize
:
12
,
fontWeight
:
'bold'
,
padding
:
5
}}
>
{
columnMeta
.
name
}
<
/div
>
<
div
style
=
{{
borderBottom
:
"1px #fff solid"
,
backgroundColor
:
'#1c71b8'
,
justifyContent
:
'center'
,
display
:
'flex'
,
alignItems
:
'center'
,
height
:
43
,
fontSize
:
12
,
fontWeight
:
'bold'
,
padding
:
5
}}
>
{
columnMeta
.
name
}
<
/div
>
<
div
className
=
"grid grid-3x"
style
=
{{
...
style2
,
color
:
'#fff'
,
fontSize
:
12
,
fontWeight
:
'bold'
,
position
:
"sticky"
}}
>
<
div
className
=
"grid grid-3x"
style
=
{{
...
style2
,
color
:
'#fff'
,
fontSize
:
12
,
fontWeight
:
'bold'
,
position
:
"sticky"
}}
>
<
div
className
=
"column-1"
style
=
{{
placeSelf
:
'center'
,
textAlign
:
'center'
,
padding
:
5
,
borderRight
:
"1px #fff solid"
,
backgroundColor
:
'#07a7d0'
}}
>
<
div
className
=
"column-1"
style
=
{{
placeSelf
:
'center'
,
textAlign
:
'center'
,
padding
:
5
,
borderRight
:
"1px #fff solid"
,
backgroundColor
:
'#07a7d0'
}}
>
<
span
>
{
"Master Budget (MB)"
}
<
/span
>
<
span
>
{
"Master Budget (MB)"
}
<
/span
>
<
/div
>
<
/div
>
<
div
className
=
"column-2"
style
=
{{
placeSelf
:
'center'
,
textAlign
:
'center'
,
padding
:
5
,
borderRight
:
"1px #fff solid"
,
backgroundColor
:
'#07a7d0'
}}
>
<
div
className
=
"column-2"
style
=
{{
placeSelf
:
'center'
,
textAlign
:
'center'
,
padding
:
5
,
borderRight
:
"1px #fff solid"
,
backgroundColor
:
'#07a7d0'
}}
>
<
span
>
{
"Rolling Budget (RB)"
}
<
/span
>
<
span
>
{
"Rolling Budget (RB)"
}
<
/span
>
<
/div
>
<
/div
>
<
div
className
=
"column-3"
style
=
{{
placeSelf
:
'center'
,
textAlign
:
'center'
,
padding
:
5
,
backgroundColor
:
'#37b5e6
'
}}
>
<
div
className
=
"column-3"
style
=
{{
placeSelf
:
'center'
,
textAlign
:
'center'
,
padding
:
5
,
backgroundColor
:
'#37b5e6'
,
height
:
'100%
'
}}
>
<
span
>
{
"Actual"
}
<
/span
>
<
span
>
{
"Actual"
}
<
/span
>
<
/div
>
<
/div
>
<
/div
>
<
/div
>
<
/th
>
<
/th
>
),
),
setCellProps
:
()
=>
({
style2
}),
setCellProps
:
()
=>
({
style
:
{
paddingLeft
:
0
,
paddingRight
:
0
}
}),
customBodyRender
:
(
val
,
tableMeta
,
updateValue
)
=>
{
customBodyRender
:
(
val
,
tableMeta
,
updateValue
)
=>
{
// console.log(tableMeta);
return
(
return
(
<
div
>
<
div
>
<
div
className
=
"grid grid-3x content-center"
>
<
div
className
=
"grid grid-3x content-center"
>
<
div
className
=
"col-1"
>
<
div
className
=
"col-1"
>
<
div
style
=
{{
textAlign
:
'right'
,
width
:
90
}}
>
<
div
style
=
{{
textAlign
:
'right'
,
width
:
90
}}
>
{
val
.
a
}
{
tableMeta
.
rowData
[
0
]
===
4
?
null
:
val
.
mb
}
<
/div
>
<
/div
>
<
/div
>
<
/div
>
<
div
className
=
"col-2"
>
<
div
className
=
"col-2"
>
<
div
style
=
{{
textAlign
:
'right'
,
width
:
90
}}
>
<
div
style
=
{{
textAlign
:
'right'
,
width
:
90
}}
>
{
val
.
b
}
{
tableMeta
.
rowData
[
0
]
===
4
?
null
:
val
.
rb
}
<
/div
>
<
/div
>
<
/div
>
<
/div
>
<
div
className
=
"col-3"
>
<
div
className
=
"col-3"
>
<
div
style
=
{{
textAlign
:
'right'
,
width
:
90
}}
>
<
div
style
=
{{
textAlign
:
'right'
,
width
:
90
}}
>
{
val
.
c
}
{
tableMeta
.
rowData
[
0
]
===
4
?
null
:
val
.
actual
}
<
/div
>
<
/div
>
<
/div
>
<
/div
>
<
/div
>
<
/div
>
...
@@ -140,7 +303,10 @@ export default class BalanceSheetMR extends Component {
...
@@ -140,7 +303,10 @@ export default class BalanceSheetMR extends Component {
customBodyRender
:
(
val
,
tableMeta
,
updateValue
)
=>
{
customBodyRender
:
(
val
,
tableMeta
,
updateValue
)
=>
{
return
(
return
(
<
div
style
=
{{
textAlign
:
'right'
,
width
:
90
}}
>
<
div
style
=
{{
textAlign
:
'right'
,
width
:
90
}}
>
{
val
}
{
tableMeta
.
rowData
[
0
]
===
4
?
null
:
val
}
<
/div
>
<
/div
>
)
)
}
}
...
@@ -151,7 +317,7 @@ export default class BalanceSheetMR extends Component {
...
@@ -151,7 +317,7 @@ export default class BalanceSheetMR extends Component {
options
:
{
options
:
{
customHeadRender
:
(
columnMeta
)
=>
(
customHeadRender
:
(
columnMeta
)
=>
(
<
th
style
=
{{
...
style2
,
backgroundColor
:
'#1c71b8'
,
color
:
'#fff'
,
fontSize
:
13
,
fontWeight
:
1
,
width
:
150
,
borderRight
:
"1px solid rgb(255, 255, 255)"
}}
>
<
th
style
=
{{
...
style2
,
backgroundColor
:
'#1c71b8'
,
color
:
'#fff'
,
fontSize
:
13
,
fontWeight
:
1
,
width
:
150
,
borderRight
:
"1px solid rgb(255, 255, 255)"
}}
>
<
div
style
=
{{
borderBottom
:
"1px #fff solid"
,
textAlign
:
'center'
,
fontSize
:
12
,
fontWeight
:
'bold'
,
padding
:
5
}}
>
{
columnMeta
.
name
}
<
/div
>
<
div
style
=
{{
borderBottom
:
"1px #fff solid"
,
justifyContent
:
'center'
,
display
:
'flex'
,
alignItems
:
'center'
,
fontSize
:
12
,
fontWeight
:
'bold'
,
padding
:
5
,
height
:
40
}}
>
{
columnMeta
.
name
}
<
/div
>
<
div
className
=
"grid grid-3x"
style
=
{{
...
style2
,
backgroundColor
:
'#1c71b8'
,
color
:
'#fff'
,
fontSize
:
12
,
fontWeight
:
'bold'
,
position
:
"sticky"
}}
>
<
div
className
=
"grid grid-3x"
style
=
{{
...
style2
,
backgroundColor
:
'#1c71b8'
,
color
:
'#fff'
,
fontSize
:
12
,
fontWeight
:
'bold'
,
position
:
"sticky"
}}
>
<
div
className
=
"column-1"
style
=
{{
placeSelf
:
'center'
,
textAlign
:
'center'
,
padding
:
5
,
border
:
'1px #fff solid'
,
backgroundColor
:
'#37b5e6'
}}
>
<
div
className
=
"column-1"
style
=
{{
placeSelf
:
'center'
,
textAlign
:
'center'
,
padding
:
5
,
border
:
'1px #fff solid'
,
backgroundColor
:
'#37b5e6'
}}
>
<
div
style
=
{{
borderBottom
:
'1px #fff solid'
,
backgroundColor
:
'#37b5e6'
}}
>
<
div
style
=
{{
borderBottom
:
'1px #fff solid'
,
backgroundColor
:
'#37b5e6'
}}
>
...
@@ -195,49 +361,72 @@ export default class BalanceSheetMR extends Component {
...
@@ -195,49 +361,72 @@ export default class BalanceSheetMR extends Component {
<
/div
>
<
/div
>
<
/th
>
<
/th
>
),
),
setCellProps
:
()
=>
({
style2
}),
setCellProps
:
()
=>
({
style
:
{
paddingLeft
:
0
,
paddingRight
:
0
}
}),
customBodyRender
:
(
val
,
tableMeta
,
updateValue
)
=>
{
customBodyRender
:
(
val
,
tableMeta
,
updateValue
)
=>
{
return
(
return
(
<
div
>
<
div
>
<
div
className
=
"grid grid-3x content-center"
>
<
div
className
=
"grid grid-3x content-center"
>
<
div
className
=
"col-1"
>
<
div
className
=
"col
umn
-1"
>
<
div
className
=
"grid grid-2x content-center"
>
<
div
className
=
"grid grid-2x content-center"
>
<
div
className
=
"col-1"
>
<
div
className
=
"col
umn
-1"
>
<
div
style
=
{{
textAlign
:
'right'
,
width
:
90
}}
>
<
div
style
=
{{
textAlign
:
'right'
,
width
:
90
}}
>
{
val
.
a
}
{
tableMeta
.
rowData
[
0
]
===
4
?
null
:
val
.
aavpm
}
<
/div
>
<
/div
>
<
/div
>
<
/div
>
<
div
className
=
"col-2"
>
<
div
className
=
"col
umn
-2"
>
<
div
style
=
{{
textAlign
:
'right'
,
width
:
90
}}
>
<
div
style
=
{{
textAlign
:
'right'
,
width
:
90
}}
>
{
val
.
b
}
{
tableMeta
.
rowData
[
0
]
===
4
?
null
:
val
.
pavpm
}
<
/div
>
<
/div
>
<
/div
>
<
/div
>
<
/div
>
<
/div
>
<
/div
>
<
/div
>
<
div
className
=
"col-2"
>
<
div
className
=
"col
umn
-2"
>
<
div
className
=
"grid grid-2x content-center"
>
<
div
className
=
"grid grid-2x content-center"
>
<
div
className
=
"col-1"
>
<
div
className
=
"col
umn
-1"
>
<
div
style
=
{{
textAlign
:
'right'
,
width
:
90
}}
>
<
div
style
=
{{
textAlign
:
'right'
,
width
:
90
}}
>
{
val
.
c
}
{
tableMeta
.
rowData
[
0
]
===
4
?
null
:
val
.
aavmb
}
<
/div
>
<
/div
>
<
/div
>
<
/div
>
<
div
className
=
"col-2"
>
<
div
className
=
"col
umn
-2"
>
<
div
style
=
{{
textAlign
:
'right'
,
width
:
90
}}
>
<
div
style
=
{{
textAlign
:
'right'
,
width
:
90
}}
>
{
val
.
d
}
{
tableMeta
.
rowData
[
0
]
===
4
?
null
:
val
.
pavmb
}
<
/div
>
<
/div
>
<
/div
>
<
/div
>
<
/div
>
<
/div
>
<
/div
>
<
/div
>
<
div
className
=
"col-3"
>
<
div
className
=
"col
umn
-3"
>
<
div
className
=
"grid grid-2x content-center"
>
<
div
className
=
"grid grid-2x content-center"
>
<
div
className
=
"col-1"
>
<
div
className
=
"col
umn
-1"
>
<
div
style
=
{{
textAlign
:
'right'
,
width
:
90
}}
>
<
div
style
=
{{
textAlign
:
'right'
,
width
:
90
}}
>
{
val
.
e
}
{
tableMeta
.
rowData
[
0
]
===
4
?
null
:
val
.
aavrb
}
<
/div
>
<
/div
>
<
/div
>
<
/div
>
<
div
className
=
"col-2"
>
<
div
className
=
"col
umn
-2"
>
<
div
style
=
{{
textAlign
:
'right'
,
width
:
90
}}
>
<
div
style
=
{{
textAlign
:
'right'
,
width
:
90
}}
>
{
val
.
f
}
{
tableMeta
.
rowData
[
0
]
===
4
?
null
:
val
.
pavrb
}
<
/div
>
<
/div
>
<
/div
>
<
/div
>
<
/div
>
<
/div
>
...
@@ -256,38 +445,52 @@ export default class BalanceSheetMR extends Component {
...
@@ -256,38 +445,52 @@ export default class BalanceSheetMR extends Component {
{
/* <TableCell style={{ ...style2, top: 0, zIndex: 99, backgroundColor: '#1c71b8', 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> */
}
<
div
style
=
{{
borderBottom
:
"1px #fff solid"
,
textAlign
:
'center'
,
fontSize
:
12
,
fontWeight
:
'bold'
,
padding
:
5
}}
>
{
columnMeta
.
name
}
<
/div
>
<
div
style
=
{{
borderBottom
:
"1px #fff solid"
,
justifyContent
:
'center'
,
display
:
'flex'
,
alignItems
:
'center'
,
fontSize
:
12
,
fontWeight
:
'bold'
,
padding
:
5
,
height
:
40
}}
>
{
columnMeta
.
name
}
<
/div
>
<
div
className
=
"grid grid-3x"
style
=
{{
...
style2
,
backgroundColor
:
'#1c71b8'
,
color
:
'#fff'
,
fontSize
:
12
,
fontWeight
:
'bold'
,
position
:
"sticky"
}}
>
<
div
className
=
"grid grid-3x"
style
=
{{
...
style2
,
backgroundColor
:
'#1c71b8'
,
color
:
'#fff'
,
fontSize
:
12
,
fontWeight
:
'bold'
,
position
:
"sticky"
}}
>
<
div
className
=
"column-1"
style
=
{{
placeSelf
:
'center'
,
textAlign
:
'center'
,
padding
:
5
,
borderRight
:
"1px #fff solid"
}}
>
<
div
className
=
"column-1"
style
=
{{
placeSelf
:
'center'
,
textAlign
:
'center'
,
padding
:
5
,
borderRight
:
"1px #fff solid"
,
justifyContent
:
'center'
,
display
:
'flex'
,
alignItems
:
'center'
,
height
:
45
}}
>
<
span
>
{
"vs Prev Month"
}
<
/span
>
<
span
>
{
"vs Prev Month"
}
<
/span
>
<
/div
>
<
/div
>
<
div
className
=
"column-2"
style
=
{{
placeSelf
:
'center'
,
textAlign
:
'center'
,
padding
:
5
,
borderRight
:
"1px #fff solid"
}}
>
<
div
className
=
"column-2"
style
=
{{
placeSelf
:
'center'
,
textAlign
:
'center'
,
padding
:
5
,
borderRight
:
"1px #fff solid"
,
justifyContent
:
'center'
,
display
:
'flex'
,
alignItems
:
'center'
,
height
:
45
}}
>
<
span
>
{
"vs MB"
}
<
/span
>
<
span
>
{
"vs MB"
}
<
/span
>
<
/div
>
<
/div
>
<
div
className
=
"column-3"
style
=
{{
placeSelf
:
'center'
,
textAlign
:
'center'
,
padding
:
5
}}
>
<
div
className
=
"column-3"
style
=
{{
placeSelf
:
'center'
,
textAlign
:
'center'
,
padding
:
5
,
justifyContent
:
'center'
,
display
:
'flex'
,
alignItems
:
'center'
,
height
:
45
}}
>
<
span
>
{
"vs RB"
}
<
/span
>
<
span
>
{
"vs RB"
}
<
/span
>
<
/div
>
<
/div
>
<
/div
>
<
/div
>
<
/th
>
<
/th
>
),
),
setCellProps
:
()
=>
({
style2
}),
setCellProps
:
()
=>
({
style
:
{
paddingLeft
:
0
,
paddingRight
:
0
}
}),
customBodyRender
:
(
val
,
tableMeta
,
updateValue
)
=>
{
customBodyRender
:
(
val
,
tableMeta
,
updateValue
)
=>
{
return
(
return
(
<
div
>
<
div
>
<
div
className
=
"grid grid-3x content-center"
>
<
div
className
=
"grid grid-3x content-center"
>
<
div
className
=
"col-1"
>
<
div
className
=
"col-1"
>
<
div
style
=
{{
textAlign
:
'right'
,
width
:
90
}}
>
<
div
style
=
{{
textAlign
:
'right'
,
width
:
90
}}
>
{
val
.
a
}
{
tableMeta
.
rowData
[
0
]
===
4
?
null
:
val
.
mtdvpm
}
<
/div
>
<
/div
>
<
/div
>
<
/div
>
<
div
className
=
"col-2"
>
<
div
className
=
"col-2"
>
<
div
style
=
{{
textAlign
:
'right'
,
width
:
90
}}
>
<
div
style
=
{{
textAlign
:
'right'
,
width
:
90
}}
>
{
val
.
b
}
{
tableMeta
.
rowData
[
0
]
===
4
?
null
:
val
.
mtdvmb
}
<
/div
>
<
/div
>
<
/div
>
<
/div
>
<
div
className
=
"col-3"
>
<
div
className
=
"col-3"
>
<
div
style
=
{{
textAlign
:
'right'
,
width
:
90
}}
>
<
div
style
=
{{
textAlign
:
'right'
,
width
:
90
}}
>
{
val
.
c
}
{
tableMeta
.
rowData
[
0
]
===
4
?
null
:
val
.
mtdvrb
}
<
/div
>
<
/div
>
<
/div
>
<
/div
>
<
/div
>
<
/div
>
...
@@ -297,10 +500,7 @@ export default class BalanceSheetMR extends Component {
...
@@ -297,10 +500,7 @@ export default class BalanceSheetMR extends Component {
}
}
},
},
]
]
let
data
=
[
[
"Total Assets"
,
"1"
,
{
a
:
"2"
,
b
:
"3"
,
c
:
"4"
},
"5"
,
{
a
:
"6"
,
b
:
"7"
,
c
:
"8"
,
d
:
"9"
,
e
:
"10"
,
f
:
"11"
},
{
a
:
"12"
,
b
:
"13"
,
c
:
"14"
}],
[
"Total Assets"
,
"1"
,
"2"
,
"3"
,
"4"
,
"5"
,
"6"
,
"7"
,
"8"
,
"9"
,
"10"
,
"11"
]
]
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
}}
>
...
@@ -367,13 +567,15 @@ export default class BalanceSheetMR extends Component {
...
@@ -367,13 +567,15 @@ export default class BalanceSheetMR extends Component {
<
/div
>
<
/div
>
<
div
style
=
{{
marginTop
:
20
,
width
:
this
.
props
.
width
-
(
this
.
props
.
open
===
true
?
400
:
150
)
}}
>
<
div
style
=
{{
marginTop
:
20
,
width
:
this
.
props
.
width
-
(
this
.
props
.
open
===
true
?
400
:
150
)
}}
>
<
MuiThemeProvider
theme
=
{
getMuiTheme
()}
>
{
!
this
.
state
.
loading
&&
(
<
MUIDataTable
<
MuiThemeProvider
theme
=
{
getMuiTheme
()}
>
data
=
{
data
}
<
MUIDataTable
columns
=
{
columns
}
data
=
{
this
.
state
.
dataTable
}
options
=
{
options
}
columns
=
{
columns
}
/
>
options
=
{
options
}
<
/MuiThemeProvider
>
/
>
<
/MuiThemeProvider
>
)}
<
/div
>
<
/div
>
<
/div
>
<
/div
>
<
/Paper
>
<
/Paper
>
...
...
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment