Skip to content

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

Merge branch 'rifka' into 'master' 

update layout dan validasi apprv matrix

See merge request !128
parents f45b37e1 3afa1d57
Hide whitespace changes
Inline Side-by-side
Showing with 168 additions and 109 deletions
src/api/index.js
View file @ ab6b1382
...@@ -109,6 +109,7 @@ const create = (baseURL = 'https://tia.eksad.com/tia-reporting-dev/public/') => ...@@ -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 getApprovedByAM = () => api.get('approval_matrix/get_all_approver')
const getTypeAM = () => api.get('approval_type/get_all_approval_type') const getTypeAM = () => api.get('approval_type/get_all_approval_type')
const getOperatorAM = () => api.get('operator_type/get_all_operator_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 searchAM = (body) => api.post('/approval_matrix/search_approval_matrix', body)
const createAM = (body) => api.post('/approval_matrix/create_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) 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/') => ...@@ -195,6 +196,7 @@ const create = (baseURL = 'https://tia.eksad.com/tia-reporting-dev/public/') =>
getApprovedByAM, getApprovedByAM,
getTypeAM, getTypeAM,
getOperatorAM, getOperatorAM,
getDetailAM,
searchAM, searchAM,
createAM, createAM,
updateAM, updateAM,
......
src/container/ApprovalMatrix/ApprovalMatrix.js
View file @ ab6b1382
...@@ -282,12 +282,11 @@ export default class ApprovalMatrix extends Component { ...@@ -282,12 +282,11 @@ export default class ApprovalMatrix extends Component {
openPopUp(index, type) { openPopUp(index, type) {
if (type === 'edit') { if (type === 'edit') {
this.setState({ this.setState({
selectIndex: index, rowData: index,
visibleEdit: true visibleEdit: true
}) })
} else { } else {
this.setState({ this.setState({
data: this.state.listData[index],
visibleCreate: true visibleCreate: true
}) })
} }
...@@ -316,6 +315,7 @@ export default class ApprovalMatrix extends Component { ...@@ -316,6 +315,7 @@ export default class ApprovalMatrix extends Component {
this.setState({ visibleCreate: false }) this.setState({ visibleCreate: false })
api.create().createAM(payload).then(response => { api.create().createAM(payload).then(response => {
if (response.data.status == 'success') { if (response.data.status == 'success') {
alert(response.data.message)
this.getData() this.getData()
} else { } else {
alert(response.data.message) alert(response.data.message)
...@@ -327,6 +327,7 @@ export default class ApprovalMatrix extends Component { ...@@ -327,6 +327,7 @@ export default class ApprovalMatrix extends Component {
this.setState({ visibleEdit: false }) this.setState({ visibleEdit: false })
api.create().updateAM(payload).then(response => { api.create().updateAM(payload).then(response => {
if (response.data.status == 'success') { if (response.data.status == 'success') {
alert(response.data.message)
this.getData() this.getData()
} else { } else {
alert(response.data.message) alert(response.data.message)
...@@ -337,8 +338,8 @@ export default class ApprovalMatrix extends Component { ...@@ -337,8 +338,8 @@ export default class ApprovalMatrix extends Component {
updateVAM = (payload) => { updateVAM = (payload) => {
this.setState({ visibleVisual: false, visibleAM: true }) this.setState({ visibleVisual: false, visibleAM: true })
api.create().updateVAM(payload).then(response => { api.create().updateVAM(payload).then(response => {
// console.log(response.data)
if (response.data.status == 'success') { if (response.data.status == 'success') {
alert(response.data.message)
this.getData() this.getData()
} else { } else {
alert(response.data.message) alert(response.data.message)
...@@ -399,7 +400,7 @@ export default class ApprovalMatrix extends Component { ...@@ -399,7 +400,7 @@ export default class ApprovalMatrix extends Component {
cursor: 'pointer', cursor: 'pointer',
borderColor: 'transparent' borderColor: 'transparent'
}} }}
onClick={() => this.openPopUp(tableMeta.rowIndex, 'edit')} onClick={() => this.openPopUp(tableMeta.rowData, 'edit')}
// onClick={() => this.setState({ visibleEdit: true })} // onClick={() => this.setState({ visibleEdit: true })}
> >
<img src={Images.editCopy} /> <img src={Images.editCopy} />
...@@ -518,7 +519,7 @@ export default class ApprovalMatrix extends Component { ...@@ -518,7 +519,7 @@ export default class ApprovalMatrix extends Component {
}} }}
onClick={() => this.downloadFile()} onClick={() => this.downloadFile()}
> >
<img src={Images.template} /> <img src={Images.template} title="Download Template"/>
</button> </button>
<button <button
style={{ style={{
...@@ -531,7 +532,7 @@ export default class ApprovalMatrix extends Component { ...@@ -531,7 +532,7 @@ export default class ApprovalMatrix extends Component {
}} }}
onClick={() => this.setState({ visibleUpload: true })} onClick={() => this.setState({ visibleUpload: true })}
> >
<img src={Images.upload} /> <img src={Images.upload} title="Upload File"/>
</button> </button>
<button <button
style={{ style={{
...@@ -544,7 +545,7 @@ export default class ApprovalMatrix extends Component { ...@@ -544,7 +545,7 @@ export default class ApprovalMatrix extends Component {
}} }}
onClick={() => this.downloadDataTable()} onClick={() => this.downloadDataTable()}
> >
<img src={Images.download} /> <img src={Images.download} title="Download File"/>
</button> </button>
<button <button
style={{ style={{
...@@ -557,7 +558,7 @@ export default class ApprovalMatrix extends Component { ...@@ -557,7 +558,7 @@ export default class ApprovalMatrix extends Component {
}} }}
onClick={() => this.setState({ visibleVisual: true, visibleAM: false })} onClick={() => this.setState({ visibleVisual: true, visibleAM: false })}
> >
<img src={Images.visualisasi} /> <img src={Images.visualisasi} title="Visualisasi"/>
</button> </button>
<button <button
style={{ style={{
...@@ -570,7 +571,7 @@ export default class ApprovalMatrix extends Component { ...@@ -570,7 +571,7 @@ export default class ApprovalMatrix extends Component {
}} }}
onClick={() => this.setState({ visibleCreate: true })} onClick={() => this.setState({ visibleCreate: true })}
> >
<img src={Images.add} /> <img src={Images.add} title="Tambah Approval Matrix"/>
</button> </button>
</div > </div >
</div> </div>
...@@ -649,7 +650,7 @@ export default class ApprovalMatrix extends Component { ...@@ -649,7 +650,7 @@ export default class ApprovalMatrix extends Component {
<EditApprovalMatrix <EditApprovalMatrix
type={"edit"} type={"edit"}
onClickClose={() => this.setState({ visibleEdit: false })} onClickClose={() => this.setState({ visibleEdit: false })}
data={this.state.listData[this.state.selectIndex]} data={this.state.rowData}
updateAM={this.updateAM.bind(this)} updateAM={this.updateAM.bind(this)}
/> />
)} )}
......
src/container/ApprovalMatrix/CreateApprovalMatrix.js
View file @ ab6b1382
...@@ -19,13 +19,19 @@ export default class CreateApprovalMatrix extends Component { ...@@ -19,13 +19,19 @@ export default class CreateApprovalMatrix extends Component {
approvedBy: null, approvedBy: null,
types: null, types: null,
operators: null, operators: null,
startDate: '', startDate: null,
endDate: '', endDate: null,
userData: [], userData: [],
value: null, value: null,
date: new Date(), date: new Date(),
errorOrder: false, errorOrder: false,
msgErrOrder: '', msgErrOrder: '',
errorType: false,
msgErrType: '',
errorStartDate: false,
errorEndDate: false,
msgErrorStartDate: "",
msgErrorEndDate: ""
} }
} }
...@@ -33,6 +39,12 @@ export default class CreateApprovalMatrix extends Component { ...@@ -33,6 +39,12 @@ export default class CreateApprovalMatrix extends Component {
this.getUserData() this.getUserData()
this.getTypeData() this.getTypeData()
this.getOperatorData() this.getOperatorData()
let date = format(new Date, 'yyyy-MM-dd')
console.log(date);
this.setState({
startDate: date,
endDate: date
})
} }
getUserData() { getUserData() {
...@@ -102,64 +114,72 @@ export default class CreateApprovalMatrix extends Component { ...@@ -102,64 +114,72 @@ export default class CreateApprovalMatrix extends Component {
} }
}) })
} }
handleChange(e, type) { handleChange(e, type) {
let data = this.state let data = this.state
let isDate = type !== '' ? true : false let isDate = type !== '' ? true : false
if (isDate && type == 'start_date') { if (isDate && type == 'start_date') {
this.setState({ startDate: format(e, 'yyyy-MM-dd'), this.setState({ startDate: format(e, 'yyyy-MM-dd'), endDate: null }, () => {
errorOrder: false, this.clearError()
msgErrOrder: '', console.log(this.state.startDate)
// }, () => {
// console.log(this.state.startDate)
}) })
} else if (isDate && type == 'end_date') { } else if (isDate && type == 'end_date') {
this.setState({ endDate: format(e, 'yyyy-MM-dd'), this.setState({ endDate: format(e, 'yyyy-MM-dd')}, () => {
errorOrder: false, this.clearError()
msgErrOrder: '', console.log(this.state.endDate)
// }, () => {
// console.log(this.state.endDate)
}) })
} else { } else {
// this.setState({...data, tempData: {...this.state.tempData, [e.target.name] : e.target.value}}) // this.setState({...data, tempData: {...this.state.tempData, [e.target.name] : e.target.value}})
this.setState({
errorOrder: false,
msgErrOrder: '',
})
} }
} }
clearError() {
this.setState({
errorOrder: false,
msgErrOrder: "",
errorType: false,
msgErrType: '',
errorStartDate: false,
errorEndDate: false,
msgErrorStartDate: "",
msgErrorEndDate: ""
})
}
validasi() { validasi() {
if (R.isNil(this.state.typeId)) return alert("Tipe Persetujuan is Required."); if (R.isNil(this.state.typeId)) {
if (R.isEmpty(this.state.order)) { return alert("Tipe Persetujuan tidak boleh kosong");
this.setState({ errorOrder: true, msgErrOrder: 'Order is Required.'})
} }
if (R.isNil(this.state.userId)) return alert("Pemberi Persetujuan is Required."); else if (R.isEmpty(this.state.order)) {
if (R.isNil(this.state.operatorId)) return alert("Operator is Required."); this.setState({ errorOrder: true, msgErrOrder: 'Order tidak boleh kosong'})
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."); else if (R.isNil(this.state.userId)) return alert("Pemberi Persetujuan tidak boleh kosong");
if (R.isEmpty(this.state.endDate)) return alert("Tanggal Berakhir is Required."); else if (R.isNil(this.state.operatorId)) return alert("Operator tidak boleh kosong");
console.log('masuk'); else if (R.isNil(this.state.startDate)) {
let payload = { this.setState({ errorStartDate: true, msgErrorStartDate: 'Tanggal Mulai tidak boleh kosong' })
"approval_type_id": this.state.typeId.approval_type_id, } else if (R.isNil(this.state.endDate)) {
"orders": this.state.order, this.setState({ errorEndDate: true, msgErrorEndDate: 'Tanggal Berakhir tidak boleh kosong' })
"user_id": this.state.userId.user_id, } else {
"operator_type_id": this.state.operatorId.operator_type_id, console.log('masuk');
"start_date": this.state.startDate, let payload = {
"end_date": this.state.endDate "approval_type_id": this.state.typeId.approval_type_id,
"orders": this.state.order,
"user_id": this.state.userId.user_id,
"operator_type_id": this.state.operatorId.operator_type_id,
"start_date": this.state.startDate,
"end_date": this.state.endDate
}
this.props.createAM(payload)
// console.log(payload)
} }
this.props.createAM(payload)
// console.log(payload)
} }
render() { render() {
return ( return (
<div className="test app-popup-show" style={{ paddingTop: 100 }}> <div className="test app-popup-show" style={{ paddingTop: 100 }}>
<div className="popup-content background-white border-radius" style={{ borderRadius: 8 }}> <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="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' }}>Tambah Data</span>
...@@ -206,7 +226,6 @@ export default class CreateApprovalMatrix extends Component { ...@@ -206,7 +226,6 @@ export default class CreateApprovalMatrix extends Component {
{...this.state.types} {...this.state.types}
id="tipe" id="tipe"
onChange={(event, newInputValue) => this.setState({typeId:newInputValue})} onChange={(event, newInputValue) => this.setState({typeId:newInputValue})}
// disableClearable
debug debug
renderInput={(params) => renderInput={(params) =>
<TextField <TextField
...@@ -222,6 +241,8 @@ export default class CreateApprovalMatrix extends Component { ...@@ -222,6 +241,8 @@ export default class CreateApprovalMatrix extends Component {
/> />
} }
value={this.state.typeId} value={this.state.typeId}
error={this.state.errorType}
helperText={this.state.msgErrType}
// inputProps={{ // inputProps={{
// style: { // style: {
// fontSize: 11 // fontSize: 11
...@@ -238,10 +259,11 @@ export default class CreateApprovalMatrix extends Component { ...@@ -238,10 +259,11 @@ export default class CreateApprovalMatrix extends Component {
style={{ width: '100%' }} style={{ width: '100%' }}
id="order" id="order"
label="Order" label="Order"
type={"number"}
value={this.state.order} value={this.state.order}
error={this.state.errorOrder} error={this.state.errorOrder}
helperText={this.state.msgErrOrder} helperText={this.state.msgErrOrder}
onChange={(e) => this.setState({ order: e.target.value })} onChange={(e) => this.setState({ order: e.target.value }, () => this.clearError())}
inputProps={{ inputProps={{
style: { style: {
fontSize: 11 fontSize: 11
...@@ -345,6 +367,8 @@ export default class CreateApprovalMatrix extends Component { ...@@ -345,6 +367,8 @@ export default class CreateApprovalMatrix extends Component {
color: '#7e8085' color: '#7e8085'
} }
}} }}
error={this.state.errorStartDate}
helperText={this.state.msgErrorStartDate}
style={{ padding: 0, margin: 0, width: '100%' }} style={{ padding: 0, margin: 0, width: '100%' }}
/> />
</div> </div>
...@@ -357,7 +381,10 @@ export default class CreateApprovalMatrix extends Component { ...@@ -357,7 +381,10 @@ export default class CreateApprovalMatrix extends Component {
label="Berlaku Hingga" label="Berlaku Hingga"
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}
helperText={this.state.msgErrorEndDate}
onChange={(e) => this.handleChange(e, 'end_date')} onChange={(e) => this.handleChange(e, 'end_date')}
minDate={this.state.startDate}
KeyboardButtonProps={{ KeyboardButtonProps={{
'aria-label': 'change date', 'aria-label': 'change date',
}} }}
......
src/container/ApprovalMatrix/EditApprovalMatrix.js
View file @ ab6b1382
...@@ -7,20 +7,6 @@ import format from "date-fns/format"; ...@@ -7,20 +7,6 @@ import format from "date-fns/format";
import api from "../../api"; import api from "../../api";
import Images from '../../assets/Images'; import Images from '../../assets/Images';
const operator = [
{
value: '-',
label: '-',
},
{
value: 'AND',
label: 'AND',
},
{
value: 'OR',
label: 'OR',
},
];
export default class EditApprovalMatrix extends Component { export default class EditApprovalMatrix extends Component {
constructor(props) { constructor(props) {
super(props) super(props)
...@@ -35,29 +21,48 @@ export default class EditApprovalMatrix extends Component { ...@@ -35,29 +21,48 @@ export default class EditApprovalMatrix extends Component {
types: null, types: null,
getTypes: null, getTypes: null,
operators: null, operators: null,
getOperators: null getOperators: null,
errorOrder: false,
msgErrOrder: '',
errorStartDate: false,
errorEndDate: false,
msgErrorStartDate: "",
msgErrorEndDate: ""
} }
} }
componentDidMount() { componentDidMount() {
if (this.props.type === 'edit') { if (this.props.type === 'edit') {
let data = this.props.data this.getDetailAM()
console.log(this.state.startDate);
// let getApprovedBy = { // let getApprovedBy = {
// user_id: data.user_id, // user_id: data.user_id,
// fullname: data.fullname // fullname: data.fullname
// } // })
this.setState({
id: data.approval_matrix_id,
startDate: data.start_date,
endDate: data.end_date,
order: data.orders,
getUserId: data.user_id,
getTypeId: data.approval_type_id,
getOperatorId: data.operator_type_id,
}, () => this.getUserData(), this.getTypeData(), this.getOperatorData())
} }
// console.log(this.props.data) }
getDetailAM() {
api.create().getDetailAM(this.props.data[1]).then(response => {
// console.log(response)
if (response.data) {
if (response.data.status === "success") {
let data = response.data.data
this.setState({
id: data.approval_matrix_id,
startDate: data.start_date,
endDate: data.end_date,
order: data.orders,
getUserId: data.user_id,
getTypeId: data.approval_type_id,
getOperatorId: data.operator_type_id,
status: data.status,
created: data.created,
updated: data.updated === null ? "" : data.updated
}, () => this.getUserData(), this.getTypeData(), this.getOperatorData())
}
}
})
} }
getUserData() { getUserData() {
...@@ -131,11 +136,13 @@ export default class EditApprovalMatrix extends Component { ...@@ -131,11 +136,13 @@ export default class EditApprovalMatrix extends Component {
let data = this.state let data = this.state
let isDate = type !== '' ? true : false let isDate = type !== '' ? true : false
if (isDate && type == 'start_date') { if (isDate && type == 'start_date') {
this.setState({ startDate: format(e, 'yyyy-MM-dd') }, () => { this.setState({ startDate: format(e, 'yyyy-MM-dd'), endDate: null }, () => {
this.clearError()
// console.log(this.state.startDate) // console.log(this.state.startDate)
}) })
} else if (isDate && type == 'end_date') { } else if (isDate && type == 'end_date') {
this.setState({ endDate: format(e, 'yyyy-MM-dd') }, () => { this.setState({ endDate: format(e, 'yyyy-MM-dd') }, () => {
this.clearError()
// console.log(this.state.endDate) // console.log(this.state.endDate)
}) })
} else { } else {
...@@ -144,41 +151,54 @@ export default class EditApprovalMatrix extends Component { ...@@ -144,41 +151,54 @@ export default class EditApprovalMatrix extends Component {
} }
clearError() {
this.setState({
errorOrder: false,
msgErrOrder: "",
errorStartDate: false,
errorEndDate: false,
msgErrorStartDate: "",
msgErrorEndDate: ""
})
}
validasi() { validasi() {
if (R.isNil(this.state.getTypes)) return alert("Tipe Persetujuan is Required."); if (R.isNil(this.state.getTypes)) {
if (R.isEmpty(this.state.order)) return alert("Order is Required."); return alert("Tipe Persetujuan tidak boleh kosong");
if (R.isNil(this.state.getApprovedBy)) return alert("Pemberi Persetujuan is Required."); }
if (R.isNil(this.state.getOperators)) return alert("Operator is Required."); else if (R.isEmpty(this.state.order)) {
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"); this.setState({ errorOrder: true, msgErrOrder: 'Order tidak boleh kosong'})
if (R.isEmpty(this.state.startDate)) return alert("Tanggal Mulai is Required."); }
if (R.isEmpty(this.state.endDate)) return alert("Tanggal Berakhir is Required."); else if (R.isNil(this.state.getApprovedBy)) return alert("Pemberi Persetujuan tidak boleh kosong");
console.log('masuk'); else if (R.isNil(this.state.getOperators)) return alert("Operator tidak boleh kosong");
if (this.props.type == 'edit') { else 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");
let payload = { else if (R.isEmpty(this.state.startDate)) {
"approval_matrix_id": this.state.id, this.setState({ errorStartDate: true, msgErrorStartDate: 'Tanggal Mulai tidak boleh kosong' })
"approval_type_id": this.state.getTypes.approval_type_id, } else if (R.isEmpty(this.state.endDate)) {
"orders": this.state.order, this.setState({ errorEndDate: true, msgErrorEndDate: 'Tanggal Berakhir tidak boleh kosong' })
"user_id": this.state.getApprovedBy.user_id, } else {
"operator_type_id": this.state.getOperators.operator_type_id, console.log('masuk');
"start_date": this.state.startDate, if (this.props.type == 'edit') {
"end_date": this.state.endDate let payload = {
"approval_matrix_id": this.state.id,
"approval_type_id": this.state.getTypes.approval_type_id,
"orders": this.state.order,
"user_id": this.state.getApprovedBy.user_id,
"operator_type_id": this.state.getOperators.operator_type_id,
"start_date": this.state.startDate,
"end_date": this.state.endDate
}
this.props.updateAM(payload)
// console.log(payload)
} }
this.props.updateAM(payload)
} }
// console.log(payload)
}
handleDate(item) {
let value = format(item, 'dd MMMM yyyy')
return value
} }
render() { render() {
return ( return (
<div className="test app-popup-show" style={{ paddingTop: 100 }}> <div className="test app-popup-show" style={{ paddingTop: 100 }}>
<div className="popup-content background-white border-radius" style={{ borderRadius: 8 }}> <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="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' }}>Edit Data</span> <span style={{ color: '#fff', fontSize: 16, fontWeight: 'bold' }}>Edit Data</span>
...@@ -203,7 +223,7 @@ export default class EditApprovalMatrix extends Component { ...@@ -203,7 +223,7 @@ export default class EditApprovalMatrix extends Component {
style={{ width: '100%' }} style={{ width: '100%' }}
id="id" id="id"
label="ID" label="ID"
value={this.props.data.approval_matrix_id} value={this.state.id}
disabled disabled
inputProps={{ inputProps={{
style: { style: {
...@@ -250,8 +270,11 @@ export default class EditApprovalMatrix extends Component { ...@@ -250,8 +270,11 @@ export default class EditApprovalMatrix extends Component {
style={{ width: '100%' }} style={{ width: '100%' }}
id="order" id="order"
label="Order" label="Order"
type={"number"}
value={this.state.order} value={this.state.order}
onChange={(e) => this.setState({ order: e.target.value })} error={this.state.errorOrder}
helperText={this.state.msgErrOrder}
onChange={(e) => this.setState({ order: e.target.value }, () => this.clearError())}
inputProps={{ inputProps={{
style: { style: {
fontSize: 11 fontSize: 11
...@@ -263,6 +286,7 @@ export default class EditApprovalMatrix extends Component { ...@@ -263,6 +286,7 @@ export default class EditApprovalMatrix extends Component {
color: '#7e8085' color: '#7e8085'
} }
}} }}
// name="order"
> >
</TextField> </TextField>
</div> </div>
...@@ -343,6 +367,8 @@ export default class EditApprovalMatrix extends Component { ...@@ -343,6 +367,8 @@ export default class EditApprovalMatrix extends Component {
color: '#7e8085' color: '#7e8085'
} }
}} }}
error={this.state.errorStartDate}
helperText={this.state.msgErrorStartDate}
style={{padding: 0, margin: 0, width: '100%'}} style={{padding: 0, margin: 0, width: '100%'}}
/> />
</div> </div>
...@@ -354,6 +380,9 @@ export default class EditApprovalMatrix extends Component { ...@@ -354,6 +380,9 @@ export default class EditApprovalMatrix extends Component {
id="endDate" id="endDate"
label="Berlaku Hingga" label="Berlaku Hingga"
format="dd MMMM yyyy" format="dd MMMM yyyy"
error={this.state.errorEndDate}
helperText={this.state.msgErrorEndDate}
minDate={this.state.startDate}
value={this.state.endDate} value={this.state.endDate}
onChange={(e) => this.handleChange(e, 'end_date')} onChange={(e) => this.handleChange(e, 'end_date')}
KeyboardButtonProps={{ KeyboardButtonProps={{
...@@ -380,9 +409,9 @@ export default class EditApprovalMatrix extends Component { ...@@ -380,9 +409,9 @@ export default class EditApprovalMatrix 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={this.state.status}
id="status" id="status"
label="Status" label="Status"
value={this.props.data.status}
disabled disabled
inputProps={{ inputProps={{
style: { style: {
...@@ -426,11 +455,11 @@ export default class EditApprovalMatrix extends Component { ...@@ -426,11 +455,11 @@ export default class EditApprovalMatrix extends Component {
<div className="margin-top-10px" style={{ padding: 10, paddingLeft: 0, borderRadius: 5 }}> <div className="margin-top-10px" style={{ padding: 10, paddingLeft: 0, borderRadius: 5 }}>
<div style={{ display: 'flex' }}> <div style={{ display: 'flex' }}>
<Typography style={{ fontSize: 11, width: '20%' }}>Dibuat</Typography> <Typography style={{ fontSize: 11, width: '20%' }}>Dibuat</Typography>
<Typography style={{ fontSize: 11 }}>: {this.props.data.created}</Typography> <Typography style={{ fontSize: 11 }}>: {this.state.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: '20%' }}>Diubah</Typography>
<Typography style={{ fontSize: 11 }}>: {this.props.data.updated == - null ? "" : this.props.data.updated}</Typography> <Typography style={{ fontSize: 11 }}>: {this.state.updated == - null ? "" : this.state.updated}</Typography>
</div> </div>
</div> </div>
</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