Skip to content

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

budget tahnunan

parent 1b4f99cd
Show whitespace changes
Inline Side-by-side
Showing with 127 additions and 41 deletions
src/container/BudgetTahunan.js
View file @ 3f20484f
...@@ -3,6 +3,9 @@ import { Typography, Paper, TextField, MenuItem } from '@material-ui/core'; ...@@ -3,6 +3,9 @@ import { Typography, Paper, TextField, MenuItem } 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 BalanceSheet from './BudgetTahunan/BalanceSheet';
import api from '../api';
import Autocomplete from '@material-ui/lab/Autocomplete';
import { titleCase } from '../library/Utils';
export default class BudgetTahunan extends Component { export default class BudgetTahunan extends Component {
constructor(props) { constructor(props) {
...@@ -12,11 +15,60 @@ export default class BudgetTahunan extends Component { ...@@ -12,11 +15,60 @@ export default class BudgetTahunan extends Component {
perusahaan: 'TAP Group', perusahaan: 'TAP Group',
revisi: '0', revisi: '0',
visibleBudgetTahunan: true, visibleBudgetTahunan: true,
visibleBS: false visibleBS: false,
listCompany: null,
company: null,
report_id: null
} }
} }
clickDetail(item){ componentDidMount() {
this.getCompanyActive()
this.getReport()
}
getReport() {
api.create().getReportType().then(response => {
if (response.data) {
if (response.data.status === "success") {
let dataTable = response.data.data.map((item, index) => {
return [
index + 1,
item.report_name,
"",
item.report_id
]
})
this.setState({ dataTable })
}
}
})
}
getCompanyActive() {
api.create().getPerusahaanActive().then((response) => {
if (response.data.status === 'success') {
let data = response.data.data
let companyData = data.map((item) => {
return {
company_id: item.company_id,
company_name: item.company_name,
}
})
let defaultProps = {
options: companyData,
getOptionLabel: (option) => titleCase(option.company_name),
};
this.setState({ listCompany: defaultProps, company: companyData[0] })
} else {
alert(response.data.message)
}
})
}
clickDetail(item, id) {
this.setState({ report_id: id })
if (item === 'Balance Sheet') { if (item === 'Balance Sheet') {
this.setState({ this.setState({
visibleBudgetTahunan: false, visibleBudgetTahunan: false,
...@@ -24,7 +76,7 @@ export default class BudgetTahunan extends Component { ...@@ -24,7 +76,7 @@ export default class BudgetTahunan extends Component {
visiblePL: false, visiblePL: false,
visibleCAT: false, visibleCAT: false,
visibleFAM: false, visibleFAM: false,
visibleTP: false visibleTP: false,
}) })
} }
} }
...@@ -38,7 +90,7 @@ export default class BudgetTahunan extends Component { ...@@ -38,7 +90,7 @@ export default class BudgetTahunan extends Component {
customBodyRender: (val, tableMeta) => { customBodyRender: (val, tableMeta) => {
return ( return (
<div style={{ display: 'flex' }}> <div style={{ display: 'flex' }}>
{val == 'done' ? {val === "acc" ?
<img src={Images.ceklis} style={{ width: 31, height: 24 }} /> : <img src={Images.ceklis} style={{ width: 31, height: 24 }} /> :
null null
} }
...@@ -59,7 +111,7 @@ export default class BudgetTahunan extends Component { ...@@ -59,7 +111,7 @@ export default class BudgetTahunan extends Component {
cursor: 'pointer', cursor: 'pointer',
borderColor: 'transparent' borderColor: 'transparent'
}} }}
onClick={() => this.clickDetail(tableMeta.rowData[1])} onClick={() => this.clickDetail(tableMeta.rowData[1], tableMeta.rowData[3])}
> >
<Typography style={{ color: '#5198ea', fontSize: 12, }}>Detail</Typography> <Typography style={{ color: '#5198ea', fontSize: 12, }}>Detail</Typography>
</button> </button>
...@@ -145,20 +197,16 @@ export default class BudgetTahunan extends Component { ...@@ -145,20 +197,16 @@ export default class BudgetTahunan extends Component {
</TextField> </TextField>
</div> </div>
<div style={{ marginTop: 20 }}> <div style={{ marginTop: 20 }}>
<TextField <Autocomplete
style={{ width: 250, }} {...this.state.listCompany}
id="perusahaan" id="company"
select onChange={(event, newInputValue) => this.setState({ company: newInputValue })}
label="Perusahaan" debug
value={this.state.perusahaan} disableClearable
onChange={(e) => this.setState({ perusahaan: e.target.value })} style={{ width: 250 }}
> renderInput={(params) => <TextField {...params} label="Company" margin="normal" style={{ marginTop: 7 }} />}
{perusahaan.map((option) => ( value={this.state.company}
<MenuItem key={option.value} value={option.value}> />
{option.label}
</MenuItem>
))}
</TextField>
</div> </div>
<div style={{ marginTop: 20 }}> <div style={{ marginTop: 20 }}>
<TextField <TextField
...@@ -179,7 +227,7 @@ export default class BudgetTahunan extends Component { ...@@ -179,7 +227,7 @@ export default class BudgetTahunan extends Component {
<div style={{ marginTop: 20 }}> <div style={{ marginTop: 20 }}>
<MUIDataTable <MUIDataTable
data={dataTable} data={this.state.dataTable}
columns={columns} columns={columns}
options={options} options={options}
/> />
...@@ -215,7 +263,10 @@ export default class BudgetTahunan extends Component { ...@@ -215,7 +263,10 @@ export default class BudgetTahunan extends Component {
)} )}
{this.state.visibleBS && ( {this.state.visibleBS && (
<BalanceSheet /> <BalanceSheet
report_id={this.state.report_id}
company_id={this.state.company.company_id}
/>
)} )}
</div > </div >
); );
......
src/container/BudgetTahunan/BalanceSheet.js
View file @ 3f20484f
...@@ -2,6 +2,7 @@ import React, { Component } from 'react'; ...@@ -2,6 +2,7 @@ import React, { Component } from 'react';
import { Typography, Paper, createMuiTheme, MuiThemeProvider, TableCell, FormControlLabel, TextField, Input } from '@material-ui/core'; import { Typography, Paper, createMuiTheme, MuiThemeProvider, TableCell, FormControlLabel, TextField, Input } from '@material-ui/core';
import MUIDataTable from 'mui-datatables'; import MUIDataTable from 'mui-datatables';
import NumberFormat from 'react-number-format'; import NumberFormat from 'react-number-format';
import api from '../../api';
var ct = require("../../library/CustomTable"); var ct = require("../../library/CustomTable");
const getMuiTheme = () => createMuiTheme(ct.customTable()); const getMuiTheme = () => createMuiTheme(ct.customTable());
...@@ -21,6 +22,49 @@ const style2 = { ...@@ -21,6 +22,49 @@ const style2 = {
}; };
export default class BalanceSheet extends Component { export default class BalanceSheet 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_id
}
api.create().getItemReportHierarki(payload).then(response => {
console.log(response);
})
}
handleChange(value, tableMeta) {
let data = this.state.dataTable
let a = data[tableMeta.rowIndex][tableMeta.columnIndex] = value
this.setState({
data: a
}, ()=> console.log(this.state.dataTable))
// let a = data[0].tableMeta.tableData[tableMeta.rowIndex] === value
// console.log(data)
}
render() { render() {
const columns = [{ const columns = [{
name: "Account", name: "Account",
...@@ -71,7 +115,6 @@ export default class BalanceSheet extends Component { ...@@ -71,7 +115,6 @@ export default class BalanceSheet extends Component {
</TableCell> </TableCell>
), ),
customBodyRender: (value, tableMeta, updateValue) => { customBodyRender: (value, tableMeta, updateValue) => {
return ( return (
<div style={{ textAlign: 'right' }}> <div style={{ textAlign: 'right' }}>
{tableMeta.rowIndex === 3 || tableMeta.rowIndex === 4 || tableMeta.rowIndex === 9 ? {tableMeta.rowIndex === 3 || tableMeta.rowIndex === 4 || tableMeta.rowIndex === 9 ?
...@@ -99,9 +142,12 @@ export default class BalanceSheet extends Component { ...@@ -99,9 +142,12 @@ export default class BalanceSheet extends Component {
type="text" type="text"
placeholder="" placeholder=""
value={value} value={value}
onChange={event => {
updateValue(event.target.value)
this.handleChange(event.target.value, tableMeta)
}}
/> />
} }
onChange={event => updateValue(event.target.value)}
/> />
</div> : </div> :
<span style={{ fontSize: 12, textAlign: 'right' }}>{value === "" ? "-" : value}</span> <span style={{ fontSize: 12, textAlign: 'right' }}>{value === "" ? "-" : value}</span>
...@@ -240,18 +286,7 @@ export default class BalanceSheet extends Component { ...@@ -240,18 +286,7 @@ export default class BalanceSheet extends Component {
} }
} }
] ]
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 ( return (
<div style={{ height: this.props.height, backgroundColor: '#f8f8f8', marginBottom: 100, minHeight: 1000 }}> <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 }}> <div className={"main-color"} style={{ height: 78, flex: 1, display: 'flex', alignItems: 'center', paddingLeft: 20 }}>
...@@ -272,7 +307,7 @@ export default class BalanceSheet extends Component { ...@@ -272,7 +307,7 @@ export default class BalanceSheet extends Component {
<div style={{ marginTop: 20, width: '100%' }}> <div style={{ marginTop: 20, width: '100%' }}>
<MuiThemeProvider theme={getMuiTheme()}> <MuiThemeProvider theme={getMuiTheme()}>
<MUIDataTable <MUIDataTable
data={dataTable} data={this.state.dataTable}
columns={columns} columns={columns}
options={options} options={options}
/> />
...@@ -285,7 +320,7 @@ export default class BalanceSheet extends Component { ...@@ -285,7 +320,7 @@ export default class BalanceSheet extends Component {
<Typography style={{ fontSize: '11px', color: '#fff', textAlign: 'center' }}>Kembali</Typography> <Typography style={{ fontSize: '11px', color: '#fff', textAlign: 'center' }}>Kembali</Typography>
</div> </div>
</div> </div>
<div className="col-2" style={{ display: 'flex', justifyContent: 'flex-end', maxWidth: '100%'}}> <div className="col-2" style={{ display: 'flex', justifyContent: 'flex-end', maxWidth: '100%' }}>
<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', marginRight: 20 }}>
<Typography style={{ fontSize: '11px', color: '#354960', textAlign: 'center' }}>Batal</Typography> <Typography style={{ fontSize: '11px', color: '#354960', textAlign: 'center' }}>Batal</Typography>
</div> </div>
......
src/container/MasterData/Parameter/Parameter.js
View file @ 3f20484f
...@@ -665,7 +665,7 @@ export default class Parameter extends Component { ...@@ -665,7 +665,7 @@ export default class Parameter extends Component {
customBodyRender: (val, tableMeta) => { customBodyRender: (val, tableMeta) => {
return ( return (
<div style={{ display: 'flex' }}> <div style={{ display: 'flex' }}>
<span style={{ color: tableMeta.rowData[10] === "Aktif" ? "#656565" : 'rgba(0, 0, 0, 0.25)' }}>{val === "Aktif" ? "Active" : "Inactive"}</span> <span style={{ color: tableMeta.rowData[10] === "Aktif" ? "#656565" : 'rgba(0, 0, 0, 0.25)' }}>{val}</span>
</div > </div >
); );
} }
......
src/container/MasterData/UnitBisnis.js
View file @ 3f20484f
...@@ -379,7 +379,7 @@ export default class UnitBisnis extends Component { ...@@ -379,7 +379,7 @@ export default class UnitBisnis extends Component {
customBodyRender: (val, tableMeta) => { customBodyRender: (val, tableMeta) => {
return ( return (
<div style={{ display: 'flex' }}> <div style={{ display: 'flex' }}>
<span style={{ color: tableMeta.rowData[3] === "Aktif" ? "#656565" : 'rgba(0, 0, 0, 0.25)' }}>{val === "Aktif" ? "Active" : "Inactive"}</span> <span style={{ color: tableMeta.rowData[3] === "Aktif" ? "#656565" : 'rgba(0, 0, 0, 0.25)' }}>{val}</span>
</div > </div >
); );
} }
......
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