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
5675f958
Commit
5675f958
authored
Nov 12, 2020
by
Riri Novita
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
CPSM
parent
67c8b0e0
Changes
2
Show whitespace changes
Inline
Side-by-side
Showing
2 changed files
with
364 additions
and
4 deletions
+364
-4
SummaryOfTriputra.js
src/container/SummaryTriputra/SummaryOfTriputra.js
+40
-4
TableSummaryTriputra.js
src/container/SummaryTriputra/TableSummaryTriputra.js
+324
-0
No files found.
src/container/SummaryTriputra/SummaryOfTriputra.js
View file @
5675f958
...
...
@@ -4,7 +4,7 @@ import Constant from '../../library/Constant'
import
api
from
'../../api'
import
{
titleCase
}
from
'../../library/Utils'
import
{
Autocomplete
}
from
'@material-ui/lab'
// import TableSubHolding from './TableSubHolding
'
import
TableSummaryTriputra
from
'./TableSummaryTriputra
'
import
{
PropagateLoader
}
from
'react-spinners'
import
ReactTooltip
from
'react-tooltip'
import
Images
from
'../../assets/Images'
...
...
@@ -162,6 +162,42 @@ export default class SummaryOfTriputra extends Component {
})
}
getReportType
()
{
let
payload
=
{
"company_id"
:
this
.
state
.
company
.
company_id
,
"periode"
:
this
.
state
.
periode
.
periode
,
"report_type"
:
"Master Budget"
,
}
api
.
create
().
getReportTypeBody
(
payload
).
then
(
response
=>
{
console
.
log
(
response
);
if
(
response
.
data
)
{
if
(
response
.
data
.
status
===
"success"
)
{
if
(
this
.
state
.
report
.
value
===
1
)
{
response
.
data
.
data
.
map
((
item
,
index
)
=>
{
if
(
item
.
report_name
===
'MTD Report'
)
{
this
.
setState
({
revisionType
:
item
.
revision
},
()
=>
{
this
.
getSubmission
()
})
}
})
}
else
if
(
this
.
state
.
report
.
value
===
1
)
{
response
.
data
.
data
.
map
((
item
,
index
)
=>
{
if
(
item
.
report_name
===
'YTD Report'
)
{
this
.
setState
({
revisionType
:
item
.
revision
},
()
=>
{
this
.
getSubmission
()
})
}
})
}
else
{
this
.
setState
({
revisionType
:
0
},
()
=>
{
this
.
getSubmission
()
})
}
}
}
})
}
getSubmission
()
{
this
.
setState
({
loading
:
true
})
let
payload
=
{
...
...
@@ -709,8 +745,8 @@ export default class SummaryOfTriputra extends Component {
)}
<
/div
>
{
this
.
state
.
loading
&&
loadingComponent
}
{
/* {
this.state.previewTable && (
<TableSu
bHolding
{
this
.
state
.
previewTable
&&
(
<
TableSu
mmaryTriputra
width
=
{
this
.
props
.
width
}
height
=
{
this
.
props
.
height
}
open
=
{
this
.
props
.
open
}
...
...
@@ -718,7 +754,7 @@ export default class SummaryOfTriputra extends Component {
dataTable
=
{
this
.
state
.
dataTable
}
periode
=
{
this
.
state
.
periode
?
this
.
state
.
periode
.
periode
:
null
}
/
>
)}
*/
}
)}
<
/div
>
<
/Paper
>
<
/div
>
...
...
src/container/SummaryTriputra/TableSummaryTriputra.js
0 → 100644
View file @
5675f958
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
());
const
options
=
ct
.
customOptionsFixedColumn
();
const
style
=
{
position
:
"sticky"
,
left
:
0
,
zIndex
:
101
,
background
:
"white"
,
};
const
style2
=
{
position
:
"sticky"
,
background
:
"white"
,
zIndex
:
100
};
export
default
class
TableSummaryTriputra
extends
Component
{
render
()
{
let
datas
=
[
[
"ABCD"
,
{
a
:
"2"
,
b
:
"3"
,
c
:
"4"
,
d
:
"5"
,
e
:
"6"
},
{
a
:
"2"
,
b
:
"3"
,
c
:
"4"
,
d
:
"5"
,
e
:
"6"
},
{
a
:
"2"
,
b
:
"3"
,
c
:
"4"
,
d
:
"5"
,
e
:
"6"
}],
[
"Total Assets"
,
{
a
:
"6"
,
b
:
"7"
,
c
:
"8"
,
d
:
"9"
,
e
:
"10"
},
{
a
:
"6"
,
b
:
"7"
,
c
:
"8"
,
d
:
"9"
,
e
:
"10"
},
{
a
:
"6"
,
b
:
"7"
,
c
:
"8"
,
d
:
"9"
,
e
:
"10"
}]
]
let
dataTable2
=
this
.
props
.
dataTable
const
columnMTD
=
[
{
name
:
""
,
options
:
{
display
:
false
}
}
]
const
columnYTD
=
[
{
name
:
""
,
options
:
{
display
:
false
}
}
]
const
columnHistorical
=
[
{
name
:
""
,
options
:
{
display
:
false
}
}
]
const
columnCPSM
=
[
{
name
:
"Company"
,
options
:
{
customHeadRender
:
(
columnMeta
)
=>
(
<
TableCell
key
=
{
columnMeta
.
index
}
style
=
{{
...
style
,
top
:
0
,
zIndex
:
102
,
backgroundColor
:
'#1c71b8'
,
width
:
300
,
borderRight
:
'1px #fff solid'
}}
>
<
Typography
style
=
{{
color
:
'white'
,
fontSize
:
12
,
fontWeight
:
'bold'
,
textAlign
:
'left'
}}
>
{
columnMeta
.
name
}
<
/Typography
>
<
/TableCell
>
),
setCellProps
:
()
=>
({
style
}),
customBodyRender
:
(
val
,
tableMeta
)
=>
{
return
(
<
div
style
=
{{
width
:
300
}}
>
{
val
}
<
/div
>
)
}
}
},
{
name
:
`Revenue`
,
options
:
{
customHeadRender
:
(
columnMeta
)
=>
(
<
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
className
=
"grid grid-2x"
style
=
{{
...
style2
,
backgroundColor
:
'#1c71b8'
,
color
:
'#fff'
,
fontSize
:
12
,
fontWeight
:
'bold'
,
position
:
"sticky"
}}
>
<
div
className
=
"column-1 grid grid-3x"
style
=
{{
placeSelf
:
'center'
,
textAlign
:
'center'
}}
>
<
div
className
=
"column-1"
style
=
{{
placeSelf
:
'center'
,
textAlign
:
'center'
,
padding
:
5
,
borderRight
:
"1px #fff solid"
,
backgroundColor
:
'#07a7d0'
}}
>
<
span
>
{
"2020"
}
<
/span
>
<
/div
>
<
div
className
=
"column-2"
style
=
{{
placeSelf
:
'center'
,
textAlign
:
'center'
,
padding
:
5
,
borderRight
:
"1px #fff solid"
,
backgroundColor
:
'#37b5e6'
}}
>
<
span
>
{
"OL 2021"
}
<
/span
>
<
/div
>
<
div
className
=
"column-3"
style
=
{{
placeSelf
:
'center'
,
textAlign
:
'center'
,
padding
:
5
,
borderRight
:
"1px #fff solid"
,
backgroundColor
:
'#37b5e6'
}}
>
<
span
>
{
"MB 2021"
}
<
/span
>
<
/div
>
<
/div
>
<
div
className
=
"column-2 grid grid-3x"
style
=
{{
placeSelf
:
'center'
,
textAlign
:
'center'
}}
>
<
div
className
=
"column-1"
style
=
{{
placeSelf
:
'center'
,
textAlign
:
'center'
,
padding
:
5
,
borderRight
:
"1px #fff solid"
,
backgroundColor
:
'#37b5e6'
}}
>
<
span
>
{
"% of MB"
}
<
/span
>
<
/div
>
<
div
className
=
"column-2"
style
=
{{
placeSelf
:
'center'
,
textAlign
:
'center'
,
padding
:
5
,
borderRight
:
"1px #fff solid"
,
backgroundColor
:
'#1c71b8'
}}
>
<
span
>
{
"2022"
}
<
/span
>
<
/div
>
<
div
className
=
"column-3"
style
=
{{
placeSelf
:
'center'
,
textAlign
:
'center'
,
padding
:
5
,
borderRight
:
"1px #fff solid"
,
backgroundColor
:
'#1c71b8'
}}
>
<
span
>
{
"2023"
}
<
/span
>
<
/div
>
<
/div
>
<
/div
>
<
/th
>
),
setCellProps
:
()
=>
({
style2
}),
customBodyRender
:
(
val
,
tableMeta
,
updateValue
)
=>
{
return
(
<
div
>
<
div
className
=
"grid grid-2x content-center"
>
<
div
className
=
"grid grid-3x content-center"
>
<
div
className
=
"col-1"
>
<
div
style
=
{{
textAlign
:
'right'
,
width
:
90
}}
>
{
val
.
a
}
<
/div
>
<
/div
>
<
div
className
=
"col-2"
>
<
div
style
=
{{
textAlign
:
'right'
,
width
:
90
}}
>
{
val
.
b
}
<
/div
>
<
/div
>
<
div
className
=
"col-3"
>
<
div
style
=
{{
textAlign
:
'right'
,
width
:
90
}}
>
{
val
.
c
}
<
/div
>
<
/div
>
<
/div
>
<
div
className
=
"grid grid-3x content-center"
>
<
div
className
=
"col-1"
>
<
div
style
=
{{
textAlign
:
'right'
,
width
:
90
}}
>
{
val
.
a
}
<
/div
>
<
/div
>
<
div
className
=
"col-2"
>
<
div
style
=
{{
textAlign
:
'right'
,
width
:
90
}}
>
{
val
.
b
}
<
/div
>
<
/div
>
<
div
className
=
"col-3"
>
<
div
style
=
{{
textAlign
:
'right'
,
width
:
90
}}
>
{
val
.
c
}
<
/div
>
<
/div
>
<
/div
>
<
/div
>
<
/div
>
)
}
}
},
{
name
:
`EBITDA`
,
options
:
{
customHeadRender
:
(
columnMeta
)
=>
(
<
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
className
=
"grid grid-2x"
style
=
{{
...
style2
,
backgroundColor
:
'#1c71b8'
,
color
:
'#fff'
,
fontSize
:
12
,
fontWeight
:
'bold'
,
position
:
"sticky"
}}
>
<
div
className
=
"column-1 grid grid-3x"
style
=
{{
placeSelf
:
'center'
,
textAlign
:
'center'
}}
>
<
div
className
=
"column-1"
style
=
{{
placeSelf
:
'center'
,
textAlign
:
'center'
,
padding
:
5
,
borderRight
:
"1px #fff solid"
,
backgroundColor
:
'#07a7d0'
}}
>
<
span
>
{
"2020"
}
<
/span
>
<
/div
>
<
div
className
=
"column-2"
style
=
{{
placeSelf
:
'center'
,
textAlign
:
'center'
,
padding
:
5
,
borderRight
:
"1px #fff solid"
,
backgroundColor
:
'#37b5e6'
}}
>
<
span
>
{
"OL 2021"
}
<
/span
>
<
/div
>
<
div
className
=
"column-3"
style
=
{{
placeSelf
:
'center'
,
textAlign
:
'center'
,
padding
:
5
,
borderRight
:
"1px #fff solid"
,
backgroundColor
:
'#37b5e6'
}}
>
<
span
>
{
"MB 2021"
}
<
/span
>
<
/div
>
<
/div
>
<
div
className
=
"column-2 grid grid-3x"
style
=
{{
placeSelf
:
'center'
,
textAlign
:
'center'
}}
>
<
div
className
=
"column-1"
style
=
{{
placeSelf
:
'center'
,
textAlign
:
'center'
,
padding
:
5
,
borderRight
:
"2px #fff solid"
,
backgroundColor
:
'#37b5e6'
}}
>
<
span
>
{
"% of MB"
}
<
/span
>
<
/div
>
<
div
className
=
"column-2"
style
=
{{
placeSelf
:
'center'
,
textAlign
:
'center'
,
padding
:
5
,
borderRight
:
"1px #fff solid"
,
backgroundColor
:
'#1c71b8'
}}
>
<
span
>
{
"2022"
}
<
/span
>
<
/div
>
<
div
className
=
"column-3"
style
=
{{
placeSelf
:
'center'
,
textAlign
:
'center'
,
padding
:
5
,
borderRight
:
"1px #fff solid"
,
backgroundColor
:
'#1c71b8'
}}
>
<
span
>
{
"2023"
}
<
/span
>
<
/div
>
<
/div
>
<
/div
>
<
/th
>
),
setCellProps
:
()
=>
({
style2
}),
customBodyRender
:
(
val
,
tableMeta
,
updateValue
)
=>
{
return
(
<
div
>
<
div
className
=
"grid grid-2x content-center"
>
<
div
className
=
"grid grid-3x content-center"
>
<
div
className
=
"col-1"
>
<
div
style
=
{{
textAlign
:
'right'
,
width
:
90
}}
>
{
val
.
a
}
<
/div
>
<
/div
>
<
div
className
=
"col-2"
>
<
div
style
=
{{
textAlign
:
'right'
,
width
:
90
}}
>
{
val
.
b
}
<
/div
>
<
/div
>
<
div
className
=
"col-3"
>
<
div
style
=
{{
textAlign
:
'right'
,
width
:
90
}}
>
{
val
.
c
}
<
/div
>
<
/div
>
<
/div
>
<
div
className
=
"grid grid-3x content-center"
>
<
div
className
=
"col-1"
>
<
div
style
=
{{
textAlign
:
'right'
,
width
:
90
}}
>
{
val
.
a
}
<
/div
>
<
/div
>
<
div
className
=
"col-2"
>
<
div
style
=
{{
textAlign
:
'right'
,
width
:
90
}}
>
{
val
.
b
}
<
/div
>
<
/div
>
<
div
className
=
"col-3"
>
<
div
style
=
{{
textAlign
:
'right'
,
width
:
90
}}
>
{
val
.
c
}
<
/div
>
<
/div
>
<
/div
>
<
/div
>
<
/div
>
)
}
}
},
{
name
:
`NPAT`
,
options
:
{
customHeadRender
:
(
columnMeta
)
=>
(
<
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
className
=
"grid grid-2x"
style
=
{{
...
style2
,
backgroundColor
:
'#1c71b8'
,
color
:
'#fff'
,
fontSize
:
12
,
fontWeight
:
'bold'
,
position
:
"sticky"
}}
>
<
div
className
=
"column-1 grid grid-3x"
style
=
{{
placeSelf
:
'center'
,
textAlign
:
'center'
}}
>
<
div
className
=
"column-1"
style
=
{{
placeSelf
:
'center'
,
textAlign
:
'center'
,
padding
:
5
,
borderRight
:
"1px #fff solid"
,
backgroundColor
:
'#07a7d0'
}}
>
<
span
>
{
"2020"
}
<
/span
>
<
/div
>
<
div
className
=
"column-2"
style
=
{{
placeSelf
:
'center'
,
textAlign
:
'center'
,
padding
:
5
,
borderRight
:
"1px #fff solid"
,
backgroundColor
:
'#37b5e6'
}}
>
<
span
>
{
"OL 2021"
}
<
/span
>
<
/div
>
<
div
className
=
"column-3"
style
=
{{
placeSelf
:
'center'
,
textAlign
:
'center'
,
padding
:
5
,
borderRight
:
"1px #fff solid"
,
backgroundColor
:
'#37b5e6'
}}
>
<
span
>
{
"MB 2021"
}
<
/span
>
<
/div
>
<
/div
>
<
div
className
=
"column-2 grid grid-3x"
style
=
{{
placeSelf
:
'center'
,
textAlign
:
'center'
}}
>
<
div
className
=
"column-1"
style
=
{{
placeSelf
:
'center'
,
textAlign
:
'center'
,
padding
:
5
,
borderRight
:
"2px #fff solid"
,
backgroundColor
:
'#37b5e6'
}}
>
<
span
>
{
"% of MB"
}
<
/span
>
<
/div
>
<
div
className
=
"column-2"
style
=
{{
placeSelf
:
'center'
,
textAlign
:
'center'
,
padding
:
5
,
borderRight
:
"1px #fff solid"
,
backgroundColor
:
'#1c71b8'
}}
>
<
span
>
{
"2022"
}
<
/span
>
<
/div
>
<
div
className
=
"column-3"
style
=
{{
placeSelf
:
'center'
,
textAlign
:
'center'
,
padding
:
5
,
borderRight
:
"1px #fff solid"
,
backgroundColor
:
'#1c71b8'
}}
>
<
span
>
{
"2023"
}
<
/span
>
<
/div
>
<
/div
>
<
/div
>
<
/th
>
),
setCellProps
:
()
=>
({
style2
}),
customBodyRender
:
(
val
,
tableMeta
,
updateValue
)
=>
{
return
(
<
div
>
<
div
className
=
"grid grid-2x content-center"
>
<
div
className
=
"grid grid-3x content-center"
>
<
div
className
=
"col-1"
>
<
div
style
=
{{
textAlign
:
'right'
,
width
:
90
}}
>
{
val
.
a
}
<
/div
>
<
/div
>
<
div
className
=
"col-2"
>
<
div
style
=
{{
textAlign
:
'right'
,
width
:
90
}}
>
{
val
.
b
}
<
/div
>
<
/div
>
<
div
className
=
"col-3"
>
<
div
style
=
{{
textAlign
:
'right'
,
width
:
90
}}
>
{
val
.
c
}
<
/div
>
<
/div
>
<
/div
>
<
div
className
=
"grid grid-3x content-center"
>
<
div
className
=
"col-1"
>
<
div
style
=
{{
textAlign
:
'right'
,
width
:
90
}}
>
{
val
.
a
}
<
/div
>
<
/div
>
<
div
className
=
"col-2"
>
<
div
style
=
{{
textAlign
:
'right'
,
width
:
90
}}
>
{
val
.
b
}
<
/div
>
<
/div
>
<
div
className
=
"col-3"
>
<
div
style
=
{{
textAlign
:
'right'
,
width
:
90
}}
>
{
val
.
c
}
<
/div
>
<
/div
>
<
/div
>
<
/div
>
<
/div
>
)
}
}
},
]
const
columns
=
[]
return
(
<
div
>
<
div
style
=
{{
padding
:
'0px 20px 20px 20px'
,
width
:
this
.
props
.
width
-
(
this
.
props
.
open
===
true
?
350
:
100
)
}}
>
<
MuiThemeProvider
theme
=
{
getMuiTheme
()}
>
<
MUIDataTable
data
=
{
datas
}
columns
=
{
this
.
props
.
type
===
2
?
columnYTD
:
this
.
props
.
type
===
1
?
columnMTD
:
this
.
props
.
type
===
3
?
columnCPSM
:
this
.
props
.
type
===
4
?
columnHistorical
:
columns
}
options
=
{
options
}
/
>
<
/MuiThemeProvider
>
<
/div
>
<
/div
>
)
}
}
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