Commit ab4834ec authored by Rifka Kurnia Irfiana's avatar Rifka Kurnia Irfiana

Merge branch 'master' of http://103.44.149.204/d.arizona/tia-dev into rifka

parents 3d7a5fcb 0a403cf3
...@@ -215,9 +215,25 @@ const create = (type = "") => { ...@@ -215,9 +215,25 @@ const create = (type = "") => {
const createOpetaingInd = (body) => api.post('transaction/operating_indicator/create_submission_report', body) const createOpetaingInd = (body) => api.post('transaction/operating_indicator/create_submission_report', body)
const checkUploadOperatingInd = (body) => api.post('transaction/operating_indicator/check_import', body) const checkUploadOperatingInd = (body) => api.post('transaction/operating_indicator/check_import', body)
const uploadOperatingInd = (body) => api.post('transaction/operating_indicator/import_operating_indicator', body) const uploadOperatingInd = (body) => api.post('transaction/operating_indicator/import_operating_indicator', body)
const getLastestUpdateOI = (body) => api.post('transaction/operating_indicator/get_latest_update', body)
const getDashboard = (body) => api.get('transaction/get_dashboard') const getDashboard = (body) => api.get('transaction/get_dashboard')
const historyApproval = (body) => api.post('transaction/master_budget/history_approval', body) const historyApproval = (body) => api.post('transaction/master_budget/history_approval', body)
//OUTLOOK PA
const getOutlookPAID = (body) => api.post('transaction/outlook_pa/get_outlook_pa_id', body)
const getLastPeriodOLPA = (idCompany) => api.get(`/transaction/outlook_pa/get_last_periode/${idCompany}`)
const getCompanySubmittedOLPA = (body) => api.post('transaction/outlook_pa/get_company_submitted', body)
const getRevisionOLPA = (body) => api.post('transaction/outlook_pa/get_revision', body)
const historyApprovalOLPA = (body) => api.post('transaction/outlook_pa/history_approval', body)
const getSubmitOLPA = (body) => api.post('transaction/outlook_pa/get_latest_periode_submit', body)
const getOLPAAtt = (body) => api.post('transaction/outlook_pa/get_report_attachment', body)
const submitOLPA = (body) => api.post('transaction/outlook_pa/submit_outlook_pa', body)
const getLastestUpdateOLPA = (body) => api.post('transaction/outlook_pa/get_latest_update', body)
const createReportOLPA = (body) => api.post('transaction/outlook_pa/create_outlook_report', body)
const checkUploadOLPA = (body) => api.post('transaction/outlook_pa/check_import', body)
const validateSubmitReportOLPA = (body) => api.post('transaction/outlook_pa/validate_save', body)
const uploadOLPA = (body) => api.post('transaction/outlook_pa/import_outlook_pa')
//Template //Template
const downloadTemplate = (fileName, fileType) => api.get(`attachment/download_file?fileName=${fileName}&&fileType=${fileType}`) const downloadTemplate = (fileName, fileType) => api.get(`attachment/download_file?fileName=${fileName}&&fileType=${fileType}`)
...@@ -373,7 +389,21 @@ const create = (type = "") => { ...@@ -373,7 +389,21 @@ const create = (type = "") => {
getCompanySubmitted, getCompanySubmitted,
getLastPeriod, getLastPeriod,
getSubmitMasterBudget, getSubmitMasterBudget,
createPeriodeRevision createPeriodeRevision,
getLastestUpdateOI,
getOutlookPAID,
getLastPeriodOLPA,
getCompanySubmittedOLPA,
getRevisionOLPA,
historyApprovalOLPA,
getSubmitOLPA,
getOLPAAtt,
submitOLPA,
getLastestUpdateOLPA,
createReportOLPA,
checkUploadOLPA,
uploadOLPA,
validateSubmitReportOLPA
} }
} }
......
...@@ -68,9 +68,12 @@ export default class BudgetTahunan extends Component { ...@@ -68,9 +68,12 @@ export default class BudgetTahunan extends Component {
maxDateRevision: new Date(), maxDateRevision: new Date(),
btnApprove: false btnApprove: false
} }
this.myRef = React.createRef()
this.fileHandler = this.fileHandler.bind(this); this.fileHandler = this.fileHandler.bind(this);
} }
scrollToMyRef = () => window.scrollTo(0, this.myRef.current.offsetTop)
componentDidMount() { componentDidMount() {
this.setState({ loading: true }) this.setState({ loading: true })
this.props.selectIndex('Master Budget & CAT') this.props.selectIndex('Master Budget & CAT')
...@@ -422,6 +425,7 @@ export default class BudgetTahunan extends Component { ...@@ -422,6 +425,7 @@ export default class BudgetTahunan extends Component {
} }
approvalSubmission(type) { approvalSubmission(type) {
this.scrollToMyRef()
this.setState({ loading: true }) this.setState({ loading: true })
let body = { let body = {
"approval_id": this.props.location.state == undefined ? this.state.approverID : this.state.rawData.approval_id, "approval_id": this.props.location.state == undefined ? this.state.approverID : this.state.rawData.approval_id,
...@@ -610,7 +614,7 @@ export default class BudgetTahunan extends Component { ...@@ -610,7 +614,7 @@ export default class BudgetTahunan extends Component {
let url = window.URL.createObjectURL(res); let url = window.URL.createObjectURL(res);
let a = document.createElement('a'); let a = document.createElement('a');
a.href = url; a.href = url;
a.download = 'Master Budget Balance Sheet.xlsx'; a.download = 'Master Budget Attachment.xlsx';
a.click(); a.click();
} }
} }
...@@ -671,6 +675,10 @@ export default class BudgetTahunan extends Component { ...@@ -671,6 +675,10 @@ export default class BudgetTahunan extends Component {
} }
render() { render() {
const handleMaxDate = () => {
let handleDate = Number(moment(this.state.maxDateRevision).format('YYYYMMDD')) - Number(moment(this.state.minDateRevision).format('YYYYMMDD'))
return handleDate < 0? moment(this.state.minDateRevision).format('YYYY/MM/DD') : moment(this.state.maxDateRevision).format('YYYY/MM/DD')
}
const columns = ["#", "Report Type", const columns = ["#", "Report Type",
{ {
name: "Revision", name: "Revision",
...@@ -892,7 +900,7 @@ export default class BudgetTahunan extends Component { ...@@ -892,7 +900,7 @@ export default class BudgetTahunan extends Component {
</div> </div>
); );
return ( return (
<div style={{ flex: 1, backgroundColor: '#f8f8f8' }}> <div style={{ flex: 1, backgroundColor: '#f8f8f8' }} ref={this.myRef}>
<Snackbar open={this.state.alert} autoHideDuration={6000} onClose={() => this.closeAlert()}> <Snackbar open={this.state.alert} autoHideDuration={6000} onClose={() => this.closeAlert()}>
<Alert onClose={() => this.closeAlert()} severity={this.state.tipeAlert}> <Alert onClose={() => this.closeAlert()} severity={this.state.tipeAlert}>
{this.state.messageAlert} {this.state.messageAlert}
...@@ -976,7 +984,7 @@ export default class BudgetTahunan extends Component { ...@@ -976,7 +984,7 @@ export default class BudgetTahunan extends Component {
<div style={{ width: '50%' }}> <div style={{ width: '50%' }}>
<Typography style={{ fontSize: '16px', color: '#4b4b4b', fontWeight: 'bold' }}>Attachment: </Typography> <Typography style={{ fontSize: '16px', color: '#4b4b4b', fontWeight: 'bold' }}>Attachment: </Typography>
</div> </div>
{!this.state.isApprover && (this.state.lastStatus !== 'SUBMITTED' && this.state.lastStatus !== 'APPROVED') && ( {!this.state.isApprover && (this.state.lastStatus === 'SUBMIT' && this.state.lastStatus === 'REVISION') && (
<div style={{ width: '50%' }}> <div style={{ width: '50%' }}>
<button <button
style={{ style={{
...@@ -1022,7 +1030,7 @@ export default class BudgetTahunan extends Component { ...@@ -1022,7 +1030,7 @@ export default class BudgetTahunan extends Component {
: null : null
} }
</div> </div>
{!this.state.isApprover && (this.state.lastStatus !== 'SUBMITTED' && this.state.lastStatus !== 'APPROVED') && ( {!this.state.isApprover && (this.state.lastStatus === 'SUBMIT' && this.state.lastStatus === 'REVISION') && (
<div style={{ width: '50%' }}> <div style={{ width: '50%' }}>
{this.state.listAttachment.length > 0 ? {this.state.listAttachment.length > 0 ?
this.state.listAttachment.map((item) => { this.state.listAttachment.map((item) => {
...@@ -1360,7 +1368,7 @@ export default class BudgetTahunan extends Component { ...@@ -1360,7 +1368,7 @@ export default class BudgetTahunan extends Component {
id="startDate" id="startDate"
label="Valid From" label="Valid From"
format="dd-MM-yyyy" format="dd-MM-yyyy"
onChange={(e) => this.setState({minDateRevision: moment(e).format('YYYY/MM/DD')})} onChange={(e) => this.setState({minDateRevision: moment(e).format('YYYY/MM/DD')}, () => this.setState({maxDateRevision: handleMaxDate()}))}
value={moment(this.state.minDateRevision).format('YYYY/MM/DD')} value={moment(this.state.minDateRevision).format('YYYY/MM/DD')}
KeyboardButtonProps={{ KeyboardButtonProps={{
'aria-label': 'change date', 'aria-label': 'change date',
......
...@@ -264,10 +264,11 @@ export default class CorporateAnnualTarget extends Component { ...@@ -264,10 +264,11 @@ export default class CorporateAnnualTarget extends Component {
nilaiTotal = i[6] == 'SUM'? total : i[6] == 'AVG'? total/12 : lastValz nilaiTotal = i[6] == 'SUM'? total : i[6] == 'AVG'? total/12 : lastValz
} }
console.log(nilaiTotal) console.log(nilaiTotal)
// console.log(i[2] === undefined ? "" : String(Number(i[2]*100)).length > 3? String(Number(i[2]*100).toFixed(0) + '%') : String(Number(i[2]*100)) + '%')
payload.push({ payload.push({
item_report_id: i[0] === undefined ? "" : reg.test(String(i[0])) === false ? "" : String(i[0]).trim(), item_report_id: i[0] === undefined ? "" : reg.test(String(i[0])) === false ? "" : String(i[0]).trim(),
item_report: i[1] === undefined ? "" : String(i[1]).trim(), item_report: i[1] === undefined ? "" : String(i[1]).trim(),
weight: i[2] === undefined ? "" : String(Number(i[2]*100) +'%'), weight: i[2] === undefined ? "" : String(Number(i[2]*100)).length > 3? String(Number(i[2]*100).toFixed(0) + '%') : String(Number(i[2]*100)) + '%',
uom: i[3] === undefined ? "" : String(i[3]).trim(), uom: i[3] === undefined ? "" : String(i[3]).trim(),
kpi_type: i[4] === undefined ? "" : String(i[4]).trim(), kpi_type: i[4] === undefined ? "" : String(i[4]).trim(),
max_ach: i[5] === undefined ? "" : String(i[5]).toLocaleLowerCase() !== 'unlimited' ? String(Number(i[5]*100) + '%') : String(i[5]).trim(), max_ach: i[5] === undefined ? "" : String(i[5]).toLocaleLowerCase() !== 'unlimited' ? String(Number(i[5]*100) + '%') : String(i[5]).trim(),
......
...@@ -5,7 +5,6 @@ import Images from '../assets/Images'; ...@@ -5,7 +5,6 @@ import Images from '../assets/Images';
import api from '../api'; import api from '../api';
import Autocomplete from '@material-ui/lab/Autocomplete'; import Autocomplete from '@material-ui/lab/Autocomplete';
import { titleCase } from '../library/Utils'; import { titleCase } from '../library/Utils';
import ProfitLoss from './BudgetTahunan/ProfitLoss';
import TaxPlanning from './BudgetTahunan/TaxPlanning'; import TaxPlanning from './BudgetTahunan/TaxPlanning';
import FixedAssetsMovement from './BudgetTahunan/FixedAssetsMovement'; import FixedAssetsMovement from './BudgetTahunan/FixedAssetsMovement';
import CorporateAnnualTarget from './BudgetTahunan/CorporateAnnualTarget'; import CorporateAnnualTarget from './BudgetTahunan/CorporateAnnualTarget';
...@@ -13,6 +12,7 @@ import { ExcelRenderer } from 'react-excel-renderer'; ...@@ -13,6 +12,7 @@ import { ExcelRenderer } from 'react-excel-renderer';
import UploadFile from "../library/Upload"; import UploadFile from "../library/Upload";
import { format } from 'date-fns'; import { format } from 'date-fns';
import BalanceSheetMR from './MonthlyReport/BalanceSheetMR'; import BalanceSheetMR from './MonthlyReport/BalanceSheetMR';
import ProfitLossMR from './MonthlyReport/ProfitLossMR';
export default class MonthlyReport extends Component { export default class MonthlyReport extends Component {
constructor(props) { constructor(props) {
...@@ -162,6 +162,7 @@ export default class MonthlyReport extends Component { ...@@ -162,6 +162,7 @@ export default class MonthlyReport extends Component {
} }
clickDetail(item, id, revision, status) { clickDetail(item, id, revision, status) {
console.log(item)
this.setState({ this.setState({
report_id: id, report_id: id,
revisionTable: revision, revisionTable: revision,
...@@ -176,7 +177,7 @@ export default class MonthlyReport extends Component { ...@@ -176,7 +177,7 @@ export default class MonthlyReport extends Component {
visibleFAM: false, visibleFAM: false,
visibleTP: false, visibleTP: false,
}) })
} else if (item === 'Profit & Loss') { } else if (item === 'Profit Loss') {
this.setState({ this.setState({
visibleMonthlyReport: false, visibleMonthlyReport: false,
visibleBS: false, visibleBS: false,
...@@ -550,10 +551,18 @@ export default class MonthlyReport extends Component { ...@@ -550,10 +551,18 @@ export default class MonthlyReport extends Component {
/> />
)} )}
{this.state.visiblePL && ( {this.state.visiblePL && (
<ProfitLoss <ProfitLossMR
open={this.props.open}
report_id={this.state.report_id} report_id={this.state.report_id}
height={this.props.height}
width={this.props.width}
company={this.state.company} company={this.state.company}
onClickClose={() => this.setState({ visiblePL: false, visibleMonthlyReport: true })} revision={this.state.revisionTable}
periode={this.state.periode.periode}
submissionID={this.state.submissionID}
// saveToMasterBudget={this.saveToMasterBudget.bind(this)}
onClickClose={() => this.setState({ visiblePL: false, visibleBudgetTahunan: true })}
// getReport={this.getCompanyActive.bind(this)}
/> />
)} )}
......
import { createMuiTheme, MuiThemeProvider, Paper, TableCell, Typography } from '@material-ui/core'
import MUIDataTable from 'mui-datatables';
import React, { Component } from 'react'
import ReactTooltip from 'react-tooltip';
import Images from '../../assets/Images';
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,
top: 0
};
export default class BalanceSheetMR extends Component {
render() {
let columns = [
{
name: "Account",
options: {
customHeadRender: (columnMeta) => (
<TableCell key={columnMeta.index} style={{ ...style, top: 0, zIndex: 102, 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 }}>
{val}
</div>
)
}
}
},
{
name: "Keterangan",
options: {
customHeadRender: (columnMeta) => (
<TableCell key={columnMeta.index} style={{ ...style, top: 0, zIndex: 102, backgroundColor: '#1c71b8', width: 96}}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'left' }}>{columnMeta.name}</Typography>
</TableCell>
),
setCellProps: () => ({ style }),
customBodyRender: (val, tableMeta) => {
return (
<div style={{ width: 96 }}>
{val}
</div>
)
}
}
},
{
name: "Rolling Outlook (FY2021)",
options: {
customHeadRender: (columnMeta) => (
<TableCell style={{ ...style2, top: 0, zIndex: 99, backgroundColor: '#07a7d0', width: 96 }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
</TableCell>
),
setCellProps: () => ({ style2 }),
customBodyRender: (val, tableMeta, updateValue) => {
return (
<div style={{ textAlign: 'right', width: 90 }}>
{val}
</div>
)
}
}
},
{
name: `Month To Date (MTD)`,
options: {
customHeadRender: (columnMeta) => (
<th style={{ ...style2, color: '#fff', backgroundColor: '#07a7d0', 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 }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
</TableCell> */}
<div style={{ borderBottom: "1px #fff solid", backgroundColor: '#1c71b8', textAlign: 'center', 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="column-1" style={{ placeSelf: 'center', textAlign: 'center', padding: 5, borderRight: "1px #fff solid", backgroundColor: '#07a7d0' }}>
<span>{"Master Budget (MB)"}</span>
</div>
<div className="column-2" style={{ placeSelf: 'center', textAlign: 'center', padding: 5, borderRight: "1px #fff solid", backgroundColor: '#07a7d0' }}>
<span>{"Rolling Budget (RB)"}</span>
</div>
<div className="column-3" style={{ placeSelf: 'center', textAlign: 'center', padding: 5, backgroundColor: '#37b5e6' }}>
<span>{"Actual"}</span>
</div>
</div>
</th>
),
setCellProps: () => ({ style2 }),
customBodyRender: (val, tableMeta, updateValue) => {
return (
<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>
)
}
}
},{
name: "YTD Actual",
options: {
customHeadRender: (columnMeta) => (
<TableCell style={{ ...style2, top: 0, zIndex: 99, backgroundColor: '#37b5e6', width: 96 }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
</TableCell>
),
setCellProps: () => ({ style2 }),
customBodyRender: (val, tableMeta, updateValue) => {
return (
<div style={{ textAlign: 'right', width: 90 }}>
{val}
</div>
)
}
}
},
{
name: "Actual Previous Month",
options: {
customHeadRender: (columnMeta) => (
<TableCell style={{ ...style2, top: 0, zIndex: 99, backgroundColor: '#37b5e6', width: 96 }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
</TableCell>
),
setCellProps: () => ({ style2 }),
customBodyRender: (val, tableMeta, updateValue) => {
return (
<div style={{ textAlign: 'right', width: 90 }}>
{val}
</div>
)
}
}
},
{
name: `Variance`,
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-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 style={{ borderBottom: '1px #fff solid', backgroundColor: '#37b5e6' }}>
<span>{"Act vs Previous Month"}</span>
</div>
<div className="grid grid-2x">
<div className="column-1" style={{ borderRight: '1px #fff solid', backgroundColor: '#37b5e6' }}>
<span>{"Amount"}</span>
</div>
<div className="column-2" style={{ borderLeft: '1px #fff solid', backgroundColor: '#37b5e6' }}>
<span>{"%"}</span>
</div>
</div>
</div>
<div className="column-2" style={{ placeSelf: 'center', textAlign: 'center', padding: 5, border: '1px #fff solid', backgroundColor: '#07a7d0' }}>
<div style={{ borderBottom: '1px #fff solid' }}>
<span>{"Act vs MB"}</span>
</div>
<div className="grid grid-2x">
<div className="column-1" style={{ borderRight: '1px #fff solid' }}>
<span>{"Amount"}</span>
</div>
<div className="column-2" style={{ borderLeft: '1px #fff solid' }}>
<span>{"%"}</span>
</div>
</div>
</div>
<div className="column-3" style={{ placeSelf: 'center', textAlign: 'center', padding: 5, border: '1px #fff solid', backgroundColor: '#07a7d0' }}>
<div style={{ borderBottom: '1px #fff solid' }}>
<span>{"Act vs RB"}</span>
</div>
<div className="grid grid-2x">
<div className="column-1" style={{ borderRight: '1px #fff solid' }}>
<span>{"Amount"}</span>
</div>
<div className="column-2" style={{ borderLeft: '1px #fff solid' }}>
<span>{"%"}</span>
</div>
</div>
</div>
</div>
</th>
),
setCellProps: () => ({ style2 }),
customBodyRender: (val, tableMeta, updateValue) => {
return (
<div>
<div className="grid grid-3x content-center">
<div className="col-1">
<div className="grid grid-2x 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>
</div>
<div className="col-2">
<div className="grid grid-2x content-center">
<div className="col-1">
<div style={{ textAlign: 'right', width: 90 }}>
{val.c}
</div>
</div>
<div className="col-2">
<div style={{ textAlign: 'right', width: 90 }}>
{val.d}
</div>
</div>
</div>
</div>
<div className="col-3">
<div className="grid grid-2x content-center">
<div className="col-1">
<div style={{ textAlign: 'right', width: 90 }}>
{val.e}
</div>
</div>
<div className="col-2">
<div style={{ textAlign: 'right', width: 90 }}>
{val.f}
</div>
</div>
</div>
</div>
</div>
</div>
)
}
}
},
{
name: `MTD Explanation`,
options: {
customHeadRender: (columnMeta) => (
<th style={{ ...style2, backgroundColor: '#1c71b8', color: '#fff', 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 }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
</TableCell> */}
<div style={{ borderBottom: "1px #fff solid", textAlign: 'center', fontSize: 12, fontWeight: 'bold', padding: 5 }}>{columnMeta.name}</div>
<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" }}>
<span>{"vs Prev Month"}</span>
</div>
<div className="column-2" style={{ placeSelf: 'center', textAlign: 'center', padding: 5, borderRight: "1px #fff solid" }}>
<span>{"vs MB"}</span>
</div>
<div className="column-3" style={{ placeSelf: 'center', textAlign: 'center', padding: 5 }}>
<span>{"vs RB"}</span>
</div>
</div>
</th>
),
setCellProps: () => ({ style2 }),
customBodyRender: (val, tableMeta, updateValue) => {
return (
<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>
)
}
}
},
]
let data = [
["Total Assets", "0", "1", { a: "2", b: "3", c: "4" }, "4.5", "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 (
<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 }}>
<Typography style={{ fontSize: '16px', color: 'white' }}>Monthly Report</Typography>
</div>
<div style={{ flex: 1, padding: 20, width: '100%' }}>
<Paper style={{ paddingTop: 10, paddingBottom: 20 }}>
<div style={{ borderBottom: 'solid 1px #c4c4c4' }} >
<Typography style={{ fontSize: '12px', color: '#4b4b4b', margin: 10 }}>Monthly Report - Profit Loss</Typography>
</div>
<div style={{ padding: 20 }}>
<div style={{ display: 'flex', justifyContent: 'space-between' }}>
<div>
<Typography style={{ fontSize: '11px', color: '#4b4b4b' }}>{this.props.company.company_name}</Typography>
<Typography style={{ fontSize: '11px', color: '#4b4b4b' }}>Period : {this.props.periode} (rev.{this.props.revision})</Typography>
<Typography style={{ fontSize: '11px', color: '#4b4b4b' }}>in IDR mn</Typography>
</div>
<div style={{ width: '50%' }}>
<div style={{ justifyContent: 'flex-end', display: 'flex', flexFlow: 'wrap' }}>
<a data-tip={'Download Template'} data-for="template">
<button
style={{
backgroundColor: 'transparent',
cursor: 'pointer',
borderColor: 'transparent',
margin: 5
}}
onClick={() => null}
>
<img src={Images.template} />
</button>
</a>
<ReactTooltip border={true} id="template" place="bottom" type="light" effect="solid" />
<a data-tip={'Upload'} data-for="upload">
<button
style={{
backgroundColor: 'transparent',
cursor: 'pointer',
borderColor: 'transparent',
margin: 5
}}
onClick={() => null}
>
<img src={Images.upload} />
</button>
</a>
<ReactTooltip border={true} id="upload" place="bottom" type="light" effect="solid" />
<a data-tip={'Download'} data-for="download">
<button
style={{
backgroundColor: 'transparent',
cursor: 'pointer',
borderColor: 'transparent',
margin: 5
}}
onClick={() => null}
>
<img src={Images.download} />
</button>
</a>
<ReactTooltip border={true} id="download" place="bottom" type="light" effect="solid" />
</div>
</div>
</div>
<div style={{ marginTop: 20, width: this.props.width - (this.props.open === true ? 400 : 150) }}>
<MuiThemeProvider theme={getMuiTheme()}>
<MUIDataTable
data={data}
columns={columns}
options={options}
/>
</MuiThemeProvider>
</div>
</div>
</Paper>
</div>
</div>
)
}
}
...@@ -50,9 +50,29 @@ export default class BalanceSheet extends Component { ...@@ -50,9 +50,29 @@ export default class BalanceSheet extends Component {
this.fileHandler = this.fileHandler.bind(this); this.fileHandler = this.fileHandler.bind(this);
} }
getLatestUpdate() {
let payload = {
"operating_indicator_id": this.props.data.operatingIndID,
"report_id": this.props.data.report_id,
"company_id": this.props.data.company.company_id,
"periode": this.props.data.periode,
}
api.create().getLastestUpdateOI(payload).then(response => {
console.log(response.data)
if (response.data) {
if (response.data.status === "success") {
this.setState({
updateBy: response.data.data.latest_update === null ? '-' : response.data.data.latest_update
})
}
}
})
}
componentDidMount() { componentDidMount() {
// this.getItemHierarki() // this.getItemHierarki()
this.getDataDetail() this.getDataDetail()
this.getLatestUpdate()
console.log(this.props); console.log(this.props);
} }
...@@ -1261,6 +1281,7 @@ export default class BalanceSheet extends Component { ...@@ -1261,6 +1281,7 @@ export default class BalanceSheet extends Component {
/> />
</MuiThemeProvider> </MuiThemeProvider>
</div> </div>
<Typography style={{ fontSize: '11px', color: '#4b4b4b', marginTop: 20 }}>Last Updated by : {this.state.updateBy}</Typography>
</div> </div>
<div className="grid grid-2x"> <div className="grid grid-2x">
<div className="col-1"> <div className="col-1">
......
...@@ -2,7 +2,6 @@ import React, { Component } from 'react'; ...@@ -2,7 +2,6 @@ import React, { Component } from 'react';
import { Typography, Paper, TextField, MenuItem, Select, FormControlLabel, Snackbar, withStyles, createMuiTheme, MuiThemeProvider, Checkbox, Input } from '@material-ui/core'; import { Typography, Paper, TextField, MenuItem, Select, FormControlLabel, Snackbar, withStyles, createMuiTheme, MuiThemeProvider, Checkbox, Input } from '@material-ui/core';
import MUIDataTable from 'mui-datatables'; import MUIDataTable from 'mui-datatables';
import Images from '../assets/Images'; import Images from '../assets/Images';
import BalanceSheet from './OutlookPA/BalanceSheet';
import api from '../api'; import api from '../api';
import Autocomplete from '@material-ui/lab/Autocomplete'; import Autocomplete from '@material-ui/lab/Autocomplete';
import MuiAlert from '@material-ui/lab/Alert'; import MuiAlert from '@material-ui/lab/Alert';
...@@ -15,6 +14,7 @@ import { format } from 'date-fns'; ...@@ -15,6 +14,7 @@ import { format } from 'date-fns';
import Constant from '../library/Constant'; import Constant from '../library/Constant';
import PropagateLoader from "react-spinners/PropagateLoader" import PropagateLoader from "react-spinners/PropagateLoader"
import { DatePicker } from '@material-ui/pickers'; import { DatePicker } from '@material-ui/pickers';
import BalanceSheetOLPA from './OutlookPA/BalanceSheetOLPA';
var ct = require("../library/CustomTable"); var ct = require("../library/CustomTable");
const getMuiTheme = () => createMuiTheme(ct.customTable()); const getMuiTheme = () => createMuiTheme(ct.customTable());
...@@ -43,7 +43,7 @@ export default class OutlookPA extends Component { ...@@ -43,7 +43,7 @@ export default class OutlookPA extends Component {
alert: false, alert: false,
tipeAlert: '', tipeAlert: '',
messageAlert: '', messageAlert: '',
submissionID: null, outlook_pa_id: null,
isSubmit: false, isSubmit: false,
visibleTableHistory: false, visibleTableHistory: false,
isApprover: false, isApprover: false,
...@@ -91,7 +91,7 @@ export default class OutlookPA extends Component { ...@@ -91,7 +91,7 @@ export default class OutlookPA extends Component {
let body = { let body = {
"periode": this.state.periode.periode "periode": this.state.periode.periode
} }
api.create().getCompanySubmitted(body).then(response => { api.create().getCompanySubmittedOLPA(body).then(response => {
console.log(response); console.log(response);
if (response.data) { if (response.data) {
if (response.data.status === 'success') { if (response.data.status === 'success') {
...@@ -138,7 +138,7 @@ export default class OutlookPA extends Component { ...@@ -138,7 +138,7 @@ export default class OutlookPA extends Component {
"periode": this.state.periode.periode, "periode": this.state.periode.periode,
"revision": this.state.revision.revision, "revision": this.state.revision.revision,
} }
api.create().getMasterBudgetAtt(payload).then(response => { api.create().getOLPAAtt(payload).then(response => {
console.log(response) console.log(response)
if (response.data) { if (response.data) {
if (response.data.status === "success") { if (response.data.status === "success") {
...@@ -191,7 +191,7 @@ export default class OutlookPA extends Component { ...@@ -191,7 +191,7 @@ export default class OutlookPA extends Component {
"company_id": this.state.company.company_id, "company_id": this.state.company.company_id,
"periode": this.state.periode.periode "periode": this.state.periode.periode
} }
api.create().getSubmitMasterBudget(body).then(response => { api.create().getSubmitOLPA(body).then(response => {
console.log(response); console.log(response);
if (response.data) { if (response.data) {
if (response.data.status === "success") { if (response.data.status === "success") {
...@@ -266,7 +266,7 @@ export default class OutlookPA extends Component { ...@@ -266,7 +266,7 @@ export default class OutlookPA extends Component {
} }
getLastPeriod() { getLastPeriod() {
api.create().getLastPeriod(this.state.company.company_id).then(response => { api.create().getLastPeriodOLPA(this.state.company.company_id).then(response => {
console.log(response); console.log(response);
if (response.data.status === "success") { if (response.data.status === "success") {
this.setState({ lastPeriod: response.data.data.last_periode, latestPeriode: response.data.data.latest_periode }, () => { this.setState({ lastPeriod: response.data.data.last_periode, latestPeriode: response.data.data.latest_periode }, () => {
...@@ -342,26 +342,26 @@ export default class OutlookPA extends Component { ...@@ -342,26 +342,26 @@ export default class OutlookPA extends Component {
getOptionLabel: (option) => option.revision, getOptionLabel: (option) => option.revision,
}; };
this.setState({ listRevision: defaultProps, revision: revisionData[0] }, () => { this.setState({ listRevision: defaultProps, revision: revisionData[0] }, () => {
this.getSubmission() this.getOutlookPAID()
}) })
} }
} }
}) })
} }
getSubmission() { getOutlookPAID() {
this.setState({ loading: true }) this.setState({ loading: true })
let payload = { let payload = {
"company_id": this.state.company.company_id, "company_id": this.state.company.company_id,
"periode": this.state.periode.periode, "periode": this.state.periode.periode,
"is_approver": this.state.isApprover "is_approver": this.state.isApprover
} }
api.create().getSubmission(payload).then(response => { api.create().getOutlookPAID(payload).then(response => {
console.log(response) console.log(response)
if (response) { if (response) {
if (response.data.status === "success") { if (response.data.status === "success") {
this.setState({ this.setState({
submissionID: response.data.data.submission_id, outlook_pa_id: response.data.data.outlook_pa_id,
submitter: response.data.data.submitter, submitter: response.data.data.submitter,
approverID: response.data.data.approve_id, pic: response.data.data.approver == null ? '' : response.data.data.approver, approverID: response.data.data.approve_id, pic: response.data.data.approver == null ? '' : response.data.data.approver,
lastStatus: response.data.data.last_status === null ? 'SUBMIT' : response.data.data.last_status, lastStatus: response.data.data.last_status === null ? 'SUBMIT' : response.data.data.last_status,
...@@ -382,7 +382,7 @@ export default class OutlookPA extends Component { ...@@ -382,7 +382,7 @@ export default class OutlookPA extends Component {
}) })
}) })
} else { } else {
this.setState({ submissionID: null, loading: false }) this.setState({ outlook_pa_id: null, loading: false })
} }
} }
}) })
...@@ -393,7 +393,7 @@ export default class OutlookPA extends Component { ...@@ -393,7 +393,7 @@ export default class OutlookPA extends Component {
"company_id": this.state.company.company_id, "company_id": this.state.company.company_id,
"periode": this.state.periode.periode "periode": this.state.periode.periode
} }
api.create().historyApproval(body).then(response => { api.create().historyApprovalOLPA(body).then(response => {
console.log(response); console.log(response);
if (response.data.data.length > 0) { if (response.data.data.length > 0) {
let dataTableHistory = response.data.data.map(item => { let dataTableHistory = response.data.data.map(item => {
...@@ -420,7 +420,7 @@ export default class OutlookPA extends Component { ...@@ -420,7 +420,7 @@ export default class OutlookPA extends Component {
api.create().approvalSubmission(body).then((res) => { api.create().approvalSubmission(body).then((res) => {
console.log(res) console.log(res)
this.setState({ loading: false }, () => { this.setState({ loading: false }, () => {
this.getSubmission() this.getOutlookPAID()
}) })
}) })
} }
...@@ -496,7 +496,7 @@ export default class OutlookPA extends Component { ...@@ -496,7 +496,7 @@ export default class OutlookPA extends Component {
if (response.data) { if (response.data) {
if (response.data.status === "success") { if (response.data.status === "success") {
this.setState({ visibleUpload: false }, () => { this.setState({ visibleUpload: false }, () => {
this.getSubmission() this.getOutlookPAID()
}) })
} }
} }
...@@ -507,7 +507,7 @@ export default class OutlookPA extends Component { ...@@ -507,7 +507,7 @@ export default class OutlookPA extends Component {
api.create().deleteAttachment(item.attachment_id).then(response => { api.create().deleteAttachment(item.attachment_id).then(response => {
if (response.data) { if (response.data) {
if (response.data.status === "success") { if (response.data.status === "success") {
this.getSubmission() this.getOutlookPAID()
} }
} }
}) })
...@@ -517,22 +517,22 @@ export default class OutlookPA extends Component { ...@@ -517,22 +517,22 @@ export default class OutlookPA extends Component {
this.setState({ alert: false }) this.setState({ alert: false })
} }
saveToMasterBudget(data) { saveToOLPA(data) {
this.setState({ loading: true }) this.setState({ loading: true })
// console.log(JSON.stringify(data)); // console.log(JSON.stringify(data));
api.create('UPLOAD').createSubmitReport(data).then(response => { api.create('UPLOAD').createReportOLPA(data).then(response => {
console.log(response); console.log(response);
if (response.data) { if (response.data) {
if (response.data.status === "success") { if (response.data.status === "success") {
this.getSubmission() this.getOutlookPAID()
} else { } else {
this.setState({ loading: false }, () => { this.setState({ loading: false }, () => {
this.getSubmission() this.getOutlookPAID()
}) })
} }
} else { } else {
this.setState({ loading: false }, () => { this.setState({ loading: false }, () => {
this.getSubmission() this.getOutlookPAID()
}) })
} }
}) })
...@@ -542,10 +542,10 @@ export default class OutlookPA extends Component { ...@@ -542,10 +542,10 @@ export default class OutlookPA extends Component {
let length = name.split(".").length let length = name.split(".").length
let fileType = name.split(".")[length - 1] let fileType = name.split(".")[length - 1]
console.log(fileType); console.log(fileType);
let url = `https://tia.eksad.com/tia-reporting-dev/public/transaction/master_budget/download_attachment?fileName=${fileurl}&&fileType=${fileType}` let url = `https://tia.eksad.com/tia-reporting-dev/public/transaction/outlook_pa/download_attachment?fileName=${fileurl}&&fileType=${fileType}`
// console.log(url); // console.log(url);
let res = await fetch( let res = await fetch(
`https://tia.eksad.com/tia-reporting-dev/public/transaction/master_budget/download_attachment?fileName=${fileurl}&&fileType=${fileType}` `https://tia.eksad.com/tia-reporting-dev/public/transaction/outlook_pa/download_attachment?fileName=${fileurl}&&fileType=${fileType}`
) )
res = await res.blob() res = await res.blob()
this.setState({ loading: false }) this.setState({ loading: false })
...@@ -553,7 +553,7 @@ export default class OutlookPA extends Component { ...@@ -553,7 +553,7 @@ export default class OutlookPA extends Component {
let url = window.URL.createObjectURL(res); let url = window.URL.createObjectURL(res);
let a = document.createElement('a'); let a = document.createElement('a');
a.href = url; a.href = url;
a.download = 'Master Budget Balance Sheet.xlsx'; a.download = 'Outlook Perfromance Appraisal.xlsx';
a.click(); a.click();
} }
} }
...@@ -577,13 +577,13 @@ export default class OutlookPA extends Component { ...@@ -577,13 +577,13 @@ export default class OutlookPA extends Component {
}) })
if (canSubmit === true) { if (canSubmit === true) {
let body = { let body = {
submission_id: this.state.submissionID outlook_pa_id: this.state.outlook_pa_id
} }
api.create().submitMasterBudget(body).then(response => { api.create().submitOLPA(body).then(response => {
console.log(response); console.log(response);
if (response.data) { if (response.data) {
if (response.data.status === "Success") { if (response.data.status === "Success") {
this.getSubmission() this.getOutlookPAID()
} }
} }
}) })
...@@ -905,7 +905,7 @@ export default class OutlookPA extends Component { ...@@ -905,7 +905,7 @@ export default class OutlookPA extends Component {
<div style={{ width: '50%' }}> <div style={{ width: '50%' }}>
<Typography style={{ fontSize: '16px', color: '#4b4b4b', fontWeight: 'bold' }}>Attachment: </Typography> <Typography style={{ fontSize: '16px', color: '#4b4b4b', fontWeight: 'bold' }}>Attachment: </Typography>
</div> </div>
{!this.state.isApprover && (this.state.lastStatus !== 'SUBMITTED' && this.state.lastStatus !== 'APPROVED') && ( {!this.state.isApprover && (this.state.lastStatus === 'SUBMIT' && this.state.lastStatus === 'REVISION') && (
<div style={{ width: '50%' }}> <div style={{ width: '50%' }}>
<button <button
style={{ style={{
...@@ -951,7 +951,7 @@ export default class OutlookPA extends Component { ...@@ -951,7 +951,7 @@ export default class OutlookPA extends Component {
: null : null
} }
</div> </div>
{!this.state.isApprover && (this.state.lastStatus !== 'SUBMITTED' && this.state.lastStatus !== 'APPROVED') && ( {!this.state.isApprover && (this.state.lastStatus === 'SUBMIT' && this.state.lastStatus === 'REVISION') && (
<div style={{ width: '50%' }}> <div style={{ width: '50%' }}>
{this.state.listAttachment.length > 0 ? {this.state.listAttachment.length > 0 ?
this.state.listAttachment.map((item) => { this.state.listAttachment.map((item) => {
...@@ -1139,7 +1139,7 @@ export default class OutlookPA extends Component { ...@@ -1139,7 +1139,7 @@ export default class OutlookPA extends Component {
)} )}
{this.state.visibleBS && ( {this.state.visibleBS && (
<BalanceSheet <BalanceSheetOLPA
open={this.props.open} open={this.props.open}
report_id={this.state.report_id} report_id={this.state.report_id}
height={this.props.height} height={this.props.height}
...@@ -1147,10 +1147,10 @@ export default class OutlookPA extends Component { ...@@ -1147,10 +1147,10 @@ export default class OutlookPA extends Component {
company={this.state.company} company={this.state.company}
revision={this.state.revisionTable} revision={this.state.revisionTable}
periode={this.state.periode.periode} periode={this.state.periode.periode}
submissionID={this.state.submissionID} outlook_pa_id={this.state.outlook_pa_id}
saveToMasterBudget={this.saveToMasterBudget.bind(this)} saveToOLPA={this.saveToOLPA.bind(this)}
onClickClose={() => this.setState({ visibleBS: false, visibleOutlookPA: true })} onClickClose={() => this.setState({ visibleBS: false, visibleOutlookPA: true })}
getReport={this.getSubmission.bind(this)} getReport={this.getOutlookPAID.bind(this)}
isApprover={this.state.isApprover} isApprover={this.state.isApprover}
lastStatus={this.state.lastStatus} lastStatus={this.state.lastStatus}
prevRevision={this.state.prevRevision} prevRevision={this.state.prevRevision}
...@@ -1166,10 +1166,10 @@ export default class OutlookPA extends Component { ...@@ -1166,10 +1166,10 @@ export default class OutlookPA extends Component {
company={this.state.company} company={this.state.company}
revision={this.state.revisionTable} revision={this.state.revisionTable}
periode={this.state.periode.periode} periode={this.state.periode.periode}
submissionID={this.state.submissionID} outlook_pa_id={this.state.outlook_pa_id}
saveToMasterBudget={this.saveToMasterBudget.bind(this)} saveToOLPA={this.saveToOLPA.bind(this)}
onClickClose={() => this.setState({ visiblePL: false, visibleOutlookPA: true })} onClickClose={() => this.setState({ visiblePL: false, visibleOutlookPA: true })}
getReport={this.getSubmission.bind(this)} getReport={this.getOutlookPAID.bind(this)}
status={this.state.status} status={this.state.status}
isApprover={this.state.isApprover} isApprover={this.state.isApprover}
lastStatus={this.state.lastStatus} lastStatus={this.state.lastStatus}
...@@ -1186,10 +1186,10 @@ export default class OutlookPA extends Component { ...@@ -1186,10 +1186,10 @@ export default class OutlookPA extends Component {
company={this.state.company} company={this.state.company}
revision={this.state.revisionTable} revision={this.state.revisionTable}
periode={this.state.periode.periode} periode={this.state.periode.periode}
submissionID={this.state.submissionID} outlook_pa_id={this.state.outlook_pa_id}
saveToMasterBudget={this.saveToMasterBudget.bind(this)} saveToOLPA={this.saveToOLPA.bind(this)}
onClickClose={() => this.setState({ visibleTP: false, visibleOutlookPA: true })} onClickClose={() => this.setState({ visibleTP: false, visibleOutlookPA: true })}
getReport={this.getSubmission.bind(this)} getReport={this.getOutlookPAID.bind(this)}
status={this.state.status} status={this.state.status}
isApprover={this.state.isApprover} isApprover={this.state.isApprover}
lastStatus={this.state.lastStatus} lastStatus={this.state.lastStatus}
......
This source diff could not be displayed because it is too large. You can view the blob instead.
...@@ -12,10 +12,10 @@ import ReportItems from '../container/MasterData/ReportItems' ...@@ -12,10 +12,10 @@ import ReportItems from '../container/MasterData/ReportItems'
import DashboardCAT from '../container/Laporan/DashboardCAT' import DashboardCAT from '../container/Laporan/DashboardCAT'
import BudgetTahunan from '../container/BudgetTahunan'; import BudgetTahunan from '../container/BudgetTahunan';
import RollingOutlook from '../container/RollingOutlook'; import RollingOutlook from '../container/RollingOutlook';
import OutlookPA from '../container/OutlookPA';
import OperatingIndicator from '../container/OprIndicator/OperatingIndicator' import OperatingIndicator from '../container/OprIndicator/OperatingIndicator'
import MonthlyReport from '../container/MonthlyReport'; import MonthlyReport from '../container/MonthlyReport';
import DocumentManagement from '../container/DocumentManagement/DocumentManagement'; import DocumentManagement from '../container/DocumentManagement/DocumentManagement';
import OutlookPA from '../container/OutlookPA';
const routes = [ const routes = [
{ {
...@@ -38,14 +38,14 @@ const routes = [ ...@@ -38,14 +38,14 @@ const routes = [
path: "/home/master-budget", path: "/home/master-budget",
main: BudgetTahunan main: BudgetTahunan
}, },
{
path: "/home/outlook-performance",
main: OutlookPA
},
{ {
path: "/home/rolling-outlook", path: "/home/rolling-outlook",
main: RollingOutlook main: RollingOutlook
}, },
{
path: "/home/outlook-performance",
main: OutlookPA
},
{ {
path: "/home/profile", path: "/home/profile",
main: Profile main: Profile
......
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