@ampath/esm-reports-app 1.0.0-next.8 → 1.0.0-next.80

package/src/reports/moh-706/moh-706.component.tsx

@@ -1,26 +1,152 @@
-import React from "react";
-import UrineAnalysis from "./sub-reports/urine-analysis/urine-analysis.component";
-import BloodChemistry from "./sub-reports/blood-chemistry/blood-chemistry.component";
-import Parasitology from "./sub-reports/parasitology/parasitology.component";
-import Haematology from "./sub-reports/haematology/haematology.component";
-import Bacteriology from "./sub-reports/bacteriology/bacteriology.component";
-import HistologyAndCytology from "./sub-reports/histology-and-cytology/histology-and-cytology.component";
-import Serology from "./sub-reports/serology/serology.component";
-import SpecimenReferralToHigherLevels from "./sub-reports/specimen-referral-to-higher-levels/specimen-referral-to-higher-levels.component";
-import DrugSusceptibilityTesting from "./sub-reports/drug-susceptibility-testing/drug-susceptibility-testing.component";
+import React, { useEffect, useState } from 'react';
+import { formatDate, useSession } from '@openmrs/esm-framework';
+import { Column, Grid } from '@carbon/react';
+import UrineAnalysis from './sub-reports/urine-analysis/urine-analysis.component';
+import BloodChemistry from './sub-reports/blood-chemistry/blood-chemistry.component';
+import Parasitology from './sub-reports/parasitology/parasitology.component';
+import Haematology from './sub-reports/haematology/haematology.component';
+import Bacteriology from './sub-reports/bacteriology/bacteriology.component';
+import HistologyAndCytology from './sub-reports/histology-and-cytology/histology-and-cytology.component';
+import Serology from './sub-reports/serology/serology.component';
+import SpecimenReferralToHigherLevels from './sub-reports/specimen-referral-to-higher-levels/specimen-referral-to-higher-levels.component';
+import DrugSusceptibilityTesting from './sub-reports/drug-susceptibility-testing/drug-susceptibility-testing.component';
+import { ReportFiltersComponent, type ReportPeriod } from '../../common/report-filters';
+import { showReportError } from '../../common/report-error';
+import { hasReportData, ReportPlaceholder, useGeneratedLocation } from '../../common/report-placeholder';
+import { getMoh706 } from '../../resources/moh-706.resource';
+import styles from './moh-706.scss';
+import MOH706Header from './moh-706-header.component';
+import { useSearchParams } from 'react-router-dom';
+import { ReportSkeleton } from '../../common/report-skeleton';
+import { ReportPage } from '../../common/report-page';
 
 const MoH706Report: React.FC = () => {
-    return <>
-        <UrineAnalysis />
-        <BloodChemistry />
-        <Parasitology />
-        <Haematology />
-        <Bacteriology />
-        <HistologyAndCytology />
-        <Serology />
-        <SpecimenReferralToHigherLevels />
-        <DrugSusceptibilityTesting />
-    </>;
-}
-
-export default MoH706Report;
+  const [moh706Data, setMoh706Data] = useState<any>({});
+  /* Only a report for the current location counts: after switching location the
+     old figures would otherwise be shown, and labelled, as the new location's. */
+  const { isForCurrentLocation, hasLocationChanged, markGenerated } = useGeneratedLocation();
+  const isReportGenerated = hasReportData(moh706Data) && isForCurrentLocation;
+  const [isLoading, setIsLoading] = useState<boolean>(false);
+  const [filters, setFilters] = useState<{ locationUuids?: string; startDate?: string; endDate?: string }>({});
+
+  const session = useSession();
+  const locationUuids = session?.sessionLocation?.uuid;
+
+  /* Masthead and sign-off fill themselves in, as on the other reports */
+  const facility = session?.sessionLocation?.display ?? '';
+  const compiledBy = session?.user?.person?.display ?? session?.user?.display ?? '';
+  const compiledOn = formatDate(new Date(), { mode: 'standard', time: false, noToday: true });
+
+  const [searchParams] = useSearchParams();
+
+  useEffect(() => {
+    const startDate = searchParams.get('startDate');
+    const endDate = searchParams.get('endDate');
+
+    if (startDate && endDate) {
+      setFilters({ locationUuids, startDate, endDate });
+      fetchMoh706Data({ startDate, endDate });
+    }
+  }, [searchParams]);
+
+  const fetchMoh706Data = async ({ startDate, endDate }: Pick<ReportPeriod, 'startDate' | 'endDate'>) => {
+    setIsLoading(true);
+
+    const params = {
+      locationUuids: locationUuids || '',
+      startDate,
+      endDate,
+    };
+
+    try {
+      const result = await getMoh706(params);
+      const flatData = Object.assign({}, ...result);
+      setMoh706Data(flatData);
+      markGenerated(params.locationUuids);
+      setFilters({ locationUuids: params.locationUuids, startDate, endDate });
+    } catch (error: any) {
+      showReportError('the MOH-706 report', error);
+    } finally {
+      setIsLoading(false);
+    }
+  };
+
+  return (
+    <>
+      <ReportFiltersComponent
+        reportName="MOH-706 Report"
+        mode="both"
+        onGenerate={fetchMoh706Data}
+        isLoading={isLoading}
+        isReportGenerated={isReportGenerated}
+      />
+      {isLoading && <ReportSkeleton />}
+      {!isLoading && !isReportGenerated && (
+        <ReportPlaceholder reportName="MOH-706" isLocationChanged={hasReportData(moh706Data) && hasLocationChanged} />
+      )}
+      {!isLoading && isReportGenerated && (
+        <ReportPage>
+          <div className={styles.sheet}>
+            <MOH706Header facility={facility} startDate={filters.startDate} endDate={filters.endDate} />
+            <div className={styles.reportSections}>
+              <UrineAnalysis
+                data={moh706Data}
+                locationUuids={filters.locationUuids}
+                startDate={filters.startDate}
+                endDate={filters.endDate}
+              />
+              <BloodChemistry
+                data={moh706Data}
+                locationUuids={filters.locationUuids}
+                startDate={filters.startDate}
+                endDate={filters.endDate}
+              />
+              <Parasitology
+                data={moh706Data}
+                locationUuids={filters.locationUuids}
+                startDate={filters.startDate}
+                endDate={filters.endDate}
+              />
+              <Haematology
+                data={moh706Data}
+                locationUuids={filters.locationUuids}
+                startDate={filters.startDate}
+                endDate={filters.endDate}
+              />
+              <Bacteriology
+                data={moh706Data}
+                locationUuids={filters.locationUuids}
+                startDate={filters.startDate}
+                endDate={filters.endDate}
+              />
+              <HistologyAndCytology />
+              <Serology
+                data={moh706Data}
+                locationUuids={filters.locationUuids}
+                startDate={filters.startDate}
+                endDate={filters.endDate}
+              />
+              <SpecimenReferralToHigherLevels />
+              <DrugSusceptibilityTesting />
+            </div>
+
+            <div className={styles.signOff}>
+              <span>
+                Compiled by:<span className={styles.line}>{compiledBy}</span>
+              </span>
+              <span>
+                Signature:
+                <span className={styles.line} />
+              </span>
+              <span>
+                Date:<span className={styles.shortLine}>{compiledOn}</span>
+              </span>
+            </div>
+          </div>
+        </ReportPage>
+      )}
+    </>
+  );
+};
+
+export default MoH706Report;

package/src/reports/moh-706/moh-706.scss

@@ -1,18 +1,126 @@
-.tableWrapper {
-  overflow-x: auto;
-  border: 1px solid #d0d0d0;
-  border-radius: 4px;
+/* MOH-706 laid out for A4, on the same scale as the other reports.
+
+   Its nine sub-reports all render through the shared TableWrapper, so their
+   cells are styled from `table-wrapper.scss` rather than here. Those rules are
+   all single-class, so scoping these under `.sheet` (a class plus an element,
+   one step more specific) wins deterministically -- no reliance on which module
+   loads first. The wrapper is asked for a plain table so Carbon's data-table
+   rules, which are far more specific, never apply at all. */
+
+$ink: #000;
+$rule: 1px solid $ink;
+
+$text: 7pt;
+$title: 7.5pt;
+$meta: 6.5pt;
+
+$pad: 3mm;
+
+.mainTitleBox {
+  padding: 2mm $pad;
+  text-align: center;
+  border: $rule;
+}
+
+.ministry {
+  font-size: $meta;
+}
+
+.reportTitle {
+  font-size: $title;
+  font-weight: 700;
+  color: $ink;
+}
+
+.headerSection {
+  padding: 0;
 }
 
-.tableContainer {
+/* The nine sub-reports run continuously down the sheet, as they do on the form.
+   Each is kept off a page break so a block is never split from the heading row
+   that names its columns. */
+
+.reportSections {
   width: 100%;
-  border-collapse: collapse;
+  margin: 0;
+  padding: 0;
+
+  > * {
+    break-inside: avoid;
+    page-break-inside: avoid;
+  }
+}
+
+.sheet {
+  font-size: $text;
 
-  thead {
-    background-color: #f4f4f4;
+  table {
+    width: 100%;
+    border-collapse: collapse;
   }
 
-  tbody tr {
-    border-bottom: 1px solid #e0e0e0;
+  td,
+  th {
+    height: auto;
+    min-width: 0;
+    padding: 0.7mm 1mm;
+    overflow-wrap: anywhere;
+    font-size: $text;
+    line-height: 1.25;
+    text-align: center;
+    border: $rule;
   }
-}
+
+  /* Row labels read as text, not as data */
+  td:first-child {
+    text-align: left;
+  }
+
+  /* The facility block is all labels and values, none of it tabular data */
+  .headerSection td {
+    text-align: left;
+  }
+}
+
+/* Sign-off, enclosed by the form */
+
+.signOff {
+  display: flex;
+  flex-wrap: nowrap;
+  align-items: baseline;
+  justify-content: space-between;
+  gap: 2.5mm;
+  padding: $pad;
+  font-size: $meta;
+  white-space: nowrap;
+  border: $rule;
+  border-top: none;
+
+  > span {
+    display: flex;
+    flex: 1 1 auto;
+    align-items: baseline;
+    min-width: 0;
+  }
+}
+
+.line,
+.shortLine {
+  padding: 0 0.5mm;
+  margin-left: 1mm;
+  overflow: hidden;
+  font-weight: 600;
+  text-align: center;
+  text-overflow: ellipsis;
+  border-bottom: $rule;
+}
+
+.line {
+  flex: 1 1 45mm;
+  min-width: 15mm;
+}
+
+.shortLine {
+  flex: 1 1 25mm;
+  min-width: 12mm;
+}

package/src/reports/moh-706/sub-reports/bacteriology/bacteriology.component.tsx

@@ -3,7 +3,14 @@ import TableWrapper from "../../../table-wrapper/table-wrapper.component";
 import TableRowMapper from "../../../table-wrapper/table-row-mapper.component";
 import { getCell } from "../../../../utils/utils";
 
-const Bacteriology: React.FC = () => {
+interface BacteriologyProps {
+    data?: any,
+    locationUuids?: string,
+    startDate?: string,
+    endDate?: string
+}
+
+const Bacteriology: React.FC<BacteriologyProps> = ({ data, locationUuids, startDate, endDate }) => {
     const tableRows = useMemo(() => {
         return [
             {
@@ -18,14 +25,14 @@ const Bacteriology: React.FC = () => {
                 ]
             },
             { tableCells: [getCell("", "5.1 Urine"), getCell(), getCell(), getCell()] },
-            { tableCells: [getCell("", "5.2 Pus swabs"), getCell(), getCell(), getCell()] },
+            { tableCells: [getCell("", "5.2 Pus swabs"), getCell("total_bact_pus_swab"), getCell(), getCell()] },
             { tableCells: [getCell("", "5.3 High Vaginal Swabs"), getCell(), getCell(), getCell()] },
-            { tableCells: [getCell("", "5.4 Throat swab"), getCell(), getCell(), getCell()] },
-            { tableCells: [getCell("", "5.5 Rectal swab"), getCell(), getCell(), getCell()] },
-            { tableCells: [getCell("", "5.6 Blood"), getCell(), getCell(), getCell()] },
-            { tableCells: [getCell("", "5.7 Water"), getCell(), getCell(), getCell()] },
-            { tableCells: [getCell("", "5.8 Food"), getCell(), getCell(), getCell()] },
-            { tableCells: [getCell("", "5.9 Urethral swabs"), getCell(), getCell(), getCell()] },
+            { tableCells: [getCell("", "5.4 Throat swab"), getCell("total_bact_throat_swab"), getCell(), getCell()] },
+            { tableCells: [getCell("", "5.5 Rectal swab"), getCell("total_bact_rectal_swab"), getCell(), getCell()] },
+            { tableCells: [getCell("", "5.6 Blood"), getCell("total_bact_blood"), getCell(), getCell()] },
+            { tableCells: [getCell("", "5.7 Water"), getCell("total_bact_water"), getCell(), getCell()] },
+            { tableCells: [getCell("", "5.8 Food"), getCell("total_bact_food"), getCell(), getCell()] },
+            { tableCells: [getCell("", "5.9 Urethral swabs"), getCell("total_bact_urethral"), getCell(), getCell()] },
             {
                 tableCells: [
                     getCell("", "Bacterial enteric pathogens", 2, 1, true),
@@ -46,10 +53,10 @@ const Bacteriology: React.FC = () => {
                     getCell("", "Number Positive", 1, 1, true),
                 ]
             },
-            { tableCells: [getCell("", "5.11 Salmonella typhi", 3), getCell()] },
-            { tableCells: [getCell("", "5.12 Shigella - dysenteriae type1", 3), getCell()] },
-            { tableCells: [getCell("", "5.13 E. coli O157:H7", 3), getCell()] },
-            { tableCells: [getCell("", "5.14 V. cholerae O1", 3), getCell()] },
+            { tableCells: [getCell("", "5.11 Salmonella typhi", 3), getCell("positive_salmonella")] },
+            { tableCells: [getCell("", "5.12 Shigella - dysenteriae type1", 3), getCell("positive_bact_shigella_dysenteriae1")] },
+            { tableCells: [getCell("", "5.13 E. coli O157:H7", 3), getCell("positive_bact_ecoli_o157")] },
+            { tableCells: [getCell("", "5.14 V. cholerae O1", 3), getCell("positive_bact_v_cholerae_o1")] },
             { tableCells: [getCell("", "5.15 V. cholerae O139", 3), getCell()] },
 
             {
@@ -66,7 +73,7 @@ const Bacteriology: React.FC = () => {
             {
                 tableCells: [
                     getCell("", "5.16 CSF"),
-                    getCell(),
+                    getCell("total_bact_csf"),
                     getCell(),
                     getCell(),
                 ]
@@ -77,21 +84,21 @@ const Bacteriology: React.FC = () => {
                     getCell("", "Number Positive", 3, 1, true),
                 ]
             },
-            { tableCells: [getCell("", "5.17 Neisseria meningitidis A"), getCell("", "", 3)] },
-            { tableCells: [getCell("", "5.18 Neisseria meningitidis B"), getCell("", "", 3)] },
-            { tableCells: [getCell("", "5.19 Neisseria meningitidis C"), getCell("", "", 3)] },
-            { tableCells: [getCell("", "5.20 Neisseria meningitidis W135"), getCell("", "", 3)] },
+            { tableCells: [getCell("", "5.17 Neisseria meningitidis A"), getCell("positive_bact_men_a", "", 3)] },
+            { tableCells: [getCell("", "5.18 Neisseria meningitidis B"), getCell("positive_bact_men_b", "", 3)] },
+            { tableCells: [getCell("", "5.19 Neisseria meningitidis C"), getCell("positive_bact_men_c", "", 3)] },
+            { tableCells: [getCell("", "5.20 Neisseria meningitidis W135"), getCell("positive_bact_men_w135", "", 3)] },
             { tableCells: [getCell("", "5.21 Neisseria meningitidis X"), getCell("", "", 3)] },
-            { tableCells: [getCell("", "5.22 Neisseria meningitidis Y"), getCell("", "", 3)] },
-            { tableCells: [getCell("", "5.23 Neisseria meningitidis (indeterminate)"), getCell("", "", 3)] },
-            { tableCells: [getCell("", "5.24 Streptococcus pneumoniae"), getCell("", "", 3)] },
-            { tableCells: [getCell("", "5.25 Haemophilus influenzae (type b)"), getCell("", "", 3)] },
+            { tableCells: [getCell("", "5.22 Neisseria meningitidis Y"), getCell("positive_bact_men_y", "", 3)] },
+            { tableCells: [getCell("", "5.23 Neisseria meningitidis (indeterminate)"), getCell("positive_bact_men_indeterminate", "", 3)] },
+            { tableCells: [getCell("", "5.24 Streptococcus pneumoniae"), getCell("positive_bact_strep_pneumoniae", "", 3)] },
+            { tableCells: [getCell("", "5.25 Haemophilus influenzae (type b)"), getCell("positive_bact_h_influenzae_b", "", 3)] },
             { tableCells: [getCell("", "5.26 Cryptococcal Meningitis"), getCell("", "", 3)] },
             {
                 tableCells: [getCell("", "Bacterial Pathogens from other types of specimen", 4, 1, true)]
             },
-            { tableCells: [getCell("", "5.27 B. anthracis"), getCell("", "", 3)] },
-            { tableCells: [getCell("", "5.28 Y. pestis"), getCell("", "", 3)] },
+            { tableCells: [getCell("", "5.27 B. anthracis"), getCell("positive_bact_b_anthracis", "", 3)] },
+            { tableCells: [getCell("", "5.28 Y. pestis"), getCell("positive_bact_y_pestis", "", 3)] },
             { tableCells: [getCell("", "TB SPUTUM", 4)] },
             {
                 tableCells: [
@@ -100,17 +107,17 @@ const Bacteriology: React.FC = () => {
                     getCell("", "Number Positive", 1, 1, true),
                 ]
             },
-            { tableCells: [getCell("", "5.29 Total TB smears"), getCell(), getCell()] },
-            { tableCells: [getCell("", "5.30 New presumptive TB cases"), getCell(), getCell()] },
-            { tableCells: [getCell("", "5.31 TB Follow up"), getCell(), getCell()] },
+            { tableCells: [getCell("", "5.29 Total TB smears"), getCell("total_tb_smear"), getCell("positive_tb_smear")] },
+            { tableCells: [getCell("", "5.30 New presumptive TB cases"), getCell("total_tb_sputum_new"), getCell("positive_tb_sputum_new")] },
+            { tableCells: [getCell("", "5.31 TB Follow up"), getCell("total_tb_sputum_followup"), getCell("positive_tb_sputum_followup")] },
             { tableCells: [getCell("", "5.32 Rifampicin Resistant TB"), getCell(), getCell()] },
-            { tableCells: [getCell("", "5.33 MDR TB"), getCell(), getCell()] },
+            { tableCells: [getCell("", "5.33 MDR TB"), getCell("total_tb_sputum_mdr"), getCell("positive_tb_sputum_mdr")] },
         ]
     }, []);
 
 
     return <TableWrapper>
-        <TableRowMapper tableRows={tableRows} />
+        <TableRowMapper tableRows={tableRows} data={data} locationUuids={locationUuids} startDate={startDate} endDate={endDate} />
     </TableWrapper>
 }