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
f41f2e9d
Commit
f41f2e9d
authored
Jun 15, 2021
by
Faisal Hamdi
Browse files
Options
Browse Files
Download
Plain Diff
Merge branch 'faisal' into 'master'
progressreport! See merge request
!1511
parents
26ad7bc8
fab173af
Changes
4
Hide whitespace changes
Inline
Side-by-side
Showing
4 changed files
with
377 additions
and
15 deletions
+377
-15
Home.js
src/container/Home.js
+2
-2
ProgressReport.js
src/container/Progress/ProgressReport.js
+19
-12
TableProgressReport.js
src/container/Progress/TableProgressReport.js
+355
-0
homeRoutes.js
src/router/homeRoutes.js
+1
-1
No files found.
src/container/Home.js
View file @
f41f2e9d
...
...
@@ -567,7 +567,7 @@ export default function MiniDrawer() {
}
<
/div
>
))}
<
Link
to
=
{
`
${
url
}
/progress-reports`
}
>
{
/*
<Link to={`${url}/progress-reports`}>
<div style={{ paddingLeft: 5 }} className={selectedIndex === 'progress-reports' ? "active" : ""}>
<a data-tip={'progress-reports'} data-for={'progress-reports'}>
<ListItem button key={'progress-reports'} onClick={() => selectIndex('progress-reports')}>
...
...
@@ -577,7 +577,7 @@ export default function MiniDrawer() {
</a>
{!open && (<ReactTooltip border={true} id={'Progress Report'} place="bottom" type="light" effect="solid" />)}
</div>
<
/Link
>
</Link>
*/
}
<
/List
>
{
open
&&
setting
.
length
>
0
&&
<
div
style
=
{{
marginLeft
:
20
}}
>
...
...
src/container/ProgressReport.js
→
src/container/Progress
/Progress
Report.js
View file @
f41f2e9d
import
React
,
{
Component
}
from
'react'
;
import
{
Typography
,
MuiThemeProvider
,
createMuiTheme
,
Paper
,
TextField
}
from
'@material-ui/core'
;
import
MUIDataTable
from
"mui-datatables"
;
import
Images
from
'../assets/Images'
;
import
Images
from
'../
../
assets/Images'
;
import
DonutChart
from
'react-d3-donut'
;
import
Constant
from
'../library/Constant'
;
import
api
from
'../api'
;
import
Constant
from
'../
../
library/Constant'
;
import
api
from
'../
../
api'
;
import
{
Link
}
from
'react-router-dom'
;
import
{
PropagateLoader
}
from
'react-spinners'
;
import
{
titleCase
}
from
'../library/Utils'
;
import
{
titleCase
}
from
'../
../
library/Utils'
;
import
{
format
}
from
'date-fns'
;
import
Autocomplete
from
'@material-ui/lab/Autocomplete'
;
import
ReactSpeedometer
from
'react-d3-speedometer'
;
import
TableProgressReport
from
'./TableProgressReport'
var
ct
=
require
(
"../library/CustomTable"
);
var
ct
=
require
(
"../
../
library/CustomTable"
);
const
getMuiTheme
=
()
=>
createMuiTheme
(
ct
.
customTable
());
class
ReportProgress
extends
Component
{
...
...
@@ -156,6 +157,12 @@ class ReportProgress extends Component {
}
render
()
{
const
dataTable
=
[
[
'Tax Planning'
,
'2'
,
'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
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
...
...
@@ -166,6 +173,7 @@ class ReportProgress extends Component {
/
>
<
/div
>
);
return
(
<
div
style
=
{{
flex
:
1
,
backgroundColor
:
'#f8f8f8'
,
minHeight
:
this
.
props
.
height
}}
>
<
div
>
...
...
@@ -274,21 +282,20 @@ class ReportProgress extends Component {
)}
</div> */
}
{
this
.
state
.
loading
&&
loadingComponent
}
{
/* {this.state.previewTable && (
<Table
SubHolding
{
/* {this.state.previewTable && (
*/
}
<
Table
ProgressReport
width
=
{
this
.
props
.
width
}
height
=
{
this
.
props
.
height
}
open
=
{
this
.
props
.
open
}
month={this.state.month.month_value}
approvedMB={this.state.approveMB}
approveMonthly={this.state.approveMonthly}
// month={this.state.month.month_value}
type
=
{
this
.
state
.
report
?
this
.
state
.
report
.
value
:
1
}
dataTable={this.state.dataTable}
dataTable
=
{
dataTable
}
// dataTable={this.state.dataTable}
periode
=
{
this
.
state
.
periode
?
this
.
state
.
periode
.
periode
:
null
}
quarter
=
{
this
.
state
.
quarter
.
name
}
company
=
{
this
.
state
.
company
}
/
>
)} */
}
{
/*
)} */
}
<
/div
>
<
/Paper
>
<
/div
>
...
...
src/container/Progress/TableProgressReport.js
0 → 100644
View file @
f41f2e9d
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
TableProgressReport
extends
Component
{
render
()
{
let
dataTable2
=
this
.
props
.
dataTable2
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
>
),
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>
// :
// <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'
}}
>
<
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'
}}
>
{
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
>
),
setCellProps
:
()
=>
({
style2
}),
customBodyRender
:
(
value
,
tableMeta
,
updateValue
)
=>
{
return
(
<
div
style
=
{{
width
:
90
,
textAlign
:
'center'
}}
>
{
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
>
),
customBodyRender
:
(
val
,
tableMeta
)
=>
{
return
(
<
div
style
=
{{
textAlign
:
'center'
,
width
:
60
}}
>
{
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
>
),
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
>
:
<
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
>
),
setCellProps
:
()
=>
({
style2
}),
customBodyRender
:
(
value
,
tableMeta
,
updateValue
)
=>
{
return
(
<
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'
}}
type
=
"text"
placeholder
=
""
suffix
=
{
"%"
}
value
=
{
Number
(
value
).
toFixed
(
1
)}
disabled
=
{
true
}
// disabled={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') ? false : true)}
decimalScale
=
{
1
}
/
>
}
/
>
}
<
/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
>
),
setCellProps
:
()
=>
({
style2
}),
customBodyRender
:
(
value
,
tableMeta
,
updateValue
)
=>
{
return
(
<
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
>
),
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
>
)
}
}
},
{
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
>
),
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
>
)
}
}
},
{
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
>
),
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
>
)
}
}
},
{
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
>
),
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
>
)
}
}
},
{
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
>
),
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
>
)
}
}
},
{
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
>
),
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
>
)
}
}
},
{
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
>
),
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
>
)
}
}
},{
name
:
""
,
options
:
{
display
:
false
}
}]
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
=
{
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}
options
=
{
options
}
/
>
<
/MuiThemeProvider
>
<
/div
>
<
/div
>
)
}
}
src/router/homeRoutes.js
View file @
f41f2e9d
...
...
@@ -20,7 +20,7 @@ import OutlookPA from '../container/OutlookPA';
import
SubHolding
from
'../container/Laporan/SubHolding'
;
import
SummaryTriputra
from
'../container/SummaryTriputra/SummaryOfTriputra'
;
import
MasterDataCAT
from
'../container/MasterData/MasterDataCAT/MasterDataCAT'
import
ProgressReport
from
'../container/ProgressReport'
import
ProgressReport
from
'../container/Progress
/Progress
Report'
const
routes
=
[
{
...
...
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