66 lines
2.1 KiB
JavaScript
66 lines
2.1 KiB
JavaScript
import React, { Component } from 'react';
|
|
import { connect } from 'react-redux';
|
|
import { Container } from 'semantic-ui-react';
|
|
|
|
import MainMenu from '../../components/MainMenu';
|
|
import MonthSelector from '../../components/MonthSelector';
|
|
import MemberIncidentsTables from '../../components/MemberIncidentsTables';
|
|
import GenerateFeesInORDButton from '../../components/GenerateFeesInORDButton';
|
|
|
|
import { fetchIncidents } from '../../store/actions';
|
|
|
|
class IncidentsReport extends Component {
|
|
state = {dateRange: null};
|
|
|
|
onDatesUpdate = (dateRange) => {
|
|
const { fetchIncidents } = this.props;
|
|
|
|
this.setState({dateRange});
|
|
fetchIncidents(dateRange);
|
|
};
|
|
|
|
render () {
|
|
const { pendingIncidents, incidents, pendingAddFeesStatus } = this.props;
|
|
const { dateRange } = this.state;
|
|
|
|
const loading = pendingIncidents || pendingAddFeesStatus;
|
|
|
|
const membersMap = {};
|
|
if (incidents && Array.isArray(incidents)) {
|
|
incidents.forEach((incident) => {
|
|
membersMap[incident.memberId] = true;
|
|
});
|
|
}
|
|
|
|
return (
|
|
<Container>
|
|
<MainMenu/>
|
|
<h3>Incidents Report</h3>
|
|
<hr/>
|
|
<MonthSelector buttonLabel="Show report" onDatesUpdate={this.onDatesUpdate} inlineButton />
|
|
<br/>
|
|
<GenerateFeesInORDButton
|
|
disabled={loading}
|
|
dateRange={dateRange}
|
|
/>
|
|
<br/><br/>
|
|
<hr/>
|
|
<br/>
|
|
<MemberIncidentsTables pendingIncidents={loading} incidents={incidents} />
|
|
</Container>
|
|
);
|
|
}
|
|
}
|
|
|
|
const mapStateToProps = (state) => ({
|
|
pendingIncidents: state.incidentsReport.pending,
|
|
incidents: state.incidentsReport.result,
|
|
pendingAddFeesStatus: state.addFeesStatus.pending,
|
|
});
|
|
|
|
const mapDispatchToProps = (dispatch) => ({
|
|
fetchIncidents: (dateRange) => fetchIncidents(dispatch, dateRange)
|
|
});
|
|
|
|
export default connect(mapStateToProps, mapDispatchToProps)(IncidentsReport);
|