@kenyaemr/esm-patient-clinical-view-app 5.4.1-pre.2018 → 5.4.1-pre.2021
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/.turbo/turbo-build.log +34 -34
- package/dist/247.js +1 -1
- package/dist/247.js.map +1 -1
- package/dist/kenyaemr-esm-patient-clinical-view-app.js.buildmanifest.json +7 -7
- package/dist/main.js +1 -1
- package/dist/main.js.map +1 -1
- package/dist/routes.json +1 -1
- package/package.json +1 -1
- package/src/config-schema.ts +1 -1
- package/src/hooks/usePartograph.ts +2 -1
- package/src/index.ts +2 -0
- package/src/maternal-and-child-health/labour-delivery.component.tsx +0 -1
- package/src/maternal-and-child-health/partography/partograph-chart.scss +2 -4
- package/src/maternal-and-child-health/partography/partograph-chart.tsx +146 -123
- package/src/maternal-and-child-health/partography/partograph.component.tsx +4 -2
- package/src/routes.json +16 -6
- package/src/utils/constants.ts +2 -1
package/dist/routes.json
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"$schema":"https://json.openmrs.org/routes.schema.json","backendDependencies":{"kenyaemr":"^19.0.0"},"pages":[],"extensions":[{"name":"clinical-view-section","component":"clinicalViewPatientDashboard","slot":"patient-chart-dashboard-slot"},{"name":"family-history","slot":"patient-chart-family-history-slot","component":"familyHistory","order":0,"online":true,"offline":false},{"name":"other-relationships","slot":"patient-chart-family-history-slot","component":"otherRelationships","order":0,"online":true,"offline":false},{"name":"relationships-link","component":"relationshipsLink","slot":"patient-chart-dashboard-slot","order":14,"meta":{"columns":1,"columnSpan":1,"slot":"patient-chart-relationships-slot","path":"relationships","layoutMode":"anchored"}},{"name":"relationships","slot":"patient-chart-relationships-slot","component":"relationships","order":0,"online":true,"offline":false},{"name":"contact-list-form","component":"contactListForm"},{"name":"maternal-and-child-health-dashboard-group-link","slot":"clinical-view-section","component":"maternalAndChildHealthSideNavGroup"},{"name":"antenatal-care-dashboard-link","component":"antenatalCareLink","slot":"maternal-and-child-health-slot","meta":{"columns":1,"columnSpan":1,"slot":"patient-chart-antenatal-care-dashboard-slot","path":"antenatal-care-dashboard","layoutMode":"anchored"}},{"name":"antenatal-care-dashboard","slot":"patient-chart-antenatal-care-dashboard-slot","component":"antenatalCare"},{"name":"postnatal-care-dashboard-link","component":"postnatalCareLink","slot":"maternal-and-child-health-slot","meta":{"columns":1,"columnSpan":1,"slot":"patient-chart-postnatal-care-dashboard-slot","path":"postnatal-care-dashboard","layoutMode":"anchored"}},{"name":"postnatal-care-dashboard","slot":"patient-chart-postnatal-care-dashboard-slot","component":"postnatalCare"},{"name":"labour-and-delivery-dashboard-link","component":"labourAndDeliveryLink","slot":"maternal-and-child-health-slot","meta":{"
|
|
1
|
+
{"$schema":"https://json.openmrs.org/routes.schema.json","backendDependencies":{"kenyaemr":"^19.0.0"},"pages":[],"extensions":[{"name":"clinical-view-section","component":"clinicalViewPatientDashboard","slot":"patient-chart-dashboard-slot"},{"name":"family-history","slot":"patient-chart-family-history-slot","component":"familyHistory","order":0,"online":true,"offline":false},{"name":"other-relationships","slot":"patient-chart-family-history-slot","component":"otherRelationships","order":0,"online":true,"offline":false},{"name":"relationships-link","component":"relationshipsLink","slot":"patient-chart-dashboard-slot","order":14,"meta":{"columns":1,"columnSpan":1,"slot":"patient-chart-relationships-slot","path":"relationships","layoutMode":"anchored"}},{"name":"relationships","slot":"patient-chart-relationships-slot","component":"relationships","order":0,"online":true,"offline":false},{"name":"contact-list-form","component":"contactListForm"},{"name":"maternal-and-child-health-dashboard-group-link","slot":"clinical-view-section","component":"maternalAndChildHealthSideNavGroup"},{"name":"antenatal-care-dashboard-link","component":"antenatalCareLink","slot":"maternal-and-child-health-slot","meta":{"columns":1,"columnSpan":1,"slot":"patient-chart-antenatal-care-dashboard-slot","path":"antenatal-care-dashboard","layoutMode":"anchored"}},{"name":"antenatal-care-dashboard","slot":"patient-chart-antenatal-care-dashboard-slot","component":"antenatalCare"},{"name":"postnatal-care-dashboard-link","component":"postnatalCareLink","slot":"maternal-and-child-health-slot","meta":{"columns":1,"columnSpan":1,"slot":"patient-chart-postnatal-care-dashboard-slot","path":"postnatal-care-dashboard","layoutMode":"anchored"}},{"name":"postnatal-care-dashboard","slot":"patient-chart-postnatal-care-dashboard-slot","component":"postnatalCare"},{"name":"labour-and-delivery-dashboard-link","component":"labourAndDeliveryLink","slot":"maternal-and-child-health-slot","meta":{"fullWidth":true,"slot":"patient-chart-labour-and-delivery-dashboard-slot","path":"labour-and-delivery-dashboard","layoutMode":"anchored"}},{"name":"labour-and-delivery-dashboard","slot":"patient-chart-labour-and-delivery-dashboard-slot","component":"labourAndDelivery","meta":{"fullWidth":true}},{"name":"hiv-care-and-treatment-dashboard-group-link","slot":"special-clinics-slot","component":"hivCareAndTreatMentSideNavGroup"},{"name":"genericNavLinks","slot":"special-clinics-slot","component":"genericNavLinks","meta":{"columns":1,"columnSpan":1,"slot":"patient-chart-special-clinic-dashboard-slot","path":"special-clinics-dashboard","layoutMode":"anchored"}},{"name":"patient-chart-special-clinic-dashboard-slot","slot":"patient-chart-special-clinic-dashboard-slot","component":"genericDashboard"},{"name":"hts-dashboard-link","component":"htsDashboardLink","slot":"hiv-care-and-treatment-slot","meta":{"columns":1,"columnSpan":1,"slot":"patient-chart-hts-dashboard-slot","path":"hts-dashboard","layoutMode":"anchored"}},{"name":"hts-clinical-view","slot":"patient-chart-hts-dashboard-slot","component":"htsClinicalView","order":2,"online":true,"offline":false},{"name":"defaulter-tracing-dashboard-link","component":"defaulterTracingLink","slot":"hiv-care-and-treatment-slot","meta":{"columns":1,"columnSpan":1,"slot":"patient-chart-defaulter-tracing-dashboard-slot","path":"defaulter-tracing-dashboard","layoutMode":"anchored"}},{"name":"defaulter-tracing-dashboard","slot":"patient-chart-defaulter-tracing-dashboard-slot","component":"defaulterTracing","order":3,"online":true,"offline":false},{"name":"special-clinics-dashboard-group-link","slot":"clinical-view-section","component":"specialClinicsSideNavGroup"},{"name":"clinical-encounter-link","component":"inPatientClinicalEncounterLink","slot":"clinical-view-section","order":40,"meta":{"columns":1,"columnSpan":1,"slot":"patient-chart-clinical-encounter-slot","path":"clinical-encounter","layoutMode":"anchored"}},{"name":"clinical-encounter","slot":"patient-chart-clinical-encounter-slot","component":"inPatientClinicalEncounter","order":0,"online":true,"offline":false},{"component":"caseManagementDashboardLink","name":"case-management-dashboard-link","slot":"homepage-dashboard-slot","meta":{"name":"case-management","title":"Case Management","slot":"case-management-dashboard-slot","path":"/case-management"}},{"name":"in-patient-dashboard-link","component":"inPatientChartLink","slot":"patient-chart-dashboard-slot","order":7,"meta":{"slot":"patient-chart-in-patient-dashboard-slot","path":"in-patient","layoutMode":"anchored","columns":1,"columnSpan":1}},{"name":"in-patient-dashboard","slot":"patient-chart-in-patient-dashboard-slot","component":"inPatientChartDashboard","meta":{"fullWidth":false}},{"name":"wrap-component-view","slot":"case-management-dashboard-slot","component":"wrapComponent","order":2,"online":true,"offline":false},{"name":"case-encounter-link","component":"caseEncounterDashboardLink","slot":"patient-chart-dashboard-slot","order":14,"meta":{"columns":1,"columnSpan":1,"slot":"patient-chart-case-encounter-slot","path":"case-management-encounters","layoutMode":"anchored"}},{"name":"case-encounter-table","slot":"patient-chart-case-encounter-slot","component":"caseEncounterTable","order":0,"online":true,"offline":false},{"component":"peerCalendarDashboardLink","name":"peer-calendar-dashboard-link","slot":"homepage-dashboard-slot","meta":{"name":"peer-calendar","title":"Peer Calendar","slot":"peer-calendar-dashboard-slot","path":"peer-management"}},{"name":"peer-calendar","slot":"peer-calendar-dashboard-slot","component":"peerCalendar","order":0,"online":true,"offline":false},{"name":"deceased-panel-dashboard-link","component":"deceasedPanelDashboardLink","slot":"patient-chart-dashboard-slot","order":15,"meta":{"columns":1,"columnSpan":1,"slot":"patient-chart-deceased-panel-slot","path":"deceased-panel","layoutMode":"anchored"}},{"name":"deceased-details-tabs","slot":"patient-chart-deceased-panel-slot","component":"deceasedDetailsTabs","order":0,"online":true,"offline":false},{"name":"parto-graph-chart","slot":"patient-chart-labour-and-delivery-dashboard-slot","component":"partograph","meta":{"fullWidth":true}}],"modals":[{"name":"birth-date-calculator","component":"birthDateCalculator"},{"name":"relationship-delete-confirm-dialog","component":"relationshipDeleteConfirmialog"},{"name":"end-relationship-dialog","component":"endRelationshipModal"}],"workspaces":[{"name":"case-management-form","component":"caseManagementForm","title":"Case Management Form","type":"form"},{"name":"family-relationship-form","component":"familyRelationshipForm","title":"Family Relationship Form","type":"form"},{"name":"other-relationship-form","component":"otherRelationshipsForm","title":"Other Relationships Form","type":"form"},{"name":"peers-form","component":"peersForm","title":"Add New Peer","type":"form"},{"name":"peer-calendar-form","component":"peerCalendarFormEntry","title":"KVP Peer Educator Outreach Calendar","type":"form","width":"extra-wide","canMaximize":true,"canHide":true},{"name":"relationship-update-form","component":"relationshipUpdateForm","title":"Relationship Update Form","type":"form"},{"name":"other-relationship-form","component":"otherRelationshipsForm","title":"Other Relationships Form","type":"form"},{"name":"end-relationship-form","component":"endRelationshipWorkspace","title":"Discontinue relationship form","type":"form"}],"version":"5.4.1-pre.2021"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@kenyaemr/esm-patient-clinical-view-app",
|
|
3
|
-
"version": "5.4.1-pre.
|
|
3
|
+
"version": "5.4.1-pre.2021",
|
|
4
4
|
"description": "Patient clinical view microfrontend for the OpenMRS SPA",
|
|
5
5
|
"browser": "dist/kenyaemr-esm-patient-clinical-view-app.js",
|
|
6
6
|
"main": "src/index.ts",
|
package/src/config-schema.ts
CHANGED
|
@@ -6,6 +6,7 @@ import {
|
|
|
6
6
|
PartographEncounterFormUuid,
|
|
7
7
|
encounterRepresentation,
|
|
8
8
|
Progress_UUID,
|
|
9
|
+
mchPartoGraphEncounterTypeUuid,
|
|
9
10
|
} from '../utils/constants';
|
|
10
11
|
|
|
11
12
|
export type PartogramProgram = {
|
|
@@ -17,7 +18,7 @@ export type PartogramProgram = {
|
|
|
17
18
|
display: string;
|
|
18
19
|
};
|
|
19
20
|
export function usePartograph(patientUuid: string) {
|
|
20
|
-
const url = `/ws/rest/v1/encounter?s=byEncounterForms&encounterType=${
|
|
21
|
+
const url = `/ws/rest/v1/encounter?s=byEncounterForms&encounterType=${mchPartoGraphEncounterTypeUuid}&formUuid=${PartographEncounterFormUuid}&patient=${patientUuid}&v=${encounterRepresentation}`;
|
|
21
22
|
|
|
22
23
|
const { data, error, isLoading, isValidating, mutate } = useSWR<{ data: { results: OpenmrsEncounter[] } }, Error>(
|
|
23
24
|
url,
|
package/src/index.ts
CHANGED
|
@@ -56,6 +56,7 @@ import DeleteRelationshipConfirmDialog from './relationships/modals/delete-relat
|
|
|
56
56
|
import DeceasedDetailsView from './deceased-panel/tabs/tabs.component';
|
|
57
57
|
import DeceasedPanelDashboardLink from './deceased-panel/dashboard-link/dashboard-link.component';
|
|
58
58
|
import EndRelationshipWorkspace from './case-management/workspace/case-management-workspace.component';
|
|
59
|
+
import Partograph from './maternal-and-child-health/partography/partograph.component';
|
|
59
60
|
|
|
60
61
|
const moduleName = '@kenyaemr/esm-patient-clinical-view-app';
|
|
61
62
|
|
|
@@ -128,6 +129,7 @@ export const maternalAndChildHealthSideNavGroup = getSyncLifecycle(
|
|
|
128
129
|
export const antenatalCare = getSyncLifecycle(AntenatalCare, options);
|
|
129
130
|
export const postnatalCare = getSyncLifecycle(PostnatalCare, options);
|
|
130
131
|
export const labourAndDelivery = getSyncLifecycle(LabourDelivery, options);
|
|
132
|
+
export const partograph = getSyncLifecycle(Partograph, options);
|
|
131
133
|
|
|
132
134
|
// Case Management
|
|
133
135
|
export const caseManagementDashboardLink = getSyncLifecycle(createLeftPanelLink(caseManagementDashboardMeta), options);
|
|
@@ -11,10 +11,7 @@
|
|
|
11
11
|
}
|
|
12
12
|
|
|
13
13
|
.vitalsChartContainer {
|
|
14
|
-
|
|
15
|
-
margin: 0rem spacing.$spacing-05;
|
|
16
|
-
flex-direction: row;
|
|
17
|
-
justify-content: space-between;
|
|
14
|
+
margin-bottom: spacing.$spacing-05;
|
|
18
15
|
}
|
|
19
16
|
|
|
20
17
|
.vitalSignsArea {
|
|
@@ -39,6 +36,7 @@
|
|
|
39
36
|
.vitalsSignLabel {
|
|
40
37
|
@extend .label01;
|
|
41
38
|
margin-bottom: 1rem;
|
|
39
|
+
margin-left: 1.5rem;
|
|
42
40
|
display: inline-block;
|
|
43
41
|
}
|
|
44
42
|
|
|
@@ -1,9 +1,26 @@
|
|
|
1
|
-
import React, { useMemo } from 'react';
|
|
1
|
+
import React, { useMemo, useState } from 'react';
|
|
2
2
|
import { useTranslation } from 'react-i18next';
|
|
3
|
-
import { Tab,
|
|
4
|
-
import styles from './partograph-chart.scss';
|
|
3
|
+
import { Tab, TabsVertical, TabListVertical, TabPanels, TabPanel } from '@carbon/react';
|
|
5
4
|
import { LineChart } from '@carbon/charts-react';
|
|
6
|
-
import
|
|
5
|
+
import styles from './partograph-chart.scss';
|
|
6
|
+
|
|
7
|
+
interface PartographyComponent {
|
|
8
|
+
date: string;
|
|
9
|
+
fetalHeartRate?: number;
|
|
10
|
+
cervicalDilation?: number;
|
|
11
|
+
descentOfHead?: string | number;
|
|
12
|
+
[key: string]: any;
|
|
13
|
+
}
|
|
14
|
+
|
|
15
|
+
interface PartographChartProps {
|
|
16
|
+
partograpyComponents: PartographyComponent[];
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
interface PartographSignOption {
|
|
20
|
+
id: string;
|
|
21
|
+
title: string;
|
|
22
|
+
value: keyof PartographyComponent;
|
|
23
|
+
}
|
|
7
24
|
|
|
8
25
|
enum ScaleTypes {
|
|
9
26
|
TIME = 'time',
|
|
@@ -12,139 +29,145 @@ enum ScaleTypes {
|
|
|
12
29
|
LABELS = 'labels',
|
|
13
30
|
LABELS_RATIO = 'labels-ratio',
|
|
14
31
|
}
|
|
15
|
-
|
|
16
|
-
partograpyComponents: Array<PartograpyComponents>;
|
|
17
|
-
}
|
|
18
|
-
interface PartographyChartData {
|
|
19
|
-
title: string;
|
|
20
|
-
value: string;
|
|
21
|
-
}
|
|
32
|
+
|
|
22
33
|
const PartographChart: React.FC<PartographChartProps> = ({ partograpyComponents }) => {
|
|
23
34
|
const { t } = useTranslation();
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
{
|
|
40
|
-
|
|
41
|
-
title: `Cervical Dilation' ${convertedData[0]?.cervicalDilation?.toString() ?? '-'})`,
|
|
42
|
-
value: 'cervicalDilation',
|
|
43
|
-
},
|
|
44
|
-
{
|
|
45
|
-
id: 'descentOfHead',
|
|
46
|
-
title: `Descent of Head ${convertedData[0]?.descentOfHead?.toString() ?? '-'})`,
|
|
47
|
-
value: 'descentOfHead',
|
|
48
|
-
},
|
|
49
|
-
];
|
|
50
|
-
function parseTodayTime(dateString: string): string | null {
|
|
51
|
-
const dateTimeRegex = /(\d{2}:\d{2} [APMapm]{2})/;
|
|
52
|
-
const match = dateString.match(dateTimeRegex);
|
|
53
|
-
if (match) {
|
|
54
|
-
return match[0];
|
|
55
|
-
} else {
|
|
56
|
-
return null;
|
|
35
|
+
|
|
36
|
+
const processedPartographData = useMemo(() => {
|
|
37
|
+
return partograpyComponents.map((item) => {
|
|
38
|
+
const processedItem = { ...item };
|
|
39
|
+
|
|
40
|
+
if (typeof item.descentOfHead === 'string' && item.descentOfHead.includes('/')) {
|
|
41
|
+
const [numerator, denominator] = item.descentOfHead.split('/').map(Number);
|
|
42
|
+
processedItem.descentOfHead = denominator !== 0 ? (numerator / denominator) * 10 : 10;
|
|
43
|
+
}
|
|
44
|
+
|
|
45
|
+
return processedItem;
|
|
46
|
+
});
|
|
47
|
+
}, [partograpyComponents]);
|
|
48
|
+
|
|
49
|
+
const getFormattedValue = (value: any): string => {
|
|
50
|
+
if (value === undefined || value === null) {
|
|
51
|
+
return '-';
|
|
57
52
|
}
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
return {
|
|
77
|
-
group: selectedPartographSign.title,
|
|
78
|
-
key: parseTodayTime(partoData.date.toString()),
|
|
79
|
-
value: partoData[selectedPartographSign.value],
|
|
80
|
-
date: partoData.date,
|
|
81
|
-
};
|
|
82
|
-
}
|
|
83
|
-
}
|
|
84
|
-
});
|
|
85
|
-
}, [partograpyComponents, selectedPartographSign]);
|
|
86
|
-
const chartOptions = {
|
|
87
|
-
axes: {
|
|
88
|
-
bottom: {
|
|
89
|
-
title: 'Time',
|
|
90
|
-
mapsTo: 'key',
|
|
91
|
-
scaleType: ScaleTypes.LABELS,
|
|
53
|
+
return value.toString();
|
|
54
|
+
};
|
|
55
|
+
|
|
56
|
+
const partographSignOptions = useMemo<PartographSignOption[]>(() => {
|
|
57
|
+
const firstValidItem = processedPartographData.find(
|
|
58
|
+
(item) =>
|
|
59
|
+
item.fetalHeartRate !== undefined || item.cervicalDilation !== undefined || item.descentOfHead !== undefined,
|
|
60
|
+
);
|
|
61
|
+
|
|
62
|
+
const fetalHeartRate = firstValidItem?.fetalHeartRate;
|
|
63
|
+
const cervicalDilation = firstValidItem?.cervicalDilation;
|
|
64
|
+
const descentOfHead = firstValidItem?.descentOfHead;
|
|
65
|
+
|
|
66
|
+
return [
|
|
67
|
+
{
|
|
68
|
+
id: 'fetalHeartRate',
|
|
69
|
+
title: `Heart Rate (${getFormattedValue(fetalHeartRate)})`,
|
|
70
|
+
value: 'fetalHeartRate',
|
|
92
71
|
},
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
title:
|
|
96
|
-
|
|
97
|
-
|
|
72
|
+
{
|
|
73
|
+
id: 'cervicalDilation',
|
|
74
|
+
title: `Cervical Dilation (${getFormattedValue(cervicalDilation)})`,
|
|
75
|
+
value: 'cervicalDilation',
|
|
76
|
+
},
|
|
77
|
+
{
|
|
78
|
+
id: 'descentOfHead',
|
|
79
|
+
title: `Descent of Head (${getFormattedValue(descentOfHead)})`,
|
|
80
|
+
value: 'descentOfHead',
|
|
81
|
+
},
|
|
82
|
+
];
|
|
83
|
+
}, [processedPartographData]);
|
|
84
|
+
|
|
85
|
+
const [selectedPartographSign, setSelectedPartographSign] = useState<PartographSignOption>(partographSignOptions[0]);
|
|
86
|
+
|
|
87
|
+
const chartData = useMemo(() => {
|
|
88
|
+
if (!processedPartographData.length) {
|
|
89
|
+
return [];
|
|
90
|
+
}
|
|
91
|
+
|
|
92
|
+
return processedPartographData
|
|
93
|
+
.filter((item) => item[selectedPartographSign.value] !== undefined)
|
|
94
|
+
.slice(0, 10)
|
|
95
|
+
.sort((a, b) => new Date(a.date).getTime() - new Date(b.date).getTime())
|
|
96
|
+
.map((item) => ({
|
|
97
|
+
group: selectedPartographSign.title,
|
|
98
|
+
value: item[selectedPartographSign.value],
|
|
99
|
+
date: item.date,
|
|
100
|
+
}));
|
|
101
|
+
}, [processedPartographData, selectedPartographSign]);
|
|
102
|
+
|
|
103
|
+
const chartOptions = useMemo(
|
|
104
|
+
() => ({
|
|
105
|
+
title: t('partoGraphtChartTitle', 'PartoGraph Chart'),
|
|
106
|
+
axes: {
|
|
107
|
+
bottom: {
|
|
108
|
+
title: t('time', 'Time'),
|
|
109
|
+
mapsTo: 'date',
|
|
110
|
+
scaleType: ScaleTypes.TIME,
|
|
111
|
+
},
|
|
112
|
+
left: {
|
|
113
|
+
mapsTo: 'value',
|
|
114
|
+
title: selectedPartographSign.title,
|
|
115
|
+
scaleType: ScaleTypes.LINEAR,
|
|
116
|
+
includeZero: false,
|
|
117
|
+
},
|
|
98
118
|
},
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
119
|
+
curve: 'curveMonotoneX',
|
|
120
|
+
height: '400px',
|
|
121
|
+
tooltip: {
|
|
122
|
+
customHTML: ([{ value, group }]: any) => `
|
|
123
|
+
<div class="cds--tooltip cds--tooltip--shown" style="min-width: max-content; font-weight:600">
|
|
124
|
+
${value} - ${String(group).toUpperCase()}
|
|
125
|
+
<span style="color: #c6c6c6; font-size: 1rem; font-weight:600">${group}</span>
|
|
126
|
+
</div>
|
|
127
|
+
`,
|
|
106
128
|
},
|
|
107
|
-
},
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
<span style="color: #c6c6c6; font-size: 1rem; font-weight:600">${key}</span></div>`,
|
|
114
|
-
},
|
|
115
|
-
height: '400px',
|
|
129
|
+
}),
|
|
130
|
+
[t, selectedPartographSign.title],
|
|
131
|
+
);
|
|
132
|
+
|
|
133
|
+
const handleTabSelect = (option: PartographSignOption) => {
|
|
134
|
+
setSelectedPartographSign(option);
|
|
116
135
|
};
|
|
117
136
|
|
|
137
|
+
React.useEffect(() => {
|
|
138
|
+
const currentOption = partographSignOptions.find((option) => option.id === selectedPartographSign.id);
|
|
139
|
+
// Update to the new option or default to the first option
|
|
140
|
+
setSelectedPartographSign(currentOption || partographSignOptions[0]);
|
|
141
|
+
}, [partographSignOptions]);
|
|
142
|
+
|
|
118
143
|
return (
|
|
119
144
|
<div className={styles.vitalsChartContainer}>
|
|
120
145
|
<div className={styles.partographSignsArea}>
|
|
121
146
|
<label className={styles.vitalsSignLabel} htmlFor="partography-chart-tab-group">
|
|
122
147
|
{t('partographyDisplay', 'Partography Displayed')}
|
|
123
148
|
</label>
|
|
124
|
-
<
|
|
125
|
-
<
|
|
126
|
-
{
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
<div className={styles.vitalsChartArea}>
|
|
147
|
-
<LineChart data={chartData.flat()} options={chartOptions} />
|
|
149
|
+
<TabsVertical height="">
|
|
150
|
+
<TabListVertical>
|
|
151
|
+
{partographSignOptions.map((option) => (
|
|
152
|
+
<Tab
|
|
153
|
+
key={option.id}
|
|
154
|
+
className={`${styles.tab} ${styles.bodyLong01} ${
|
|
155
|
+
selectedPartographSign.id === option.id ? styles.selectedTab : ''
|
|
156
|
+
}`}
|
|
157
|
+
onClick={() => handleTabSelect(option)}>
|
|
158
|
+
{option.title}
|
|
159
|
+
</Tab>
|
|
160
|
+
))}
|
|
161
|
+
</TabListVertical>
|
|
162
|
+
|
|
163
|
+
<TabPanels>
|
|
164
|
+
{partographSignOptions.map(({ id, title, value }) => (
|
|
165
|
+
<TabPanel key={id}>
|
|
166
|
+
<LineChart data={chartData.flat()} options={chartOptions} />
|
|
167
|
+
</TabPanel>
|
|
168
|
+
))}
|
|
169
|
+
</TabPanels>
|
|
170
|
+
</TabsVertical>
|
|
148
171
|
</div>
|
|
149
172
|
</div>
|
|
150
173
|
);
|
|
@@ -89,6 +89,7 @@ const Partograph: React.FC<PartographyProps> = ({ patientUuid }) => {
|
|
|
89
89
|
contractionDuration: '--', // TODO: get from obsGroup 163750AAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
|
|
90
90
|
};
|
|
91
91
|
}) ?? [];
|
|
92
|
+
|
|
92
93
|
const chartData =
|
|
93
94
|
encounters.map((encounter) => {
|
|
94
95
|
const groupMembers = encounter.groupMembers;
|
|
@@ -99,12 +100,13 @@ const Partograph: React.FC<PartographyProps> = ({ patientUuid }) => {
|
|
|
99
100
|
});
|
|
100
101
|
return {
|
|
101
102
|
id: `${encounter.uuid}`,
|
|
102
|
-
date:
|
|
103
|
+
date: encounter.obsDatetime,
|
|
103
104
|
fetalHeartRate: groupmembersObj[FetalHeartRate],
|
|
104
105
|
cervicalDilation: groupmembersObj[CervicalDilation],
|
|
105
106
|
descentOfHead: descentOfHeadObj[groupmembersObj[SurgicalProcedure]],
|
|
106
107
|
};
|
|
107
108
|
}) ?? [];
|
|
109
|
+
|
|
108
110
|
const handleAddHistory = () => {
|
|
109
111
|
launchPatientWorkspace('patient-form-entry-workspace', {
|
|
110
112
|
workspaceTitle: headerTitle,
|
|
@@ -114,7 +116,6 @@ const Partograph: React.FC<PartographyProps> = ({ patientUuid }) => {
|
|
|
114
116
|
formInfo: {
|
|
115
117
|
encounterUuid: '',
|
|
116
118
|
formUuid: PartographEncounterFormUuid,
|
|
117
|
-
additionalProps: {} ?? {},
|
|
118
119
|
},
|
|
119
120
|
});
|
|
120
121
|
};
|
|
@@ -178,6 +179,7 @@ const Partograph: React.FC<PartographyProps> = ({ patientUuid }) => {
|
|
|
178
179
|
|
|
179
180
|
<Button
|
|
180
181
|
kind="ghost"
|
|
182
|
+
onClick={handleAddHistory}
|
|
181
183
|
renderIcon={(props) => <Add {...props} size={16} />}
|
|
182
184
|
iconDescription="Add vitals">
|
|
183
185
|
{t('add', 'Add')}
|
package/src/routes.json
CHANGED
|
@@ -95,8 +95,7 @@
|
|
|
95
95
|
"component": "labourAndDeliveryLink",
|
|
96
96
|
"slot": "maternal-and-child-health-slot",
|
|
97
97
|
"meta": {
|
|
98
|
-
"
|
|
99
|
-
"columnSpan": 1,
|
|
98
|
+
"fullWidth": true,
|
|
100
99
|
"slot": "patient-chart-labour-and-delivery-dashboard-slot",
|
|
101
100
|
"path": "labour-and-delivery-dashboard",
|
|
102
101
|
"layoutMode": "anchored"
|
|
@@ -105,7 +104,10 @@
|
|
|
105
104
|
{
|
|
106
105
|
"name": "labour-and-delivery-dashboard",
|
|
107
106
|
"slot": "patient-chart-labour-and-delivery-dashboard-slot",
|
|
108
|
-
"component": "labourAndDelivery"
|
|
107
|
+
"component": "labourAndDelivery",
|
|
108
|
+
"meta": {
|
|
109
|
+
"fullWidth": true
|
|
110
|
+
}
|
|
109
111
|
},
|
|
110
112
|
{
|
|
111
113
|
"name": "hiv-care-and-treatment-dashboard-group-link",
|
|
@@ -275,7 +277,7 @@
|
|
|
275
277
|
"online": true,
|
|
276
278
|
"offline": false
|
|
277
279
|
},
|
|
278
|
-
|
|
280
|
+
{
|
|
279
281
|
"name": "deceased-panel-dashboard-link",
|
|
280
282
|
"component": "deceasedPanelDashboardLink",
|
|
281
283
|
"slot": "patient-chart-dashboard-slot",
|
|
@@ -295,6 +297,14 @@
|
|
|
295
297
|
"order": 0,
|
|
296
298
|
"online": true,
|
|
297
299
|
"offline": false
|
|
300
|
+
},
|
|
301
|
+
{
|
|
302
|
+
"name": "parto-graph-chart",
|
|
303
|
+
"slot": "patient-chart-labour-and-delivery-dashboard-slot",
|
|
304
|
+
"component": "partograph",
|
|
305
|
+
"meta": {
|
|
306
|
+
"fullWidth": true
|
|
307
|
+
}
|
|
298
308
|
}
|
|
299
309
|
],
|
|
300
310
|
"modals": [
|
|
@@ -357,11 +367,11 @@
|
|
|
357
367
|
"title": "Other Relationships Form",
|
|
358
368
|
"type": "form"
|
|
359
369
|
},
|
|
360
|
-
|
|
370
|
+
{
|
|
361
371
|
"name": "end-relationship-form",
|
|
362
372
|
"component": "endRelationshipWorkspace",
|
|
363
373
|
"title": "Discontinue relationship form",
|
|
364
374
|
"type": "form"
|
|
365
375
|
}
|
|
366
376
|
]
|
|
367
|
-
}
|
|
377
|
+
}
|
package/src/utils/constants.ts
CHANGED
|
@@ -24,12 +24,13 @@ export const TracingOutcome_UUID = '160433AAAAAAAAAAAAAAAAAAAAAAAAAAAAAA';
|
|
|
24
24
|
export const PatientTracingEncounterType_UUID = '1495edf8-2df2-11e9-b210-d663bd873d93';
|
|
25
25
|
|
|
26
26
|
export const ClinicalEncounterFormUuid = 'e958f902-64df-4819-afd4-7fb061f59308';
|
|
27
|
-
export const PartographEncounterFormUuid = '
|
|
27
|
+
export const PartographEncounterFormUuid = '3791e5b7-2cdc-44fc-982b-a81135367c96';
|
|
28
28
|
export const AdmissionDate_UUID = '1640AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA';
|
|
29
29
|
export const PriorityOfAdmission_UUID = '1655AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA';
|
|
30
30
|
// export const AdmittingDoctor_UUID= '';
|
|
31
31
|
export const AdmissionWard_UUID = '5fc29316-0869-4b3b-ae2f-cc37c6014eb7';
|
|
32
32
|
export const MchEncounterType_UUID = 'c6d09e05-1f25-4164-8860-9f32c5a02df0';
|
|
33
|
+
export const mchPartoGraphEncounterTypeUuid = '022d62af-e2a5-4282-953b-52dd5cba3296';
|
|
33
34
|
export const Alcohol_Use_UUID = '159449AAAAAAAAAAAAAAAAAAAAAAAAAAAAAA';
|
|
34
35
|
export const Alcohol_Use_Duration_UUID = '1546AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA';
|
|
35
36
|
export const Smoking_UUID = '163201AAAAAAAAAAAAAAAAAAAAAAAAAAAAAA';
|