Commit ab6b1382 authored by Deni Rinaldi's avatar Deni Rinaldi

Merge branch 'rifka' into 'master'

update layout dan validasi apprv matrix

See merge request !128
parents f45b37e1 3afa1d57
......@@ -109,6 +109,7 @@ const create = (baseURL = 'https://tia.eksad.com/tia-reporting-dev/public/') =>
const getApprovedByAM = () => api.get('approval_matrix/get_all_approver')
const getTypeAM = () => api.get('approval_type/get_all_approval_type')
const getOperatorAM = () => api.get('operator_type/get_all_operator_type')
const getDetailAM = (id) => api.get(`approval_matrix/get_approval_matrix_by_id/${id}`)
const searchAM = (body) => api.post('/approval_matrix/search_approval_matrix', body)
const createAM = (body) => api.post('/approval_matrix/create_approval_matrix', body)
const updateAM = (body) => api.post('/approval_matrix/update_approval_matrix', body)
......@@ -195,6 +196,7 @@ const create = (baseURL = 'https://tia.eksad.com/tia-reporting-dev/public/') =>
getApprovedByAM,
getTypeAM,
getOperatorAM,
getDetailAM,
searchAM,
createAM,
updateAM,
......
......@@ -282,12 +282,11 @@ export default class ApprovalMatrix extends Component {
openPopUp(index, type) {
if (type === 'edit') {
this.setState({
selectIndex: index,
rowData: index,
visibleEdit: true
})
} else {
this.setState({
data: this.state.listData[index],
visibleCreate: true
})
}
......@@ -316,6 +315,7 @@ export default class ApprovalMatrix extends Component {
this.setState({ visibleCreate: false })
api.create().createAM(payload).then(response => {
if (response.data.status == 'success') {
alert(response.data.message)
this.getData()
} else {
alert(response.data.message)
......@@ -327,6 +327,7 @@ export default class ApprovalMatrix extends Component {
this.setState({ visibleEdit: false })
api.create().updateAM(payload).then(response => {
if (response.data.status == 'success') {
alert(response.data.message)
this.getData()
} else {
alert(response.data.message)
......@@ -337,8 +338,8 @@ export default class ApprovalMatrix extends Component {
updateVAM = (payload) => {
this.setState({ visibleVisual: false, visibleAM: true })
api.create().updateVAM(payload).then(response => {
// console.log(response.data)
if (response.data.status == 'success') {
alert(response.data.message)
this.getData()
} else {
alert(response.data.message)
......@@ -399,7 +400,7 @@ export default class ApprovalMatrix extends Component {
cursor: 'pointer',
borderColor: 'transparent'
}}
onClick={() => this.openPopUp(tableMeta.rowIndex, 'edit')}
onClick={() => this.openPopUp(tableMeta.rowData, 'edit')}
// onClick={() => this.setState({ visibleEdit: true })}
>
<img src={Images.editCopy} />
......@@ -518,7 +519,7 @@ export default class ApprovalMatrix extends Component {
}}
onClick={() => this.downloadFile()}
>
<img src={Images.template} />
<img src={Images.template} title="Download Template"/>
</button>
<button
style={{
......@@ -531,7 +532,7 @@ export default class ApprovalMatrix extends Component {
}}
onClick={() => this.setState({ visibleUpload: true })}
>
<img src={Images.upload} />
<img src={Images.upload} title="Upload File"/>
</button>
<button
style={{
......@@ -544,7 +545,7 @@ export default class ApprovalMatrix extends Component {
}}
onClick={() => this.downloadDataTable()}
>
<img src={Images.download} />
<img src={Images.download} title="Download File"/>
</button>
<button
style={{
......@@ -557,7 +558,7 @@ export default class ApprovalMatrix extends Component {
}}
onClick={() => this.setState({ visibleVisual: true, visibleAM: false })}
>
<img src={Images.visualisasi} />
<img src={Images.visualisasi} title="Visualisasi"/>
</button>
<button
style={{
......@@ -570,7 +571,7 @@ export default class ApprovalMatrix extends Component {
}}
onClick={() => this.setState({ visibleCreate: true })}
>
<img src={Images.add} />
<img src={Images.add} title="Tambah Approval Matrix"/>
</button>
</div >
</div>
......@@ -649,7 +650,7 @@ export default class ApprovalMatrix extends Component {
<EditApprovalMatrix
type={"edit"}
onClickClose={() => this.setState({ visibleEdit: false })}
data={this.state.listData[this.state.selectIndex]}
data={this.state.rowData}
updateAM={this.updateAM.bind(this)}
/>
)}
......
......@@ -19,13 +19,19 @@ export default class CreateApprovalMatrix extends Component {
approvedBy: null,
types: null,
operators: null,
startDate: '',
endDate: '',
startDate: null,
endDate: null,
userData: [],
value: null,
date: new Date(),
errorOrder: false,
msgErrOrder: '',
errorType: false,
msgErrType: '',
errorStartDate: false,
errorEndDate: false,
msgErrorStartDate: "",
msgErrorEndDate: ""
}
}
......@@ -33,6 +39,12 @@ export default class CreateApprovalMatrix extends Component {
this.getUserData()
this.getTypeData()
this.getOperatorData()
let date = format(new Date, 'yyyy-MM-dd')
console.log(date);
this.setState({
startDate: date,
endDate: date
})
}
getUserData() {
......@@ -103,44 +115,52 @@ export default class CreateApprovalMatrix extends Component {
})
}
handleChange(e, type) {
let data = this.state
let isDate = type !== '' ? true : false
if (isDate && type == 'start_date') {
this.setState({ startDate: format(e, 'yyyy-MM-dd'),
errorOrder: false,
msgErrOrder: '',
// }, () => {
// console.log(this.state.startDate)
this.setState({ startDate: format(e, 'yyyy-MM-dd'), endDate: null }, () => {
this.clearError()
console.log(this.state.startDate)
})
} else if (isDate && type == 'end_date') {
this.setState({ endDate: format(e, 'yyyy-MM-dd'),
errorOrder: false,
msgErrOrder: '',
// }, () => {
// console.log(this.state.endDate)
this.setState({ endDate: format(e, 'yyyy-MM-dd')}, () => {
this.clearError()
console.log(this.state.endDate)
})
} else {
// this.setState({...data, tempData: {...this.state.tempData, [e.target.name] : e.target.value}})
}
}
clearError() {
this.setState({
errorOrder: false,
msgErrOrder: '',
msgErrOrder: "",
errorType: false,
msgErrType: '',
errorStartDate: false,
errorEndDate: false,
msgErrorStartDate: "",
msgErrorEndDate: ""
})
}
}
validasi() {
if (R.isNil(this.state.typeId)) return alert("Tipe Persetujuan is Required.");
if (R.isEmpty(this.state.order)) {
this.setState({ errorOrder: true, msgErrOrder: 'Order is Required.'})
}
if (R.isNil(this.state.userId)) return alert("Pemberi Persetujuan is Required.");
if (R.isNil(this.state.operatorId)) return alert("Operator is Required.");
if (!R.isEmpty(this.state.startDate) && !R.isEmpty(this.state.endDate) && (this.state.startDate > this.state.endDate)) return alert("Masa Berlaku Tidak Boleh Kurang Dari Tanggal Mulai");
if (R.isEmpty(this.state.startDate)) return alert("Tanggal Mulai is Required.");
if (R.isEmpty(this.state.endDate)) return alert("Tanggal Berakhir is Required.");
if (R.isNil(this.state.typeId)) {
return alert("Tipe Persetujuan tidak boleh kosong");
}
else if (R.isEmpty(this.state.order)) {
this.setState({ errorOrder: true, msgErrOrder: 'Order tidak boleh kosong'})
}
else if (R.isNil(this.state.userId)) return alert("Pemberi Persetujuan tidak boleh kosong");
else if (R.isNil(this.state.operatorId)) return alert("Operator tidak boleh kosong");
else if (R.isNil(this.state.startDate)) {
this.setState({ errorStartDate: true, msgErrorStartDate: 'Tanggal Mulai tidak boleh kosong' })
} else if (R.isNil(this.state.endDate)) {
this.setState({ errorEndDate: true, msgErrorEndDate: 'Tanggal Berakhir tidak boleh kosong' })
} else {
console.log('masuk');
let payload = {
"approval_type_id": this.state.typeId.approval_type_id,
......@@ -152,14 +172,14 @@ export default class CreateApprovalMatrix extends Component {
}
this.props.createAM(payload)
// console.log(payload)
}
}
render() {
return (
<div className="test app-popup-show" style={{ paddingTop: 100 }}>
<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>
......@@ -206,7 +226,6 @@ export default class CreateApprovalMatrix extends Component {
{...this.state.types}
id="tipe"
onChange={(event, newInputValue) => this.setState({typeId:newInputValue})}
// disableClearable
debug
renderInput={(params) =>
<TextField
......@@ -222,6 +241,8 @@ export default class CreateApprovalMatrix extends Component {
/>
}
value={this.state.typeId}
error={this.state.errorType}
helperText={this.state.msgErrType}
// inputProps={{
// style: {
// fontSize: 11
......@@ -238,10 +259,11 @@ export default class CreateApprovalMatrix extends Component {
style={{ width: '100%' }}
id="order"
label="Order"
type={"number"}
value={this.state.order}
error={this.state.errorOrder}
helperText={this.state.msgErrOrder}
onChange={(e) => this.setState({ order: e.target.value })}
onChange={(e) => this.setState({ order: e.target.value }, () => this.clearError())}
inputProps={{
style: {
fontSize: 11
......@@ -345,6 +367,8 @@ export default class CreateApprovalMatrix extends Component {
color: '#7e8085'
}
}}
error={this.state.errorStartDate}
helperText={this.state.msgErrorStartDate}
style={{ padding: 0, margin: 0, width: '100%' }}
/>
</div>
......@@ -357,7 +381,10 @@ export default class CreateApprovalMatrix extends Component {
label="Berlaku Hingga"
format="dd MMMM yyyy"
value={this.state.endDate == "" ? null : this.state.endDate}
error={this.state.errorEndDate}
helperText={this.state.msgErrorEndDate}
onChange={(e) => this.handleChange(e, 'end_date')}
minDate={this.state.startDate}
KeyboardButtonProps={{
'aria-label': 'change date',
}}
......
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