Commit 26a85b1b authored by Rifka Kurnia Irfiana's avatar Rifka Kurnia Irfiana

Merge branch 'master' of http://103.44.149.204/d.arizona/tia-dev into rifka

parents cee6e47e 22169fb5
......@@ -3,6 +3,10 @@ import { Typography, Paper, TextField, MenuItem } from '@material-ui/core';
import MUIDataTable from 'mui-datatables';
import Images from '../assets/Images';
import BalanceSheet from './BudgetTahunan/BalanceSheet';
import api from '../api';
import Autocomplete from '@material-ui/lab/Autocomplete';
import { titleCase } from '../library/Utils';
import ProfitLoss from './BudgetTahunan/ProfitLoss';
export default class BudgetTahunan extends Component {
constructor(props) {
......@@ -12,9 +16,83 @@ export default class BudgetTahunan extends Component {
perusahaan: 'TAP Group',
revisi: '0',
visibleBudgetTahunan: true,
visibleBalanceSheet: false
visibleBS: false,
listCompany: null,
company: null,
report_id: null,
visiblePL: false
}
}
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') {
this.setState({
visibleBudgetTahunan: false,
visibleBS: true,
visiblePL: false,
visibleCAT: false,
visibleFAM: false,
visibleTP: false,
})
} else if (item === 'Profit & Loss') {
this.setState({
visibleBudgetTahunan: false,
visibleBS: false,
visiblePL: true,
visibleCAT: false,
visibleFAM: false,
visibleTP: false
})
}
}
render() {
const columns = ["#", "Jenis Laporan",
{
......@@ -23,7 +101,7 @@ export default class BudgetTahunan extends Component {
customBodyRender: (val, tableMeta) => {
return (
<div style={{ display: 'flex' }}>
{val == 'done' ?
{val === "acc" ?
<img src={Images.ceklis} style={{ width: 31, height: 24 }} /> :
null
}
......@@ -44,7 +122,7 @@ export default class BudgetTahunan extends Component {
cursor: 'pointer',
borderColor: 'transparent'
}}
onClick={() => this.setState({ visibleBudgetTahunan: false, visibleBalanceSheet: true })}
onClick={() => this.clickDetail(tableMeta.rowData[1], tableMeta.rowData[3])}
>
<Typography style={{ color: '#5198ea', fontSize: 12, }}>Detail</Typography>
</button>
......@@ -130,20 +208,16 @@ export default class BudgetTahunan extends Component {
</TextField>
</div>
<div style={{ marginTop: 20 }}>
<TextField
style={{ width: 250, }}
id="perusahaan"
select
label="Perusahaan"
value={this.state.perusahaan}
onChange={(e) => this.setState({ perusahaan: e.target.value })}
>
{perusahaan.map((option) => (
<MenuItem key={option.value} value={option.value}>
{option.label}
</MenuItem>
))}
</TextField>
<Autocomplete
{...this.state.listCompany}
id="company"
onChange={(event, newInputValue) => this.setState({ company: newInputValue })}
debug
disableClearable
style={{ width: 250 }}
renderInput={(params) => <TextField {...params} label="Company" margin="normal" style={{ marginTop: 7 }} />}
value={this.state.company}
/>
</div>
<div style={{ marginTop: 20 }}>
<TextField
......@@ -164,7 +238,7 @@ export default class BudgetTahunan extends Component {
<div style={{ marginTop: 20 }}>
<MUIDataTable
data={dataTable}
data={this.state.dataTable}
columns={columns}
options={options}
/>
......@@ -199,8 +273,14 @@ export default class BudgetTahunan extends Component {
</div>
)}
{this.state.visibleBalanceSheet && (
<BalanceSheet />
{this.state.visibleBS && (
<BalanceSheet
report_id={this.state.report_id}
company_id={this.state.company.company_id}
/>
)}
{this.state.visiblePL && (
<ProfitLoss />
)}
</div >
);
......
......@@ -2,6 +2,7 @@ import React, { Component } from 'react';
import { Typography, Paper, createMuiTheme, MuiThemeProvider, TableCell, FormControlLabel, TextField, Input } from '@material-ui/core';
import MUIDataTable from 'mui-datatables';
import NumberFormat from 'react-number-format';
import api from '../../api';
var ct = require("../../library/CustomTable");
const getMuiTheme = () => createMuiTheme(ct.customTable());
......@@ -21,6 +22,49 @@ const style2 = {
};
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() {
const columns = [{
name: "Account",
......@@ -71,7 +115,6 @@ export default class BalanceSheet extends Component {
</TableCell>
),
customBodyRender: (value, tableMeta, updateValue) => {
return (
<div style={{ textAlign: 'right' }}>
{tableMeta.rowIndex === 3 || tableMeta.rowIndex === 4 || tableMeta.rowIndex === 9 ?
......@@ -99,9 +142,12 @@ export default class BalanceSheet extends Component {
type="text"
placeholder=""
value={value}
onChange={event => {
updateValue(event.target.value)
this.handleChange(event.target.value, tableMeta)
}}
/>
}
onChange={event => updateValue(event.target.value)}
/>
</div> :
<span style={{ fontSize: 12, textAlign: 'right' }}>{value === "" ? "-" : value}</span>
......@@ -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 (
<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 }}>
......@@ -272,7 +307,7 @@ export default class BalanceSheet extends Component {
<div style={{ marginTop: 20, width: '100%' }}>
<MuiThemeProvider theme={getMuiTheme()}>
<MUIDataTable
data={dataTable}
data={this.state.dataTable}
columns={columns}
options={options}
/>
......@@ -285,7 +320,7 @@ export default class BalanceSheet extends Component {
<Typography style={{ fontSize: '11px', color: '#fff', textAlign: 'center' }}>Kembali</Typography>
</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 }}>
<Typography style={{ fontSize: '11px', color: '#354960', textAlign: 'center' }}>Batal</Typography>
</div>
......
This diff is collapsed.
......@@ -491,7 +491,7 @@ export default function MiniDrawer() {
}
{open &&
<div style={{ marginLeft: 20, marginTop: 10 }}>
<Typography style={{ color: '#525355', fontSize: 14, fontFamily: 'nunito' }}>Application</Typography>
<Typography style={{ color: '#525355', fontSize: 14, fontFamily: 'Nunito Sans, sans-serif' }}>Application</Typography>
</div>
}
<List>
......@@ -501,7 +501,7 @@ export default function MiniDrawer() {
<div style={{ justifyContent: 'space-between', flexDirection: 'row', display: 'flex', paddingLeft: 5, paddingRight: 10, cursor: 'pointer' }} onClick={() => { handleCollapse(item) }}>
<ListItem key={item.label}>
<ListItemIcon style={{ minWidth: open ? 40 : 56 }}><img src={item.img} /></ListItemIcon>
<Typography style={{ fontFamily: 'nunito', color: '#525355', fontSize: 14 }}>{item.label}</Typography>
<Typography style={{ fontFamily: 'Nunito Sans, sans-serif', color: '#525355', fontSize: 14 }}>{item.label}</Typography>
</ListItem>
{item.subItem.length !== 0 ? (item.collapse ? <ExpandLess style={{ color: "#525355", marginLeft: 50, alignSelf: 'center' }} /> : <ExpandMore style={{ color: "#525355", marginLeft: 50, alignSelf: 'center' }} />) : null}
</div>
......@@ -510,7 +510,7 @@ export default function MiniDrawer() {
<div style={{ paddingLeft: 5 }} className={selectedIndex === item.label ? "active" : ""}>
<ListItem button key={item.label} onClick={() => selectIndex(item.label)}>
<ListItemIcon style={{ minWidth: open ? 40 : 56 }}><img src={item.img} style={{ fill: '#525355' }} /></ListItemIcon>
<Typography style={{ fontFamily: 'nunito', color: '#525355', fontSize: 14 }}>{item.label}</Typography>
<Typography style={{ fontFamily: 'Nunito Sans, sans-serif', color: '#525355', fontSize: 14 }}>{item.label}</Typography>
</ListItem>
</div>
</Link>
......@@ -523,8 +523,8 @@ export default function MiniDrawer() {
return (
<Link to={sub.label === "Logout" ? `/` : `${url}/${sub.path}`}>
<div style={{ paddingLeft: 5, }} className={selectedSubIndex === sub.label ? "active" : ""} onClick={() => sub.label === "Logout" ? logout() : selectSub(sub.label)}>
<ListItem button style={{ paddingLeft: 61 }}>
<Typography style={{ fontFamily: 'nunito', color: '#525355', fontSize: 14 }}>{sub.label}</Typography>
<ListItem button style={{ paddingLeft: 57 }}>
<Typography style={{ fontFamily: 'Nunito Sans, sans-serif', color: '#525355', fontSize: 14 }}>{sub.label}</Typography>
</ListItem>
</div>
</Link>
......@@ -539,7 +539,7 @@ export default function MiniDrawer() {
</List>
{open &&
<div style={{ marginLeft: 20 }}>
<Typography style={{ color: '#525355', fontSize: 14, fontFamily: 'nunito' }}>Setting</Typography>
<Typography style={{ color: '#525355', fontSize: 14, fontFamily: 'Nunito Sans, sans-serif' }}>Setting</Typography>
</div>
}
<List style={{ marginTop: !open ? -10 : null, marginLeft: !open ? -2 : null }}>
......@@ -549,7 +549,7 @@ export default function MiniDrawer() {
<div style={{ justifyContent: 'space-between', flexDirection: 'row', display: 'flex', paddingLeft: 5, paddingRight: 10, cursor: 'pointer' }} onClick={() => { handleCollapseSetting(item) }}>
<ListItem key={item.label}>
<ListItemIcon style={{ minWidth: open ? 40 : 56 }}><img src={item.img} /></ListItemIcon>
<Typography style={{ fontFamily: 'nunito', color: '#525355', fontSize: 14 }}>{item.label}</Typography>
<Typography style={{ fontFamily: 'Nunito Sans, sans-serif', color: '#525355', fontSize: 14 }}>{item.label}</Typography>
</ListItem>
{item.subItem.length !== 0 ? (item.collapse ? <ExpandLess style={{ color: "#525355", marginLeft: 50, alignSelf: 'center' }} /> : <ExpandMore style={{ color: "#525355", marginLeft: 50, alignSelf: 'center' }} />) : null}
</div>
......@@ -558,7 +558,7 @@ export default function MiniDrawer() {
<div style={{ paddingLeft: 5 }} className={selectedIndex === item.label ? "active" : ""}>
<ListItem button key={item.label} onClick={() => selectIndex(item.label)}>
<ListItemIcon style={{ minWidth: open ? 40 : 56 }}><img src={item.img} style={{ fill: '#525355' }} /></ListItemIcon>
<Typography style={{ fontFamily: 'nunito', color: '#525355', fontSize: 14 }}>{item.label}</Typography>
<Typography style={{ fontFamily: 'Nunito Sans, sans-serif', color: '#525355', fontSize: 14 }}>{item.label}</Typography>
</ListItem>
</div>
</Link>
......@@ -571,8 +571,8 @@ export default function MiniDrawer() {
return (
<Link to={sub.label === "Logout" ? `/` : `${url}/${sub.path}`}>
<div style={{ paddingLeft: 5, }} className={selectedSubIndex === sub.label ? "active" : ""} onClick={() => sub.label === "Logout" ? logout() : selectSub(sub.label)}>
<ListItem button style={{ paddingLeft: 61 }}>
<Typography style={{ fontFamily: 'nunito', color: '#525355', fontSize: 14 }}>{sub.label}</Typography>
<ListItem button style={{ paddingLeft: 57 }}>
<Typography style={{ fontFamily: 'Nunito Sans, sans-serif', color: '#525355', fontSize: 14 }}>{sub.label}</Typography>
</ListItem>
</div>
</Link>
......
......@@ -665,7 +665,7 @@ export default class Parameter extends Component {
customBodyRender: (val, tableMeta) => {
return (
<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 >
);
}
......
This diff is collapsed.
......@@ -379,7 +379,7 @@ export default class UnitBisnis extends Component {
customBodyRender: (val, tableMeta) => {
return (
<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 >
);
}
......
......@@ -198,7 +198,7 @@ export default class VisualReportItems extends Component {
return (
<div>
<button type="button" onClick={() => this.collapse(item.id)}>{collapseIcon ? (this.state.arrayCollapse.includes(item.id) ? <AddIcon /> : <RemoveIcon />) : null}</button>
<label style={{ marginLeft: collapseIcon ? 10 : 0 }}>{item.report_name}</label>
<label style={{ marginLeft: collapseIcon ? 10 : 0 }}>{item.description}</label>
</div>
)
};
......
......@@ -343,11 +343,10 @@ exports.customOptionsFixedColumn = function () {
sort: false,
viewColumns:false,
overflowX: 'auto',
rowsPerPage: 10,
rowsPerPageOptions: [5, 10, 20, 50],
print: false,
download: false,
elevation: 5,
search:false
search:false,
pagination: false
}
}
\ No newline at end of file
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