Skip to content

T
Tia-dev
Commit 26a85b1b authored by Rifka Kurnia Irfiana's avatar Rifka Kurnia Irfiana
Browse files
Options

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

parents cee6e47e 22169fb5
Show whitespace changes
Inline Side-by-side
Showing with 728 additions and 231 deletions
src/container/BudgetTahunan.js
View file @ 26a85b1b
...@@ -3,6 +3,10 @@ import { Typography, Paper, TextField, MenuItem } from '@material-ui/core'; ...@@ -3,6 +3,10 @@ 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';
import ProfitLoss from './BudgetTahunan/ProfitLoss';
export default class BudgetTahunan extends Component { export default class BudgetTahunan extends Component {
constructor(props) { constructor(props) {
...@@ -12,9 +16,83 @@ export default class BudgetTahunan extends Component { ...@@ -12,9 +16,83 @@ export default class BudgetTahunan extends Component {
perusahaan: 'TAP Group', perusahaan: 'TAP Group',
revisi: '0', revisi: '0',
visibleBudgetTahunan: true, 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() { render() {
const columns = ["#", "Jenis Laporan", const columns = ["#", "Jenis Laporan",
{ {
...@@ -23,7 +101,7 @@ export default class BudgetTahunan extends Component { ...@@ -23,7 +101,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
} }
...@@ -44,7 +122,7 @@ export default class BudgetTahunan extends Component { ...@@ -44,7 +122,7 @@ export default class BudgetTahunan extends Component {
cursor: 'pointer', cursor: 'pointer',
borderColor: 'transparent' 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> <Typography style={{ color: '#5198ea', fontSize: 12, }}>Detail</Typography>
</button> </button>
...@@ -130,20 +208,16 @@ export default class BudgetTahunan extends Component { ...@@ -130,20 +208,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
...@@ -164,7 +238,7 @@ export default class BudgetTahunan extends Component { ...@@ -164,7 +238,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}
/> />
...@@ -199,8 +273,14 @@ export default class BudgetTahunan extends Component { ...@@ -199,8 +273,14 @@ export default class BudgetTahunan extends Component {
</div> </div>
)} )}
{this.state.visibleBalanceSheet && ( {this.state.visibleBS && (
<BalanceSheet /> <BalanceSheet
report_id={this.state.report_id}
company_id={this.state.company.company_id}
/>
)}
{this.state.visiblePL && (
<ProfitLoss />
)} )}
</div > </div >
); );
......
src/container/BudgetTahunan/BalanceSheet.js
View file @ 26a85b1b
...@@ -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/BudgetTahunan/ProfitLoss.js 0 → 100644
View file @ 26a85b1b
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';
var ct = require("../../library/CustomTable");
const getMuiTheme = () => createMuiTheme(ct.customTable());
const options = ct.customOptionsFixedColumn();
const style = {
position: "sticky",
left: 0,
background: "white",
zIndex: 101,
};
const style2 = {
position: "sticky",
left: 420,
background: "white",
zIndex: 101
};
export default class ProfitLoss extends Component {
render() {
const columns = [{
name: "Account",
options: {
customHeadRender: (columnMeta) => (
<TableCell key={columnMeta.index} style={{ ...style, top: 0, zIndex: 102, backgroundColor: '#354960', width: 388 }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'left' }}>{columnMeta.name}</Typography>
</TableCell>
),
setCellProps: () => ({ style }),
customBodyRender: (val, tableMeta) => {
return (
<div style={{ width: 388 }}>
{tableMeta.rowIndex == 0 ?
<span style={{ fontSize: 12, fontWeight: 'bold' }}>{val}</span>
:
tableMeta.rowIndex == 1 || tableMeta.rowIndex == 4 || tableMeta.rowIndex == 7 ?
<span style={{ fontSize: 12, marginLeft: 10 }}>{val}</span> :
<span style={{ fontSize: 12, marginLeft: 20 }}>{val}</span>
}
</div>
)
}
}
}, {
name: "Keterangan",
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: "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) => {
return (
<div style={{ textAlign: 'right' }}>
{tableMeta.rowIndex === 2 || tableMeta.rowIndex === 3 ?
<div style={{ flex: 1 }}>
<FormControlLabel
style={{ margin: 0 }}
value={value}
control={
// <Input
// value={this.formatValue(value)}
// style={{}}
// inputProps={{
// style: {
// color: "#5198ea",
// fontSize: 12,
// textAlign: 'right'
// }
// }}
// disableUnderline={true}
// inputStyle={{ color: 'red' }}
// />
<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 => updateValue(event.target.value)}
/>
</div> :
<span style={{ fontSize: 12, textAlign: 'right' }}>{value === "" ? "-" : value}</span>
}
</div>
)
}
}
}, {
name: "February 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>
)
}
}
}, {
name: "March 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>
)
}
}
}, {
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>
)
}
}
}, {
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>
)
}
}
}, {
name: "June 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>
)
}
}
}, {
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>
)
}
}
}, {
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>
)
}
}
}
]
const dataTable = [
["Ravenue", "", "11,247,249", "10,702,196"],
["Unit Bisnis/ Brand/ SubCo 1", "", "2,647,647", "2,058,898"],
["Sales Volume","Subco1", "1,464,571", "729,743"],
["Sales Price","Subco1", "1", "6"],
["Unit Bisnis/ Brand/ SubCo 2", "", "-", "-"],
["Sales Volume","Subco2", "-", "-"],
["Sales Price","Subco2", "-", "-"],
["Unit Bisnis/ Brand/ SubCo 3", "", "-", "-"],
["Sales Volume","Subco3", "-", "-"],
["Sales Price","Subco3", "-", "-"],
]
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 }}>
<Typography style={{ fontSize: '16px', color: 'white' }}>Pengajuan Budget Tahunan</Typography>
</div>
<div style={{ flex: 1, padding: 20, width: '100%' }}>
<Paper style={{ paddingTop: 10, paddingBottom: 20 }}>
<div style={{ borderBottom: 'solid 1px #c4c4c4' }} >
<Typography style={{ fontSize: '12px', color: '#4b4b4b', margin: 10 }}>Budget Tahunan - Profit & Loss</Typography>
</div>
<div style={{ padding: 20 }}>
<div>
<Typography style={{ fontSize: '11px', color: '#4b4b4b' }}>PT. XYZ</Typography>
<Typography style={{ fontSize: '11px', color: '#4b4b4b' }}>Periode : 2021</Typography>
<Typography style={{ fontSize: '11px', color: '#4b4b4b' }}>in IDR mn</Typography>
</div>
<div style={{ marginTop: 20, width: '100%' }}>
<MuiThemeProvider theme={getMuiTheme()}>
<MUIDataTable
data={dataTable}
columns={columns}
options={options}
/>
</MuiThemeProvider>
</div>
</div>
<div className="grid grid-2x">
<div className="col-1">
<div style={{ backgroundColor: '#019ce5', width: 105, height: 25, borderRadius: 3, justifyContent: 'center', display: 'flex', alignItems: 'center' }}>
<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 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>
<div style={{ backgroundColor: '#354960', width: 105, height: 25, borderRadius: 3, justifyContent: 'center', display: 'flex', alignItems: 'center' }}>
<Typography style={{ fontSize: '11px', color: '#fff', textAlign: 'center' }}>Simpan</Typography>
</div>
</div>
</div>
</Paper>
</div>
</div>
);
}
}
src/container/Home.js
View file @ 26a85b1b
...@@ -491,7 +491,7 @@ export default function MiniDrawer() { ...@@ -491,7 +491,7 @@ export default function MiniDrawer() {
} }
{open && {open &&
<div style={{ marginLeft: 20, marginTop: 10 }}> <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> </div>
} }
<List> <List>
...@@ -501,7 +501,7 @@ export default function MiniDrawer() { ...@@ -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) }}> <div style={{ justifyContent: 'space-between', flexDirection: 'row', display: 'flex', paddingLeft: 5, paddingRight: 10, cursor: 'pointer' }} onClick={() => { handleCollapse(item) }}>
<ListItem key={item.label}> <ListItem key={item.label}>
<ListItemIcon style={{ minWidth: open ? 40 : 56 }}><img src={item.img} /></ListItemIcon> <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> </ListItem>
{item.subItem.length !== 0 ? (item.collapse ? <ExpandLess style={{ color: "#525355", marginLeft: 50, alignSelf: 'center' }} /> : <ExpandMore style={{ color: "#525355", marginLeft: 50, alignSelf: 'center' }} />) : null} {item.subItem.length !== 0 ? (item.collapse ? <ExpandLess style={{ color: "#525355", marginLeft: 50, alignSelf: 'center' }} /> : <ExpandMore style={{ color: "#525355", marginLeft: 50, alignSelf: 'center' }} />) : null}
</div> </div>
...@@ -510,7 +510,7 @@ export default function MiniDrawer() { ...@@ -510,7 +510,7 @@ export default function MiniDrawer() {
<div style={{ paddingLeft: 5 }} className={selectedIndex === item.label ? "active" : ""}> <div style={{ paddingLeft: 5 }} className={selectedIndex === item.label ? "active" : ""}>
<ListItem button key={item.label} onClick={() => selectIndex(item.label)}> <ListItem button key={item.label} onClick={() => selectIndex(item.label)}>
<ListItemIcon style={{ minWidth: open ? 40 : 56 }}><img src={item.img} style={{ fill: '#525355' }} /></ListItemIcon> <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> </ListItem>
</div> </div>
</Link> </Link>
...@@ -523,8 +523,8 @@ export default function MiniDrawer() { ...@@ -523,8 +523,8 @@ export default function MiniDrawer() {
return ( return (
<Link to={sub.label === "Logout" ? `/` : `${url}/${sub.path}`}> <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)}> <div style={{ paddingLeft: 5, }} className={selectedSubIndex === sub.label ? "active" : ""} onClick={() => sub.label === "Logout" ? logout() : selectSub(sub.label)}>
<ListItem button style={{ paddingLeft: 61 }}> <ListItem button style={{ paddingLeft: 57 }}>
<Typography style={{ fontFamily: 'nunito', color: '#525355', fontSize: 14 }}>{sub.label}</Typography> <Typography style={{ fontFamily: 'Nunito Sans, sans-serif', color: '#525355', fontSize: 14 }}>{sub.label}</Typography>
</ListItem> </ListItem>
</div> </div>
</Link> </Link>
...@@ -539,7 +539,7 @@ export default function MiniDrawer() { ...@@ -539,7 +539,7 @@ export default function MiniDrawer() {
</List> </List>
{open && {open &&
<div style={{ marginLeft: 20 }}> <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> </div>
} }
<List style={{ marginTop: !open ? -10 : null, marginLeft: !open ? -2 : null }}> <List style={{ marginTop: !open ? -10 : null, marginLeft: !open ? -2 : null }}>
...@@ -549,7 +549,7 @@ export default function MiniDrawer() { ...@@ -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) }}> <div style={{ justifyContent: 'space-between', flexDirection: 'row', display: 'flex', paddingLeft: 5, paddingRight: 10, cursor: 'pointer' }} onClick={() => { handleCollapseSetting(item) }}>
<ListItem key={item.label}> <ListItem key={item.label}>
<ListItemIcon style={{ minWidth: open ? 40 : 56 }}><img src={item.img} /></ListItemIcon> <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> </ListItem>
{item.subItem.length !== 0 ? (item.collapse ? <ExpandLess style={{ color: "#525355", marginLeft: 50, alignSelf: 'center' }} /> : <ExpandMore style={{ color: "#525355", marginLeft: 50, alignSelf: 'center' }} />) : null} {item.subItem.length !== 0 ? (item.collapse ? <ExpandLess style={{ color: "#525355", marginLeft: 50, alignSelf: 'center' }} /> : <ExpandMore style={{ color: "#525355", marginLeft: 50, alignSelf: 'center' }} />) : null}
</div> </div>
...@@ -558,7 +558,7 @@ export default function MiniDrawer() { ...@@ -558,7 +558,7 @@ export default function MiniDrawer() {
<div style={{ paddingLeft: 5 }} className={selectedIndex === item.label ? "active" : ""}> <div style={{ paddingLeft: 5 }} className={selectedIndex === item.label ? "active" : ""}>
<ListItem button key={item.label} onClick={() => selectIndex(item.label)}> <ListItem button key={item.label} onClick={() => selectIndex(item.label)}>
<ListItemIcon style={{ minWidth: open ? 40 : 56 }}><img src={item.img} style={{ fill: '#525355' }} /></ListItemIcon> <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> </ListItem>
</div> </div>
</Link> </Link>
...@@ -571,8 +571,8 @@ export default function MiniDrawer() { ...@@ -571,8 +571,8 @@ export default function MiniDrawer() {
return ( return (
<Link to={sub.label === "Logout" ? `/` : `${url}/${sub.path}`}> <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)}> <div style={{ paddingLeft: 5, }} className={selectedSubIndex === sub.label ? "active" : ""} onClick={() => sub.label === "Logout" ? logout() : selectSub(sub.label)}>
<ListItem button style={{ paddingLeft: 61 }}> <ListItem button style={{ paddingLeft: 57 }}>
<Typography style={{ fontFamily: 'nunito', color: '#525355', fontSize: 14 }}>{sub.label}</Typography> <Typography style={{ fontFamily: 'Nunito Sans, sans-serif', color: '#525355', fontSize: 14 }}>{sub.label}</Typography>
</ListItem> </ListItem>
</div> </div>
</Link> </Link>
......
src/container/MasterData/Parameter/Parameter.js
View file @ 26a85b1b
...@@ -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/ReportItems.js
View file @ 26a85b1b
...@@ -105,7 +105,7 @@ export default class ReportItems extends Component { ...@@ -105,7 +105,7 @@ export default class ReportItems extends Component {
let columns = [ let columns = [
"Data Ke-", "Data Ke-",
{ {
name: "Jenis Laporan", name: "Report Type",
options: { options: {
customBodyRender: (val, tableMeta) => { customBodyRender: (val, tableMeta) => {
let check = null let check = null
...@@ -130,7 +130,7 @@ export default class ReportItems extends Component { ...@@ -130,7 +130,7 @@ export default class ReportItems extends Component {
} }
}, },
{ {
name: "Perusahaan", name: "Company Name",
options: { options: {
customBodyRender: (val, tableMeta) => { customBodyRender: (val, tableMeta) => {
let check = null let check = null
...@@ -180,7 +180,7 @@ export default class ReportItems extends Component { ...@@ -180,7 +180,7 @@ export default class ReportItems extends Component {
} }
}, },
{ {
name: "Deskripsi", name: "Description",
options: { options: {
customBodyRender: (val, tableMeta) => { customBodyRender: (val, tableMeta) => {
let check = null let check = null
...@@ -280,7 +280,7 @@ export default class ReportItems extends Component { ...@@ -280,7 +280,7 @@ export default class ReportItems extends Component {
} }
}, },
{ {
name: "Tipe Data", name: "Data Type",
options: { options: {
customBodyRender: (val, tableMeta) => { customBodyRender: (val, tableMeta) => {
let check = null let check = null
...@@ -330,7 +330,7 @@ export default class ReportItems extends Component { ...@@ -330,7 +330,7 @@ export default class ReportItems extends Component {
} }
}, },
{ {
name: "Nilai Seharusnya", name: "True Value",
options: { options: {
customBodyRender: (val, tableMeta) => { customBodyRender: (val, tableMeta) => {
let check = null let check = null
...@@ -355,7 +355,7 @@ export default class ReportItems extends Component { ...@@ -355,7 +355,7 @@ export default class ReportItems extends Component {
} }
}, },
{ {
name: "Kondisi Jika Salah", name: "False Condition",
options: { options: {
customBodyRender: (val, tableMeta) => { customBodyRender: (val, tableMeta) => {
let check = null let check = null
...@@ -380,7 +380,7 @@ export default class ReportItems extends Component { ...@@ -380,7 +380,7 @@ export default class ReportItems extends Component {
} }
}, },
{ {
name: "Berlaku Mulai", name: "Valid From",
options: { options: {
customBodyRender: (val, tableMeta) => { customBodyRender: (val, tableMeta) => {
let check = null let check = null
...@@ -405,7 +405,7 @@ export default class ReportItems extends Component { ...@@ -405,7 +405,7 @@ export default class ReportItems extends Component {
} }
}, },
{ {
name: "Berakhir Hingga", name: "Valid To",
options: { options: {
customBodyRender: (val, tableMeta) => { customBodyRender: (val, tableMeta) => {
let check = null let check = null
...@@ -550,7 +550,7 @@ export default class ReportItems extends Component { ...@@ -550,7 +550,7 @@ export default class ReportItems extends Component {
let url = window.URL.createObjectURL(res); let url = window.URL.createObjectURL(res);
let a = document.createElement('a'); let a = document.createElement('a');
a.href = url; a.href = url;
a.download = 'Item Report.xlsx'; a.download = 'Report Items.xlsx';
a.click(); a.click();
} }
} }
...@@ -621,31 +621,31 @@ export default class ReportItems extends Component { ...@@ -621,31 +621,31 @@ export default class ReportItems 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}</span> <span style={{ color: tableMeta.rowData[10] === "active" ? "#656565" : 'rgba(0, 0, 0, 0.25)' }}>{val}</span>
</div > </div >
); );
} }
} }
}, },
{ {
name: "Jenis Laporan", name: "Report Type",
options: { options: {
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}</span> <span style={{ color: tableMeta.rowData[10] === "active" ? "#656565" : 'rgba(0, 0, 0, 0.25)' }}>{val}</span>
</div > </div >
); );
} }
} }
}, },
{ {
name: "Perusahaan", name: "Company",
options: { options: {
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}</span> <span style={{ color: tableMeta.rowData[10] === "active" ? "#656565" : 'rgba(0, 0, 0, 0.25)' }}>{val}</span>
</div > </div >
); );
} }
...@@ -657,19 +657,19 @@ export default class ReportItems extends Component { ...@@ -657,19 +657,19 @@ export default class ReportItems 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}</span> <span style={{ color: tableMeta.rowData[10] === "active" ? "#656565" : 'rgba(0, 0, 0, 0.25)' }}>{val}</span>
</div > </div >
); );
} }
} }
}, },
{ {
name: "Deskripsi", name: "Description",
options: { options: {
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}</span> <span style={{ color: tableMeta.rowData[10] === "active" ? "#656565" : 'rgba(0, 0, 0, 0.25)' }}>{val}</span>
</div > </div >
); );
} }
...@@ -681,7 +681,7 @@ export default class ReportItems extends Component { ...@@ -681,7 +681,7 @@ export default class ReportItems 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}</span> <span style={{ color: tableMeta.rowData[10] === "active" ? "#656565" : 'rgba(0, 0, 0, 0.25)' }}>{val}</span>
</div > </div >
); );
} }
...@@ -693,7 +693,7 @@ export default class ReportItems extends Component { ...@@ -693,7 +693,7 @@ export default class ReportItems 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}</span> <span style={{ color: tableMeta.rowData[10] === "active" ? "#656565" : 'rgba(0, 0, 0, 0.25)' }}>{val}</span>
</div > </div >
); );
} }
...@@ -705,19 +705,19 @@ export default class ReportItems extends Component { ...@@ -705,19 +705,19 @@ export default class ReportItems 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}</span> <span style={{ color: tableMeta.rowData[10] === "active" ? "#656565" : 'rgba(0, 0, 0, 0.25)' }}>{val}</span>
</div > </div >
); );
} }
} }
}, },
{ {
name: "Tipe Data", name: "Data Type",
options: { options: {
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}</span> <span style={{ color: tableMeta.rowData[10] === "active" ? "#656565" : 'rgba(0, 0, 0, 0.25)' }}>{val}</span>
</div > </div >
); );
} }
...@@ -729,7 +729,7 @@ export default class ReportItems extends Component { ...@@ -729,7 +729,7 @@ export default class ReportItems 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}</span> <span style={{ color: tableMeta.rowData[10] === "active" ? "#656565" : 'rgba(0, 0, 0, 0.25)' }}>{val}</span>
</div > </div >
); );
} }
...@@ -756,7 +756,7 @@ export default class ReportItems extends Component { ...@@ -756,7 +756,7 @@ export default class ReportItems extends Component {
{this.state.itemReport === true ? {this.state.itemReport === true ?
<div> <div>
<div style={{ display: 'flex', flexDirection: 'row', justifyContent: 'space-between', paddingRight: 25, paddingLeft: 25, marginTop: -150 }}> <div style={{ display: 'flex', flexDirection: 'row', justifyContent: 'space-between', paddingRight: 25, paddingLeft: 25, marginTop: -150 }}>
<label style={{ color: 'white', fontSize: 16, alignSelf: 'center', width: '20%', }}>Master Data - Item Laporan</label> <label style={{ color: 'white', fontSize: 16, alignSelf: 'center', width: '20%', }}>Master Data - Report Items</label>
<div style={{ color: 'white', width: '50%', height: 37, display: 'flex', backgroundColor: 'white', borderWidth: 2, alignItems: 'center', borderRadius: 6, paddingLeft: 5, paddingRight: 5, alignSelf: 'center' }}> <div style={{ color: 'white', width: '50%', height: 37, display: 'flex', backgroundColor: 'white', borderWidth: 2, alignItems: 'center', borderRadius: 6, paddingLeft: 5, paddingRight: 5, alignSelf: 'center' }}>
<img src={Images.searchBlack} style={{ marginRight: 10 }} /> <img src={Images.searchBlack} style={{ marginRight: 10 }} />
<InputBase <InputBase
...@@ -810,7 +810,7 @@ export default class ReportItems extends Component { ...@@ -810,7 +810,7 @@ export default class ReportItems extends Component {
</button> </button>
</a> </a>
<ReactTooltip border={true} id="download" place="bottom" type="light" effect="solid" /> <ReactTooltip border={true} id="download" place="bottom" type="light" effect="solid" />
<a data-tip={'Visualisasi'} data-for="visualisasi"> <a data-tip={'Visualization'} data-for="visualisasi">
<button <button
style={{ style={{
backgroundColor: 'transparent', backgroundColor: 'transparent',
...@@ -824,7 +824,7 @@ export default class ReportItems extends Component { ...@@ -824,7 +824,7 @@ export default class ReportItems extends Component {
</button> </button>
</a> </a>
<ReactTooltip border={true} id="visualisasi" place="bottom" type="light" effect="solid" /> <ReactTooltip border={true} id="visualisasi" place="bottom" type="light" effect="solid" />
<a data-tip={'Tambah'} data-for="tambah"> <a data-tip={'Add'} data-for="tambah">
<button <button
style={{ style={{
backgroundColor: 'transparent', backgroundColor: 'transparent',
...@@ -858,9 +858,6 @@ export default class ReportItems extends Component { ...@@ -858,9 +858,6 @@ export default class ReportItems extends Component {
height={this.props.height} height={this.props.height}
/> />
: :
<div style={{ height: this.props.height }}>
<div style={{ height: 199, width: '100%' }} className={"main-color"} />
<div>
<div> <div>
<div style={{ display: 'flex', flexDirection: 'row', justifyContent: 'space-between', paddingRight: 25, paddingLeft: 25, marginTop: -150 }}> <div style={{ display: 'flex', flexDirection: 'row', justifyContent: 'space-between', paddingRight: 25, paddingLeft: 25, marginTop: -150 }}>
<label style={{ color: 'white', fontSize: 16, alignSelf: 'center' }}>Preview Data</label> <label style={{ color: 'white', fontSize: 16, alignSelf: 'center' }}>Preview Data</label>
...@@ -898,8 +895,6 @@ export default class ReportItems extends Component { ...@@ -898,8 +895,6 @@ export default class ReportItems extends Component {
</button> </button>
</div> </div>
</div> </div>
</div>
</div>
} }
{this.state.add && ( {this.state.add && (
<CreateReportItems <CreateReportItems
......
src/container/MasterData/UnitBisnis.js
View file @ 26a85b1b
...@@ -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 >
); );
} }
......
src/container/MasterData/formReportItems/CreateReportItems.js
View file @ 26a85b1b
import React, { Component } from 'react'; import React, { Component } from 'react';
import { TextField, Typography } from '@material-ui/core'; import { TextField, Typography, Snackbar, withStyles } from '@material-ui/core';
import * as R from 'ramda'; import * as R from 'ramda';
import api from '../../../api'; import api from '../../../api';
import Autocomplete from '@material-ui/lab/Autocomplete'; import Autocomplete from '@material-ui/lab/Autocomplete';
...@@ -7,6 +7,9 @@ import { titleCase } from '../../../library/Utils'; ...@@ -7,6 +7,9 @@ import { titleCase } from '../../../library/Utils';
import format from "date-fns/format"; import format from "date-fns/format";
import { DatePicker } from '@material-ui/pickers'; import { DatePicker } from '@material-ui/pickers';
import Images from '../../../assets/Images'; import Images from '../../../assets/Images';
import MuiAlert from '@material-ui/lab/Alert';
const Alert = withStyles({
})((props) => <MuiAlert elevation={6} variant="filled" {...props} />);
export default class CreateReportItems extends Component { export default class CreateReportItems extends Component {
constructor(props) { constructor(props) {
...@@ -53,7 +56,10 @@ export default class CreateReportItems extends Component { ...@@ -53,7 +56,10 @@ export default class CreateReportItems extends Component {
disabledFormula: true, disabledFormula: true,
disabledCondt: true, disabledCondt: true,
disabledValue: true, disabledValue: true,
options: ['WARNING', 'STOPPER'] options: ['WARNING', 'STOPPER'],
alert: false,
tipeAlert: '',
messageAlert: ''
} }
} }
...@@ -141,17 +147,17 @@ export default class CreateReportItems extends Component { ...@@ -141,17 +147,17 @@ export default class CreateReportItems extends Component {
validasi() { validasi() {
// alert('coba ya') // alert('coba ya')
if (R.isNil(this.state.reportType)) { if (R.isNil(this.state.reportType)) {
this.setState({errorJenisLaporan: true, msgErrorJenisLaporan: 'Jenis Laporan Harus Diisi'}) this.setState({errorJenisLaporan: true, msgErrorJenisLaporan: 'Report type cannot be empty.'})
} else if (R.isNil(this.state.company)){ } else if (R.isNil(this.state.company)){
this.setState({ errorPerusahaan: true, msgErrorPerusahaan: 'Perusahaan Harus Diisi'}) this.setState({ errorPerusahaan: true, msgErrorPerusahaan: 'Company cannot be empty.'})
} else if (R.isEmpty(this.state.order)) { } else if (R.isEmpty(this.state.order)) {
this.setState({ errorOrder: true, msgErrorOrder: 'Order Harus Diisi' }) this.setState({ errorOrder: true, msgErrorOrder: 'Order cannot be empty.' })
} }
else if (R.isEmpty(this.state.description)) { else if (R.isEmpty(this.state.description)) {
this.setState({ errorDesc: true, msgErrorDesc: 'Deskripsi Harus Diisi' }) this.setState({ errorDesc: true, msgErrorDesc: 'Description cannot be empty.' })
} }
else if (R.isNil(this.state.InputType)) { else if (R.isNil(this.state.InputType)) {
this.setState({ errorTipeData: true, msgErrorTipeData: 'Tipe Data Harus Diisi' }) this.setState({ errorTipeData: true, msgErrorTipeData: 'Data type cannot be empty' })
} }
else if (this.state.disabledFormula === false && R.isEmpty(this.state.formula)) { else if (this.state.disabledFormula === false && R.isEmpty(this.state.formula)) {
this.setState({ errorFormula: true, msgErrorFormula: 'Formula Harus Diisi' }) this.setState({ errorFormula: true, msgErrorFormula: 'Formula Harus Diisi' })
...@@ -196,7 +202,9 @@ export default class CreateReportItems extends Component { ...@@ -196,7 +202,9 @@ export default class CreateReportItems extends Component {
getInputType() { getInputType() {
api.create().getInputType().then((response) => { api.create().getInputType().then((response) => {
console.log(response.data) // console.log(response.data)
if(response.data) {
if (response.data.status === 'success') { if (response.data.status === 'success') {
let data = response.data.data let data = response.data.data
let inputData = data.map((item) => { let inputData = data.map((item) => {
...@@ -211,7 +219,11 @@ export default class CreateReportItems extends Component { ...@@ -211,7 +219,11 @@ export default class CreateReportItems extends Component {
}; };
this.setState({ listInputType: defaultProps, inputData: response.data.data }) this.setState({ listInputType: defaultProps, inputData: response.data.data })
} else { } else {
alert(response.data.message) this.setState({ alert: true, messageAlert: response.data.message, tipeAlert: 'warning' })
// alert(response.data.message)
}
} else {
this.setState({ alert: true, messageAlert: response.problem, tipeAlert: 'error' })
} }
}) })
} }
...@@ -219,6 +231,7 @@ export default class CreateReportItems extends Component { ...@@ -219,6 +231,7 @@ export default class CreateReportItems extends Component {
getPerusahaan() { getPerusahaan() {
api.create().getPerusahaanActive().then((response) => { api.create().getPerusahaanActive().then((response) => {
// console.log(response) // console.log(response)
if (response.data) {
if (response.data.status === 'success') { if (response.data.status === 'success') {
let data = response.data.data let data = response.data.data
let companyData = data.map((item) => { let companyData = data.map((item) => {
...@@ -227,13 +240,21 @@ export default class CreateReportItems extends Component { ...@@ -227,13 +240,21 @@ export default class CreateReportItems extends Component {
company_name: item.company_name company_name: item.company_name
} }
}) })
let defaultProps = { companyData.push({
options: companyData, company_id: 0,
getOptionLabel: (option) => titleCase(option.company_name), company_name: 'Default'
})
let typeProps = {
options: companyData.sort((a, b) => a.company_id - b.company_id),
getOptionLabel: (option) => option.company_name,
}; };
this.setState({ listCompany: defaultProps, companyData: response.data.data }) this.setState({ listCompany: typeProps, companyData: response.data.data })
} else {
this.setState({ alert: true, messageAlert: response.data.message, tipeAlert: 'warning' })
// alert(response.data.message)
}
} else { } else {
alert(response.data.message) this.setState({ alert: true, messageAlert: response.problem, tipeAlert: 'error' })
} }
}) })
} }
...@@ -241,6 +262,7 @@ export default class CreateReportItems extends Component { ...@@ -241,6 +262,7 @@ export default class CreateReportItems extends Component {
getReportType() { getReportType() {
api.create().getReportType().then((response) => { api.create().getReportType().then((response) => {
// console.log(response) // console.log(response)
if (response.data) {
if (response.data.status === 'success') { if (response.data.status === 'success') {
let data = response.data.data let data = response.data.data
let reportTypeData = data.map((item) => { let reportTypeData = data.map((item) => {
...@@ -255,7 +277,11 @@ export default class CreateReportItems extends Component { ...@@ -255,7 +277,11 @@ export default class CreateReportItems extends Component {
}; };
this.setState({ listReportType: defaultProps, reportTypeData: response.data.data }) this.setState({ listReportType: defaultProps, reportTypeData: response.data.data })
} else { } else {
alert(response.data.message) // alert(response.data.message)
this.setState({ alert: true, messageAlert: response.data.message, tipeAlert: 'warning' })
}
} else {
this.setState({ alert: true, messageAlert: response.problem, tipeAlert: 'error' })
} }
}) })
} }
...@@ -267,7 +293,9 @@ export default class CreateReportItems extends Component { ...@@ -267,7 +293,9 @@ export default class CreateReportItems extends Component {
"company_id": this.state.company.company_id "company_id": this.state.company.company_id
} }
api.create().getReportParent(payload).then((response) => { api.create().getReportParent(payload).then((response) => {
console.log(response) // console.log(response)
if (response.data) {
if (response.data.status === 'success') { if (response.data.status === 'success') {
let data = response.data.data let data = response.data.data
let parentData = data.map((item) => { let parentData = data.map((item) => {
...@@ -282,7 +310,11 @@ export default class CreateReportItems extends Component { ...@@ -282,7 +310,11 @@ export default class CreateReportItems extends Component {
}; };
this.setState({ listParent: defaultProps, parentData: response.data.data }) this.setState({ listParent: defaultProps, parentData: response.data.data })
} else { } else {
alert(response.data.message) this.setState({ alert: true, messageAlert: response.data.message, tipeAlert: 'warning' })
// alert(response.data.message)
}
} else {
this.setState({ alert: true, messageAlert: response.problem, tipeAlert: 'error' })
} }
}) })
} }
...@@ -314,7 +346,7 @@ export default class CreateReportItems extends Component { ...@@ -314,7 +346,7 @@ export default class CreateReportItems extends Component {
<div className="popup-panel grid grid-2x main-color" style={{ height: 64, borderTopRightRadius: 8, borderTopLeftRadius: 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="col-1" style={{ maxWidth: "inherit", display: 'flex', alignItems: 'center' }}>
<div className="popup-title"> <div className="popup-title">
<span style={{ color: '#fff', fontSize: 16, fontWeight: 'bold' }}>Tambah Data</span> <span style={{ color: '#fff', fontSize: 16, fontWeight: 'bold' }}>Add Data</span>
</div> </div>
</div> </div>
<div className="col-2 content-right" style={{ maxWidth: "inherit", alignSelf: 'center' }}> <div className="col-2 content-right" style={{ maxWidth: "inherit", alignSelf: 'center' }}>
...@@ -327,6 +359,11 @@ export default class CreateReportItems extends Component { ...@@ -327,6 +359,11 @@ export default class CreateReportItems extends Component {
</button> </button>
</div> </div>
</div> </div>
<Snackbar open={this.state.alert} autoHideDuration={6000} onClose={() => this.closeAlert()}>
<Alert onClose={() => this.closeAlert()} severity={this.state.tipeAlert}>
{this.state.messageAlert}
</Alert>
</Snackbar>
<div className="grid grid-2x grid-mobile-none gap-15px" style={{ paddingLeft: 20, paddingRight: 20 }}> <div className="grid grid-2x grid-mobile-none gap-15px" style={{ paddingLeft: 20, paddingRight: 20 }}>
<div className="column-1"> <div className="column-1">
...@@ -362,7 +399,7 @@ export default class CreateReportItems extends Component { ...@@ -362,7 +399,7 @@ export default class CreateReportItems extends Component {
debug debug
renderInput={(params) => renderInput={(params) =>
<TextField {...params} <TextField {...params}
label="Jenis Laporan" label="Report Type"
InputLabelProps={{ InputLabelProps={{
style: { style: {
fontSize: 11, fontSize: 11,
...@@ -390,7 +427,7 @@ export default class CreateReportItems extends Component { ...@@ -390,7 +427,7 @@ export default class CreateReportItems extends Component {
debug debug
renderInput={(params) => renderInput={(params) =>
<TextField {...params} <TextField {...params}
label="Perusahaan" label="Company"
InputLabelProps={{ InputLabelProps={{
style: { style: {
fontSize: 11, fontSize: 11,
...@@ -444,7 +481,7 @@ export default class CreateReportItems extends Component { ...@@ -444,7 +481,7 @@ export default class CreateReportItems extends Component {
<TextField <TextField
style={{ width: '100%' }} style={{ width: '100%' }}
id="description" id="description"
label="Deskripsi" label="Description"
name="description" name="description"
value={this.state.description} value={this.state.description}
error={this.state.errorDesc} error={this.state.errorDesc}
...@@ -587,7 +624,7 @@ export default class CreateReportItems extends Component { ...@@ -587,7 +624,7 @@ export default class CreateReportItems extends Component {
debug debug
renderInput={(params) => renderInput={(params) =>
<TextField {...params} <TextField {...params}
label="Tipe Data" label="Data Type"
error={this.state.errorTipeData} error={this.state.errorTipeData}
helperText={this.state.msgErrorTipeData} helperText={this.state.msgErrorTipeData}
InputLabelProps={{ InputLabelProps={{
...@@ -642,7 +679,7 @@ export default class CreateReportItems extends Component { ...@@ -642,7 +679,7 @@ export default class CreateReportItems extends Component {
<TextField <TextField
style={{ width: '100%' }} style={{ width: '100%' }}
id="realVal" id="realVal"
label="Nilai Seharusnya" label="True Value"
name="realVal" name="realVal"
disabled={this.state.disabledValue} disabled={this.state.disabledValue}
value={this.state.realVal} value={this.state.realVal}
...@@ -679,7 +716,7 @@ export default class CreateReportItems extends Component { ...@@ -679,7 +716,7 @@ export default class CreateReportItems extends Component {
<TextField {...params} <TextField {...params}
error={this.state.errorCondition} error={this.state.errorCondition}
helperText={this.state.msgErrorCondition} helperText={this.state.msgErrorCondition}
label="Kondisi Jika Salah" label="False Condition"
InputLabelProps={{ InputLabelProps={{
style: { style: {
fontSize: 11, fontSize: 11,
...@@ -700,7 +737,7 @@ export default class CreateReportItems extends Component { ...@@ -700,7 +737,7 @@ export default class CreateReportItems extends Component {
<DatePicker <DatePicker
margin="normal" margin="normal"
id="startDate" id="startDate"
label="Berlaku Mulai" label="Valid From"
format="dd MMMM yyyy" format="dd MMMM yyyy"
value={this.state.startDate == "" ? null : this.state.startDate} value={this.state.startDate == "" ? null : this.state.startDate}
error={this.state.errorStartDate} error={this.state.errorStartDate}
...@@ -732,7 +769,7 @@ export default class CreateReportItems extends Component { ...@@ -732,7 +769,7 @@ export default class CreateReportItems extends Component {
<DatePicker <DatePicker
margin="normal" margin="normal"
id="endDate" id="endDate"
label="Berlaku Hingga" label="Valid To"
format="dd MMMM yyyy" format="dd MMMM yyyy"
value={this.state.endDate == "" ? null : this.state.endDate} value={this.state.endDate == "" ? null : this.state.endDate}
error={this.state.errorEndDate} error={this.state.errorEndDate}
...@@ -767,7 +804,7 @@ export default class CreateReportItems extends Component { ...@@ -767,7 +804,7 @@ export default class CreateReportItems extends Component {
<div className="margin-top-10px" style={{ backgroundColor: '#e8e8e8', padding: 10, borderRadius: 5 }}> <div className="margin-top-10px" style={{ backgroundColor: '#e8e8e8', padding: 10, borderRadius: 5 }}>
<TextField <TextField
style={{ width: '100%' }} style={{ width: '100%' }}
value={'Aktif'} defaultValue={"active"}
id="status" id="status"
label="Status" label="Status"
disabled disabled
...@@ -793,10 +830,10 @@ export default class CreateReportItems extends Component { ...@@ -793,10 +830,10 @@ export default class CreateReportItems extends Component {
<div className="column-1"> <div className="column-1">
<div className="margin-top-10px" style={{ padding: 10, borderRadius: 5 }}> <div className="margin-top-10px" style={{ padding: 10, borderRadius: 5 }}>
<div style={{ display: 'flex' }}> <div style={{ display: 'flex' }}>
<Typography style={{ fontSize: 11 }}>Dibuat :</Typography> <Typography style={{ fontSize: 11 }}>Created By :</Typography>
</div> </div>
<div style={{ display: 'flex' }}> <div style={{ display: 'flex' }}>
<Typography style={{ fontSize: 11 }}>Diubah :</Typography> <Typography style={{ fontSize: 11 }}>Updated By :</Typography>
</div> </div>
</div> </div>
</div> </div>
...@@ -809,7 +846,7 @@ export default class CreateReportItems extends Component { ...@@ -809,7 +846,7 @@ export default class CreateReportItems extends Component {
onClick={() => this.props.onClickClose()} onClick={() => this.props.onClickClose()}
> >
<div style={{ width: 102, height: 30, border: 'solid 1px #354960', borderRadius: 5, alignItems: 'center', display: 'flex', justifyContent: 'center' }}> <div style={{ width: 102, height: 30, border: 'solid 1px #354960', borderRadius: 5, alignItems: 'center', display: 'flex', justifyContent: 'center' }}>
<span style={{ color: '#354960', fontSize: 11 }}>Batal</span> <span style={{ color: '#354960', fontSize: 11 }}>Cancel</span>
</div> </div>
</button> </button>
</div> </div>
...@@ -819,7 +856,7 @@ export default class CreateReportItems extends Component { ...@@ -819,7 +856,7 @@ export default class CreateReportItems extends Component {
onClick={() => this.validasi()} onClick={() => this.validasi()}
> >
<div style={{ width: 102, height: 30, backgroundColor: '#354960', borderRadius: 5, alignItems: 'center', display: 'flex', justifyContent: 'center' }}> <div style={{ width: 102, height: 30, backgroundColor: '#354960', borderRadius: 5, alignItems: 'center', display: 'flex', justifyContent: 'center' }}>
<span style={{ color: '#fff', fontSize: 11 }}>Simpan</span> <span style={{ color: '#fff', fontSize: 11 }}>Save</span>
</div> </div>
</button> </button>
</div> </div>
......
src/container/MasterData/formReportItems/EditReportItems.js
View file @ 26a85b1b
...@@ -128,15 +128,15 @@ export default class EditReportItems extends Component { ...@@ -128,15 +128,15 @@ export default class EditReportItems extends Component {
validasi() { validasi() {
// alert('coba ya') // alert('coba ya')
if (R.isNil(this.state.reportType)){ if (R.isNil(this.state.reportType)){
this.setState({errorJenisLaporan: true, msgErrorJenisLaporan: 'Jenis Laporan Harus Diisi'}) this.setState({errorJenisLaporan: true, msgErrorJenisLaporan: 'Report type cannot be empty'})
} else if (R.isNil(this.state.company)){ } else if (R.isNil(this.state.company)){
this.setState({ errorPerusahaan: true, msgErrorPerusahaan: 'Perusahaan Harus Diisi'}) this.setState({ errorPerusahaan: true, msgErrorPerusahaan: 'Company cannot be empty'})
} else if (R.isEmpty(this.state.tempData.order)) { } else if (R.isEmpty(this.state.tempData.order)) {
this.setState({ errorOrder: true, msgErrorOrder: 'Order Harus Diisi' }) this.setState({ errorOrder: true, msgErrorOrder: 'Order cannot be empty.' })
} else if (R.isEmpty(this.state.tempData.description)) { } else if (R.isEmpty(this.state.tempData.description)) {
this.setState({ errorDesc: true, msgErrorDesc: 'Deskripsi Harus Diisi' }) this.setState({ errorDesc: true, msgErrorDesc: 'Description cannot be empty.' })
} else if (R.isNil(this.state.InputType)) { } else if (R.isNil(this.state.InputType)) {
this.setState({ errorTipeData: true, msgErrorTipeData: 'Tipe Data Harus Diisi' }) this.setState({ errorTipeData: true, msgErrorTipeData: 'Data type cannot be empty' })
} else if ((this.state.InputType.type_report_name === 'Formula' && R.isEmpty(this.state.tempData.formula)) || (this.state.InputType.type_report_name === 'Validation' && R.isEmpty(this.state.tempData.formula))) { } else if ((this.state.InputType.type_report_name === 'Formula' && R.isEmpty(this.state.tempData.formula)) || (this.state.InputType.type_report_name === 'Validation' && R.isEmpty(this.state.tempData.formula))) {
this.setState({ errorFormula: true, msgErrorFormula: 'Formula Harus Diisi' }) this.setState({ errorFormula: true, msgErrorFormula: 'Formula Harus Diisi' })
} else if (this.state.InputType.type_report_name === 'Validation' && R.isEmpty(this.state.tempData.condition_it_should_be)) { } else if (this.state.InputType.type_report_name === 'Validation' && R.isEmpty(this.state.tempData.condition_it_should_be)) {
...@@ -179,7 +179,13 @@ export default class EditReportItems extends Component { ...@@ -179,7 +179,13 @@ export default class EditReportItems extends Component {
api.create().getDetailReportItems(this.props.data[1]).then((response) => { api.create().getDetailReportItems(this.props.data[1]).then((response) => {
if (response.data) { if (response.data) {
if (response.data.status === 'success') { if (response.data.status === 'success') {
this.setState({ tempData: response.data.data }, () => this.getInputType(), this.getPerusahaan(), this.getReportType(),) let data = response.data.data
this.setState({
tempData: response.data.data,
getCompanyID: data.company_id
}, () => this.getInputType(),
this.getPerusahaan(),
this.getReportType(),)
console.log(response.data.data) console.log(response.data.data)
} else { } else {
this.setState({ alert: true, messageAlert: response.data.message, tipeAlert: 'warning' }) this.setState({ alert: true, messageAlert: response.data.message, tipeAlert: 'warning' })
...@@ -230,13 +236,17 @@ export default class EditReportItems extends Component { ...@@ -230,13 +236,17 @@ export default class EditReportItems extends Component {
company_name: item.company_name company_name: item.company_name
} }
}) })
companyData.push({
company_id: 0,
company_name: 'Default'
})
let index = companyData.sort((a, b) => a.company_id - b.company_id).findIndex((val) => val.company_id == this.state.getCompanyID)
let defaultProps = { let defaultProps = {
options: companyData, options: companyData,
getOptionLabel: (option) => titleCase(option.company_name), getOptionLabel: (option) => option.company_name,
}; };
// let index = companyData.findIndex((val) => val.company_id === this.state.tempData.company_id)
let index = companyData.findIndex((val) => val.company_id === this.state.tempData.company_id) this.setState({ listCompany: defaultProps, companyData: response.data.data, company: index === -1 ? null : companyData[index] }, () => this.getParent())
this.setState({ listCompany: defaultProps, company: index === -1 ? null : companyData[index] }, () => this.getParent())
} else { } else {
this.setState({ alert: true, messageAlert: response.data.message, tipeAlert: 'warning' }) this.setState({ alert: true, messageAlert: response.data.message, tipeAlert: 'warning' })
} }
...@@ -384,7 +394,7 @@ export default class EditReportItems extends Component { ...@@ -384,7 +394,7 @@ export default class EditReportItems extends Component {
debug debug
renderInput={(params) => renderInput={(params) =>
<TextField {...params} <TextField {...params}
label="Jenis Laporan" label="Report Type"
InputLabelProps={{ InputLabelProps={{
style: { style: {
fontSize: 11, fontSize: 11,
...@@ -411,7 +421,7 @@ export default class EditReportItems extends Component { ...@@ -411,7 +421,7 @@ export default class EditReportItems extends Component {
debug debug
renderInput={(params) => renderInput={(params) =>
<TextField {...params} <TextField {...params}
label="Perusahaan" label="Company"
InputLabelProps={{ InputLabelProps={{
style: { style: {
fontSize: 11, fontSize: 11,
...@@ -464,7 +474,7 @@ export default class EditReportItems extends Component { ...@@ -464,7 +474,7 @@ export default class EditReportItems extends Component {
<TextField <TextField
style={{ width: '100%' }} style={{ width: '100%' }}
id="description" id="description"
label="Deskripsi" label="Description"
name="description" name="description"
error={this.state.errorDesc} error={this.state.errorDesc}
helperText={this.state.msgErrorDesc} helperText={this.state.msgErrorDesc}
...@@ -581,7 +591,7 @@ export default class EditReportItems extends Component { ...@@ -581,7 +591,7 @@ export default class EditReportItems extends Component {
debug debug
renderInput={(params) => renderInput={(params) =>
<TextField {...params} <TextField {...params}
label="Tipe Data" label="Data Type"
InputLabelProps={{ InputLabelProps={{
style: { style: {
fontSize: 11, fontSize: 11,
...@@ -633,7 +643,7 @@ export default class EditReportItems extends Component { ...@@ -633,7 +643,7 @@ export default class EditReportItems extends Component {
<TextField <TextField
style={{ width: '100%' }} style={{ width: '100%' }}
id="condition_it_should_be" id="condition_it_should_be"
label="Nilai Seharusnya" label="True Value"
error={this.state.errorRV} error={this.state.errorRV}
helperText={this.state.msgErrorRV} helperText={this.state.msgErrorRV}
disabled={this.state.InputType == null ? true : (this.state.InputType.type_report_name === 'Validation' ? false : true)} disabled={this.state.InputType == null ? true : (this.state.InputType.type_report_name === 'Validation' ? false : true)}
...@@ -668,7 +678,7 @@ export default class EditReportItems extends Component { ...@@ -668,7 +678,7 @@ export default class EditReportItems extends Component {
options={this.state.options} options={this.state.options}
renderInput={(params) => renderInput={(params) =>
<TextField {...params} <TextField {...params}
label="Kondisi Jika Salah" label="False Condition"
InputLabelProps={{ InputLabelProps={{
style: { style: {
fontSize: 11, fontSize: 11,
...@@ -690,7 +700,7 @@ export default class EditReportItems extends Component { ...@@ -690,7 +700,7 @@ export default class EditReportItems extends Component {
<DatePicker <DatePicker
margin="normal" margin="normal"
id="startDate" id="startDate"
label="Berlaku Mulai" label="Valid From"
format="dd MMMM yyyy" format="dd MMMM yyyy"
value={this.state.tempData === null ? null : this.state.tempData.start_date} value={this.state.tempData === null ? null : this.state.tempData.start_date}
error={this.state.errorStartDate} error={this.state.errorStartDate}
...@@ -699,6 +709,19 @@ export default class EditReportItems extends Component { ...@@ -699,6 +709,19 @@ export default class EditReportItems extends Component {
KeyboardButtonProps={{ KeyboardButtonProps={{
'aria-label': 'change date', 'aria-label': 'change date',
}} }}
inputProps={{
style: {
fontSize: 11,
fontFamily: 'Nunito Sans, sans-serif',
}
}}
InputLabelProps={{
style: {
fontSize: 11,
color: '#7e8085',
fontFamily: 'Nunito Sans, sans-serif',
}
}}
style={{ padding: 0, margin: 0, width: '100%' }} style={{ padding: 0, margin: 0, width: '100%' }}
/> />
</div> </div>
...@@ -708,7 +731,7 @@ export default class EditReportItems extends Component { ...@@ -708,7 +731,7 @@ export default class EditReportItems extends Component {
<DatePicker <DatePicker
margin="normal" margin="normal"
id="endDate" id="endDate"
label="Berlaku Hingga" label="Valid To"
format="dd MMMM yyyy" format="dd MMMM yyyy"
value={this.state.tempData === null ? null : this.state.tempData.end_date} value={this.state.tempData === null ? null : this.state.tempData.end_date}
error={this.state.errorEndDate} error={this.state.errorEndDate}
...@@ -718,6 +741,19 @@ export default class EditReportItems extends Component { ...@@ -718,6 +741,19 @@ export default class EditReportItems extends Component {
KeyboardButtonProps={{ KeyboardButtonProps={{
'aria-label': 'change date', 'aria-label': 'change date',
}} }}
inputProps={{
style: {
fontSize: 11,
fontFamily: 'Nunito Sans, sans-serif',
}
}}
InputLabelProps={{
style: {
fontSize: 11,
color: '#7e8085',
fontFamily: 'Nunito Sans, sans-serif',
}
}}
style={{ padding: 0, margin: 0, width: '100%' }} style={{ padding: 0, margin: 0, width: '100%' }}
/> />
...@@ -750,20 +786,16 @@ export default class EditReportItems extends Component { ...@@ -750,20 +786,16 @@ export default class EditReportItems extends Component {
</div> </div>
</div> </div>
</div> </div>
<div className="grid grid-2x grid-mobile-none gap-15px" style={{ paddingBottom: 20, paddingLeft: 20, paddingRight: 20 }}> <div className="margin-top-10px" style={{ padding: 20}}>
<div className="column-1">
<div className="margin-top-10px" style={{ padding: 10, borderRadius: 5 }}>
<div style={{ display: 'flex' }}> <div style={{ display: 'flex' }}>
<Typography style={{ fontSize: 11, width: '20%' }}>Dibuat</Typography> <Typography style={{ fontSize: 11, width: '13%' }}>Created By</Typography>
<Typography style={{ fontSize: 11 }}>: {this.state.tempData === null ? "" : this.state.tempData.created}</Typography> <Typography style={{ fontSize: 11 }}>: {this.state.tempData === null ? "" : this.state.tempData.created}</Typography>
</div> </div>
<div style={{ display: 'flex' }}> <div style={{ display: 'flex' }}>
<Typography style={{ fontSize: 11, width: '20%' }}>Diubah</Typography> <Typography style={{ fontSize: 11, width: '13%' }}>Updated By</Typography>
<Typography style={{ fontSize: 11 }}>: {this.state.tempData === null ? "" : this.state.tempData.updated}</Typography> <Typography style={{ fontSize: 11 }}>: {this.state.tempData === null ? "" : this.state.tempData.updated}</Typography>
</div> </div>
</div> </div>
</div>
</div>
<div className="border-top grid grid-2x" style={{ height: 56, backgroundColor: '#f5f5f5', paddingLeft: 20, paddingRight: 20 }}> <div className="border-top grid grid-2x" style={{ height: 56, backgroundColor: '#f5f5f5', paddingLeft: 20, paddingRight: 20 }}>
<div className="column-1" style={{ alignSelf: 'center' }}> <div className="column-1" style={{ alignSelf: 'center' }}>
...@@ -772,14 +804,14 @@ export default class EditReportItems extends Component { ...@@ -772,14 +804,14 @@ export default class EditReportItems extends Component {
onClick={() => this.props.onClickClose()} onClick={() => this.props.onClickClose()}
> >
<div style={{ width: 102, height: 30, border: 'solid 1px #354960', borderRadius: 5, alignItems: 'center', display: 'flex', justifyContent: 'center' }}> <div style={{ width: 102, height: 30, border: 'solid 1px #354960', borderRadius: 5, alignItems: 'center', display: 'flex', justifyContent: 'center' }}>
<span style={{ color: '#354960', fontSize: 11 }}>Batal</span> <span style={{ color: '#354960', fontSize: 11 }}>Cancel</span>
</div> </div>
</button> </button>
</div> </div>
<div className="column-2" style={{ display: 'flex', justifyContent: 'flex-end', alignItems: 'center' }}> <div className="column-2" style={{ display: 'flex', justifyContent: 'flex-end', alignItems: 'center' }}>
<button onClick={() => this.validasi()}> <button onClick={() => this.validasi()}>
<div style={{ width: 102, height: 30, backgroundColor: '#354960', borderRadius: 5, alignItems: 'center', display: 'flex', justifyContent: 'center' }}> <div style={{ width: 102, height: 30, backgroundColor: '#354960', borderRadius: 5, alignItems: 'center', display: 'flex', justifyContent: 'center' }}>
<span style={{ color: '#fff', fontSize: 11 }}>Simpan</span> <span style={{ color: '#fff', fontSize: 11 }}>Save</span>
</div> </div>
</button> </button>
</div> </div>
......
src/container/MasterData/formReportItems/VisualReportItems.js
View file @ 26a85b1b
...@@ -198,7 +198,7 @@ export default class VisualReportItems extends Component { ...@@ -198,7 +198,7 @@ export default class VisualReportItems extends Component {
return ( return (
<div> <div>
<button type="button" onClick={() => this.collapse(item.id)}>{collapseIcon ? (this.state.arrayCollapse.includes(item.id) ? <AddIcon /> : <RemoveIcon />) : null}</button> <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> </div>
) )
}; };
......
src/library/CustomTable.js
View file @ 26a85b1b
...@@ -343,11 +343,10 @@ exports.customOptionsFixedColumn = function () { ...@@ -343,11 +343,10 @@ exports.customOptionsFixedColumn = function () {
sort: false, sort: false,
viewColumns:false, viewColumns:false,
overflowX: 'auto', overflowX: 'auto',
rowsPerPage: 10,
rowsPerPageOptions: [5, 10, 20, 50],
print: false, print: false,
download: false, download: false,
elevation: 5, 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