Skip to content

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

update approval matrix

parent 5e620906
Show whitespace changes
Inline Side-by-side
Showing with 309 additions and 266 deletions
src/container/ApprovalMatrix/ApprovalMatrix.js
View file @ dbf68640
...@@ -46,7 +46,7 @@ export default class ApprovalMatrix extends Component { ...@@ -46,7 +46,7 @@ export default class ApprovalMatrix extends Component {
let fileObj = event let fileObj = event
ExcelRenderer(fileObj, (err, resp) => { ExcelRenderer(fileObj, (err, resp) => {
if (err) { if (err) {
console.log(err); // console.log(err);
} }
else { else {
let judul = resp.rows[2] let judul = resp.rows[2]
...@@ -55,7 +55,7 @@ export default class ApprovalMatrix extends Component { ...@@ -55,7 +55,7 @@ export default class ApprovalMatrix extends Component {
isi.map((item, index) => { isi.map((item, index) => {
if (item.length > 0) { if (item.length > 0) {
payload.push({ payload.push({
// id: index + 1, id: index + 1,
approval_type_name: item[0], approval_type_name: item[0],
orders: item[1], orders: item[1],
fullname: item[2], fullname: item[2],
...@@ -70,7 +70,8 @@ export default class ApprovalMatrix extends Component { ...@@ -70,7 +70,8 @@ export default class ApprovalMatrix extends Component {
} }
this.setState({ payload: body, buttonError: false }) this.setState({ payload: body, buttonError: false })
api.create().checkUploadAM(body).then(response => { api.create().checkUploadAM(body).then(response => {
console.log(response.data) // console.log(response.data)
if(response.data){
if (response.data.status === "success") { if (response.data.status === "success") {
let dataRow = response.data.data.map((item, index) => { let dataRow = response.data.data.map((item, index) => {
return [ return [
...@@ -90,7 +91,6 @@ export default class ApprovalMatrix extends Component { ...@@ -90,7 +91,6 @@ export default class ApprovalMatrix extends Component {
name: "Tipe Persetujuan", name: "Tipe Persetujuan",
options: { options: {
customBodyRender: (val, tableMeta) => { customBodyRender: (val, tableMeta) => {
// console.log(tableMeta)
let check = null let check = null
if (tableMeta.rowData[7] != null) { if (tableMeta.rowData[7] != null) {
check = tableMeta.rowData[7].findIndex((val) => val.field.includes('approval_type_name')) check = tableMeta.rowData[7].findIndex((val) => val.field.includes('approval_type_name'))
...@@ -252,10 +252,11 @@ export default class ApprovalMatrix extends Component { ...@@ -252,10 +252,11 @@ export default class ApprovalMatrix extends Component {
rows: dataRow rows: dataRow
}); });
} }
// console.log(response); } else {
this.setState({
dataLoaded: false,
});
}
}) })
} }
}); });
...@@ -401,10 +402,9 @@ export default class ApprovalMatrix extends Component { ...@@ -401,10 +402,9 @@ export default class ApprovalMatrix extends Component {
uploadAM() { uploadAM() {
api.create().uploadAM(this.state.payload).then(response => { api.create().uploadAM(this.state.payload).then(response => {
console.log(response.data) console.log(response)
if (response.data) { if (response.data) {
if (response.data.status === "success") { if (response.data.status === "success") {
// console.log(this.state.payload)
this.getData() this.getData()
this.setState({ visibleAM: true, alert: true, messageAlert: response.data.message, tipeAlert: 'success' }) this.setState({ visibleAM: true, alert: true, messageAlert: response.data.message, tipeAlert: 'success' })
} else { } else {
...@@ -547,6 +547,7 @@ export default class ApprovalMatrix extends Component { ...@@ -547,6 +547,7 @@ export default class ApprovalMatrix extends Component {
/> />
</div> </div>
<div style={{ width: '30%', justifyContent: 'flex-end', display: 'flex', flexFlow: 'wrap' }}> <div style={{ width: '30%', justifyContent: 'flex-end', display: 'flex', flexFlow: 'wrap' }}>
<a data-tip={'Download Template'} data-for="template">
<button <button
style={{ style={{
backgroundColor: 'transparent', backgroundColor: 'transparent',
...@@ -557,8 +558,11 @@ export default class ApprovalMatrix extends Component { ...@@ -557,8 +558,11 @@ export default class ApprovalMatrix extends Component {
}} }}
onClick={() => this.downloadFile()} onClick={() => this.downloadFile()}
> >
<img src={Images.template} title="Download Template" /> <img src={Images.template} />
</button> </button>
</a>
<ReactTooltip border={true} id="template" place="bottom" type="light" effect="solid" />
<a data-tip={'Upload'} data-for="upload">
<button <button
style={{ style={{
backgroundColor: 'transparent', backgroundColor: 'transparent',
...@@ -570,8 +574,11 @@ export default class ApprovalMatrix extends Component { ...@@ -570,8 +574,11 @@ export default class ApprovalMatrix extends Component {
}} }}
onClick={() => this.setState({ visibleUpload: true })} onClick={() => this.setState({ visibleUpload: true })}
> >
<img src={Images.upload} title="Upload File" /> <img src={Images.upload} />
</button> </button>
</a>
<ReactTooltip border={true} id="upload" place="bottom" type="light" effect="solid" />
<a data-tip={'Download'} data-for="download">
<button <button
style={{ style={{
backgroundColor: 'transparent', backgroundColor: 'transparent',
...@@ -583,8 +590,11 @@ export default class ApprovalMatrix extends Component { ...@@ -583,8 +590,11 @@ export default class ApprovalMatrix extends Component {
}} }}
onClick={() => this.downloadDataTable()} onClick={() => this.downloadDataTable()}
> >
<img src={Images.download} title="Download File" /> <img src={Images.download} />
</button> </button>
</a>
<ReactTooltip border={true} id="download" place="bottom" type="light" effect="solid" />
<a data-tip={'Visualisasi'} data-for="visualisasi">
<button <button
style={{ style={{
backgroundColor: 'transparent', backgroundColor: 'transparent',
...@@ -596,8 +606,11 @@ export default class ApprovalMatrix extends Component { ...@@ -596,8 +606,11 @@ export default class ApprovalMatrix extends Component {
}} }}
onClick={() => this.setState({ visibleVisual: true, visibleAM: false })} onClick={() => this.setState({ visibleVisual: true, visibleAM: false })}
> >
<img src={Images.visualisasi} title="Visualisasi" /> <img src={Images.visualisasi} />
</button> </button>
</a>
<ReactTooltip border={true} id="visualisasi" place="bottom" type="light" effect="solid" />
<a data-tip={'Tambah'} data-for="create">
<button <button
style={{ style={{
backgroundColor: 'transparent', backgroundColor: 'transparent',
...@@ -611,6 +624,8 @@ export default class ApprovalMatrix extends Component { ...@@ -611,6 +624,8 @@ export default class ApprovalMatrix extends Component {
> >
<img src={Images.add} title="Tambah Approval Matrix" /> <img src={Images.add} title="Tambah Approval Matrix" />
</button> </button>
</a>
<ReactTooltip border={true} id="create" place="bottom" type="light" effect="solid" />
</div > </div >
</div> </div>
<div style={{ padding: 25, width: '100%' }}> <div style={{ padding: 25, width: '100%' }}>
...@@ -718,7 +733,7 @@ export default class ApprovalMatrix extends Component { ...@@ -718,7 +733,7 @@ export default class ApprovalMatrix extends Component {
type={this.state.uploadStatus} type={this.state.uploadStatus}
percentage={this.state.percentage} percentage={this.state.percentage}
result={this.state.result} result={this.state.result}
acceptedFiles={["pdf"]} acceptedFiles={["xlsx"]}
onHandle={(dt) => { onHandle={(dt) => {
this.fileHandler(dt) this.fileHandler(dt)
this.setState({ uploadStatus: 'idle', percentage: '0' }) this.setState({ uploadStatus: 'idle', percentage: '0' })
......
src/container/ApprovalMatrix/CreateApprovalMatrix.js
View file @ dbf68640
...@@ -28,6 +28,10 @@ export default class CreateApprovalMatrix extends Component { ...@@ -28,6 +28,10 @@ export default class CreateApprovalMatrix extends Component {
msgErrOrder: '', msgErrOrder: '',
errorType: false, errorType: false,
msgErrType: '', msgErrType: '',
errorApproved: false,
msgErrApproved: '',
errorOperator: false,
msgErrOperator: '',
errorStartDate: false, errorStartDate: false,
errorEndDate: false, errorEndDate: false,
msgErrorStartDate: "", msgErrorStartDate: "",
...@@ -140,6 +144,10 @@ export default class CreateApprovalMatrix extends Component { ...@@ -140,6 +144,10 @@ export default class CreateApprovalMatrix extends Component {
msgErrOrder: "", msgErrOrder: "",
errorType: false, errorType: false,
msgErrType: '', msgErrType: '',
errorApproved: false,
msgErrApproved: '',
errorOperator: false,
msgErrOperator: '',
errorStartDate: false, errorStartDate: false,
errorEndDate: false, errorEndDate: false,
msgErrorStartDate: "", msgErrorStartDate: "",
...@@ -149,13 +157,18 @@ export default class CreateApprovalMatrix extends Component { ...@@ -149,13 +157,18 @@ export default class CreateApprovalMatrix extends Component {
validasi() { validasi() {
if (R.isNil(this.state.typeId)) { if (R.isNil(this.state.typeId)) {
return alert("Tipe Persetujuan tidak boleh kosong"); this.setState({ errorType: true, msgErrType: 'Tipe Persetujuan tidak boleh kosong' })
} }
else if (R.isEmpty(this.state.order)) { else if (R.isEmpty(this.state.order)) {
this.setState({ errorOrder: true, msgErrOrder: 'Order tidak boleh kosong'}) 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.userId)) {
else if (R.isNil(this.state.operatorId)) return alert("Operator tidak boleh kosong"); // return alert("Pemberi Persetujuan tidak boleh kosong");
this.setState({ errorApproved: true, msgErrApproved: 'Pemberi Persetujuan tidak boleh kosong' })
}
else if (R.isNil(this.state.operatorId)) {
this.setState({ errorOperator: true, msgErrOperator: 'Operator tidak boleh kosong' })
}
else if (R.isNil(this.state.startDate)) { else if (R.isNil(this.state.startDate)) {
this.setState({ errorStartDate: true, msgErrorStartDate: 'Tanggal Mulai tidak boleh kosong' }) this.setState({ errorStartDate: true, msgErrorStartDate: 'Tanggal Mulai tidak boleh kosong' })
} else if (R.isNil(this.state.endDate)) { } else if (R.isNil(this.state.endDate)) {
...@@ -225,29 +238,26 @@ export default class CreateApprovalMatrix extends Component { ...@@ -225,29 +238,26 @@ export default class CreateApprovalMatrix extends Component {
<Autocomplete <Autocomplete
{...this.state.types} {...this.state.types}
id="tipe" id="tipe"
onChange={(event, newInputValue) => this.setState({typeId:newInputValue})} onChange={(event, newInputValue) => this.setState({typeId:newInputValue}, ()=> this.clearError())}
debug debug
renderInput={(params) => renderInput={(params) =>
<TextField <TextField
{...params} {...params}
label="Tipe Persetujuan" label="Tipe Persetujuan"
onChange={(e) => this.handleChange(e, '')}
error={this.state.errorType}
helperText={this.state.msgErrType}
InputLabelProps={{ InputLabelProps={{
style: { style: {
fontSize: 11, fontSize: 11,
fontFamily: 'Nunito Sans, sans-serif',
color: '#7e8085' color: '#7e8085'
} }
}} }}
InputProps={{ ...params.InputProps, style: { fontSize: 11 } }} InputProps={{ ...params.InputProps, style: { fontSize: 11, fontFamily: 'Nunito Sans, sans-serif' } }}
/> />
} }
value={this.state.typeId} value={this.state.typeId}
error={this.state.errorType}
helperText={this.state.msgErrType}
// inputProps={{
// style: {
// fontSize: 11
// }
// }}
/> />
</div> </div>
</div> </div>
...@@ -284,12 +294,15 @@ export default class CreateApprovalMatrix extends Component { ...@@ -284,12 +294,15 @@ export default class CreateApprovalMatrix extends Component {
<Autocomplete <Autocomplete
{...this.state.approvedBy} {...this.state.approvedBy}
id="approvedby" id="approvedby"
onChange={(event, newInputValue) => this.setState({userId:newInputValue})} onChange={(event, newInputValue) => this.setState({userId:newInputValue}, ()=> this.clearError())}
// disableClearable // disableClearable
debug debug
renderInput={(params) => renderInput={(params) =>
<TextField {...params} <TextField {...params}
label="Pemberi Persetujuan" label="Pemberi Persetujuan"
onChange={(e) => this.handleChange(e, '')}
error={this.state.errorApproved}
helperText={this.state.msgErrApproved}
InputLabelProps={{ InputLabelProps={{
style: { style: {
fontSize: 11, fontSize: 11,
...@@ -299,12 +312,6 @@ export default class CreateApprovalMatrix extends Component { ...@@ -299,12 +312,6 @@ export default class CreateApprovalMatrix extends Component {
InputProps={{ ...params.InputProps, style: { fontSize: 11 } }} InputProps={{ ...params.InputProps, style: { fontSize: 11 } }}
/>} />}
value={this.state.userId} value={this.state.userId}
// inputProps={{
// style: {
// fontSize: 11
// }
// }}
// style={{ padding: 0, margin: 0, width: '100%'}}
/> />
</div> </div>
</div> </div>
...@@ -317,10 +324,13 @@ export default class CreateApprovalMatrix extends Component { ...@@ -317,10 +324,13 @@ export default class CreateApprovalMatrix extends Component {
id="operator" id="operator"
// disableClearable // disableClearable
debug debug
onChange={(event, newInputValue) => this.setState({operatorId:newInputValue})} onChange={(event, newInputValue) => this.setState({operatorId:newInputValue}, ()=> this.clearError())}
renderInput={(params) => renderInput={(params) =>
<TextField {...params} <TextField {...params}
label="Operator" label="Operator"
onChange={(e) => this.handleChange(e, '')}
error={this.state.errorOperator}
helperText={this.state.msgErrOperator}
InputLabelProps={{ InputLabelProps={{
style: { style: {
fontSize: 11, fontSize: 11,
...@@ -330,12 +340,6 @@ export default class CreateApprovalMatrix extends Component { ...@@ -330,12 +340,6 @@ export default class CreateApprovalMatrix extends Component {
InputProps={{ ...params.InputProps, style: { fontSize: 11 } }} InputProps={{ ...params.InputProps, style: { fontSize: 11 } }}
/>} />}
value={this.state.operatorId} value={this.state.operatorId}
// inputProps={{
// style: {
// fontSize: 11
// }
// }}
// style={{ padding: 0, margin: 0, width: '100%' }}
/> />
</div> </div>
</div> </div>
......
src/container/ApprovalMatrix/EditApprovalMatrix.js
View file @ dbf68640
...@@ -22,6 +22,12 @@ export default class EditApprovalMatrix extends Component { ...@@ -22,6 +22,12 @@ export default class EditApprovalMatrix extends Component {
getTypes: null, getTypes: null,
operators: null, operators: null,
getOperators: null, getOperators: null,
errorType: false,
msgErrType: '',
errorApproved: false,
msgErrApproved: '',
errorOperator: false,
msgErrOperator: '',
errorOrder: false, errorOrder: false,
msgErrOrder: '', msgErrOrder: '',
errorStartDate: false, errorStartDate: false,
...@@ -153,6 +159,12 @@ export default class EditApprovalMatrix extends Component { ...@@ -153,6 +159,12 @@ export default class EditApprovalMatrix extends Component {
clearError() { clearError() {
this.setState({ this.setState({
errorType: false,
msgErrType: '',
errorApproved: false,
msgErrApproved: '',
errorOperator: false,
msgErrOperator: '',
errorOrder: false, errorOrder: false,
msgErrOrder: "", msgErrOrder: "",
errorStartDate: false, errorStartDate: false,
...@@ -164,14 +176,17 @@ export default class EditApprovalMatrix extends Component { ...@@ -164,14 +176,17 @@ export default class EditApprovalMatrix extends Component {
validasi() { validasi() {
if (R.isNil(this.state.getTypes)) { if (R.isNil(this.state.getTypes)) {
return alert("Tipe Persetujuan tidak boleh kosong"); this.setState({ errorType: true, msgErrType: 'Tipe Persetujuan tidak boleh kosong' })
} }
else if (R.isEmpty(this.state.order)) { else if (R.isEmpty(this.state.order)) {
this.setState({ errorOrder: true, msgErrOrder: 'Order tidak boleh kosong'}) this.setState({ errorOrder: true, msgErrOrder: 'Order tidak boleh kosong'})
} }
else if (R.isNil(this.state.getApprovedBy)) return alert("Pemberi Persetujuan tidak boleh kosong"); else if (R.isNil(this.state.getApprovedBy)) {
else if (R.isNil(this.state.getOperators)) return alert("Operator tidak boleh kosong"); this.setState({ errorApproved: true, msgErrApproved: 'Pemberi Persetujuan tidak boleh kosong' })
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"); }
else if (R.isNil(this.state.getOperators)) {
this.setState({ errorOperator: true, msgErrOperator: 'Operator tidak boleh kosong' })
}
else if (R.isEmpty(this.state.startDate)) { else if (R.isEmpty(this.state.startDate)) {
this.setState({ errorStartDate: true, msgErrorStartDate: 'Tanggal Mulai tidak boleh kosong' }) this.setState({ errorStartDate: true, msgErrorStartDate: 'Tanggal Mulai tidak boleh kosong' })
} else if (R.isEmpty(this.state.endDate)) { } else if (R.isEmpty(this.state.endDate)) {
...@@ -246,10 +261,13 @@ export default class EditApprovalMatrix extends Component { ...@@ -246,10 +261,13 @@ export default class EditApprovalMatrix extends Component {
option option
debug debug
id="tipe" id="tipe"
onChange={(event, newInputValue) => this.setState({getTypes:newInputValue})} onChange={(event, newInputValue) => this.setState({getTypes:newInputValue}, ()=> this.clearError())}
renderInput={(params) => renderInput={(params) =>
<TextField {...params} <TextField {...params}
label="Tipe Persetujuan" label="Tipe Persetujuan"
onChange={(e) => this.handleChange(e, '')}
error={this.state.errorType}
helperText={this.state.msgErrType}
InputLabelProps={{ InputLabelProps={{
style: { style: {
fontSize: 11, fontSize: 11,
...@@ -298,10 +316,13 @@ export default class EditApprovalMatrix extends Component { ...@@ -298,10 +316,13 @@ export default class EditApprovalMatrix extends Component {
option option
debug debug
id="approvedby" id="approvedby"
onChange={(event, newInputValue) => this.setState({getApprovedBy: newInputValue})} onChange={(event, newInputValue) => this.setState({getApprovedBy: newInputValue}, ()=> this.clearError())}
renderInput={(params) => renderInput={(params) =>
<TextField {...params} <TextField {...params}
label="Pemberi Persetujuan" label="Pemberi Persetujuan"
onChange={(e) => this.handleChange(e, '')}
error={this.state.errorApproved}
helperText={this.state.msgErrApproved}
InputLabelProps={{ InputLabelProps={{
style: { style: {
fontSize: 11, fontSize: 11,
...@@ -321,12 +342,15 @@ export default class EditApprovalMatrix extends Component { ...@@ -321,12 +342,15 @@ export default class EditApprovalMatrix extends Component {
<Autocomplete <Autocomplete
{...this.state.operators} {...this.state.operators}
option option
disableClearable debug
id="operator" id="operator"
onChange={(event, newInputValue) => this.setState({getOperators: newInputValue})} onChange={(event, newInputValue) => this.setState({getOperators: newInputValue}, ()=> this.clearError())}
renderInput={(params) => renderInput={(params) =>
<TextField {...params} <TextField {...params}
label="Operator" label="Operator"
onChange={(e) => this.handleChange(e, '')}
error={this.state.errorOperator}
helperText={this.state.msgErrOperator}
InputLabelProps={{ InputLabelProps={{
style: { style: {
fontSize: 11, fontSize: 11,
......
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