@ampath/esm-reports-app 1.0.0-next.76 → 1.0.0-next.78

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.
@@ -1,4 +1,4 @@
1
- import React from 'react';
1
+ import React, { useState } from 'react';
2
2
 
3
3
  import styles from './moh-510.scss';
4
4
  import { useSearchParams } from 'react-router-dom';
@@ -7,14 +7,27 @@ import { getMoh510PatientList } from '../../../../resources/moh-710.resource';
7
7
  import { moh510ExportColumns } from './moh-510.columns';
8
8
  import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from '@carbon/react';
9
9
  import classNames from 'classnames';
10
+ import dayjs from 'dayjs';
11
+ import { useSession } from '@openmrs/esm-framework';
12
+ import { ReportFiltersComponent, type ReportPeriod } from '../../../../common/report-filters';
10
13
 
11
14
  interface Moh510RegisterComponentProps {}
12
15
 
13
16
  const Moh510RegisterComponent: React.FC<Moh510RegisterComponentProps> = () => {
14
- const [searchParams] = useSearchParams();
15
- const startDate = searchParams.get('startDate');
16
- const endDate = searchParams.get('endDate');
17
- const locationUuids = searchParams.get('locationUuids');
17
+ const [searchParams, setSearchParams] = useSearchParams();
18
+ const session = useSession();
19
+ const from = searchParams.get('from');
20
+ const isDrilldown = Boolean(from);
21
+ const [generatedPeriod, setGeneratedPeriod] = useState<{ startDate: string; endDate: string } | null>(() => {
22
+ const startDate = searchParams.get('startDate');
23
+ const endDate = searchParams.get('endDate');
24
+ return !isDrilldown && startDate && endDate ? { startDate, endDate } : null;
25
+ });
26
+ const isGenerated = isDrilldown || Boolean(generatedPeriod);
27
+
28
+ const startDate = generatedPeriod?.startDate ?? searchParams.get('startDate');
29
+ const endDate = generatedPeriod?.endDate ?? searchParams.get('endDate');
30
+ const locationUuids = searchParams.get('locationUuids') ?? session?.sessionLocation?.uuid ?? '';
18
31
  const indicator = searchParams.get('indicator');
19
32
 
20
33
  const {
@@ -27,115 +40,151 @@ const Moh510RegisterComponent: React.FC<Moh510RegisterComponentProps> = () => {
27
40
  onPageChange,
28
41
  fetchAll,
29
42
  } = usePatientList(
30
- ({ startIndex, limit }) =>
31
- getMoh510PatientList({
32
- startDate: startDate!,
33
- endDate: endDate!,
34
- locationUuids: locationUuids!,
35
- indicator: indicator!,
43
+ ({ startIndex, limit }) => {
44
+ if (!isDrilldown && !generatedPeriod) {
45
+ return Promise.resolve({ results: [], total: 0, isTotalExact: true });
46
+ }
47
+
48
+ return getMoh510PatientList({
49
+ startDate,
50
+ endDate,
51
+ locationUuids,
52
+ indicator,
36
53
  startIndex,
37
54
  limit,
38
- }),
39
- [startDate, endDate, locationUuids, indicator],
55
+ });
56
+ },
57
+ [startDate, endDate, locationUuids, indicator, isDrilldown, generatedPeriod],
40
58
  );
59
+
60
+ const generate = ({ startDate, endDate }: ReportPeriod) => {
61
+ setGeneratedPeriod({ startDate, endDate });
62
+ setSearchParams((currentParams) => {
63
+ const nextParams = new URLSearchParams(currentParams);
64
+ nextParams.set('startDate', startDate);
65
+ nextParams.set('endDate', endDate);
66
+ if (!nextParams.has('locationUuids') && locationUuids) {
67
+ nextParams.set('locationUuids', locationUuids);
68
+ }
69
+ return nextParams;
70
+ });
71
+ };
72
+
41
73
  return (
42
- <RegisterLayout
43
- parentLabel="MOH-710 Report"
44
- parentPath="/moh-710"
45
- title="MOH-510 Register"
46
- isLoading={isLoading}
47
- isEmpty={patientlist.length === 0}
48
- page={page}
49
- pageSize={pageSize}
50
- total={total}
51
- isTotalExact={isTotalExact}
52
- onPageChange={onPageChange}
53
- fetchAll={fetchAll}
54
- columns={moh510ExportColumns}
55
- >
56
- <div className={styles.tableContainer}>
57
- <Table className={classNames(`${styles.table}`, `${styles.tableBordered}`, `${styles.tableStriped}`)}>
58
- <TableHead>
59
- <TableRow>
60
- <TableHeader>Date (DD/MM/YYYY)</TableHeader>
61
- <TableHeader>Serial Number</TableHeader>
62
- <TableHeader>Child's Number</TableHeader>
63
- <TableHeader>Child's Names</TableHeader>
64
- <TableHeader>Sex</TableHeader>
65
- <TableHeader>Date of Birth</TableHeader>
66
- <TableHeader>Date first Seen</TableHeader>
67
- <TableHeader>Father's Full Names/Guardian</TableHeader>
68
- <TableHeader>Mother's Full Names/Guardian</TableHeader>
69
- <TableHeader>Village /Estate / Landmark</TableHeader>
70
- <TableHeader>Telephone No.</TableHeader>
71
- <TableHeader>BCG</TableHeader>
72
- <TableHeader>Polio birth Dose</TableHeader>
73
- <TableHeader>OPV 1</TableHeader>
74
- <TableHeader>OPV 2</TableHeader>
75
- <TableHeader>OPV 3</TableHeader>
76
- <TableHeader>IPV</TableHeader>
77
- <TableHeader>DPT / Hep.B / Hib.1</TableHeader>
78
- <TableHeader>DPT / Hep.B / Hib.2</TableHeader>
79
- <TableHeader>DPT / Hep.B / Hib.3</TableHeader>
80
- <TableHeader>PCV 10 (Pneumococcal) 1</TableHeader>
81
- <TableHeader>PCV 10 (Pneumococcal) 2</TableHeader>
82
- <TableHeader>PCV 10 (Pneumococcal) 3</TableHeader>
83
- <TableHeader>Rota1</TableHeader>
84
- <TableHeader>Rota2</TableHeader>
85
- <TableHeader>Vitamin A(6-11 months)</TableHeader>
86
- <TableHeader>MR1</TableHeader>
87
- <TableHeader>Yellow Fever</TableHeader>
88
- <TableHeader>Fully Immunized Child</TableHeader>
89
- <TableHeader>MR2</TableHeader>
90
- <TableHeader>Remarks</TableHeader>
91
- </TableRow>
92
- </TableHead>
93
- <TableBody>
94
- {patientlist?.length > 0 ? (
95
- patientlist?.map((patient, i) => (
96
- <TableRow key={patient.person_id || patient.id}>
97
- <TableCell>{patient.encounter_datetime}</TableCell>
98
- <TableCell>{i + 1}</TableCell>
99
- <TableCell>{patient.child_number}</TableCell>
100
- <TableCell>{patient.child_names}</TableCell>
101
- <TableCell>{patient.sex}</TableCell>
102
- <TableCell>{patient.date_of_birth}</TableCell>
103
- <TableCell>{patient.date_first_seen}</TableCell>
104
- <TableCell>{patient.father_names}</TableCell>
105
- <TableCell>{patient.mother_names}</TableCell>
106
- <TableCell>{patient.village_estate_landmark}</TableCell>
107
- <TableCell>{patient.phone_number}</TableCell>
108
- <TableCell>{patient.bcg_encounter_datetime}</TableCell>
109
- <TableCell>{patient.polio_birth_dose_encounter_datetime}</TableCell>
110
- <TableCell>{patient.opv_1_encounter_datetime}</TableCell>
111
- <TableCell>{patient.opv_2_encounter_datetime}</TableCell>
112
- <TableCell>{patient.opv_3_encounter_datetime}</TableCell>
113
- <TableCell>{patient.ipv_encounter_datetime}</TableCell>
114
- <TableCell>{patient.dpt_hep_1_encounter_datetime}</TableCell>
115
- <TableCell>{patient.dpt_hep_2_encounter_datetime}</TableCell>
116
- <TableCell>{patient.dpt_hep_3_encounter_datetime}</TableCell>
117
- <TableCell>{patient.pneumococcal_1_encounter_datetime}</TableCell>
118
- <TableCell>{patient.pneumococcal_2_encounter_datetime}</TableCell>
119
- <TableCell>{patient.pneumococcal_3_encounter_datetime}</TableCell>
120
- <TableCell>{patient.rotavirus_1_encounter_datetime}</TableCell>
121
- <TableCell>{patient.rotavirus_2_encounter_datetime}</TableCell>
122
- <TableCell>{patient.vitamin_a_6_11_months_encounter_datetime}</TableCell>
123
- <TableCell>{patient.measles_rubella_1_encounter_datetime}</TableCell>
124
- <TableCell>{patient.yellow_fever_encounter_datetime}</TableCell>
125
- <TableCell>{patient.fully_immunized_child_encounter_datetime}</TableCell>
126
- <TableCell>{patient.measles_rubella_2_encounter_datetime}</TableCell>
127
- <TableCell>{patient.remarks}</TableCell>
74
+ <>
75
+ {!isDrilldown && (
76
+ <ReportFiltersComponent
77
+ reportName="MOH-510 Register"
78
+ mode="range"
79
+ onGenerate={generate}
80
+ isLoading={isLoading}
81
+ isReportGenerated={Boolean(generatedPeriod)}
82
+ generatedPeriod={generatedPeriod ?? undefined}
83
+ backLink={{ label: 'All registers', to: '/?tab=registers' }}
84
+ />
85
+ )}
86
+ <RegisterLayout
87
+ parentLabel={isDrilldown ? 'MOH-710 Report' : 'All registers'}
88
+ parentPath={isDrilldown ? '/moh-710' : '/?tab=registers'}
89
+ title="MOH-510 Register"
90
+ isLoading={isLoading}
91
+ isEmpty={isGenerated && patientlist.length === 0}
92
+ page={page}
93
+ pageSize={pageSize}
94
+ total={total}
95
+ isTotalExact={isTotalExact}
96
+ onPageChange={onPageChange}
97
+ fetchAll={isGenerated ? fetchAll : undefined}
98
+ columns={moh510ExportColumns}
99
+ >
100
+ {isGenerated && (
101
+ <div className={styles.tableContainer}>
102
+ <Table className={classNames(`${styles.table}`, `${styles.tableBordered}`, `${styles.tableStriped}`)}>
103
+ <TableHead>
104
+ <TableRow>
105
+ <TableHeader>Date (DD/MM/YYYY)</TableHeader>
106
+ <TableHeader>Serial Number</TableHeader>
107
+ <TableHeader>Child's Number</TableHeader>
108
+ <TableHeader>Child's Names</TableHeader>
109
+ <TableHeader>Sex</TableHeader>
110
+ <TableHeader>Date of Birth</TableHeader>
111
+ <TableHeader>Date first Seen</TableHeader>
112
+ <TableHeader>Father's Full Names/Guardian</TableHeader>
113
+ <TableHeader>Mother's Full Names/Guardian</TableHeader>
114
+ <TableHeader>Village /Estate / Landmark</TableHeader>
115
+ <TableHeader>Telephone No.</TableHeader>
116
+ <TableHeader>BCG</TableHeader>
117
+ <TableHeader>Polio birth Dose</TableHeader>
118
+ <TableHeader>OPV 1</TableHeader>
119
+ <TableHeader>OPV 2</TableHeader>
120
+ <TableHeader>OPV 3</TableHeader>
121
+ <TableHeader>IPV</TableHeader>
122
+ <TableHeader>DPT / Hep.B / Hib.1</TableHeader>
123
+ <TableHeader>DPT / Hep.B / Hib.2</TableHeader>
124
+ <TableHeader>DPT / Hep.B / Hib.3</TableHeader>
125
+ <TableHeader>PCV 10 (Pneumococcal) 1</TableHeader>
126
+ <TableHeader>PCV 10 (Pneumococcal) 2</TableHeader>
127
+ <TableHeader>PCV 10 (Pneumococcal) 3</TableHeader>
128
+ <TableHeader>Rota1</TableHeader>
129
+ <TableHeader>Rota2</TableHeader>
130
+ <TableHeader>Vitamin A(6-11 months)</TableHeader>
131
+ <TableHeader>MR1</TableHeader>
132
+ <TableHeader>Yellow Fever</TableHeader>
133
+ <TableHeader>Fully Immunized Child</TableHeader>
134
+ <TableHeader>MR2</TableHeader>
135
+ <TableHeader>Remarks</TableHeader>
128
136
  </TableRow>
129
- ))
130
- ) : (
131
- <TableRow>
132
- <TableCell colSpan={28}>No data available</TableCell>
133
- </TableRow>
134
- )}
135
- </TableBody>
136
- </Table>
137
- </div>
138
- </RegisterLayout>
137
+ </TableHead>
138
+ <TableBody>
139
+ {patientlist?.length > 0 ? (
140
+ patientlist?.map((patient, i) => (
141
+ <TableRow key={patient.person_id || patient.id}>
142
+ <TableCell>
143
+ {patient.date ? dayjs(patient.encounter_datetime).format('YYYY-MM-DD') : ''}
144
+ </TableCell>
145
+ <TableCell>{i + 1}</TableCell>
146
+ <TableCell>{patient.child_number}</TableCell>
147
+ <TableCell>{patient.child_names}</TableCell>
148
+ <TableCell>{patient.sex}</TableCell>
149
+ <TableCell>{patient.date_of_birth}</TableCell>
150
+ <TableCell>{patient.date_first_seen}</TableCell>
151
+ <TableCell>{patient.father_names}</TableCell>
152
+ <TableCell>{patient.mother_names}</TableCell>
153
+ <TableCell>{patient.village_estate_landmark}</TableCell>
154
+ <TableCell>{patient.phone_number}</TableCell>
155
+ <TableCell>{patient.bcg_encounter_datetime}</TableCell>
156
+ <TableCell>{patient.polio_birth_dose_encounter_datetime}</TableCell>
157
+ <TableCell>{patient.opv_1_encounter_datetime}</TableCell>
158
+ <TableCell>{patient.opv_2_encounter_datetime}</TableCell>
159
+ <TableCell>{patient.opv_3_encounter_datetime}</TableCell>
160
+ <TableCell>{patient.ipv_encounter_datetime}</TableCell>
161
+ <TableCell>{patient.dpt_hep_1_encounter_datetime}</TableCell>
162
+ <TableCell>{patient.dpt_hep_2_encounter_datetime}</TableCell>
163
+ <TableCell>{patient.dpt_hep_3_encounter_datetime}</TableCell>
164
+ <TableCell>{patient.pneumococcal_1_encounter_datetime}</TableCell>
165
+ <TableCell>{patient.pneumococcal_2_encounter_datetime}</TableCell>
166
+ <TableCell>{patient.pneumococcal_3_encounter_datetime}</TableCell>
167
+ <TableCell>{patient.rotavirus_1_encounter_datetime}</TableCell>
168
+ <TableCell>{patient.rotavirus_2_encounter_datetime}</TableCell>
169
+ <TableCell>{patient.vitamin_a_6_11_months_encounter_datetime}</TableCell>
170
+ <TableCell>{patient.measles_rubella_1_encounter_datetime}</TableCell>
171
+ <TableCell>{patient.yellow_fever_encounter_datetime}</TableCell>
172
+ <TableCell>{patient.fully_immunized_child_encounter_datetime}</TableCell>
173
+ <TableCell>{patient.measles_rubella_2_encounter_datetime}</TableCell>
174
+ <TableCell>{patient.remarks}</TableCell>
175
+ </TableRow>
176
+ ))
177
+ ) : (
178
+ <TableRow>
179
+ <TableCell colSpan={28}>No data available</TableCell>
180
+ </TableRow>
181
+ )}
182
+ </TableBody>
183
+ </Table>
184
+ </div>
185
+ )}
186
+ </RegisterLayout>
187
+ </>
139
188
  );
140
189
  };
141
190
 
@@ -168,7 +168,12 @@ const Moh711Report: React.FC = () => {
168
168
  locationUuids={locationUuid!}
169
169
  />
170
170
  <PostAbortion moh711Data={moh711Data} />
171
- <ChanisComponent moh711Data={moh711Data} />
171
+ <ChanisComponent
172
+ moh711Data={moh711Data}
173
+ startDate={startDate}
174
+ endDate={endDate}
175
+ locationUuids={locationUuid!}
176
+ />
172
177
  <PhysiotherapyComponent moh711Data={moh711Data} />
173
178
  <OtherComponent moh711Data={MaternityComponent} />
174
179
  <TBScreeningComponent