senaduka/old-psihologija
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

modify UI to display incidents separately

Browse Source
This commit is contained in:
Bilal Catic
2019-07-07 02:44:34 +02:00
parent bd513b7599
commit e3eee4139b
5 changed files with 102 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
client/src/components/MemberIncidentsTable/index.js
View File

@@ -8,13 +8,13 @@ import {incidentsReportHeaderTitles} from '../../constants/menuItems';
import {
incidentDescriptions,
incidentLevelDescriptions,
UNLOCKED_INCIDENT,
UNSCHEDULED_INCIDENT
UNLOCKED_INCIDENT_RELATED_WITH_RESERVATION, UNLOCKED_INCIDENT_STANDALONE, UNSCHEDULED_INCIDENT_AFTER_RESERVATION,
UNSCHEDULED_INCIDENT_BEFORE_RESERVATION, UNSCHEDULED_INCIDENT_STANDALONE
} from '../../constants/enums';
const MemberIncidentsTable = props => {
const { loading, title, openMemberSummaryOnMemberClick } = props;
const { loading, title, openMemberSummaryOnMemberClick, showBookingTimes, showDoorLockEntryTimes } = props;
const incidents = props.incidents ? props.incidents : [];
const columns = [];
@@ -24,7 +24,15 @@ const MemberIncidentsTable = props => {
incidentHeaders.forEach((header) => {
const columnTitle = incidentsReportHeaderTitles[header];
if (columnTitle){
let showColumn = true;
if ((header === 'bookingStart' || header === 'bookingEnd') && !showBookingTimes){
showColumn = false;
}
if ((header === 'unlockTimestamp' || header === 'lockTimestamp') && !showDoorLockEntryTimes){
showColumn = false;
}
if (columnTitle && showColumn){
const columnAlignments = {
left: 'left',
right: 'right',
@@ -54,10 +62,13 @@ const MemberIncidentsTable = props => {
const { incidentType, incidentLevel, timeIntervalsToCharge } = props.row['_original'];
switch (incidentType) {
case UNLOCKED_INCIDENT:
case UNLOCKED_INCIDENT_RELATED_WITH_RESERVATION:
case UNLOCKED_INCIDENT_STANDALONE:
cellValue = `${incidentLevelDescriptions[incidentLevel]}`;
break;
case UNSCHEDULED_INCIDENT:
case UNSCHEDULED_INCIDENT_BEFORE_RESERVATION:
case UNSCHEDULED_INCIDENT_AFTER_RESERVATION:
case UNSCHEDULED_INCIDENT_STANDALONE:
cellValue = `${timeIntervalsToCharge} x 5 min`;
break;
default:
@@ -80,12 +91,6 @@ const MemberIncidentsTable = props => {
}else{
return <div style={{ textAlign: columnContentsAlignment }}>{cellValue}</div>
}
// return <NavLink to={urlValue}>
// <div>{cellValue}</div>
// </NavLink>
// return <div style={{ textAlign: columnContentsAlignment }}><a href={'www.gogole.com'} >{cellValue}</a></div>
}
});
}

15
client/src/constants/enums.js
View File

@@ -1,10 +1,16 @@
export const UNLOCKED_INCIDENT = 2;
export const UNSCHEDULED_INCIDENT = 3;
export const UNLOCKED_INCIDENT_RELATED_WITH_RESERVATION = 2;
export const UNSCHEDULED_INCIDENT_BEFORE_RESERVATION = 3;
export const UNSCHEDULED_INCIDENT_AFTER_RESERVATION = 4;
export const UNLOCKED_INCIDENT_STANDALONE = 5;
export const UNSCHEDULED_INCIDENT_STANDALONE = 6;
export const incidentDescriptions = {};
incidentDescriptions[UNLOCKED_INCIDENT] = 'User left door unlocked';
incidentDescriptions[UNSCHEDULED_INCIDENT] = 'Unscheduled use';
incidentDescriptions[UNLOCKED_INCIDENT_RELATED_WITH_RESERVATION] = 'User left door unlocked';
incidentDescriptions[UNSCHEDULED_INCIDENT_BEFORE_RESERVATION] = 'Unscheduled use - before';
incidentDescriptions[UNSCHEDULED_INCIDENT_AFTER_RESERVATION] = 'Unscheduled use - after';
incidentDescriptions[UNLOCKED_INCIDENT_STANDALONE] = 'User left door unlocked';
incidentDescriptions[UNSCHEDULED_INCIDENT_STANDALONE] = 'Unscheduled use';
export const incidentLevelDescriptions = {
UNLOCKED_0: 'First month',
@@ -13,5 +19,4 @@ export const incidentLevelDescriptions = {
UNLOCKED_3: 'Fourth month',
UNLOCKED_4: 'Fifth month',
UNLOCKED_5: 'Sixth month',
};

2
client/src/constants/menuItems.js
View File

@@ -45,6 +45,8 @@ export const incidentsReportHeaderTitles = {
resourceName: 'Room',
bookingStart: 'Reservation Start',
bookingEnd: 'Reservation End',
unlockTimestamp: 'Unlock Time',
lockTimestamp: 'Lock Time',
memberName: 'Member Name',
incidentType: 'Incident Type',
feeDescription: 'Fee description',

72
client/src/scenes/IncidentsReport/index.js
View File

@@ -1,6 +1,6 @@
import React, { Component } from 'react';
import { connect } from 'react-redux';
import { Container } from 'semantic-ui-react';
import { Container, Accordion, Label } from 'semantic-ui-react';
import MainMenu from '../../components/MainMenu';
import DateRangePicker from '../../components/DateRangePicker';
@@ -8,6 +8,13 @@ import MemberIncidentsTable from '../../components/MemberIncidentsTable';
import { fetchIncidents } from '../../store/actions';
import {
UNLOCKED_INCIDENT_RELATED_WITH_RESERVATION,
UNLOCKED_INCIDENT_STANDALONE, UNSCHEDULED_INCIDENT_AFTER_RESERVATION,
UNSCHEDULED_INCIDENT_BEFORE_RESERVATION,
UNSCHEDULED_INCIDENT_STANDALONE
} from '../../constants/enums';
class IncidentsReport extends Component {
onDatesUpdate(dateRange) {
const { fetchIncidents } = this.props;
@@ -17,6 +24,62 @@ class IncidentsReport extends Component {
render () {
const { pendingIncidents, incidents } = this.props;
const incidentsRelatedToReservations = [];
const standaloneIncidents = [];
if (Array.isArray(incidents)){
incidents.forEach((incident) => {
if (incident && incident.incidentType){
switch (incident.incidentType) {
case UNLOCKED_INCIDENT_RELATED_WITH_RESERVATION:
case UNSCHEDULED_INCIDENT_BEFORE_RESERVATION:
case UNSCHEDULED_INCIDENT_AFTER_RESERVATION:
incidentsRelatedToReservations.push(incident);
break;
case UNLOCKED_INCIDENT_STANDALONE:
case UNSCHEDULED_INCIDENT_STANDALONE:
standaloneIncidents.push(incident);
break;
}
}
});
}
const incidentsRelatedToReservationsTable = (
<MemberIncidentsTable
loading={pendingIncidents}
incidents={incidentsRelatedToReservations}
openMemberSummaryOnMemberClick
showBookingTimes
/>
);
const standaloneIncidentsTable = (
<MemberIncidentsTable
loading={pendingIncidents}
incidents={standaloneIncidents}
openMemberSummaryOnMemberClick
showDoorLockEntryTimes
/>
);
const accordionPanels = [
{
key: 'related-door-lock-incidents',
title : { content: <Label color='blue' content={'Door Lock Charges - Related to reservations'} /> },
content: { content : incidentsRelatedToReservationsTable },
},
{
key: 'standalone-door-lock-incidents',
title : { content: <Label color='blue' content={'Door Lock Charges - Standalone'} /> },
content: { content: standaloneIncidentsTable },
},
{
key: 'reservation-modification-incidents',
title: {content: <Label color='blue' content={'Cancellation charges'}/>},
}
];
return (
<Container>
<MainMenu/>
@@ -24,7 +87,12 @@ class IncidentsReport extends Component {
<hr/>
<DateRangePicker buttonLabel="Show report" onDatesUpdate={this.onDatesUpdate.bind(this)} />
<br/>
<MemberIncidentsTable loading={pendingIncidents} incidents={incidents} openMemberSummaryOnMemberClick />
<Accordion
panels={accordionPanels}
exclusive={false}
defaultActiveIndex={[0]}
fluid
/>
</Container>
);
}

6
client/src/scenes/PracticeSummaryReport/components/MemberSummary.js
View File

@@ -1,7 +1,7 @@
import React from 'react';
import { Loader, Grid } from 'semantic-ui-react';
import { UNSCHEDULED_INCIDENT, UNLOCKED_INCIDENT } from '../../../constants/enums';
import { UNSCHEDULED_INCIDENT_BEFORE_RESERVATION, UNLOCKED_INCIDENT_RELATED_WITH_RESERVATION } from '../../../constants/enums';
const MemberSummary = props => {
const { loading } = props;
@@ -12,10 +12,10 @@ const MemberSummary = props => {
incidents.forEach((incident) => {
switch (incident.incidentType) {
case UNSCHEDULED_INCIDENT:
case UNSCHEDULED_INCIDENT_BEFORE_RESERVATION:
totalUnscheduledFees += parseFloat(incident.totalChargeFee);
break;
case UNLOCKED_INCIDENT:
case UNLOCKED_INCIDENT_RELATED_WITH_RESERVATION:
totalUnlockedFees += parseFloat(incident.incidentPrice);
break;
default: