Commit e7bedee0 authored by EKSAD's avatar EKSAD

report item

parent e6b8cb2c
......@@ -414,6 +414,7 @@ export default class ReportItems extends Component {
<CreateReportItems
onClickClose={() => this.setState({ add: false })}
data={this.state.listData}
refresh={this.getData.bind(this)}
createReportItems={this.createReportItems.bind(this)}
/>
)}
......@@ -421,6 +422,7 @@ export default class ReportItems extends Component {
<EditReportItems
onClickClose={() => this.setState({ edit: false })}
data={this.state.listData[this.state.selectIndex]}
refresh={this.getData.bind(this)}
updateReportItems={this.updateReportItems.bind(this)}
/>
)}
......
......@@ -7,6 +7,8 @@ import { titleCase } from '../../../library/Utils';
import format from "date-fns/format";
import { DatePicker } from '@material-ui/pickers';
const options = ['WARNING', 'STOPPER'];
export default class CreateReportItems extends Component {
constructor(props) {
super(props)
......@@ -17,13 +19,15 @@ export default class CreateReportItems extends Component {
reportType: null,
startDate: null,
endDate: null,
order: '',
order: null,
description: '',
uom: '',
weight: '',
weight: null,
formula: '',
realVal: '',
condition: '',
value: options[0],
inputValue: '',
date: new Date(),
listInputType: null,
listCompany: null,
......@@ -39,10 +43,13 @@ export default class CreateReportItems extends Component {
msgErrorOrder: '',
msgErrorDesc: '',
msgErrorFormula: '',
masgErrorRV: '',
msgErrorRV: '',
msgErrorCF: '',
msgErrorSD: '',
msgErrorED: '',
disabledFormula: true,
disabledCondt: true,
disabledValue: true
}
}
......@@ -60,27 +67,51 @@ export default class CreateReportItems extends Component {
if (isDate && type === 'start_date') {
this.setState({...data, startDate: format(e, 'yyyy-MM-dd'), endDate: null,
errorOrder: false,
errorDesc: false,
errorFormula: false,
errorRV: false,
errorCF: false,
errorStartDate: false,
errorEndDate: false,
msgErrorOrder: '',
msgErrorDesc: '',
msgErrorFormula: '',
msgErrorRV: '',
msgErrorCF: '',
msgErrorSD: '',
msgErrorED: '',
})
} else if (isDate && type === 'end_date') {
this.setState({...data, endDate : format(e, 'yyyy-MM-dd'),
errorOrder: false,
errorDesc: false,
errorFormula: false,
errorRV: false,
errorCF: false,
errorStartDate: false,
errorEndDate: false,
msgErrorOrder: '',
msgErrorDesc: '',
msgErrorFormula: '',
msgErrorRV: '',
msgErrorCF: '',
msgErrorSD: '',
msgErrorED: '',
})
} else {
this.setState({...data, [e.target.name]: e.target.value,
errorOrder: false,
errorDesc: false,
errorFormula: false,
errorRV: false,
errorCF: false,
errorStartDate: false,
errorEndDate: false,
msgErrorOrder: '',
msgErrorDesc: '',
msgErrorFormula: '',
msgErrorRV: '',
msgErrorCF: '',
msgErrorSD: '',
msgErrorED: '',
})
......@@ -89,32 +120,60 @@ export default class CreateReportItems extends Component {
validasi() {
// alert('coba ya')
if (R.isEmpty(this.state.order)) {
if (R.isNil(this.state.reportType)) return alert("Jenis Laporan is Required.");
if (R.isNil(this.state.company)) return alert("Perusahaan is Required.");
else if (R.isNil(this.state.order)) {
this.setState({errorOrder: true, msgErrorOrder: 'Order Harus Diisi'})
} else if (R.isNil(this.state.startDate)) {
}
else if (R.isEmpty(this.state.description)) {
this.setState({errorDesc: true, msgErrorDesc: 'Deskripsi Harus Diisi'})
}
else if (R.isNil(this.state.parent)) return alert("Parent ID is Required.")
else if (R.isNil(this.state.InputType)) return alert("Tipe Data is Required.");
else if (this.state.disabledFormula === false && R.isEmpty(this.state.formula)) {
this.setState({errorFormula: true, msgErrorFormula: 'Formula Harus Diisi'})
}
else if (this.state.disabledValue === false && R.isEmpty(this.state.realVal)) {
this.setState({errorRV: true, msgErrorRV: 'Nilai Seharusnya Harus Diisi'})
}
else if (this.state.disabledCondt === false && R.isEmpty(this.state.condition)) {
this.setState({errorCF: true, msgErrorCF: 'Nilai Seharusnya Harus Diisi'})
}
else if (R.isNil(this.state.startDate)) {
this.setState({errorStartDate: true, msgErrorSD: 'Start Date tidak boleh kosong'})
} else if (R.isNil(this.state.endDate)) {
}
else if (R.isNil(this.state.endDate)) {
this.setState({errorEndDate: true, msgErrorED: 'End Date tidak boleh kosong'})
} else {
}
else {
this.addReportItems()
}
}
addReportItems() {
alert("test")
// let payload = {
// "role_name": this.state.roleName,
// "start_date": this.state.startDate,
// "end_date": this.state.endDate,
// "privileges": this.state.privileges
// }
// // console.log(payload)
// api.create().addRole(payload).then((response) => {
// alert("test")
let payload = {
"report_id": this.state.reportType.report_id,
"company_id": this.state.company.company_id,
"description": this.state.description,
"orders": this.state.order,
"parent": this.state.parent.item_report_id,
"type_report_id": this.state.InputType.type_report_id,
"formula": this.state.formula,
"uom": this.state.uom,
"weight": this.state.weight,
"condition_if_wrong": this.state.condition,
"condition_it_should_be": this.state.realVal,
"start_date": this.state.startDate,
"end_date": this.state.endDate
}
console.log(payload)
// api.create().createReportItems(payload).then((response) => {
// console.log(response)
// if (response.data.status === 'success') {
// this.props.refresh()
// this.props.onClickClose()
// this.props.refresh()
// } else {
// alert(response.data.message)
// }
......@@ -208,13 +267,18 @@ export default class CreateReportItems extends Component {
})
}
handleDate(item) {
let value = format(item, 'dd MMMM yyyy')
return value
}
render() {
const { startDate, endDate } = this.state;
return (
<div className="test app-popup-show">
<div className="popup-content background-white border-radius" style={{ borderRadius: 8 }}>
<div className="popup-panel grid grid-2x" style={{ backgroundColor: '#51c6ea', 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="popup-title">
<span style={{ color: '#fff', fontSize: 16, fontWeight: 'bold' }}>Tambah Data</span>
......@@ -237,7 +301,7 @@ export default class CreateReportItems extends Component {
<div className="margin-top-10px" style={{ backgroundColor: '#e8e8e8', padding: 10, borderRadius: 5 }}>
<TextField
style={{ width: '100%' }}
value={1}
value={'-'}
id="ID"
label="ID"
disabled
......@@ -285,6 +349,11 @@ export default class CreateReportItems extends Component {
style={{ width: '100%' }}
id="description"
label="Deskripsi"
name="description"
value={this.state.description}
error={this.state.errorDesc}
helperText={this.state.msgErrorDesc}
onChange={(e) => this.handleChange(e, '')}
// value={this.props.data.business_unit_name}
inputProps={{
style: {
......@@ -308,8 +377,10 @@ export default class CreateReportItems extends Component {
<TextField
style={{ width: '100%' }}
id="uom"
name="uom"
label="UOM"
// value={this.props.data.business_unit_name}
value={this.state.uom}
onChange={(e) => this.handleChange(e, '')}
inputProps={{
style: {
fontSize: 11,
......@@ -332,7 +403,12 @@ export default class CreateReportItems extends Component {
<Autocomplete
{...this.state.listInputType}
id="inputType"
onChange={(event, newInputValue) => this.setState({InputType: newInputValue})}
onChange={(event, newInputValue) => this.setState({InputType: newInputValue},
() => newInputValue === null ? this.setState({disabledFormula: true, disabledCondt: true, disabledValue: true, formula: '', condition: '', realVal: ''})
: newInputValue.type_report_name === 'FORMULA' ? this.setState({disabledFormula: false, disabledCondt: true, disabledValue: true, formula: '', condition: '', realVal: ''})
: newInputValue.type_report_name === 'VALIDATION' ? this.setState({disabledFormula: false, disabledCondt: false, disabledValue: false, formula: '', condition: '', realVal: ''})
: this.setState({disabledFormula: true, disabledCondt: true, disabledValue: true, formula: '', condition: '', realVal: ''})
)}
debug
renderInput={(params) =>
<TextField {...params}
......@@ -351,14 +427,17 @@ export default class CreateReportItems extends Component {
/>
</div>
<div className="margin-top-10px" style={{ backgroundColor: '#e8e8e8', padding: 10, borderRadius: 5 }}>
<div className="margin-top-10px" style={{padding: 10}}>
<TextField
style={{ width: '100%' }}
// value={this.props.data.status}
id="realValue"
label="Nilai Seharusnya"
value="-"
disabled
name="realValue"
value={this.state.realVal}
error={this.state.errorRV}
helperText={this.state.msgErrorRV}
onChange={(e) => this.handleChange(e, '')}
disabled={this.state.disabledValue}
inputProps={{
style: {
fontSize: 11,
......@@ -411,7 +490,7 @@ export default class CreateReportItems extends Component {
<div className="margin-top-10px" style={{ backgroundColor: '#e8e8e8', padding: 10, borderRadius: 5 }}>
<TextField
style={{ width: '100%' }}
value="Aktif"
value={'Aktif'}
id="status"
label="Status"
disabled
......@@ -474,6 +553,7 @@ export default class CreateReportItems extends Component {
id="orders"
name="order"
label="Order"
onChange={(e) => this.handleChange(e, '')}
value={this.state.order}
error={this.state.errorOrder}
helperText={this.state.msgErrorOrder}
......@@ -523,7 +603,9 @@ export default class CreateReportItems extends Component {
style={{ width: '100%' }}
id="weight"
label="Weight"
// value=""
name="weight"
value={this.state.weight}
onChange={(e) => this.handleChange(e, '')}
inputProps={{
style: {
fontSize: 11,
......@@ -547,7 +629,12 @@ export default class CreateReportItems extends Component {
style={{ width: '100%' }}
id="formula"
label="Formula"
// value=""
name="formula"
disabled={this.state.disabledFormula}
value={this.state.formula}
error={this.state.errorFormula}
helperText={this.state.msgErrorFormula}
onChange={(e) => this.handleChange(e, '')}
inputProps={{
style: {
fontSize: 11,
......@@ -566,13 +653,41 @@ export default class CreateReportItems extends Component {
>
</TextField>
</div>
<div className="margin-top-10px" style={{ backgroundColor: '#e8e8e8', padding: 10, borderRadius: 5 }}>
<TextField
<div className="margin-top-10px" style={{padding: 10}}>
<Autocomplete
value={this.state.condition}
id="isWrongCondition"
disabled={this.state.disabledCondt}
onChange={(event, newValue) => {
this.setState({value: newValue});
}}
inputValue={this.state.inputValue}
onInputChange={(event, newInputValue) => {
this.setState({inputValue: newInputValue});
}}
id="controllable-states-demo"
options={options}
style={{ width: 300 }}
renderInput={(params) =>
<TextField {...params}
label="Kondisi Jika Salah"
InputLabelProps={{
style: {
fontSize: 11,
fontWeight: 600,
fontFamily: 'Nunito Sans, sans-serif',
color: '#7e8085'
}
}}
InputProps={{ ...params.InputProps, style: { fontSize: 11, fontWeight: 600, fontFamily: 'Nunito Sans, sans-serif' } }}
/>}
/>
{/* <TextField
style={{ width: '100%' }}
value="-"
value={this.state.condition}
id="isWrongCondition"
label="Kondisi Jika Salah"
disabled
disabled={this.state.disabledCondt}
inputProps={{
style: {
fontSize: 11,
......@@ -588,7 +703,7 @@ export default class CreateReportItems extends Component {
color: '#7e8085',
}
}}
/>
/> */}
</div>
<div className="margin-top-10px" style={{ padding: 10, borderRadius: 5 }}>
<DatePicker
......@@ -639,7 +754,7 @@ export default class CreateReportItems extends Component {
</button>
</div>
<div className="column-2" style={{display: 'flex', justifyContent: 'flex-end', alignItems: 'center'}}>
<div onClick={() => this.validasi()} style={{ width: 102, height: 30, backgroundColor: '#354960', borderRadius: 5, alignItems: 'center', display: 'flex', justifyContent: 'center' }}>
<div onClick={() => this.addReportItems()} style={{ width: 102, height: 30, backgroundColor: '#354960', borderRadius: 5, alignItems: 'center', display: 'flex', justifyContent: 'center' }}>
<span style={{ color: '#fff', fontSize: 11 }}>Simpan</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