Skip to content

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

Merge branch 'rifka' into 'master' 

update bahasa dan layout tax planning

See merge request !190
parents 88eea993 36599645
Show whitespace changes
Inline Side-by-side
Showing with 349 additions and 104 deletions
src/container/ApprovalMatrix/CreateApprovalMatrix.js
View file @ a2e7d408
......@@ -71,7 +71,7 @@ export default class CreateApprovalMatrix extends Component {
};
this.setState({ approvedBy: defaultProps, userData: response.data.data})
} else {
alert('Approver: ' +response.data.message)
alert('Approver Name: ' +response.data.message)
}
})
}
......@@ -157,22 +157,22 @@ export default class CreateApprovalMatrix extends Component {
validasi() {
if (R.isNil(this.state.typeId)) {
this.setState({ errorType: true, msgErrType: 'Approval Type is Required' })
this.setState({ errorType: true, msgErrType: 'Approval Type Cannot be Empty' })
}
else if (R.isEmpty(this.state.order)) {
this.setState({ errorOrder: true, msgErrOrder: 'Order is Required'})
this.setState({ errorOrder: true, msgErrOrder: 'Order Cannot be Empty'})
}
else if (R.isNil(this.state.userId)) {
// return alert("Pemberi Persetujuan tidak boleh kosong");
this.setState({ errorApproved: true, msgErrApproved: 'Approver is Required' })
this.setState({ errorApproved: true, msgErrApproved: 'Approver Name Cannot be Empty' })
}
else if (R.isNil(this.state.operatorId)) {
this.setState({ errorOperator: true, msgErrOperator: 'Operator is Required' })
this.setState({ errorOperator: true, msgErrOperator: 'Operator Cannot be Empty' })
}
else if (R.isNil(this.state.startDate)) {
this.setState({ errorStartDate: true, msgErrorStartDate: 'Start Date is Required' })
this.setState({ errorStartDate: true, msgErrorStartDate: 'Valid From Cannot be Empty' })
} else if (R.isNil(this.state.endDate)) {
this.setState({ errorEndDate: true, msgErrorEndDate: 'End Date is Required' })
this.setState({ errorEndDate: true, msgErrorEndDate: 'Valid To Cannot be Empty' })
} else {
console.log('masuk');
let payload = {
......@@ -299,7 +299,7 @@ export default class CreateApprovalMatrix extends Component {
debug
renderInput={(params) =>
<TextField {...params}
label="Approver"
label="Approver Name"
onChange={(e) => this.handleChange(e, '')}
error={this.state.errorApproved}
helperText={this.state.msgErrApproved}
......@@ -353,7 +353,7 @@ export default class CreateApprovalMatrix extends Component {
<DatePicker
margin="normal"
id="startDate"
label="Start Date"
label="Valid From"
format="dd MMMM yyyy"
value={this.state.startDate == "" ? null : this.state.startDate}
onChange={(e) => this.handleChange(e, 'start_date')}
......@@ -382,7 +382,7 @@ export default class CreateApprovalMatrix extends Component {
<DatePicker
margin="normal"
id="endDate"
label="End Date"
label="Valid To"
format="dd MMMM yyyy"
value={this.state.endDate == "" ? null : this.state.endDate}
error={this.state.errorEndDate}
......
src/container/ApprovalMatrix/EditApprovalMatrix.js
View file @ a2e7d408
......@@ -176,21 +176,21 @@ export default class EditApprovalMatrix extends Component {
validasi() {
if (R.isNil(this.state.getTypes)) {
this.setState({ errorType: true, msgErrType: 'Approval Type is Required' })
this.setState({ errorType: true, msgErrType: 'Approval Type Cannot be Empty' })
}
else if (R.isEmpty(this.state.order)) {
this.setState({ errorOrder: true, msgErrOrder: 'Order is Required'})
this.setState({ errorOrder: true, msgErrOrder: 'Order Cannot be Empty'})
}
else if (R.isNil(this.state.getApprovedBy)) {
this.setState({ errorApproved: true, msgErrApproved: 'Approver is Required' })
this.setState({ errorApproved: true, msgErrApproved: 'Approver Name Cannot be Empty' })
}
else if (R.isNil(this.state.getOperators)) {
this.setState({ errorOperator: true, msgErrOperator: 'Operator is Required' })
this.setState({ errorOperator: true, msgErrOperator: 'Operator Cannot be Empty' })
}
else if (R.isEmpty(this.state.startDate)) {
this.setState({ errorStartDate: true, msgErrorStartDate: 'Start Date is Required' })
this.setState({ errorStartDate: true, msgErrorStartDate: 'Valid From Cannot be Empty' })
} else if (R.isEmpty(this.state.endDate)) {
this.setState({ errorEndDate: true, msgErrorEndDate: 'End Date is Required' })
this.setState({ errorEndDate: true, msgErrorEndDate: 'Valid To Cannot be Empty' })
} else {
console.log('masuk');
if (this.props.type == 'edit') {
......@@ -319,7 +319,7 @@ export default class EditApprovalMatrix extends Component {
onChange={(event, newInputValue) => this.setState({getApprovedBy: newInputValue}, ()=> this.clearError())}
renderInput={(params) =>
<TextField {...params}
label="Approver"
label="Approver Name"
onChange={(e) => this.handleChange(e, '')}
error={this.state.errorApproved}
helperText={this.state.msgErrApproved}
......@@ -373,7 +373,7 @@ export default class EditApprovalMatrix extends Component {
<DatePicker
margin="normal"
id="startDate"
label="Start Date"
label="Valid From"
format="dd MMMM yyyy"
value={this.state.startDate}
onChange={(e) => this.handleChange(e, 'start_date')}
......@@ -402,7 +402,7 @@ export default class EditApprovalMatrix extends Component {
<DatePicker
margin="normal"
id="endDate"
label="End Date"
label="Valid To"
format="dd MMMM yyyy"
error={this.state.errorEndDate}
helperText={this.state.msgErrorEndDate}
......
src/container/BudgetTahunan.js
View file @ a2e7d408
......@@ -326,6 +326,8 @@ export default class BudgetTahunan extends Component {
)}
{this.state.visibleTP && (
<TaxPlanning
report_id={this.state.report_id}
company={this.state.company}
onClickClose={() => this.setState({ visibleTP: false, visibleBudgetTahunan: true })}
/>
)}
......
src/container/BudgetTahunan/TaxPlanning.js
View file @ a2e7d408
......@@ -4,10 +4,11 @@ import MUIDataTable from 'mui-datatables';
import NumberFormat from 'react-number-format';
import Images from '../../assets/Images';
import ReactTooltip from 'react-tooltip';
import api from '../../api';
var ct = require("../../library/CustomTable");
const getMuiTheme = () => createMuiTheme(ct.customTable());
const options = ct.customOptions();
const options = ct.customOptionsFixedColumn();
const style = {
position: "sticky",
......@@ -15,9 +16,163 @@ const style = {
background: "white",
zIndex: 101,
};
export default class BalanceSheet extends Component {
const style2 = {
position: "sticky",
left: 420,
background: "white",
zIndex: 101
};
export default class TaxPlanning extends Component {
constructor(props) {
super(props)
this.state = {
dataTable: [
// ["TOTAL ASSETS", "11,247,249", "10,702,196"],
// ["TOTAL CURRENT ASSETS", "2,647,647", "2,058,898"],
// ["Cash & Cash Equivalent", "1,464,571", "729,743"],
// ["Cash & Bank Balance", "938,707", "265,584"],
// ["Time & Call Deposit", "525,864", "464,159"],
// ["BI Deposit", "", ""],
// ["Marketable Securities", "150,250", "154,500"],
// ["Notes Receivable", "", ""],
// ["Accounts Receivable", "172,031", "97,112"],
// ["Trade Receivables - Third Party", "142,668", "77,480"],
]
}
}
componentDidMount() {
this.getItemHierarki()
console.log(this.props);
}
getItemHierarki() {
let payload = {
"report_id": this.props.report_id,
"company_id": this.props.company.company_id
}
api.create().getItemReportHierarki(payload).then(response => {
console.log(response);
if (response.data) {
if (response.data.status === "success") {
let dataTable = []
response.data.data.map((item, index) => {
if (item.children && item.children.length > 0) {
dataTable.push([
item.type_report_id,
item.id,
item.parent,
item.level,
item.description
])
item.children.map(i => {
if (i.children) {
if (i.children.length > 0) {
dataTable.push([
i.type_report_id,
i.id,
i.parent,
i.level,
i.description
])
i.children.map(val => {
dataTable.push([
val.type_report_id,
val.id,
val.parent,
val.level,
val.description
])
})
} else {
dataTable.push([
i.type_report_id,
i.id,
i.parent,
i.level,
i.description
])
}
} else {
dataTable.push([
i.type_report_id,
i.id,
i.parent,
i.level,
i.description
])
}
})
} else {
dataTable.push([
item.type_report_id,
item.id,
item.parent,
item.level,
item.description
])
}
})
console.log(dataTable);
this.setState({ dataTable })
}
}
})
}
handleValue(data) {
let total = 0
this.state.dataTable.map((item,index) => {
if (data.rowData[1] == item[2]) {
total = item[6] == undefined? (total + 0) : (total + item[6])
}
})
let indexParent = this.state.dataTable.findIndex((val) => val[1] == this.state.dataTable[data.rowIndex][2])
let a = this.state.dataTable[data.rowIndex][data.columnIndex] = total
// console.log(indexParent);
return a
}
handleChange(value, tableMeta) {
let data = this.state.dataTable
let indexParent = data.findIndex((val) => val[1] == data[tableMeta.rowIndex][2])
// console.log(indexParent);
if (indexParent > 0) {
let a = data[tableMeta.rowIndex][tableMeta.columnIndex] = Number(value)
let jagain = data[indexParent][tableMeta.columnIndex]
a = data[indexParent][tableMeta.columnIndex] = jagain == undefined? (0 + Number(value)) : (jagain + Number(value))
} else {
let a = data[tableMeta.rowIndex][tableMeta.columnIndex] = Number(value)
}
// this.setState({
// data: a,
// }, () => console.log(this.state.dataTable))
}
render() {
const columns = [{
name: "",
options: {
display: false
}
},{
name: "",
options: {
display: false
}
},{
name: "",
options: {
display: false
}
},{
name: "",
options: {
display: false
}
},{
name: "Account",
options: {
customHeadRender: (columnMeta) => (
......@@ -29,32 +184,94 @@ export default class BalanceSheet extends Component {
customBodyRender: (val, tableMeta) => {
return (
<div style={{ width: 388 }}>
{tableMeta.rowIndex == 0 || tableMeta.rowIndex == 1 ?
<span style={{ fontSize: 12, fontWeight: 'bold' }}>{val}</span>
{tableMeta.rowData[3] == 0 ?
<span style={{ fontSize: 12, fontWeight: 'bold' }}>{String(val).toUpperCase()}</span>
:
tableMeta.rowIndex == 2 || tableMeta.rowIndex == 6 || tableMeta.rowIndex == 7 || tableMeta.rowIndex == 8 ?
<span style={{ fontSize: 12, marginLeft: 10 }}>{val}</span> :
<span style={{ fontSize: 12, marginLeft: 20 }}>{val}</span>
tableMeta.rowData[3] === 1?
<span style={{ fontSize: 12, marginLeft: 20 }}>{val}</span> :
<span style={{ fontSize: 12, marginLeft: 40 }}>{val}</span>
}
</div>
)
}
}
}, {
name: "Jan 21",
name: "31 Dec 2020 Actual",
options: {
customHeadRender: (columnMeta) => (
<TableCell key={columnMeta.index} style={{ ...style2, top: 0, zIndex: 102, backgroundColor: '#354960', width: 96 }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
</TableCell>
),
setCellProps: () => ({
style: {
position: "sticky",
left: 420,
background: "white",
zIndex: 101
}
})
}
}, {
name: "January 2021",
options: {
customHeadRender: (columnMeta) => (
<TableCell style={{ backgroundColor: '#354960', width: 96 }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
</TableCell>
),
customBodyRender: (value, tableMeta, updateValue) => {
console.log(tableMeta)
return (
<div style={{ textAlign: 'right' }}>
{tableMeta.rowData[0] === 4 ?
<div style={{ flex: 1 }}>
<FormControlLabel
style={{ margin: 0 }}
value={value}
control={
<NumberFormat
thousandSeparator={true}
style={{ color: "#5198ea", fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
type="text"
placeholder=""
value={value}
onChange={event => {
// console.log(event.target)
updateValue(event.target.value)
this.handleChange(event.target.value, tableMeta)
}}
/>
}
/>
</div> :
tableMeta.rowData[0] === 2 ?
<span style={{ fontSize: 12, textAlign: 'right' }}>{this.handleValue(tableMeta)}</span>
:
tableMeta.rowData[0] === 1 ?
<span>-</span>
:
<span>validasi</span>
}
</div>
)
}
}
}, {
name: "February 2021",
options: {
filter: false,
customHeadRender: (columnMeta) => (
<th key={3} style={{ cursor: 'pointer', backgroundColor: '#354960', color: '#fff', fontSize: 13, fontWeight: 1 }} >
<th key={3} style={{ cursor: 'pointer', backgroundColor: '#354960', color: '#fff', fontSize: 13, fontWeight: 1, width: 150}} >
<div style={{ borderBottom: "1px #fff solid", textAlign: 'center' }}>{columnMeta.name}</div>
<div className="grid grid-3x" style={{ backgroundColor: '#354960', color: '#fff', fontSize: 13, fontWeight: 1, position: "sticky" }}>
<div style={{ width: '33%', placeSelf: 'center' }}>
<div style={{ placeSelf: 'center', textAlign: 'center', padding: 5 }}>
<span style={{ textAlign: 'center' }}>{"Trial Balance (Commercial) MTD"}</span>
</div>
<div style={{ width: '33%', placeSelf: 'center' }}>
<div style={{ placeSelf: 'center', textAlign: 'center', padding: 5 }}>
<span>{"Fiscal Correction Positive /(Negative)"}</span>
</div>
<div style={{ width: '33%', placeSelf: 'center' }}>
<div style={{ placeSelf: 'center', textAlign: 'center', padding: 5 }}>
<span>{"Trial Balance (Fiscal) MTD"}</span>
</div>
</div>
......@@ -79,94 +296,120 @@ export default class BalanceSheet extends Component {
}
}
}, {
name: "Feb 21",
name: "March 2021",
options: {
filter: false,
customHeadRender: (columnMeta) => (
<th key={3} style={{ cursor: 'pointer', backgroundColor: '#354960', color: '#fff', fontSize: 13, fontWeight: 1 }} >
<div style={{ borderBottom: "1px #fff solid", textAlign: 'center' }}>{columnMeta.name}</div>
<div className="grid grid-3x" style={{ backgroundColor: '#354960', color: '#fff', fontSize: 13, fontWeight: 1, position: "sticky" }}>
<div style={{ width: '33%', placeSelf: 'center' }}>
<span style={{ textAlign: 'center' }}>{"Trial Balance (Commercial) MTD"}</span>
</div>
<div style={{ width: '33%', placeSelf: 'center' }}>
<span>{"Fiscal Correction Positive /(Negative)"}</span>
</div>
<div style={{ width: '33%', placeSelf: 'center' }}>
<span>{"Trial Balance (Fiscal) MTD"}</span>
</div>
</div>
</th>
<TableCell style={{ backgroundColor: '#354960', width: 96 }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
</TableCell>
),
customBodyRender: (val) => {
return (
<div>
<div className="grid grid-3x content-center">
<div className="col-1">
<div style={{ width: 96 }}>
{val}
</div>
<div className="col-2">
)
}
}
}, {
name: "April 2021",
options: {
customHeadRender: (columnMeta) => (
<TableCell style={{ backgroundColor: '#354960', width: 96 }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
</TableCell>
),
customBodyRender: (val) => {
return (
<div style={{ width: 96 }}>
{val}
</div>
<div className="col-3">
)
}
}
}, {
name: "May 2021",
options: {
customHeadRender: (columnMeta) => (
<TableCell style={{ backgroundColor: '#354960', width: 96 }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
</TableCell>
),
customBodyRender: (val) => {
return (
<div style={{ width: 96 }}>
{val}
</div>
</div>
</div>
);
)
}
}
}, {
name: "Mar 21",
name: "June 2021",
options: {
filter: false,
customHeadRender: (columnMeta) => (
<th key={3} style={{ cursor: 'pointer', backgroundColor: '#354960', color: '#fff', fontSize: 13, fontWeight: 1 }} >
<div style={{ borderBottom: "1px #fff solid", textAlign: 'center' }}>{columnMeta.name}</div>
<div className="grid grid-3x" style={{ backgroundColor: '#354960', color: '#fff', fontSize: 13, fontWeight: 1, position: "sticky" }}>
<div style={{ width: '33%', placeSelf: 'center' }}>
<span style={{ textAlign: 'center' }}>{"Trial Balance (Commercial) MTD"}</span>
</div>
<div style={{ width: '33%', placeSelf: 'center' }}>
<span>{"Fiscal Correction Positive /(Negative)"}</span>
</div>
<div style={{ width: '33%', placeSelf: 'center' }}>
<span>{"Trial Balance (Fiscal) MTD"}</span>
</div>
</div>
</th>
<TableCell style={{ backgroundColor: '#354960', width: 96 }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
</TableCell>
),
customBodyRender: (val) => {
return (
<div>
<div className="grid grid-3x content-center">
<div className="col-1">
<div style={{ width: 96 }}>
{val}
</div>
<div className="col-2">
)
}
}
}, {
name: "31 Dec 2021 Total",
options: {
customHeadRender: (columnMeta) => (
<TableCell style={{ backgroundColor: '#354960', width: 96 }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
</TableCell>
),
customBodyRender: (val) => {
return (
<div style={{ width: 96 }}>
{val}
</div>
<div className="col-3">
)
}
}
}, {
name: "31 Dec 2022 Total",
options: {
customHeadRender: (columnMeta) => (
<TableCell style={{ backgroundColor: '#354960', width: 96 }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
</TableCell>
),
customBodyRender: (val) => {
return (
<div style={{ width: 96 }}>
{val}
</div>
)
}
}
}, {
name: "31 Dec 2023 Total",
options: {
customHeadRender: (columnMeta) => (
<TableCell style={{ backgroundColor: '#354960', width: 96 }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
</TableCell>
),
customBodyRender: (val) => {
return (
<div style={{ width: 96 }}>
{val}
</div>
</div>
);
)
}
}
}
}]
const dataTable = [
["TOTAL ASSETS", "11,247,249", "10,702,196"],
["TOTAL CURRENT ASSETS", "2,647,647", "2,058,898"],
["Cash & Cash Equivalent", "1,464,571", "729,743"],
["Cash & Bank Balance", "938,707", "265584"],
["Time & Call Deposit", "525,864", "464,159"],
["BI Deposit", "", ""],
["Marketable Securities", "150,250", "154,500"],
["Notes Receivable", "", ""],
["Accounts Receivable", "172,031", "97,112"],
["Trade Receivables - Third Party", "142,668", "77,480"],
]
return (
<div style={{ height: this.props.height }}>
<div class="main-color" style={{ height: 279, width: '100%' }} />
......@@ -177,7 +420,7 @@ export default class BalanceSheet extends Component {
<div style={{ display: 'flex', flexDirection: 'row', justifyContent: 'space-between', paddingRight: 25, paddingLeft: 25, marginTop: 45 }}>
{/* <label style={{ width: '20%', color: 'white', fontSize: 16, alignSelf: 'center', paddingTop: 8 }}>Master Budget - Tax Planning</label> */}
<div>
<Typography style={{ fontSize: '11px', color: 'white' }}>PT. XYZ</Typography>
<Typography style={{ fontSize: '11px', color: 'white' }}>{this.props.company.company_name} Company</Typography>
<Typography style={{ fontSize: '11px', color: 'white' }}>Periode : 2021</Typography>
<Typography style={{ fontSize: '11px', color: 'white' }}>in IDR mn</Typography>
</div>
......@@ -191,7 +434,7 @@ export default class BalanceSheet extends Component {
padding: 0,
margin: 5
}}
onClick={() => this.downloadFile()}
// onClick={() => this.downloadFile()}
>
<img src={Images.template} />
</button>
......@@ -207,7 +450,7 @@ export default class BalanceSheet extends Component {
padding: 0,
margin: 5
}}
onClick={() => this.setState({ visibleUpload: true })}
// onClick={() => this.setState({ visibleUpload: true })}
>
<img src={Images.upload} />
</button>
......@@ -223,7 +466,7 @@ export default class BalanceSheet extends Component {
padding: 0,
margin: 5
}}
onClick={() => this.downloadDataTable()}
// onClick={() => this.downloadDataTable()}
>
<img src={Images.download} />
</button>
......@@ -234,7 +477,7 @@ export default class BalanceSheet extends Component {
<div style={{ padding: 25, width: '100%' }}>
<MuiThemeProvider theme={getMuiTheme()}>
<MUIDataTable
data={dataTable}
data={this.state.dataTable}
columns={columns}
options={options}
/>
......
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