@ampath/esm-reports-app 1.0.0-next.4 → 1.0.0-next.41

package/src/reports/moh-717/sections/preparedby.component.tsx

@@ -0,0 +1,47 @@
+import React from 'react';
+
+import styles from '../moh717.scss';
+import classNames from 'classnames';
+
+const PreparedbyComponent: React.FC = () => {
+  return (
+    <>
+      <table className={classNames(`${styles.table}`, `${styles.tableBordered}`, `${styles.tableStriped}`)}>
+        <thead>
+          <tr>
+            <th></th>
+            <th>Name</th>
+            <th>Designation</th>
+            <th>Date</th>
+            <th>Signature</th>
+          </tr>
+        </thead>
+        <tbody>
+          <tr>
+            <td>Prepared by:</td>
+            <td></td>
+            <td></td>
+            <td></td>
+            <td></td>
+          </tr>
+          <tr>
+            <td>Checked by:</td>
+            <td></td>
+            <td></td>
+            <td></td>
+            <td></td>
+          </tr>
+          <tr>
+            <td>Received by:</td>
+            <td></td>
+            <td></td>
+            <td></td>
+            <td></td>
+          </tr>
+        </tbody>
+      </table>
+    </>
+  );
+};
+
+export default PreparedbyComponent;

package/src/reports/moh-717/sections/special-services.component.tsx

@@ -0,0 +1,114 @@
+import React from 'react';
+
+import styles from '../moh717.scss';
+import classNames from 'classnames';
+
+interface SpecialServicesComponentProps {
+  moh717ReportData: any;
+}
+
+const SpecialServicesComponent: React.FC<SpecialServicesComponentProps> = ({ moh717ReportData }) => {
+  return (
+    <>
+      <table className={classNames(`${styles.table}`, `${styles.tableBordered}`, `${styles.tableStriped}`)}>
+        <thead>
+          <tr>
+            <th colSpan={6} className={classNames(`${styles.totals} ${styles.alighnLeft}`)}>
+              C.SPECIAL SERVICES (includes both inpatients and outpatients)
+            </th>
+          </tr>
+          <tr>
+            <th></th>
+            <th colSpan={2}>Services</th>
+            <th>Number</th>
+            <th>Services</th>
+            <th>Number</th>
+          </tr>
+        </thead>
+        <tbody>
+          <tr>
+            <td>C.1</td>
+            <td>Laboratory- Number of Tests</td>
+            <td>Routine</td>
+            <td>{moh717ReportData.lab_routine_test}</td>
+            <td>Special</td>
+            <td>{moh717ReportData.lab_special_test}</td>
+          </tr>
+          <tr>
+            <td rowSpan={6}>C.2</td>
+            <td rowSpan={6}>X-Ray & Imaging- Number of Examinations</td>
+            <th>Routine</th>
+            <th>Number</th>
+            <th>Special</th>
+            <th>Number</th>
+          </tr>
+          <tr>
+            <td rowSpan={5}>Plain X-Rays without contrast enhancement</td>
+            <td rowSpan={5}>{moh717ReportData.plain_xray_without_enhancement}</td>
+            <td>Contrast enhanced examinations</td>
+            <td>{moh717ReportData.contrast_enhancement_examination}</td>
+          </tr>
+          <tr>
+            <td>Magnetic Resonance Imaging</td>
+            <td>{moh717ReportData.magnetic_resonance_imaging}</td>
+          </tr>
+          <tr>
+            <td>Computarized Tomography</td>
+            <td>{moh717ReportData.computerized_tomography}</td>
+          </tr>
+          <tr>
+            <td>Mammography</td>
+            <td>{moh717ReportData.mammography}</td>
+          </tr>
+          <tr>
+            <td>Chest x-ray for PTB with specialist's report</td>
+            <td>{moh717ReportData.chest_xray_for_ptb}</td>
+          </tr>
+          <tr>
+            <td>C.3</td>
+            <td>Number of ultrasound examinations</td>
+            <td>General ultrasound</td>
+            <td>{moh717ReportData.general_ultrasound}</td>
+            <td>Obstetric ultrasound</td>
+            <td>{moh717ReportData.obstetric_ultrasound}</td>
+          </tr>
+          <tr>
+            <td>C.4</td>
+            <th colSpan={2}>Total routine (X-Ray and Imaging)</th>
+            <th>{moh717ReportData.total_routine_xray_and_imaging}</th>
+            <th>Total special exams (X-Ray and Imaging)</th>
+            <th>{moh717ReportData.total_special_exams_xray_and_imaging}</th>
+          </tr>
+          <tr>
+            <td>C.5</td>
+            <td colSpan={4}>Physiotherapy - Number of Treatments</td>
+            <td>{moh717ReportData.physiotherapy_number_of_treatments}</td>
+          </tr>
+          <tr>
+            <td>C.6</td>
+            <td colSpan={4}>Occupational therapy - Number of treatments</td>
+            <td>{moh717ReportData.occupational_therapy_number_of_treatments}</td>
+          </tr>
+          <tr>
+            <td>C.7</td>
+            <td colSpan={4}>
+              Orthopaedic Technology (Prosthetist & Orthotist) - Orthopaedic Technology - No of ITEMS Prepared and
+              issued e.g. a pair of crutches, Wheelchair, Prosthesis etc. count as one item
+            </td>
+            <td>{moh717ReportData.orthopaedic_technology_prepared}</td>
+          </tr>
+          <tr>
+            <td>C.8</td>
+            <td colSpan={4}>
+              Orthopaedic Technology (Prosthetist & Orthotist) - Orthopaedic Technology - No of ITEMS issued e.g. a pair
+              of crutches, Wheelchair, Prosthesis etc. count as one item
+            </td>
+            <td>{moh717ReportData.orthopaedic_technology_issued}</td>
+          </tr>
+        </tbody>
+      </table>
+    </>
+  );
+};
+
+export default SpecialServicesComponent;

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

@@ -0,0 +1,181 @@
+import React, { useEffect, useState } from 'react';
+
+import styles from './moh-731.scss';
+import ReportFiltersComponent from '../../common/report-filters/report-filters.component';
+import { type ReportFilters } from '../moh-705a/type';
+import { useSession } from '@openmrs/esm-framework';
+import { useNavigate } from 'react-router-dom';
+import { getMoh731 } from '../../resources/moh-731.resource';
+import HivTestingandPreExposusreProphylaxis from './sections/hiv-testing-and-pre-exposure.component';
+import PmtctComponent from './sections/pmtct.component';
+import HivAndTBTreatmentComponent from './sections/hiv-and-tb-treatment.component';
+import classNames from 'classnames';
+import { Loading } from '@carbon/react';
+
+interface Moh731Props {}
+
+const Moh731Report: React.FC<Moh731Props> = () => {
+  const [moh731Data, setMoh731Data] = useState<any>(() => {
+    const saved = sessionStorage.getItem('moh731Data');
+    return saved ? JSON.parse(saved) : [];
+  });
+  const [isLoading, setIsLoading] = useState<boolean>(false);
+  const [startDate, setStartDate] = useState<string>(() => {
+    return sessionStorage.getItem('moh731StartDate') || '';
+  });
+
+  const [endDate, setEndDate] = useState<string>(() => {
+    return sessionStorage.getItem('moh731EndDate') || '';
+  });
+  useEffect(() => {
+    sessionStorage.setItem('moh731Data', JSON.stringify(moh731Data));
+  }, [moh731Data]);
+
+  useEffect(() => {
+    sessionStorage.setItem('moh731StartDate', startDate);
+  }, [startDate]);
+
+  useEffect(() => {
+    sessionStorage.setItem('moh731EndDate', endDate);
+  }, [endDate]);
+  const [errorMessage, setErrorMessage] = useState<any>();
+
+  const session = useSession();
+  const locationUuids = session?.sessionLocation?.uuid;
+  const navigate = useNavigate();
+
+  const getReportParams = (filters: ReportFilters) => {
+    let { startDate: sDate, endDate: eDate } = filters;
+
+    if (filters.month) {
+      const [year, monthIndex] = filters.month.split('-').map(Number);
+
+      const start = new Date(year, monthIndex - 1, 1);
+      const end = new Date(year, monthIndex, 0);
+
+      const formatLocalDate = (d: Date) => {
+        const y = d.getFullYear();
+        const m = String(d.getMonth() + 1).padStart(2, '0');
+        const day = String(d.getDate()).padStart(2, '0');
+        return `${y}-${m}-${day}`;
+      };
+
+      sDate = formatLocalDate(start);
+      eDate = formatLocalDate(end);
+    }
+
+    setStartDate(sDate || '');
+    setEndDate(eDate || '');
+
+    return { startDate: sDate, endDate: eDate };
+  };
+
+  const fetchMoh731ReportData = async (filters: { startDate?: string; endDate?: string; month?: string }) => {
+    setIsLoading(true);
+
+    const { startDate, endDate } = getReportParams(filters);
+
+    const params = {
+      locationUuids: locationUuids || '',
+      startDate,
+      endDate,
+    };
+    try {
+      const data = await getMoh731(params);
+      const flatData = Object.assign({}, ...data.result);
+      setMoh731Data(flatData);
+      setIsLoading(false);
+    } catch (error: any) {
+      setErrorMessage(error.message);
+      setIsLoading(false);
+      throw new Error(`Failed to fetch MOH-710 report data: ${error instanceof Error ? error.message : String(error)}`);
+    }
+  };
+
+  const navigateToRegister = (indicator: string) => {
+    navigate(
+      `/moh-405-register?startDate=${startDate}&endDate=${endDate}&locationUuids=${locationUuids}&indicator=${indicator}`,
+    );
+  };
+  return (
+    <>
+      <ReportFiltersComponent
+        reportName="MOH-731 Report"
+        mode="monthly"
+        onGenerate={fetchMoh731ReportData}
+        isLoding={isLoading}
+      />
+      <div
+        className={classNames(`${styles.table}`, `${styles.tableBordered}`, `${styles.border}`, `${styles.border2}`)}
+      >
+        <table style={{ width: '100%' }}>
+          <tr>
+            <td style={{ textAlign: 'center', fontWeight: 'bold' }}>
+              National AIDS & STI Control Program- NASCOP <br />
+              Comprehensive HIV/ AIDS reporting form
+              <div style={{ textAlign: 'right', marginBottom: '1%' }}>
+                <span style={{ textAlign: 'right', border: '2px dotted #000' }}>(MOH 731-Ver. July 2023)</span>
+              </div>
+            </td>
+          </tr>
+        </table>
+      </div>
+      <table className={styles.locationContainer} style={{ marginTop: '0.5%' }}>
+        <tr>
+          <td style={{ paddingLeft: '5rem', paddingBottom: '1%' }}>
+            County______________________SubCounty___________________Facility___________________MFL_______Month______year______
+          </td>
+        </tr>
+      </table>
+      <table className={styles.table} style={{ marginTop: '1%' }}>
+        <thead>
+          <tr>
+            <th className={styles.border}>1. HIV Testing & Pre exposure Prophylaxis</th>
+          </tr>
+        </thead>
+        <HivTestingandPreExposusreProphylaxis
+          MOH731Data={moh731Data}
+          startDate={startDate}
+          endDate={endDate}
+          locationUuids={locationUuids!}
+        />
+        <thead>
+          <tr>
+            <th className={styles.border2}>2. Elimination of Mother-to-Child Transmission(EMTCT)</th>
+          </tr>
+        </thead>
+        <PmtctComponent
+          MOH731Data={moh731Data}
+          startDate={startDate}
+          endDate={endDate}
+          locationUuids={locationUuids!}
+        />
+
+        <HivAndTBTreatmentComponent
+          MOH731Data={moh731Data}
+          startDate={startDate}
+          endDate={endDate}
+          locationUuids={locationUuids!}
+        />
+        <thead>
+          <div className={classNames(styles.reviewSection, styles.border3)}>
+            <div>Reviewed by:</div>
+            <div>Name</div>
+            <div>Designation</div>
+            <div>Signature</div>
+            <div>Date</div>
+
+            <div></div>
+            <div>_______________________________________</div>
+            <div>______________________</div>
+            <div>_____________</div>
+            <div>____________</div>
+          </div>
+        </thead>
+      </table>
+      {isLoading && <Loading />}
+    </>
+  );
+};
+
+export default Moh731Report;

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

@@ -0,0 +1,118 @@
+.table {
+  border: 2px solid #000;
+  margin: 2rem;
+  table-layout: fixed;
+
+  td:nth-child(1) {
+  width: 40%;
+}
+
+td:nth-child(2) {
+  width: 25%;
+}
+
+td:nth-child(3) {
+  width: 27.5%;
+}
+
+tr {
+  display: flex;
+  justify-content: space-between;
+}
+
+span {
+  font-weight: normal;
+}
+
+
+}
+
+
+.locationContainer {
+  border: 2px solid #000;
+  width: 100%;
+  text-align: center;
+  margin: 2rem;
+}
+
+.border {
+  background-color: #f2f2f2;
+  border-bottom: 2px solid #000;
+  width: 100%;
+  font-weight: bold;
+}
+.border2 {
+  background-color: #f2f2f2;
+  border-top: 2px solid #000;
+  border-bottom: 2px solid #000;
+  width: 100%;
+  font-weight: bold;
+}
+
+.border3 {
+  border-top: 2px solid #000;
+  border-right: 2px dotted #000;
+  width: 78.5%;
+}
+
+.flexColumn {
+  display: inline-block;
+  flex-direction: column;
+  margin: 2rem;
+}
+
+.flexRow {
+  display: flex;
+  justify-content: space-between;
+}
+.rectangle {
+  width: 50px;
+  height: 20px;
+  border: 2px solid #000;
+  display: inline-block;
+  margin-left: 5px;
+}
+.textBox {
+  display: inline-block;
+  align-items: center;
+  justify-content: start;
+  gap: 8px;
+  white-space: nowrap;
+  cursor: pointer;
+}
+.textBox2 {
+  margin-left: 10px;
+}
+.spaceAfter {
+  padding-right: 6vw;
+}
+.borderRight {
+  border-right: 2px dotted #000;
+  padding-right: 4vw;
+}
+.borderLeft {
+  border-left: 2px dotted #000;
+  padding-left: 1vw;
+}
+
+.reviewSection {
+  display: grid;
+  grid-template-columns: repeat(5, 1fr);
+  column-gap: 20px;
+  text-align: center;
+  font-size: 14px;
+  margin-top: 10px;
+  font-weight: bold;
+}
+
+.subTitle {
+  font-weight: bold;
+}
+
+
+.emptyColumn {
+  min-width: 10rem;
+}
+
+
+