Skip to content

T
Tia-dev
Commit 0a403cf3 authored by Dida Adams Arizona's avatar Dida Adams Arizona
Browse files
Options

Merge branch 'didam' into 'master' 

apdet

See merge request !466
parents 7d5fa451 4ed7df1f
Show whitespace changes
Inline Side-by-side
Showing with 436 additions and 4 deletions
src/api/index.js
View file @ 0a403cf3
...@@ -215,6 +215,7 @@ const create = (type = "") => { ...@@ -215,6 +215,7 @@ 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)
...@@ -389,6 +390,7 @@ const create = (type = "") => { ...@@ -389,6 +390,7 @@ const create = (type = "") => {
getLastPeriod, getLastPeriod,
getSubmitMasterBudget, getSubmitMasterBudget,
createPeriodeRevision, createPeriodeRevision,
getLastestUpdateOI,
getOutlookPAID, getOutlookPAID,
getLastPeriodOLPA, getLastPeriodOLPA,
getCompanySubmittedOLPA, getCompanySubmittedOLPA,
......
src/container/MonthlyReport.js
View file @ 0a403cf3
...@@ -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)}
/> />
)} )}
......
src/container/MonthlyReport/ProfitLossMR.js 0 → 100644
View file @ 0a403cf3
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>
)
}
}
src/container/OprIndicator/OperatingIndicatorDetail.js
View file @ 0a403cf3
...@@ -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">
......
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