Skip to content

Commit bb33364

Browse files
rusiruavbrusiruavb
committed
Fix the delete examination issue
1 parent 5fbcd4d commit bb33364

File tree

5 files changed

+142
-27
lines changed

5 files changed

+142
-27
lines changed

‎src/components/navigation_bar.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -47,7 +47,7 @@ class NavigationBar extends Component {
4747
localStorage.removeItem('token');
4848

4949
NotificationManager.success(Constant.LOGOUT_MESSAGE);
50-
window.location = '/login';
50+
window.location = '/';
5151
}
5252
};
5353

‎src/pages/employee/update/update_employee.js

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -65,9 +65,10 @@ class UpdateEmployee extends Component {
6565
}
6666

6767
if (this.props.update !== nextProps.update) {
68-
NotificationManager.success('Updated Employee Details successfully!');
69-
this.setState({ isLoading: false });
70-
this.closeModal();
68+
this.setState({ isLoading: false }, () => {
69+
NotificationManager.success('Updated Employee Details successfully!');
70+
this.closeModal();
71+
});
7172
}
7273
if (this.props.updateemployeeError !== nextProps.updateemployeeError) {
7374
this.setState({ isLoading: false }, () => {

‎src/pages/employee/view/employee_view.js

Lines changed: 16 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
/* eslint-disable jsx-a11y/anchor-is-valid */
12
import React, { Component } from 'react';
23
import { connect } from 'react-redux';
34
import BootstrapTable from 'react-bootstrap-table-next';
@@ -7,7 +8,7 @@ import ToolkitProvider, {
78
} from 'react-bootstrap-table2-toolkit/dist/react-bootstrap-table2-toolkit';
89
import paginationFactory from 'react-bootstrap-table2-paginator';
910
import moment from 'moment';
10-
import {
11+
import {
1112
getEmployeeList,
1213
setEmployee,
1314
deleteEmployee,
@@ -23,7 +24,6 @@ const initialState = {
2324
employees: [],
2425
isLoading: false,
2526
removeemployeeId: '',
26-
2727
};
2828

2929
const { ExportCSVButton } = CSVExport;
@@ -57,8 +57,8 @@ class EmployeePage extends Component {
5757
componentDidMount() {
5858
this.props.getEmployeeList();
5959
const employeeId = this.props.employeeId;
60-
if(employeeId){
61-
this.props.getEmployeeById(employeeId)
60+
if (employeeId) {
61+
this.props.getEmployeeById(employeeId);
6262
}
6363
}
6464

@@ -80,12 +80,12 @@ class EmployeePage extends Component {
8080
}
8181

8282
if (this.props.deleteempError !== nextProps.deleteempError) {
83-
if(nextProps.deleteempError && nextProps.deleteempError.message) {
84-
this.setState({isLoading: false}, () => {
83+
if (nextProps.deleteempError && nextProps.deleteempError.message) {
84+
this.setState({ isLoading: false }, () => {
8585
NotificationManager.error(nextProps.deleteempError.message);
8686
});
8787
} else {
88-
this.setState({ isLoading: false}, () => {
88+
this.setState({ isLoading: false }, () => {
8989
NotificationManager.error('Employee delete failed!');
9090
});
9191
}
@@ -95,7 +95,7 @@ class EmployeePage extends Component {
9595
closeModal() {
9696
const { removeemployeeId } = this.state;
9797

98-
if(removeemployeeId) {
98+
if (removeemployeeId) {
9999
$(`#q${removeemployeeId}`).modal('toggle');
100100
this.setState(initialState);
101101
}
@@ -104,12 +104,10 @@ class EmployeePage extends Component {
104104
setRemoveEmployeeId = (event, employeeId) => {
105105
if (event) {
106106
this.setState({ removeemployeeId: employeeId });
107-
console.log(employeeId);
108107
this.props.deleteEmployee(employeeId);
109-
this.setState({isLoading: false});
108+
this.setState({ isLoading: false });
110109
this.closeModal();
111110
}
112-
113111
};
114112

115113
OnSelectEmployeeToUpdate = (event, employeeId) => {
@@ -129,14 +127,14 @@ class EmployeePage extends Component {
129127
event.preventDefault();
130128
const { removeemployeeId } = this.state;
131129

132-
if(removeemployeeId) {
130+
if (removeemployeeId) {
133131
console.log(removeemployeeId);
134132
this.props.deleteEmployee(removeemployeeId);
135-
this.setState({isLoading: false});
133+
this.setState({ isLoading: false });
136134
this.closeModal();
137135
}
138136
}
139-
}
137+
};
140138

141139
tableColumData = [
142140
{
@@ -244,7 +242,7 @@ class EmployeePage extends Component {
244242
}
245243

246244
actionButtonFormatter = (row) => {
247-
const {removeemployeeId} = this.state;
245+
const { removeemployeeId } = this.state;
248246
return (
249247
<span className="dropdown show">
250248
<span className="dropdown">
@@ -266,10 +264,8 @@ class EmployeePage extends Component {
266264
<i class="far fa-edit" /> Edit
267265
</a>
268266

269-
<a
270-
className="dropdown-item"
271-
data-mdb-toggle="modal"
272-
data-mdb-target={`#q${this.removeemployeeId}`}
267+
<a
268+
className="dropdown-item"
273269
onClick={(event) => this.setRemoveEmployeeId(event, row._id)}
274270
>
275271
<i class="far fa-trash-alt" /> Delete
@@ -359,7 +355,7 @@ class EmployeePage extends Component {
359355
};
360356

361357
render() {
362-
const { employees,isLoading,removeemployeeId } = this.state;
358+
const { employees, isLoading, removeemployeeId } = this.state;
363359
return (
364360
<div className="pt-5 pb-5 admin-container-color">
365361
<div className="card p-4 exam-table container">

‎src/pages/examination/view/examination_page.js

Lines changed: 120 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@ import { Link } from 'react-router-dom';
55
import {
66
getExaminationsForTeacher,
77
setExam,
8+
deleteExamination,
89
} from '../../../actions/examination_actions';
910
import BootstrapTable from 'react-bootstrap-table-next';
1011
import ToolkitProvider, {
@@ -17,9 +18,12 @@ import CreateExam from '../add/create_new_exam';
1718
import UpdateExam from '../update/update_exam';
1819
import axios from 'axios';
1920
import download from 'downloadjs';
21+
import Loader from '../../../components/loader';
22+
import { NotificationManager } from 'react-notifications';
2023

2124
const { SearchBar } = Search;
2225
const { ExportCSVButton } = CSVExport;
26+
const $ = window.$;
2327

2428
const rowStyle = (row, rowIndex) => {
2529
const style = {};
@@ -45,12 +49,25 @@ class ExaminationPage extends Component {
4549
constructor(props) {
4650
super(props);
4751
this.onSelectExamToUpdate = this.onSelectExamToUpdate.bind(this);
52+
this.removeExamination = this.removeExamination.bind(this);
53+
this.setRemoveExam = this.setRemoveExam.bind(this);
54+
this.closeModal = this.closeModal.bind(this);
4855
this.state = {
4956
exams: [],
5057
selectedExam: '',
58+
isLoading: false,
59+
removeExamId: '',
5160
};
5261
}
5362

63+
closeModal() {
64+
$('#delete-exam').modal('toggle');
65+
this.setState({
66+
isLoading: false,
67+
removeExamId: '',
68+
});
69+
}
70+
5471
componentDidMount() {
5572
if (localStorage.getItem('token') !== null) {
5673
this.props.getExaminationsForTeacher();
@@ -73,6 +90,23 @@ class ExaminationPage extends Component {
7390
if (this.props.updateExam !== nextProps.updateExam) {
7491
this.props.getExaminationsForTeacher();
7592
}
93+
94+
if (this.props.deleteExam !== nextProps.deleteExam) {
95+
this.props.getExaminationsForTeacher();
96+
this.closeModal();
97+
}
98+
99+
if (this.props.deleteExamError !== nextProps.deleteExamError) {
100+
if (nextProps.deleteExamError && nextProps.deleteExamError.message) {
101+
this.setState({ isLoading: false }, () => {
102+
NotificationManager.error(nextProps.deleteExamError.message);
103+
});
104+
} else {
105+
this.setState({ isLoading: false }, () => {
106+
NotificationManager.error('Error with delete examination');
107+
});
108+
}
109+
}
76110
};
77111

78112
// react bootstrap table data & functions
@@ -232,15 +266,42 @@ class ExaminationPage extends Component {
232266
>
233267
<i className="far fa-edit" /> Edit
234268
</a>
235-
<a className="dropdown-item" href="#">
269+
<button
270+
className="dropdown-item"
271+
data-mdb-toggle="modal"
272+
data-mdb-target="#delete-exam"
273+
onClick={(event) => this.setRemoveExam(event, row._id)}
274+
>
236275
<i className="far fa-trash-alt" /> Delete
237-
</a>
276+
</button>
238277
</div>
239278
</span>
240279
</span>
241280
);
242281
};
243282

283+
setRemoveExam = (event, examId) => {
284+
if (event) {
285+
console.log(examId);
286+
this.setState({ removeExamId: examId });
287+
}
288+
};
289+
290+
removeExamination = (event) => {
291+
if (event) {
292+
event.preventDefault();
293+
const { removeExamId } = this.state;
294+
295+
if (removeExamId) {
296+
const removeExamData = {
297+
id: removeExamId,
298+
};
299+
this.props.deleteExamination(removeExamData);
300+
this.setState({ isLoading: true });
301+
}
302+
}
303+
};
304+
244305
examDateTimeFormatter = (cell) => {
245306
return moment(cell).format('lll');
246307
};
@@ -299,6 +360,58 @@ class ExaminationPage extends Component {
299360
)}
300361
</ToolkitProvider>
301362
</div>
363+
364+
<div
365+
className="modal fade"
366+
id="delete-exam"
367+
tabIndex="-1"
368+
aria-labelledby="exampleModalLabel"
369+
data-mdb-backdrop="static"
370+
data-mdb-keyboard="false"
371+
aria-hidden="true"
372+
>
373+
<div className="modal-dialog">
374+
<div className="modal-content">
375+
<div className="modal-header">
376+
<h5 className="modal-title" id="exampleModalLabel">
377+
Remove Examination
378+
</h5>
379+
<button
380+
type="button"
381+
className="btn-close"
382+
data-mdb-dismiss="modal"
383+
aria-label="Close"
384+
></button>
385+
</div>
386+
<div className="modal-body">
387+
<p>Do you want to remove the examination?</p>
388+
</div>
389+
<div className="modal-footer d-flex justify-content-center">
390+
{this.state.isLoading ? (
391+
<Loader size={50} />
392+
) : (
393+
<div>
394+
<button
395+
type="button"
396+
className="btn btn-light btn-no-shadow btn-rounded"
397+
data-mdb-dismiss="modal"
398+
>
399+
Close
400+
</button>
401+
<button
402+
type="button"
403+
className="btn btn-danger btn-no-shadow btn-rounded"
404+
onClick={this.removeExamination}
405+
>
406+
Remove
407+
</button>
408+
</div>
409+
)}
410+
</div>
411+
</div>
412+
</div>
413+
</div>
414+
302415
<CreateExam />
303416
<UpdateExam selectedExam={selectedExam} />
304417
</div>
@@ -311,6 +424,8 @@ const mapStateToProps = (state) => ({
311424
createExam: state.examinationReducer.createexamination,
312425
updateExam: state.examinationReducer.updateexamination,
313426
updateExamError: state.examinationReducer.updateexaminationerror,
427+
deleteExam: state.examinationReducer.deleteexamination,
428+
deleteExamError: state.examinationReducer.deleteexaminationerror,
314429
});
315430

316431
const mapDispatchToProps = (dispatch) => ({
@@ -320,6 +435,9 @@ const mapDispatchToProps = (dispatch) => ({
320435
setExam: (examData) => {
321436
dispatch(setExam(examData));
322437
},
438+
deleteExamination: (examinationData) => {
439+
dispatch(deleteExamination(examinationData));
440+
},
323441
});
324442

325443
export default connect(mapStateToProps, mapDispatchToProps)(ExaminationPage);

‎src/reducers/examination_reducer.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -144,7 +144,7 @@ function examinationReducer(state = INITIALSTATE, action) {
144144
return {
145145
...state,
146146
loading: false,
147-
deleteexaminationerror: action.payload.data,
147+
deleteexaminationerror: action.payload,
148148
state: INITIALSTATE,
149149
};
150150
case `${CREATE_QUESTION}_REJECTED`:

0 commit comments

Comments
 (0)