Skip to content

T
Tia-dev
Commit 24453840 authored by Deni Rinaldi's avatar Deni Rinaldi
Browse files
Options

Merge branch 'riri' into 'master' 

upload PL

See merge request !304
parents 56a6e542 a2206407
Show whitespace changes
Inline Side-by-side
Showing with 443 additions and 178 deletions
src/container/BudgetTahunan/ProfitLoss.js
View file @ 24453840
...@@ -8,6 +8,8 @@ import { values } from 'ramda'; ...@@ -8,6 +8,8 @@ import { values } from 'ramda';
import PropagateLoader from "react-spinners/PropagateLoader" import PropagateLoader from "react-spinners/PropagateLoader"
import Images from '../../assets/Images'; import Images from '../../assets/Images';
import ReactTooltip from 'react-tooltip'; import ReactTooltip from 'react-tooltip';
import UploadFile from "../../library/Upload";
import { ExcelRenderer } from 'react-excel-renderer';
var ct = require("../../library/CustomTable"); var ct = require("../../library/CustomTable");
const getMuiTheme = () => createMuiTheme(ct.customTable3()); const getMuiTheme = () => createMuiTheme(ct.customTable3());
...@@ -40,9 +42,12 @@ export default class ProfitLoss extends Component { ...@@ -40,9 +42,12 @@ export default class ProfitLoss extends Component {
// ["Notes Receivable", "", ""], // ["Notes Receivable", "", ""],
// ["Accounts Receivable", "172,031", "97,112"], // ["Accounts Receivable", "172,031", "97,112"],
// ["Trade Receivables - Third Party", "142,668", "77,480"], // ["Trade Receivables - Third Party", "142,668", "77,480"],
] ],
visibleProfitLoss: true,
disabledSave: true
} }
this.handleValue = this.handleValue.bind(this) this.handleValue = this.handleValue.bind(this)
this.fileHandler = this.fileHandler.bind(this);
} }
componentDidMount() { componentDidMount() {
...@@ -65,6 +70,7 @@ export default class ProfitLoss extends Component { ...@@ -65,6 +70,7 @@ export default class ProfitLoss extends Component {
if (response.data.status === "success") { if (response.data.status === "success") {
let dataTable = [] let dataTable = []
response.data.data.map((item, index) => { response.data.data.map((item, index) => {
if (item.children && item.children.length > 0) { if (item.children && item.children.length > 0) {
dataTable.push([ dataTable.push([
item.type_report_id, item.type_report_id,
...@@ -697,7 +703,7 @@ export default class ProfitLoss extends Component { ...@@ -697,7 +703,7 @@ export default class ProfitLoss extends Component {
]) ])
} }
}) })
// console.log(dataTable); console.log(dataTable);
this.setState({ loading: false, dataTable }) this.setState({ loading: false, dataTable })
} }
} else { } else {
...@@ -772,7 +778,7 @@ export default class ProfitLoss extends Component { ...@@ -772,7 +778,7 @@ export default class ProfitLoss extends Component {
"status": type, "status": type,
"profit_loss": data "profit_loss": data
} }
console.log(data); // console.log(data);
this.props.saveToMasterBudget(payload) this.props.saveToMasterBudget(payload)
this.props.onClickClose() this.props.onClickClose()
} }
...@@ -792,6 +798,121 @@ export default class ProfitLoss extends Component { ...@@ -792,6 +798,121 @@ export default class ProfitLoss extends Component {
} }
} }
fileHandler = (event) => {
let fileObj = event
ExcelRenderer(fileObj, (err, resp) => {
if (err) {
console.log(err);
}
else {
let isi = resp.rows.slice(3)
console.log(isi);
let payload = []
isi.map((i, index) => {
if (i.length > 0) {
payload.push({
item_report_id: i[0] === undefined ? "" : String(i[0]).trim(),
item_report: i[1] === undefined ? "" : String(i[1]).trim(),
notes: i[2] === undefined ? "" : String(i[2]).trim(),
total_actual_before: i[3] === undefined ? "" : String(i[3]).trim(),
january: i[4] === undefined ? "" : String(i[4]).trim(),
february: i[5] === undefined ? "" : String(i[5]).trim(),
march: i[6] === undefined ? "" : String(i[6]).trim(),
april: i[7] === undefined ? "" : String(i[7]).trim(),
may: i[8] === undefined ? "" : String(i[8]).trim(),
june: i[9] === undefined ? "" : String(i[9]).trim(),
july: i[10] === undefined ? "" : String(i[10]).trim(),
august: i[11] === undefined ? "" : String(i[11]).trim(),
september: i[12] === undefined ? "" : String(i[12]).trim(),
october: i[13] === undefined ? "" : String(i[13]).trim(),
november: i[14] === undefined ? "" : String(i[14]).trim(),
december: i[15] === undefined ? "" : String(i[15]).trim(),
total_current_year: i[16] === undefined ? "" : String(i[16]).trim(),
total_next_year: i[17] === undefined ? "" : String(i[17]).trim(),
total_more_year: i[18] === undefined ? "" : String(i[18]).trim()
})
}
})
let rows = isi.map((i, index) => {
return [
String(i[0]) === '-' ? 4 : 3,
0,
0,
"",
1,
i[0] === undefined ? "" : String(i[0]),
i[1] === undefined ? "" : String(i[1]),
i[2] === undefined ? "" : String(i[2]),
i[3] === undefined ? "" : String(i[3]),
i[4] === undefined ? "" : String(i[4]),
i[5] === undefined ? "" : String(i[5]),
i[6] === undefined ? "" : String(i[6]),
i[7] === undefined ? "" : String(i[7]),
i[8] === undefined ? "" : String(i[8]),
i[9] === undefined ? "" : String(i[9]),
i[10] === undefined ? "" : String(i[10]),
i[11] === undefined ? "" : String(i[11]),
i[12] === undefined ? "" : String(i[12]),
i[13] === undefined ? "" : String(i[13]),
i[14] === undefined ? "" : String(i[14]),
i[15] === undefined ? "" : String(i[15]),
i[16] === undefined ? "" : String(i[16]),
i[17] === undefined ? "" : String(i[17])
]
})
let body = {
company_id: this.props.company.company_id,
periode: this.props.periode,
report_id: this.props.report_id,
profit_loss: payload
}
// console.log(JSON.stringify(body))
this.setState({ payload: body, buttonError: false, judul: resp.rows[1][0] })
}
});
}
checkUpload() {
api.create().checkUploadMB(this.state.payload).then(response => {
console.log(JSON.stringify(this.state.payload));
console.log(response)
if (response.data) {
if (response.data.status === 'success') {
this.setState({ visibleUpload: false, visibleProfitLoss: false, loading: true })
let dataTable = response.data.data.map((item, index) => {
return [
item.type_report_id,
item.item_report_id,
item.parent,
item.formula,
item.level,
item.item_report,
item.notes,
item.total_actual_before,
item.january,
item.february,
item.march,
item.april,
item.may,
item.june,
item.july,
item.august,
item.september,
item.october,
item.november,
item.december,
item.total_current_year,
item.total_next_year,
item.total_more_year,
item.error
]
})
this.setState({ dataTable, dataLoaded: true, loading: false })
}
}
})
}
render() { render() {
let dataTable2 = this.state.dataTable let dataTable2 = this.state.dataTable
const handleChange = (value, tableMeta) => { const handleChange = (value, tableMeta) => {
...@@ -907,13 +1028,42 @@ export default class ProfitLoss extends Component { ...@@ -907,13 +1028,42 @@ export default class ProfitLoss extends Component {
customBodyRender: (val, tableMeta) => { customBodyRender: (val, tableMeta) => {
return ( return (
<div style={{ width: 300 }}> <div style={{ width: 300 }}>
{tableMeta.rowData[4] == 0 ? {tableMeta.rowData[23] ?
tableMeta.rowData[23].length > 0 ?
tableMeta.rowData[23][0].field === 'item' ?
tableMeta.rowData[4] == 0 ?
<a data-tip={tableMeta.rowData[23][0].message} data-for="account">
<span style={{ fontSize: 12, fontWeight: 'bold', color: 'red' }}>{String(tableMeta.rowData[0] === 4 ? "" : val).toUpperCase()}</span>
</a>
:
<div style={{ paddingLeft: 20 * Number(tableMeta.rowData[4]) }}>
<a data-tip={tableMeta.rowData[23][0].message} data-for="account">
<span style={{ fontSize: 12, color: 'red' }}>{tableMeta.rowData[0] === 4 ? "" : val}</span>
</a>
</div>
:
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>
:
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>
:
tableMeta.rowData[4] == 0 ?
<span style={{ fontSize: 12, fontWeight: 'bold' }}>{String(tableMeta.rowData[0] === 4 ? "" : val).toUpperCase()}</span> <span style={{ fontSize: 12, fontWeight: 'bold' }}>{String(tableMeta.rowData[0] === 4 ? "" : val).toUpperCase()}</span>
: :
<div style={{ paddingLeft: 20 * Number(tableMeta.rowData[4]) }}> <div style={{ paddingLeft: 20 * Number(tableMeta.rowData[4]) }}>
<span style={{ fontSize: 12 }}>{tableMeta.rowData[0] === 4 ? "" : val}</span> <span style={{ fontSize: 12 }}>{tableMeta.rowData[0] === 4 ? "" : val}</span>
</div> </div>
} }
<ReactTooltip border={true} id="account" place="bottom" type="light" effect="solid" />
</div> </div>
) )
} }
...@@ -2331,6 +2481,12 @@ export default class ProfitLoss extends Component { ...@@ -2331,6 +2481,12 @@ export default class ProfitLoss extends Component {
) )
} }
} }
},
{
name: "",
options: {
display: false
}
} }
] ]
const loadingComponent = ( const loadingComponent = (
...@@ -2351,6 +2507,7 @@ export default class ProfitLoss extends Component { ...@@ -2351,6 +2507,7 @@ export default class ProfitLoss extends Component {
</div> </div>
{this.state.loading && loadingComponent} {this.state.loading && loadingComponent}
<div style={{ flex: 1, padding: 20, width: '100%' }}> <div style={{ flex: 1, padding: 20, width: '100%' }}>
{this.state.visibleProfitLoss === true ?
<Paper style={{ paddingTop: 10, paddingBottom: 20 }}> <Paper style={{ paddingTop: 10, paddingBottom: 20 }}>
<div style={{ borderBottom: 'solid 1px #c4c4c4' }} > <div style={{ borderBottom: 'solid 1px #c4c4c4' }} >
<Typography style={{ fontSize: '12px', color: '#4b4b4b', margin: 10 }}>Budget Tahunan - Profit & Loss</Typography> <Typography style={{ fontSize: '12px', color: '#4b4b4b', margin: 10 }}>Budget Tahunan - Profit & Loss</Typography>
...@@ -2386,7 +2543,7 @@ export default class ProfitLoss extends Component { ...@@ -2386,7 +2543,7 @@ export default class ProfitLoss extends Component {
borderColor: 'transparent', borderColor: 'transparent',
margin: 5 margin: 5
}} }}
onClick={() => null} onClick={() => this.setState({ visibleUpload: true })}
> >
<img src={Images.upload} /> <img src={Images.upload} />
</button> </button>
...@@ -2411,13 +2568,13 @@ export default class ProfitLoss extends Component { ...@@ -2411,13 +2568,13 @@ export default class ProfitLoss extends Component {
</div> </div>
<div style={{ marginTop: 20, width: this.props.width - (this.props.open === true ? 400 : 150), height: this.props.height - 400 }}> <div style={{ marginTop: 20, width: this.props.width - (this.props.open === true ? 400 : 150), height: this.props.height - 400 }}>
<MuiThemeProvider theme={getMuiTheme()}> {!this.state.loading && <MuiThemeProvider theme={getMuiTheme()}>
<MUIDataTable <MUIDataTable
data={dataTable2} data={dataTable2}
columns={columns} columns={columns}
options={options} options={options}
/> />
</MuiThemeProvider> </MuiThemeProvider>}
</div> </div>
</div> </div>
<div className="grid grid-2x" style={{ marginTop: 20 }}> <div className="grid grid-2x" style={{ marginTop: 20 }}>
...@@ -2445,27 +2602,95 @@ export default class ProfitLoss extends Component { ...@@ -2445,27 +2602,95 @@ export default class ProfitLoss extends Component {
backgroundColor: 'transparent', backgroundColor: 'transparent',
cursor: 'pointer', cursor: 'pointer',
borderColor: 'transparent', borderColor: 'transparent',
outline: 'none' outline: 'none',
marginRight: 20
}} }}
onClick={() => { onClick={() => {
this.props.onClickClose() this.props.onClickClose()
}} }}
> >
<div style={{ backgroundColor: '#fff', width: 105, height: 25, borderRadius: 3, justifyContent: 'center', display: 'flex', alignItems: 'center', border: 'solid 1px #354960', marginRight: 20 }}> <div style={{ backgroundColor: '#fff', width: 105, height: 25, borderRadius: 3, justifyContent: 'center', display: 'flex', alignItems: 'center', border: 'solid 1px #354960' }}>
<Typography style={{ fontSize: '11px', color: '#354960', textAlign: 'center' }}>Cancel</Typography> <Typography style={{ fontSize: '11px', color: '#354960', textAlign: 'center' }}>Cancel</Typography>
</div> </div>
</button> </button>
<button <button
type="button" type="button"
disabled={this.state.disabledSave}
onClick={() => this.backToMasterBudget('submitted')} onClick={() => this.backToMasterBudget('submitted')}
style={{
backgroundColor: 'transparent',
cursor: this.state.disabledSave === true ? 'default' : 'pointer',
borderColor: 'transparent',
outline: 'none',
marginRight: 20
}}
>
<div style={{ backgroundColor: '#354960', width: 105, height: 25, borderRadius: 3, justifyContent: 'center', display: 'flex', alignItems: 'center' }}>
<Typography style={{ fontSize: '11px', color: '#fff', textAlign: 'center' }}>Save</Typography>
</div>
</button>
<button
className="button"
type="button"
style={{ style={{
backgroundColor: 'transparent', backgroundColor: 'transparent',
cursor: 'pointer', cursor: 'pointer',
borderColor: 'transparent', borderColor: 'transparent',
outline: 'none' outline: 'none'
}} }}
onClick={() => {
this.setState({ loading: true }, () => {
setTimeout(() => {
this.setState({ loading: false, disabledSave: false })
}, 100);
})
}}
>
<div style={{ backgroundColor: '#354960', width: 105, height: 25, borderRadius: 3, justifyContent: 'center', display: 'flex', alignItems: 'center' }}>
<Typography style={{ fontSize: '11px', color: '#fff', textAlign: 'center' }}>Calculate</Typography>
</div>
</button>
</div>
</div>
</Paper>
:
<Paper style={{ paddingTop: 10, paddingBottom: 20 }}>
<div>
<div style={{ padding: 25 }}>
<div>
<Typography style={{ fontSize: '11px', color: '#4b4b4b' }}>{this.props.company.company_name}</Typography>
<Typography style={{ fontSize: '11px', color: '#4b4b4b' }}>Periode : {this.props.periode}</Typography>
<Typography style={{ fontSize: '11px', color: '#4b4b4b' }}>in IDR mn</Typography>
</div>
{this.state.dataLoaded && (
<div style={{ marginTop: 20, width: this.props.width - (this.props.open === true ? 400 : 150), height: this.props.height - 400 }}>
{!this.state.loading && <MuiThemeProvider theme={getMuiTheme()}>
<MUIDataTable
data={dataTable2}
columns={columns}
options={options}
/>
</MuiThemeProvider>}
</div>
)}
</div>
<div style={{ display: 'flex', width: '100%', placeContent: 'flex-end', padding: 20 }}>
<button
type="button"
onClick={() => this.setState({ visibleProfitLoss: true }, () => this.getItemHierarki())}
style={{ marginRight: 20 }}
>
<div style={{ backgroundColor: '#fff', width: 105, height: 25, borderRadius: 3, justifyContent: 'center', display: 'flex', alignItems: 'center', border: 'solid 1px #354960'}}>
<Typography style={{ fontSize: '11px', color: '#354960', textAlign: 'center' }}>Cancel</Typography>
</div>
</button>
<button
type="button"
disabled={this.state.buttonError == true ? true : false}
onClick={() => null}
style={{ marginRight: 20 }}
> >
<div style={{ backgroundColor: '#354960', width: 105, height: 25, borderRadius: 3, justifyContent: 'center', display: 'flex', alignItems: 'center', marginRight: 20 }}> <div style={{ backgroundColor: '#354960', width: 105, height: 25, borderRadius: 3, justifyContent: 'center', display: 'flex', alignItems: 'center' }}>
<Typography style={{ fontSize: '11px', color: '#fff', textAlign: 'center' }}>Save</Typography> <Typography style={{ fontSize: '11px', color: '#fff', textAlign: 'center' }}>Save</Typography>
</div> </div>
</button> </button>
...@@ -2479,7 +2704,11 @@ export default class ProfitLoss extends Component { ...@@ -2479,7 +2704,11 @@ export default class ProfitLoss extends Component {
outline: 'none' outline: 'none'
}} }}
onClick={() => { onClick={() => {
this.forceUpdate() this.setState({ loading: true }, () => {
setTimeout(() => {
this.setState({ loading: false, buttonError: false })
}, 100);
})
}} }}
> >
<div style={{ backgroundColor: '#354960', width: 105, height: 25, borderRadius: 3, justifyContent: 'center', display: 'flex', alignItems: 'center' }}> <div style={{ backgroundColor: '#354960', width: 105, height: 25, borderRadius: 3, justifyContent: 'center', display: 'flex', alignItems: 'center' }}>
...@@ -2489,7 +2718,47 @@ export default class ProfitLoss extends Component { ...@@ -2489,7 +2718,47 @@ export default class ProfitLoss extends Component {
</div> </div>
</div> </div>
</Paper> </Paper>
}
</div>
{this.state.visibleUpload && (
<div className="test app-popup-show">
<div className="popup-content background-white border-radius" style={{ borderRadius: 8 }}>
<div className="popup-panel grid grid-2x main-color" style={{ height: 64, borderTopRightRadius: 8, borderTopLeftRadius: 8 }}>
<div className="col-1" style={{ maxWidth: "inherit", display: 'flex', alignItems: 'center' }}>
<div className="popup-title">
<span style={{ color: '#fff', fontSize: 16, fontWeight: 'bold' }}>Upload File</span>
</div>
</div>
<div className="col-2 content-right" style={{ maxWidth: "inherit", alignSelf: 'center' }}>
<button
type="button"
className="btn btn-circle btn-white"
onClick={() => this.setState({ visibleUpload: false })}
>
<img src={Images.close} />
</button>
</div> </div>
</div>
<UploadFile
type={this.state.uploadStatus}
percentage={this.state.percentage}
result={this.state.result}
acceptedFiles={["xlsx"]}
onHandle={(dt) => {
this.fileHandler(dt)
this.setState({ uploadStatus: 'idle', percentage: '0' })
}}
onUpload={() => {
this.state.judul === "MASTER BUDGET - PROFIT LOSS" ?
this.checkUpload() :
this.setState({ alert: true, messageAlert: "Invalid Template", tipeAlert: 'warning' })
}}
/>
</div>
</div>
)}
</div > </div >
); );
} }
......
src/container/OperatingIndicator.js
View file @ 24453840
...@@ -2,14 +2,9 @@ import React, { Component } from 'react'; ...@@ -2,14 +2,9 @@ import React, { Component } from 'react';
import { Typography, Paper, TextField, MenuItem, Select, FormControlLabel } from '@material-ui/core'; import { Typography, Paper, TextField, MenuItem, Select, FormControlLabel } 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 './BudgetTahunan/BalanceSheet';
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 FixedAssetsMovement from './BudgetTahunan/FixedAssetsMovement';
import CorporateAnnualTarget from './BudgetTahunan/CorporateAnnualTarget';
import { ExcelRenderer } from 'react-excel-renderer'; 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';
...@@ -207,40 +202,41 @@ export default class OperatingIndicator extends Component { ...@@ -207,40 +202,41 @@ export default class OperatingIndicator extends Component {
render() { render() {
const columns = ["#", "Jenis Laporan", const columns = ["#", "Jenis Laporan",
// {
// name: "Revision",
// options: {
// customBodyRender: (val, tableMeta, updateValue) => {
// var list = [];
// for (var i = 0; i <= tableMeta.rowData[6]; i++) {
// list.push(i);
// }
// return (
// <div style={{ display: 'flex' }}>
// <FormControlLabel
// style={{ margin: 0 }}
// value={val}
// control={
// <Select
// value={val}
// onChange={event => {
// // console.log(event.target)
// updateValue(event.target.value)
// this.handleChange(event.target.value, tableMeta)
// }}
// autoWidth
// >
// {list.map((item, index) =>
// <MenuItem key={index} value={item}>{item}</MenuItem>
// )}
// </Select>
// }
// />
// </div >
// );
// }
// }
// },
{ {
name: "Revision",
options: {
customBodyRender: (val, tableMeta, updateValue) => {
var list = [];
for (var i = 0; i <= tableMeta.rowData[6]; i++) {
list.push(i);
}
return (
<div style={{ display: 'flex' }}>
<FormControlLabel
style={{ margin: 0 }}
value={val}
control={
<Select
value={val}
onChange={event => {
// console.log(event.target)
updateValue(event.target.value)
this.handleChange(event.target.value, tableMeta)
}}
autoWidth
>
{list.map((item, index) =>
<MenuItem key={index} value={item}>{item}</MenuItem>
)}
</Select>
}
/>
</div >
);
}
}
}, {
name: "Status", name: "Status",
options: { options: {
customBodyRender: (val, tableMeta) => { customBodyRender: (val, tableMeta) => {
...@@ -377,7 +373,7 @@ export default class OperatingIndicator extends Component { ...@@ -377,7 +373,7 @@ export default class OperatingIndicator extends Component {
value={this.state.company} value={this.state.company}
/> />
</div> </div>
<div style={{ marginTop: 20 }}> {/* <div style={{ marginTop: 20 }}>
<Autocomplete <Autocomplete
{...this.state.listRevision} {...this.state.listRevision}
id="revision" id="revision"
...@@ -391,7 +387,7 @@ export default class OperatingIndicator extends Component { ...@@ -391,7 +387,7 @@ export default class OperatingIndicator extends Component {
renderInput={(params) => <TextField {...params} label="Revision" margin="normal" style={{ marginTop: 7 }} />} renderInput={(params) => <TextField {...params} label="Revision" margin="normal" style={{ marginTop: 7 }} />}
value={this.state.revision} value={this.state.revision}
/> />
</div> </div> */}
<div style={{ marginTop: 20 }}> <div style={{ marginTop: 20 }}>
<MUIDataTable <MUIDataTable
......
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