From 4166ff7a4833cc6bd99767fa33289adaea06f68b Mon Sep 17 00:00:00 2001 From: Bilal Catic Date: Wed, 19 Jun 2019 00:23:40 +0200 Subject: [PATCH] show incidents for selected member and selected dates --- .../components/MemberIncidentsTable/index.js | 3 +- .../components/MemberSelector.js | 40 ++++++++++++++++- .../src/scenes/PracticeSummaryReport/index.js | 44 +++++++++++++++++-- .../src/store/actions/integrationActions.js | 30 +++++++++++++ client/src/store/constants.js | 8 ++++ client/src/store/reducers/index.js | 4 ++ .../store/reducers/memberIncidentsReducer.js | 38 ++++++++++++++++ .../src/store/reducers/membersListReducer.js | 38 ++++++++++++++++ 8 files changed, 200 insertions(+), 5 deletions(-) create mode 100644 client/src/store/reducers/memberIncidentsReducer.js create mode 100644 client/src/store/reducers/membersListReducer.js diff --git a/client/src/components/MemberIncidentsTable/index.js b/client/src/components/MemberIncidentsTable/index.js index 1586abf..2e6b44f 100644 --- a/client/src/components/MemberIncidentsTable/index.js +++ b/client/src/components/MemberIncidentsTable/index.js @@ -13,7 +13,8 @@ import { const MemberIncidentsTable = props => { - const { loading, incidents, title } = props; + const { loading, title } = props; + const incidents = props.incidents ? props.incidents : []; const columns = []; if (incidents && incidents.length > 0){ diff --git a/client/src/scenes/PracticeSummaryReport/components/MemberSelector.js b/client/src/scenes/PracticeSummaryReport/components/MemberSelector.js index fe1781a..2c439b3 100644 --- a/client/src/scenes/PracticeSummaryReport/components/MemberSelector.js +++ b/client/src/scenes/PracticeSummaryReport/components/MemberSelector.js @@ -1,20 +1,58 @@ import React, { Component } from 'react'; +import { connect } from 'react-redux'; import { Dropdown, Form } from 'semantic-ui-react'; +import { fetchMembersList } from '../../../store/actions'; + class MemberSelector extends Component { + componentDidMount() { + const { fetchMembersList } = this.props; + + fetchMembersList(); + } + + onMemberSelectionChange(event, data){ + const { onMemberSelect } = this.props; + + const { value } = data; + + if (onMemberSelect && value){ + onMemberSelect(value); + } + } + render(){ + const { members } = this.props; + + const dropdownOptions = members && Array.isArray(members) ? members.map(member => ({ + key: member.memberId, + value: member.memberId, + text: member.name + }) + ) : null; + return (
); } } -export default MemberSelector; +const mapStateToProps = (state) => ({ + members: state.membersList.result, +}); + +const mapDispatchToProps = (dispatch) => ({ + fetchMembersList: () => fetchMembersList(dispatch), +}); + +export default connect(mapStateToProps, mapDispatchToProps)(MemberSelector); diff --git a/client/src/scenes/PracticeSummaryReport/index.js b/client/src/scenes/PracticeSummaryReport/index.js index 14c8bcd..baa1e42 100644 --- a/client/src/scenes/PracticeSummaryReport/index.js +++ b/client/src/scenes/PracticeSummaryReport/index.js @@ -8,8 +8,39 @@ import MemberSelector from './components/MemberSelector'; import MemberSummary from './components/MemberSummary'; import MemberIncidentsTable from '../../components/MemberIncidentsTable'; +import { fetchMemberIncidents } from '../../store/actions'; + class PracticeSummaryReport extends Component { + constructor(props){ + super(props); + + this.state = { + dateRange: null, + memberId: null, + }; + } + + onDateRangeUpdate(dateRange){ + this.fetchIncidents(dateRange, this.state.memberId); + this.setState({dateRange}); + } + + onMemberSelectionUpdate(memberId){ + this.fetchIncidents(this.state.dateRange, memberId); + this.setState({memberId}); + } + + fetchIncidents(dateRange, memberId){ + const { fetchMemberIncidents } = this.props; + + if (dateRange && dateRange.startDate && dateRange.endDate && memberId){ + fetchMemberIncidents(memberId, dateRange); + } + } + render () { + const { memberIncidents, loading } = this.props; + return ( @@ -18,10 +49,10 @@ class PracticeSummaryReport extends Component { - + - + @@ -31,7 +62,11 @@ class PracticeSummaryReport extends Component { - + @@ -41,9 +76,12 @@ class PracticeSummaryReport extends Component { } const mapStateToProps = (state) => ({ + memberIncidents: state.memberIncidents.result, + loading: state.memberIncidents.pending, }); const mapDispatchToProps = (dispatch) => ({ + fetchMemberIncidents: (memberId, dateRange) => fetchMemberIncidents(dispatch, memberId, dateRange), }); export default connect(mapStateToProps, mapDispatchToProps)(PracticeSummaryReport); diff --git a/client/src/store/actions/integrationActions.js b/client/src/store/actions/integrationActions.js index b79c15e..5e9a127 100644 --- a/client/src/store/actions/integrationActions.js +++ b/client/src/store/actions/integrationActions.js @@ -8,6 +8,12 @@ import { FETCH_INCIDENTS_PENDING, FETCH_INCIDENTS_SUCCESS, FETCH_INCIDENTS_FAILED, + FETCH_MEMBERS_PENDING, + FETCH_MEMBERS_SUCCESS, + FETCH_MEMBERS_FAILED, + FETCH_MEMBER_INCIDENTS_PENDING, + FETCH_MEMBER_INCIDENTS_SUCCESS, + FETCH_MEMBER_INCIDENTS_FAILED, } from '../constants'; import API from '../../utilities/api'; @@ -48,3 +54,27 @@ export const fetchIncidents = (dispatch, dateRange) => { dispatch({type: FETCH_INCIDENTS_FAILED, payload: error.response}); }); }; + +export const fetchMembersList = (dispatch) => { + dispatch({type: FETCH_MEMBERS_PENDING}); + API.get('officeRnD/membersList') + .then(response => { + dispatch({type: FETCH_MEMBERS_SUCCESS, payload: response.data}); + }) + .catch(error => { + dispatch({type: FETCH_MEMBERS_FAILED, payload: error.response}); + }); +}; + +export const fetchMemberIncidents = (dispatch, memberId, dateRange) => { + const { startDate, endDate } = dateRange; + + dispatch({type: FETCH_MEMBER_INCIDENTS_PENDING}); + API.get(`integration/report/member/${memberId}/${startDate}/${endDate}`) + .then(response => { + dispatch({type: FETCH_MEMBER_INCIDENTS_SUCCESS, payload: response.data}); + }) + .catch(error => { + dispatch({type: FETCH_MEMBER_INCIDENTS_FAILED, payload: error.response}); + }); +}; diff --git a/client/src/store/constants.js b/client/src/store/constants.js index 9b20bbc..6dd4fd8 100644 --- a/client/src/store/constants.js +++ b/client/src/store/constants.js @@ -13,3 +13,11 @@ export const ADD_NEW_MAPPING_FAILED = 'ADD_NEW_MAPPING_FAILED'; export const FETCH_INCIDENTS_PENDING = 'FETCH_INCIDENTS_PENDING'; export const FETCH_INCIDENTS_SUCCESS = 'FETCH_INCIDENTS_SUCCESS'; export const FETCH_INCIDENTS_FAILED = 'FETCH_INCIDENTS_FAILED'; + +export const FETCH_MEMBERS_PENDING = 'FETCH_MEMBERS_PENDING'; +export const FETCH_MEMBERS_SUCCESS = 'FETCH_MEMBERS_SUCCESS'; +export const FETCH_MEMBERS_FAILED = 'FETCH_MEMBERS_FAILED'; + +export const FETCH_MEMBER_INCIDENTS_PENDING = 'FETCH_MEMBER_INCIDENTS_PENDING'; +export const FETCH_MEMBER_INCIDENTS_SUCCESS = 'FETCH_MEMBER_INCIDENTS_SUCCESS'; +export const FETCH_MEMBER_INCIDENTS_FAILED = 'FETCH_MEMBER_INCIDENTS_FAILED'; diff --git a/client/src/store/reducers/index.js b/client/src/store/reducers/index.js index 3c060be..869300c 100644 --- a/client/src/store/reducers/index.js +++ b/client/src/store/reducers/index.js @@ -4,11 +4,15 @@ import { doorLockData} from './doorLockReducers'; import { mappingsData } from './mappingsReducer'; import { addMapping } from './addMappingReducer'; import { incidentsReport } from './incidentsReportReducer'; +import { membersList } from './membersListReducer'; +import { memberIncidents} from './memberIncidentsReducer'; export const rootReducer = combineReducers({ doorLockData, mappingsData, addMapping, incidentsReport, + membersList, + memberIncidents, }); diff --git a/client/src/store/reducers/memberIncidentsReducer.js b/client/src/store/reducers/memberIncidentsReducer.js new file mode 100644 index 0000000..04cef0f --- /dev/null +++ b/client/src/store/reducers/memberIncidentsReducer.js @@ -0,0 +1,38 @@ +import { + FETCH_MEMBER_INCIDENTS_PENDING, + FETCH_MEMBER_INCIDENTS_SUCCESS, + FETCH_MEMBER_INCIDENTS_FAILED, +} from '../constants'; + +const initialState = { + pending: false, + result: null, + error: null, +}; + +export const memberIncidents = (state, action) => { + state = state || initialState; + action = action || {}; + + switch(action.type){ + case FETCH_MEMBER_INCIDENTS_PENDING: + return Object.assign({}, state, { + pending: true, + error: null, + }); + case FETCH_MEMBER_INCIDENTS_SUCCESS: + return Object.assign({}, state, { + pending: false, + result: action.payload, + error: null, + }); + case FETCH_MEMBER_INCIDENTS_FAILED: + return Object.assign({}, state, { + pending: false, + result: {}, + error: action.payload, + }); + default: + return state; + } +}; diff --git a/client/src/store/reducers/membersListReducer.js b/client/src/store/reducers/membersListReducer.js new file mode 100644 index 0000000..bf5c1f6 --- /dev/null +++ b/client/src/store/reducers/membersListReducer.js @@ -0,0 +1,38 @@ +import { + FETCH_MEMBERS_PENDING, + FETCH_MEMBERS_SUCCESS, + FETCH_MEMBERS_FAILED, +} from '../constants'; + +const initialState = { + pending: false, + result: null, + error: null, +}; + +export const membersList = (state, action) => { + state = state || initialState; + action = action || {}; + + switch(action.type){ + case FETCH_MEMBERS_PENDING: + return Object.assign({}, state, { + pending: true, + error: null, + }); + case FETCH_MEMBERS_SUCCESS: + return Object.assign({}, state, { + pending: false, + result: action.payload, + error: null, + }); + case FETCH_MEMBERS_FAILED: + return Object.assign({}, state, { + pending: false, + result: {}, + error: action.payload, + }); + default: + return state; + } +};