Skip to content

T
Tia-dev
Commit 21a26477 authored by Rifka Kurnia's avatar Rifka Kurnia
Browse files
Options

Merge branch 'rifka' into 'master' 

Rifka

See merge request !976
parents c2053f47 9f25c4f9
Hide whitespace changes
Inline Side-by-side
Showing with 167 additions and 63 deletions
src/container/HomePage.js
View file @ 21a26477
...@@ -26,6 +26,7 @@ class HomePage extends Component { ...@@ -26,6 +26,7 @@ class HomePage extends Component {
], ],
isApprover: true, isApprover: true,
listSubcoMB: [], listSubcoMB: [],
listSubcoMR: [],
valueSubmit: 0, valueSubmit: 0,
listdmb: [], listdmb: [],
dataTableMB: [], dataTableMB: [],
...@@ -69,22 +70,37 @@ class HomePage extends Component { ...@@ -69,22 +70,37 @@ class HomePage extends Component {
getListUserSubco() { getListUserSubco() {
api.create().getDashboardUser().then(response => { api.create().getDashboardUser().then(response => {
// console.log(response); console.log(response);
let valueSubmit = 0 let valueSubmit = 0
let valueSubmitMR = 0
let dataMB = []
let dataMR = []
if (response.data) { if (response.data) {
if (response.data.status === "success") { if (response.data.status === "success") {
response.data.data.map((item, index) => { response.data.data.map((item, index) => {
if (item.is_submit === true) { if (item.is_submit === true && item.type === "master_budget") {
valueSubmit += 1 valueSubmit += 1
} else if (item.is_submit === true && item.type === "monthly_report") {
valueSubmitMR += 1
}
if ( item.type === "master_budget" ) {
dataMB.push(item)
} else {
dataMR.push(item)
} }
}) })
this.setState({ this.setState({
listSubcoMB: response.data.data, listSubcoMB: dataMB,
listSubcoMR: dataMR,
valueSubmit, valueSubmit,
valueSubmitMR,
loading: false loading: false
}) })
} }
} }
console.log(this.state.listSubcoMB)
console.log(this.state.listSubcoMR)
}) })
} }
...@@ -92,13 +108,25 @@ class HomePage extends Component { ...@@ -92,13 +108,25 @@ class HomePage extends Component {
let listDashboard = [] let listDashboard = []
let rawData = [] let rawData = []
api.create().getDashboard().then((response) => { api.create().getDashboard().then((response) => {
// console.log(response); console.log(response);
if (String(response.data.status).toLocaleLowerCase() == 'success') { if (String(response.data.status).toLocaleLowerCase() == 'success') {
let data = response.data.data let data = response.data.data
data.map((item, index) => { data.map((item, index) => {
let statusConvert = item.status == 'approval_review'? 'Waiting For Review' : item.status == 'approval_proccess'? 'Waiting For Approval' : titleCase(item.status) let statusConvert = item.status == 'approval_review'? 'Waiting For Review' : item.status == 'approval_proccess'? 'Waiting For Approval' : titleCase(item.status)
listDashboard.push([index + 1, item.approval_id, item.company_name, `${item.type_report} - ${item.periode}`, item.revision, item.status, statusConvert]) if (this.state.isApproverMB && this.state.isApproverMR){
rawData.push(item) listDashboard.push([index + 1, item.approval_id, item.company_name, `${item.type_report} - ${item.periode}`, item.revision, item.status, statusConvert])
rawData.push(item)
} else if (this.state.isApproverMB) {
if (String(item.type_report).toLocaleLowerCase().includes("master")){
listDashboard.push([index + 1, item.approval_id, item.company_name, `${item.type_report} - ${item.periode}`, item.revision, item.status, statusConvert])
rawData.push(item)
}
} else if (this.state.isApproverMR) {
if (String(item.type_report).toLocaleLowerCase().includes("monthly")){
listDashboard.push([index + 1, item.approval_id, item.company_name, `${item.type_report} - ${item.periode}`, item.revision, item.status, statusConvert])
rawData.push(item)
}
}
}) })
this.setState({ listDashboard, rawData }) this.setState({ listDashboard, rawData })
} }
...@@ -107,6 +135,10 @@ class HomePage extends Component { ...@@ -107,6 +135,10 @@ class HomePage extends Component {
getApprMat() { getApprMat() {
this.setState({loading: true}) this.setState({loading: true})
let isApproverMR = false
let isApproverMB = false
// let isApproverMRTabel = false
// let isApproverMBTabel = false
api.create().getAM().then((response) => { api.create().getAM().then((response) => {
console.log(response); console.log(response);
let actAMActive = [] let actAMActive = []
...@@ -117,11 +149,35 @@ class HomePage extends Component { ...@@ -117,11 +149,35 @@ class HomePage extends Component {
} }
}) })
let userId = localStorage.getItem(Constant.USER) let userId = localStorage.getItem(Constant.USER)
console.log(userId);
let indexId = actAMActive.findIndex((val) => val.user_id == userId) let indexId = actAMActive.findIndex((val) => val.user_id == userId)
actAMActive.map((item, index) => {
if (item.approval_type_name === "MONTHLY_REPORT"){
isApproverMR = true
} else if (item.approval_type_name === "MASTER_BUDGET"){
isApproverMB = true
}
})
if (indexId === -1) { if (indexId === -1) {
this.setState({ isApprover: false }) this.setState({ isApprover: false })
this.getListUserSubco() this.getListUserSubco()
} }
// else if (isApproverMR){
// if (isApproverMBTabel === false){
// this.setState({ isApproverMRTabel: true, isApproverMBList: true })
// } else {
// this.setState({ isApproverMRTabel: true })
// }
// }
// else if (isApproverMB){
// if (isApproverMRTabel === false){
// this.setState({ isApproverMBTabel: true, isApproverMRList: true })
// } else {
// this.setState({ isApproverMBTabel: true })
// }
// }
this.setState({ isApproverMB, isApproverMR})
this.getDashboardMB() this.getDashboardMB()
// console.log(actAM) // console.log(actAM)
this.setState({loading: false}) this.setState({loading: false})
...@@ -130,7 +186,7 @@ class HomePage extends Component { ...@@ -130,7 +186,7 @@ class HomePage extends Component {
getDashboardMB() { getDashboardMB() {
api.create().getDashboardMB().then((response) => { api.create().getDashboardMB().then((response) => {
// console.log(response) console.log(response)
if (String(response.data.status).toLocaleLowerCase() == 'success') { if (String(response.data.status).toLocaleLowerCase() == 'success') {
let data = response.data.data let data = response.data.data
let listdmb = data.sort((a, b) => a.company_id - b.company_id).map((item, index) => { let listdmb = data.sort((a, b) => a.company_id - b.company_id).map((item, index) => {
...@@ -156,11 +212,11 @@ class HomePage extends Component { ...@@ -156,11 +212,11 @@ class HomePage extends Component {
name: "Action", name: "Action",
options: { options: {
customBodyRender: (val, tableMeta) => { customBodyRender: (val, tableMeta) => {
// console.log(tableMeta); console.log(tableMeta);
return ( return (
<div style={{ display: 'flex' }}> <div style={{ display: 'flex' }}>
<Link to={{ <Link to={{
pathname: `/home/master-budget/`, pathname: this.state.isApproverMB ? `/home/master-budget/` : `/home/monthly-report/`,
state: { state: {
userType: 'approver', userType: 'approver',
rawData: this.state.rawData[tableMeta.rowIndex] rawData: this.state.rawData[tableMeta.rowIndex]
...@@ -241,6 +297,9 @@ class HomePage extends Component { ...@@ -241,6 +297,9 @@ class HomePage extends Component {
/> />
</div> </div>
); );
let bulan = new Date().toLocaleString('default', { month: 'long'})
let tahun = new Date().getFullYear()
return ( return (
<div style={{ flex: 1, backgroundColor: '#f8f8f8', minHeight: this.props.height }}> <div style={{ flex: 1, backgroundColor: '#f8f8f8', minHeight: this.props.height }}>
{this.state.loading && loadingComponent} {this.state.loading && loadingComponent}
...@@ -249,33 +308,36 @@ class HomePage extends Component { ...@@ -249,33 +308,36 @@ class HomePage extends Component {
<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: '24px', color: 'white' }}>{this.state.userData === null ? '' : `Welcome, ${this.state.userData.fullname} !`}</Typography> <Typography style={{ fontSize: '24px', color: 'white' }}>{this.state.userData === null ? '' : `Welcome, ${this.state.userData.fullname} !`}</Typography>
</div> </div>
<div style={{ flex: 1, padding: 20, width: '100%' }}> <div>
<div style={{ display: 'flex' }}> <div style={{ flex: 1, padding: 20, width: '100%' }}>
<Typography style={{ color: '#656565', fontSize: '16px', fontWeight: 'bold' }}>Waiting Your Approval</Typography> <div style={{ display: 'flex' }}>
</div> <Typography style={{ color: '#656565', fontSize: '16px', fontWeight: 'bold' }}>Waiting Your Approval</Typography>
</div>
</div>
<div style={{ flex: 1, padding: 20, width: '100%' }}>
<div>
<MuiThemeProvider theme={getMuiTheme()}>
<MUIDataTable
data={this.state.listDashboard}
columns={columns}
options={options}
/>
</MuiThemeProvider>
</div> </div>
<div style={{ marginTop: 20 }}>
<Typography style={{ color: '#656565', fontSize: '16px', fontWeight: 'bold' }}>Master Budget & CAT</Typography> <div style={{ flex: 1, padding: 20, width: '100%' }}>
<div style={{ marginTop: 10, width: '100%' }}> <div>
<MuiThemeProvider theme={getMuiTheme()}> <MuiThemeProvider theme={getMuiTheme()}>
<MUIDataTable <MUIDataTable
data={this.state.dataTableMB} data={this.state.listDashboard}
columns={columnsMB} columns={columns}
options={options} options={options}
/> />
</MuiThemeProvider> </MuiThemeProvider>
</div> </div>
<div style={{ marginTop: 20 }}>
<Typography style={{ color: '#656565', fontSize: '16px', fontWeight: 'bold' }}>Master Budget & CAT</Typography>
<div style={{ marginTop: 10, width: '100%' }}>
<MuiThemeProvider theme={getMuiTheme()}>
<MUIDataTable
data={this.state.dataTableMB}
columns={columnsMB}
options={options}
/>
</MuiThemeProvider>
</div>
</div>
</div> </div>
{/* <div style={{ marginTop: 20 }}> {/* <div style={{ marginTop: 20 }}>
<Typography style={{ color: '#656565', fontSize: '16px', fontWeight: 'bold' }}>Status Laporan</Typography> <Typography style={{ color: '#656565', fontSize: '16px', fontWeight: 'bold' }}>Status Laporan</Typography>
...@@ -417,42 +479,84 @@ class HomePage extends Component { ...@@ -417,42 +479,84 @@ class HomePage extends Component {
<Typography style={{ color: '#656565', fontSize: '16px', fontWeight: 'bold' }}>Tasks to be Complete</Typography> <Typography style={{ color: '#656565', fontSize: '16px', fontWeight: 'bold' }}>Tasks to be Complete</Typography>
</div> </div>
</div> </div>
<div style={{ flex: 1, padding: 20, width: '100%' }}> <div style={{ display: 'inline-flex' }}>
<Paper style={{ width: 450, padding: 20, borderRadius: 10 }}> <div style={{ flex: 1, padding: 20, width: '100%' }}>
<Typography style={{ fontWeight: 'bold', textDecorationLine: 'underline' }}>{`Master Budget ${this.state.valueSubmit}/${this.state.listSubcoMB.length}`}</Typography> <Paper style={{ width: 450, padding: 20, borderRadius: 10 }}>
{this.state.listSubcoMB.map((item, index) => { <Typography style={{ fontWeight: 'bold', textDecorationLine: 'underline' }}>{`Master Budget ${this.state.valueSubmit}/${this.state.listSubcoMB.length}`}</Typography>
return ( {this.state.listSubcoMB.map((item, index) => {
<div style={{ display: 'flex', justifyContent: 'space-between', marginTop: 10, paddingLeft: 10 }}> return (
<div style={{ display: 'flex' }}> <div style={{ display: 'flex', justifyContent: 'space-between', marginTop: 10, paddingLeft: 10 }}>
<img src={item.is_submit === true ? Images.dotDone : item.is_overdue === true ? Images.dotOverdue : Images.dotOpen} /> <div style={{ display: 'flex' }}>
<Link to={{ <img src={item.is_submit === true ? Images.dotDone : item.is_overdue === true ? Images.dotOverdue : Images.dotOpen} />
pathname: `/home/master-budget/`, <Link to={{
state: { pathname: `/home/master-budget/`,
userType: 'user', state: {
rawData: item userType: 'user',
} rawData: item
}}> }
<button }}>
style={{ <button
backgroundColor: 'transparent', style={{
cursor: 'pointer', backgroundColor: 'transparent',
borderColor: 'transparent', cursor: 'pointer',
margin: 5, borderColor: 'transparent',
outline: 'none' margin: 5,
}}> outline: 'none'
<Typography style={{ marginLeft: 10, color: '#5198ea', fontSize: 13 }}>{item.company_name}</Typography> }}>
</button> <Typography style={{ marginLeft: 10, color: '#5198ea', fontSize: 13 }}>{item.company_name}</Typography>
</Link> </button>
</Link>
</div>
{item.is_overdue && (
<div style={{ backgroundColor: '#f65a4c', paddingRight: 5, paddingLeft: 5, borderRadius: 5, alignSelf: 'center' }}>
<Typography style={{ fontSize: 11, color: '#fff' }}>Overdue</Typography>
</div>
)}
</div> </div>
{item.is_overdue && ( )
<div style={{ backgroundColor: '#f65a4c', paddingRight: 5, paddingLeft: 5, borderRadius: 5, alignSelf: 'center' }}> })}
<Typography style={{ fontSize: 11, color: '#fff' }}>Overdue</Typography> </Paper>
</div>
{/* : this.state.isApproverMRList === true || this.state.isApprover === false ? */}
<div style={{ flex: 1, padding: 20, width: '100%' }}>
<Paper style={{ width: 450, padding: 20, borderRadius: 10 }}>
<Typography style={{ fontWeight: 'bold', textDecorationLine: 'underline' }}>{`Monthly Report ${this.state.valueSubmitMR}/${this.state.listSubcoMR.length} - ${bulan} ${tahun}`}</Typography>
{this.state.listSubcoMR.map((item, index) => {
return (
<div style={{ display: 'flex', justifyContent: 'space-between', marginTop: 10, paddingLeft: 10 }}>
<div style={{ display: 'flex' }}>
<img src={item.is_submit === true ? Images.dotDone : item.is_overdue === true ? Images.dotOverdue : Images.dotOpen} />
<Link to={{
pathname: `/home/master-budget/`,
state: {
userType: 'user',
rawData: item
}
}}>
<button
style={{
backgroundColor: 'transparent',
cursor: 'pointer',
borderColor: 'transparent',
margin: 5,
outline: 'none'
}}>
<Typography style={{ marginLeft: 10, color: '#5198ea', fontSize: 13 }}>{item.company_name}</Typography>
</button>
</Link>
</div> </div>
)} {item.is_overdue && (
</div> <div style={{ backgroundColor: '#f65a4c', paddingRight: 5, paddingLeft: 5, borderRadius: 5, alignSelf: 'center' }}>
) <Typography style={{ fontSize: 11, color: '#fff' }}>Overdue</Typography>
})} </div>
</Paper> )}
</div>
)
})}
</Paper>
</div>
{/* : null
} */}
</div> </div>
</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