Skip to content

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

Merge branch 'didam' into 'master' 

Didam

See merge request !358
parents f45c11fc 7c8b1201
Hide whitespace changes
Inline Side-by-side
Showing with 230 additions and 98 deletions
src/container/BudgetTahunan/CorporateAnnualTarget.js
View file @ 842274e1
import React, { Component } from 'react';
import { Typography, Paper, createMuiTheme, MuiThemeProvider, TableCell, FormControlLabel, TextField, Input, withStyles, makeStyles, Snackbar } from '@material-ui/core';
import { Typography, Paper, createMuiTheme, ThemeProvider, MuiThemeProvider, TableCell, FormControlLabel, TextField, Input, withStyles, makeStyles, Snackbar } from '@material-ui/core';
import MUIDataTable from 'mui-datatables';
import NumberFormat from 'react-number-format';
import api from '../../api';
......@@ -38,7 +38,18 @@ const style2 = {
background: "white",
zIndex: 100
};
const theme = createMuiTheme({
overrides: {
// Style sheet name ⚛️
MuiInputBase: {
input: {
color: '#5198ea'
}
}
},
});
export default class CorporateAnnualTarget extends Component {
constructor(props) {
super(props)
......@@ -54,7 +65,7 @@ export default class CorporateAnnualTarget extends Component {
loading: false,
uomList: [],
formulaYtdList: {
options: [{value: 'SUM'}, {value: 'AVG'}, {value: 'MIN'}, {value: 'MAX'}],
options: [{value: 'SUM'}, {value: 'AVG'}, {value: 'LAST'}],
getOptionLabel: (option) => titleCase(option.value),
},
kpiTypeList: [],
......@@ -62,7 +73,8 @@ export default class CorporateAnnualTarget extends Component {
visibleCAT: true,
buttonError: true,
// formulaYTDList: null,,
dataDelete: []
dataDelete: [],
dataReal: []
}
this.fileHandler = this.fileHandler.bind(this);
......@@ -101,7 +113,7 @@ export default class CorporateAnnualTarget extends Component {
item.level,
"",
item.description,
item.cat.weight,
item.type_report_id == 1? `${Number(item.weight) * 100}%` : (String(item.cat.weight).includes('%')? `${Number(String(item.cat.weight).replace('%', '')) * 100}%` : `${Number(item.cat.weight) * 100}%`),
item.cat.uom,
item.cat.kpi_type == "" ? null : {value: item.cat.kpi_type},
item.cat.max_ach == "" ? null : {value: item.cat.max_ach},
......@@ -143,7 +155,7 @@ export default class CorporateAnnualTarget extends Component {
item.level,
"",
item.description,
item.cat.weight,
item.type_report_id == 1? `${Number(item.weight) * 100}%` : (String(item.cat.weight).includes('%')? `${Number(String(item.cat.weight).replace('%', '')) * 100}%` : `${Number(item.cat.weight) * 100}%`),
item.cat.uom,
item.cat.kpi_type == "" ? null : {value: item.cat.kpi_type},
item.cat.max_ach == "" ? null : {value: item.cat.max_ach},
......@@ -175,7 +187,7 @@ export default class CorporateAnnualTarget extends Component {
}
}
})
this.setState({dataTable, loading: false})
this.setState({dataTable, loading: false, dataReal: res})
})
}
......@@ -189,7 +201,7 @@ export default class CorporateAnnualTarget extends Component {
let url = window.URL.createObjectURL(res);
let a = document.createElement('a');
a.href = url;
a.download = 'Template Balance Sheet.xlsx';
a.download = 'Template Master Budget CAT.xlsx';
a.click();
}
}
......@@ -427,14 +439,26 @@ export default class CorporateAnnualTarget extends Component {
"status": "submitted",
"cat": data
}
api.create().validateSubmitReport(payload).then((response) => {
console.log(response)
if (response.data.data.result) {
this.setState({ loading: false, buttonError: false, editable: true })
} else {
this.setState({ loading: false, buttonError: true, editable: true })
}
let totalWeight = 0
this.state.dataTable.map((items,indexs) => {
if (items[0] == 3) {
console.log(items[7])
totalWeight += Number(items[7].replace('%', ''))
}
})
console.log(totalWeight)
if (totalWeight < 100) {
this.setState({ alert: true, messageAlert: 'Total weight less than 100%', tipeAlert: 'warning', loading: false, buttonError: true, editable: true })
} else {
api.create().validateSubmitReport(payload).then((response) => {
console.log(response)
if (response.data.data.result) {
this.setState({ loading: false, buttonError: false, editable: true })
} else {
this.setState({ loading: false, buttonError: true, editable: true })
}
})
}
}
closeAlert() {
......@@ -608,23 +632,72 @@ export default class CorporateAnnualTarget extends Component {
const handleChange = (value, tableMeta) => {
let val = String(value).split(",").join("")
let total = 0
let lastValz = 0
dataTable2[tableMeta.rowIndex][tableMeta.columnIndex] = Number(val)
dataTable2[tableMeta.rowIndex].map((item,index) => {
if (index >= 13 && index <= 24) {
let valItem = item == undefined || item == ""? 0 : item
total += Number(valItem)
if (index == 24) {
lastValz += Number(valItem)
}
}
})
dataTable2[tableMeta.rowIndex][25] = total
let valz = dataTable2[tableMeta.rowIndex][11] == null? 'SUM' : dataTable2[tableMeta.rowIndex][11].value
dataTable2[tableMeta.rowIndex][25] = (valz == 'SUM'? total : (valz == 'AVG'? (total / 12) : lastValz))
console.log(dataTable2[tableMeta.rowIndex])
}
const handleChangeDropdown = (value, tableMeta) => {
dataTable2[tableMeta.rowIndex][tableMeta.columnIndex] = value
let valz = value.value
let total = 0
let lastValz = 0
if (valz == 'SUM' || valz == 'AVG' || valz == 'LAST') {
dataTable2[tableMeta.rowIndex].map((item,index) => {
if (index >= 13 && index <= 24) {
let valItem = item == undefined || item == ""? 0 : item
total += Number(valItem)
if (index == 24) {
lastValz += Number(valItem)
}
}
})
dataTable2[tableMeta.rowIndex][25] = (valz == 'SUM'? total : (valz == 'AVG'? (total / 12) : lastValz))
}
}
const handleChangePercentage = (value, tableMeta) => {
dataTable2[tableMeta.rowIndex][tableMeta.columnIndex] = value
let valueReal = value.replace('%', '')
let indexParentDatatable = dataTable2.findIndex((val) => val[1] == tableMeta.rowData[2])
let indexParentReal = this.state.dataReal.findIndex((val) => val.id == tableMeta.rowData[2])
// console.log(indexParentDatatable)
// console.log(indexParentReal)
let valParent = dataTable2[indexParentDatatable][7]
valParent.replace('%', '')
let valChild = 0
dataTable2.map((item,index) => {
if(item[2] == dataTable2[indexParentDatatable][1] && item[1] !== tableMeta.rowData[1]) {
let weightItem = item[7] == ""? 0 : item[7].replace('%', '')
console.log(weightItem)
valChild += Number(weightItem)
}
})
let endVal = ''
// console.log(Number(valueReal) + Number(valChild))
// console.log(valueReal)
// console.log(Number(valParent.replace('%', '')))
if ((Number(valueReal) + Number(valChild)) > Number(valParent.replace('%', ''))) {
endVal = `${Number(valParent.replace('%', '')) - (Number(valChild))}%`
console.log(endVal)
} else {
endVal = `${Number(valueReal)}%`
console.log(endVal)
}
// console.log(endVal)
dataTable2[tableMeta.rowIndex][tableMeta.columnIndex] = endVal
}
const handleChangeText = (value, tableMeta) => {
......@@ -681,6 +754,7 @@ export default class CorporateAnnualTarget extends Component {
"",
"",
"",
"",
""
])
......@@ -872,37 +946,32 @@ export default class CorporateAnnualTarget extends Component {
customBodyRender: (value, tableMeta, updateValue) => {
return (
<div style={{ textAlign: 'right' }}>
{tableMeta.rowData[0] === 1 || tableMeta.rowData[0] === 2 || tableMeta.rowData[0] === 4?
{tableMeta.rowData[0] === 2 || tableMeta.rowData[0] === 4?
null :
<div style={{ flex: 1 }}>
<FormControlLabel
style={{ margin: 0 }}
value={value}
control={
<NumberFormat
thousandSeparator={true}
suffix="%"
style={{ color: "#5198ea", fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
type="text"
placeholder=""
value={value}
maxLength={4}
onBlur={(event) => {
let valueReal = event.target.value.replace('%', '')
let some = ''
console.log(Number(valueReal) > 100)
if (Number(valueReal) > 100) {
some = '100%'
} else {
some = event.target.value
}
// updateValue(some)
handleChangePercentage(event.target.value, tableMeta)
}}
/>
}
/>
</div>
tableMeta.rowData[0] === 1 ?
value
:
<div style={{ flex: 1 }}>
<FormControlLabel
style={{ margin: 0 }}
value={value}
control={
<NumberFormat
thousandSeparator={true}
suffix="%"
style={{ color: "#5198ea", fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
type="text"
placeholder=""
value={value}
maxLength={4}
onBlur={(event) => {
// updateValue(some)
handleChangePercentage(event.target.value, tableMeta)
}}
/>
}
/>
</div>
}
</div>
)
......@@ -925,26 +994,39 @@ export default class CorporateAnnualTarget extends Component {
style={{ margin: 0 }}
// value={value}
control={
!handleAction(tableMeta.rowData[2])?
<Input
disableUnderline={true}
style={{ color: "#5198ea", fontSize: 12, textAlign: 'right', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent' }}
style={{ fontSize: 12, textAlign: 'center', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent', marginTop: -10 }}
type="text"
placeholder=""
defaultValue={value}
color={"#5198ea"}
disabled={!handleAction(tableMeta.rowData[2])}
onChange={(event) => {
// console.log(event.target.value)
// // updateValue(event.target.value)
// handleChangeText(event.target.value, tableMeta)
// console.log(dataTable2)
}}
onBlur={(event) => {
console.log(event.target.value)
// updateValue(event.target.value)
handleChangeText(event.target.value, tableMeta)
console.log(dataTable2)
}}
/>
/> :
<ThemeProvider theme={theme}>
<Input
disableUnderline={true}
style={{ fontSize: 12, textAlign: 'center', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent', marginBottom: -5 }}
type="text"
placeholder=""
defaultValue={value}
color={"#5198ea"}
disabled={!handleAction(tableMeta.rowData[2])}
onBlur={(event) => {
console.log(event.target.value)
// updateValue(event.target.value)
handleChangeText(event.target.value, tableMeta)
console.log(dataTable2)
}}
/>
</ThemeProvider>
}
/>
}
......@@ -953,7 +1035,7 @@ export default class CorporateAnnualTarget extends Component {
}
}
}, {
name: "Jenis KPI",
name: "KPI Type",
options: {
customHeadRender: (columnMeta) => (
<TableCell style={{ ...style2, top: 0, zIndex: 99, backgroundColor: '#1c71b8', width: 96 }}>
......@@ -1689,30 +1771,29 @@ export default class CorporateAnnualTarget extends Component {
),
customBodyRender: (value, tableMeta) => {
return (
<div style={{ width: 96 }}>
<div style={{ textAlign: 'right' }}>
{tableMeta.rowData[0] === 1 || tableMeta.rowData[0] === 2 || tableMeta.rowData[0] === 4?
null
:
<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' }}
null :
<FormControlLabel
style={{ margin: 0 }}
control={
<ThemeProvider theme={theme}>
<Input
disableUnderline={true}
style={{ fontSize: 12, textAlign: 'center', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent', marginBottom: -5 }}
type="text"
placeholder=""
value={value}
defaultValue={value}
onBlur={(event) => {
// updateValue(event.target.value)
handleChange(event.target.value, tableMeta)
console.log(event.target.value)
handleChangeText(event.target.value, tableMeta)
console.log(dataTable2)
}}
/>
}
/>
</div>
</ThemeProvider>
}
/>
}
</div>
)
......@@ -1728,30 +1809,31 @@ export default class CorporateAnnualTarget extends Component {
),
customBodyRender: (value, tableMeta) => {
return (
<div style={{ width: 96 }}>
<div style={{ textAlign: 'right' }}>
{tableMeta.rowData[0] === 1 || tableMeta.rowData[0] === 2 || tableMeta.rowData[0] === 4?
null
:
<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' }}
null :
<FormControlLabel
style={{ margin: 0 }}
// value={value}
control={
<ThemeProvider theme={theme}>
<Input
disableUnderline={true}
style={{ color: "#5198ea", fontSize: 12, textAlign: 'center', borderColor: 'transparent', margin: 0, width: 96, backgroundColor: 'transparent', marginBottom: -5 }}
type="text"
placeholder=""
value={value}
defaultValue={value}
onBlur={(event) => {
console.log(event.target.value)
// updateValue(event.target.value)
handleChange(event.target.value, tableMeta)
handleChangeText(event.target.value, tableMeta)
console.log(dataTable2)
}}
/>
}
/>
</div>
</ThemeProvider>
}
/>
}
</div>
)
......@@ -1790,7 +1872,7 @@ export default class CorporateAnnualTarget extends Component {
<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' }}>Periode : {this.props.periode} (rev.{this.props.revision})</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%' }}>
......@@ -1906,7 +1988,7 @@ export default class CorporateAnnualTarget extends Component {
marginRight: 20
}}
onClick={() => {
this.setState({ loading: true }, () => {
this.setState({ loading: true, dataTable: dataTable2}, () => {
setTimeout(() => {
this.handleValidate()
}, 100);
......@@ -1943,11 +2025,11 @@ export default class CorporateAnnualTarget extends Component {
<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' }}>Period : {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 }}>
<div style={{ marginTop: 20, width: this.props.width - (this.props.open === true ? 400 : 150) }}>
{!this.state.loading && <MuiThemeProvider theme={getMuiTheme()}>
<MUIDataTable
data={dataTable2}
......
src/container/BudgetTahunan/ProfitLoss.js
View file @ 842274e1
import React, { Component } from 'react';
import { Typography, Paper, createMuiTheme, MuiThemeProvider, TableCell, FormControlLabel, TextField, Input, Tooltip, withStyles } from '@material-ui/core';
import { Typography, Paper, createMuiTheme, MuiThemeProvider, TableCell, FormControlLabel, TextField, Input, Tooltip, withStyles, Snackbar } from '@material-ui/core';
import MUIDataTable from 'mui-datatables';
import NumberFormat from 'react-number-format';
import api from '../../api';
......@@ -10,6 +10,7 @@ import Images from '../../assets/Images';
import ReactTooltip from 'react-tooltip';
import UploadFile from "../../library/Upload";
import { ExcelRenderer } from 'react-excel-renderer';
import { Alert } from '@material-ui/lab';
const LightTooltip = withStyles((theme) => ({
tooltip: {
......@@ -393,6 +394,48 @@ export default class ProfitLoss extends Component {
}
}
handleValidate() {
let data = []
this.state.dataTable.map(i => {
data.push({
item_report_id: i[1],
notes: i[6] == null || i[6] == "" ? "" : String(i[6]),
total_actual_before: String(i[7]),
january: String(i[8]),
february: String(i[9]),
march: String(i[10]),
april: String(i[11]),
may: String(i[12]),
june: String(i[13]),
july: String(i[14]),
august: String(i[15]),
september: String(i[16]),
october: String(i[17]),
november: String(i[18]),
december: String(i[19]),
total_current_year: String(i[20]),
total_next_year: String(i[21]),
total_more_year: String(i[22])
})
})
let payload = {
"submission_id": this.props.submissionID,
"company_id": this.props.company.company_id,
"periode": this.props.periode,
"report_id": this.props.report_id,
"status": type,
"profit_loss": data
}
api.create().validateSubmitReport(payload).then((response) => {
console.log(response)
if (response.data.data.result) {
this.setState({ loading: false, buttonError: false, editable: true })
} else {
this.setState({ loading: false, buttonError: true, editable: true })
}
})
}
render() {
let dataTable2 = this.state.dataTable
const handleChange = (value, tableMeta, type) => {
......@@ -1930,6 +1973,11 @@ export default class ProfitLoss extends Component {
<div className={"main-color"} style={{ height: 78, flex: 1, display: 'flex', alignItems: 'center', paddingLeft: 20 }}>
<Typography style={{ fontSize: '16px', color: 'white' }}>Pengajuan Budget Tahunan</Typography>
</div>
<Snackbar open={this.state.alert} autoHideDuration={6000} onClose={() => this.closeAlert()}>
<Alert onClose={() => this.closeAlert()} severity={this.state.tipeAlert}>
{this.state.messageAlert}
</Alert>
</Snackbar>
{this.state.loading && loadingComponent}
<div style={{ flex: 1, padding: 20, width: '100%' }}>
{this.state.visibleProfitLoss === true ?
......@@ -2066,9 +2114,9 @@ export default class ProfitLoss extends Component {
marginRight: 20
}}
onClick={() => {
this.setState({ loading: true }, () => {
this.setState({ loading: true}, () => {
setTimeout(() => {
this.setState({ loading: false, buttonError: false, editable: true })
this.handleValidate()
}, 100);
})
}}
......@@ -2079,8 +2127,10 @@ export default class ProfitLoss extends Component {
</button>
<button
type="button"
disabled={this.state.buttonError}
onClick={() => this.backToMasterBudget('submitted')}
// disabled={this.state.buttonError}
onClick={() => this.state.buttonError?
this.setState({ alert: true, messageAlert: 'Data is not complete !', tipeAlert: 'warning' })
: this.backToMasterBudget('submitted')}
style={{
backgroundColor: 'transparent',
cursor: this.state.buttonError === true ? 'default' : 'pointer',
......
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