@ampath/esm-reports-app 1.0.0-next.6 → 1.0.0-next.61

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

@@ -0,0 +1,572 @@
+import React from 'react';
+
+import styles from '../moh-731.scss';
+import classNames from 'classnames';
+import { useOpenMoh731Linelist } from '../linelist/use-open-moh-731-linelist';
+
+interface PmtctComponentProps {
+  MOH731Data: any;
+  startDate: string;
+  endDate: string;
+  locationUuids: string;
+}
+
+const PmtctComponent: React.FC<PmtctComponentProps> = ({ MOH731Data, startDate, endDate, locationUuids }) => {
+  const openLinelist = useOpenMoh731Linelist(startDate, endDate, locationUuids);
+  return (
+    <>
+      <div className={styles.flexRow}>
+        <div className={styles.flexColumn}>
+          <table className={styles.block}>
+            <tbody>
+              <tr>
+                <td className={styles.blockTitle} colSpan={3}>
+                  2.1 Maternal HIV Testing
+                </td>
+              </tr>
+              <tr>
+                <td>Known Positive at 1st ANC</td>
+                <td className={styles.textBox}>
+                  <span>HV02-01</span>
+                  <div
+                    onClick={() => openLinelist('HV02-01')}
+                    className={styles.rectangle}
+                    title="Click to open linelist"
+                  >
+                    {MOH731Data.known_positive_1st_anc}
+                  </div>
+                </td>
+                <td></td>
+              </tr>
+              <tr>
+                <td></td>
+                <td className={styles.subTitle}>Initial</td>
+                <td className={styles.subTitle}>Retest</td>
+              </tr>
+              <tr>
+                <td>Tested at ANC</td>
+                <td className={styles.textBox}>
+                  <span>HV02-02</span>
+                  <div
+                    onClick={() => openLinelist('HV02-02')}
+                    className={styles.rectangle}
+                    title="Click to open linelist"
+                  >
+                    {MOH731Data.initial_test_anc}
+                  </div>
+                </td>
+                <td>
+                  <div className={classNames(`${styles.textBox}`, `${styles.textBox2}`)}>
+                    <span>HV02-03</span>
+                    <div
+                      onClick={() => openLinelist('HV02-03')}
+                      className={styles.rectangle}
+                      title="Click to open linelist"
+                    >
+                      {MOH731Data.retest_anc}
+                    </div>
+                  </div>
+                </td>
+              </tr>
+              <tr>
+                <td>Tested at L&D</td>
+                <td className={styles.textBox}>
+                  <span>HV02-04</span>
+                  <div
+                    onClick={() => openLinelist('HV02-04')}
+                    className={styles.rectangle}
+                    title="Click to open linelist"
+                  >
+                    {MOH731Data.initial_test_LD}
+                  </div>
+                </td>
+                <td>
+                  <div className={classNames(`${styles.textBox}`, `${styles.textBox2}`)}>
+                    <span>HV02-05</span>
+                    <div
+                      onClick={() => openLinelist('HV02-05')}
+                      className={styles.rectangle}
+                      title="Click to open linelist"
+                    >
+                      {MOH731Data.retest_LD}
+                    </div>
+                  </div>
+                </td>
+              </tr>
+              <tr>
+                <td>Tested at PNC_&le;6weeks</td>
+                <td className={styles.textBox}>
+                  <span>HV02-06</span>
+                  <div
+                    onClick={() => openLinelist('HV02-06')}
+                    className={styles.rectangle}
+                    title="Click to open linelist"
+                  >
+                    {MOH731Data.initial_test_pnc_less_6_weeks}
+                  </div>
+                </td>
+                <td>
+                  <div className={classNames(`${styles.textBox}`, `${styles.textBox2}`)}>
+                    <span>HV02-07</span>
+                    <div
+                      onClick={() => openLinelist('HV02-07')}
+                      className={styles.rectangle}
+                      title="Click to open linelist"
+                    >
+                      {MOH731Data.retest_pnc_less_6_weeks}
+                    </div>
+                  </div>
+                </td>
+              </tr>
+              <tr>
+                <td>Tested at PNC_&gt;6weeks</td>
+                <td className={styles.textBox}>
+                  <span>HV02-08</span>
+                  <div
+                    onClick={() => openLinelist('HV02-08')}
+                    className={styles.rectangle}
+                    title="Click to open linelist"
+                  >
+                    {MOH731Data.initial_test_pnc_greater_6_weeks}
+                  </div>
+                </td>
+                <td>
+                  <div className={classNames(`${styles.textBox}`, `${styles.textBox2}`)}>
+                    <span>HV02-09</span>
+                    <div
+                      onClick={() => openLinelist('HV02-09')}
+                      className={styles.rectangle}
+                      title="Click to open linelist"
+                    >
+                      {MOH731Data.retest_pnc_greater_6_weeks}
+                    </div>
+                  </div>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+          <hr className={styles.divider} />
+          <table className={styles.block}>
+            <tbody>
+              <tr>
+                <td className={styles.blockTitle} colSpan={3}>
+                  2.2 HIV Positive Results
+                </td>
+              </tr>
+              <tr>
+                <td>Tested at ANC</td>
+                <td className={styles.textBox}>
+                  <span>HV02-10</span>
+                  <div
+                    onClick={() => openLinelist('HV02-10')}
+                    className={styles.rectangle}
+                    title="Click to open linelist"
+                  >
+                    {MOH731Data.positive_anc}
+                  </div>
+                </td>
+                <td></td>
+              </tr>
+              <tr>
+                <td>Tested at L&D</td>
+                <td className={styles.textBox}>
+                  <span>HV02-11</span>
+                  <div
+                    onClick={() => openLinelist('HV02-11')}
+                    className={styles.rectangle}
+                    title="Click to open linelist"
+                  >
+                    {MOH731Data.positive_LD}
+                  </div>
+                </td>
+                <td></td>
+              </tr>
+              <tr>
+                <td>Tested at PNC_&le;6weeks</td>
+                <td className={styles.textBox}>
+                  <span>HV02-12</span>
+                  <div
+                    onClick={() => openLinelist('HV02-12')}
+                    className={styles.rectangle}
+                    title="Click to open linelist"
+                  >
+                    {MOH731Data.positive_pnc_less_6_weeks}
+                  </div>
+                </td>
+                <td></td>
+              </tr>
+              <tr>
+                <td>Tested at PNC_&gt;6weeks</td>
+                <td className={styles.textBox}>
+                  <span>HV02-13</span>
+                  <div
+                    onClick={() => openLinelist('HV02-13')}
+                    className={styles.rectangle}
+                    title="Click to open linelist"
+                  >
+                    {MOH731Data.positive_pnc_greater_6_weeks}
+                  </div>
+                </td>
+                <td></td>
+              </tr>
+            </tbody>
+          </table>
+          <hr className={styles.divider} />
+          <table className={styles.block}>
+            <tbody>
+              <tr>
+                <td className={styles.blockTitle} colSpan={3}>
+                  2.3 Maternal HAART
+                </td>
+              </tr>
+              <tr>
+                <td>On HAART at 1st ANC</td>
+                <td className={styles.textBox}>
+                  <span>HV02-14</span>
+                  <div
+                    onClick={() => openLinelist('HV02-14')}
+                    className={styles.rectangle}
+                    title="Click to open linelist"
+                  >
+                    {MOH731Data.maternal_haart_1st_anc}
+                  </div>
+                </td>
+                <td></td>
+              </tr>
+              <tr>
+                <td>Start HAART_ANC</td>
+                <td className={styles.textBox}>
+                  <span>HV02-15</span>
+                  <div
+                    onClick={() => openLinelist('HV02-15')}
+                    className={styles.rectangle}
+                    title="Click to open linelist"
+                  >
+                    {MOH731Data.start_maternal_haart_1st_anc}
+                  </div>
+                </td>
+                <td></td>
+              </tr>
+              <tr>
+                <td>Start HAART_L&D</td>
+                <td className={styles.textBox}>
+                  <span>HV02-16</span>
+                  <div
+                    onClick={() => openLinelist('HV02-16')}
+                    className={styles.rectangle}
+                    title="Click to open linelist"
+                  >
+                    {MOH731Data.start_maternal_haart_LD}
+                  </div>
+                </td>
+                <td></td>
+              </tr>
+              <tr>
+                <td>Start HAART_PNC_&le;6weeks</td>
+                <td className={styles.textBox}>
+                  <span>HV02-17</span>
+                  <div
+                    onClick={() => openLinelist('HV02-17')}
+                    className={styles.rectangle}
+                    title="Click to open linelist"
+                  >
+                    {MOH731Data.maternal_haart_less_6_weeks}
+                  </div>
+                </td>
+                <td></td>
+              </tr>
+              <tr>
+                <td>Start HAART_PNC_&gt;6weeks</td>
+                <td className={styles.textBox}>
+                  <span>HV02-18</span>
+                  <div
+                    onClick={() => openLinelist('HV02-18')}
+                    className={styles.rectangle}
+                    title="Click to open linelist"
+                  >
+                    {MOH731Data.maternal_haart_more_6_weeks}
+                  </div>
+                </td>
+                <td></td>
+              </tr>
+            </tbody>
+          </table>
+          <hr className={styles.divider} />
+        </div>
+        <div className={styles.flexColumn}>
+          <table className={styles.block}>
+            <tbody>
+              <tr>
+                <td className={styles.blockTitle} colSpan={3}>
+                  2.4 HBV Screening at ANC
+                </td>
+              </tr>
+              <tr>
+                <td>Screened_HBV_ANC</td>
+                <td className={styles.textBox}>
+                  <span>HV02-19</span>
+                  <div
+                    onClick={() => openLinelist('HV02-19')}
+                    className={styles.rectangle}
+                    title="Click to open linelist"
+                  >
+                    {MOH731Data.hbv_screened_anc}
+                  </div>
+                </td>
+                <td></td>
+              </tr>
+              <tr>
+                <td>HBV Screened_Positive</td>
+                <td className={styles.textBox}>
+                  <span>HV02-20</span>
+                  <div
+                    onClick={() => openLinelist('HV02-20')}
+                    className={styles.rectangle}
+                    title="Click to open linelist"
+                  >
+                    {MOH731Data.hbv_screened_positive_anc}
+                  </div>
+                </td>
+                <td></td>
+              </tr>
+            </tbody>
+          </table>
+          <hr className={styles.divider} />
+          <table className={styles.block}>
+            <tbody>
+              <tr>
+                <td className={styles.blockTitle} colSpan={3}>
+                  2.5 Adolescents girls & Young Women (10-24 Yrs)
+                  <br />
+                  testing & results
+                </td>
+              </tr>
+              <tr>
+                <td></td>
+                <td>10-19yrs</td>
+                <td>20-24yrs</td>
+              </tr>
+              <tr>
+                <td>1st ANC KP</td>
+                <td className={styles.textBox}>
+                  <span>HV02-21</span>
+                  <div
+                    onClick={() => openLinelist('HV02-21')}
+                    className={styles.rectangle}
+                    title="Click to open linelist"
+                  >
+                    {MOH731Data.known_positive_anc_10_19}
+                  </div>
+                </td>
+                <td>
+                  <div className={classNames(`${styles.textBox}`, `${styles.textBox2}`)}>
+                    <span>HV02-22</span>
+                    <div
+                      onClick={() => openLinelist('HV02-22')}
+                      className={styles.rectangle}
+                      title="Click to open linelist"
+                    >
+                      {MOH731Data.known_positive_anc_20_24}
+                    </div>
+                  </div>
+                </td>
+              </tr>
+              <tr>
+                <td>New HIV Positive</td>
+                <td className={styles.textBox}>
+                  <span>HV02-23</span>
+                  <div
+                    onClick={() => openLinelist('HV02-23')}
+                    className={styles.rectangle}
+                    title="Click to open linelist"
+                  >
+                    {MOH731Data.positive_anc_ld_pnc_10_19}
+                  </div>
+                </td>
+                <td>
+                  <div className={classNames(`${styles.textBox}`, `${styles.textBox2}`)}>
+                    <span>HV02-24</span>
+                    <div
+                      onClick={() => openLinelist('HV02-24')}
+                      className={styles.rectangle}
+                      title="Click to open linelist"
+                    >
+                      {MOH731Data.positive_anc_ld_pnc_20_24}
+                    </div>
+                  </div>
+                </td>
+              </tr>
+              <tr>
+                <td>On HAART 1st ANC KP</td>
+                <td className={styles.textBox}>
+                  <span>HV02-25</span>
+                  <div
+                    onClick={() => openLinelist('HV02-25')}
+                    className={styles.rectangle}
+                    title="Click to open linelist"
+                  >
+                    {MOH731Data.on_art_anc_10_19}
+                  </div>
+                </td>
+                <td>
+                  <div className={classNames(`${styles.textBox}`, `${styles.textBox2}`)}>
+                    <span>HV02-26</span>
+                    <div
+                      onClick={() => openLinelist('HV02-26')}
+                      className={styles.rectangle}
+                      title="Click to open linelist"
+                    >
+                      {MOH731Data.on_art_anc_20_24}
+                    </div>
+                  </div>
+                </td>
+              </tr>
+              <tr>
+                <td>Started HAART New</td>
+                <td className={styles.textBox}>
+                  <span>HV02-27</span>
+                  <div
+                    onClick={() => openLinelist('HV02-27')}
+                    className={styles.rectangle}
+                    title="Click to open linelist"
+                  >
+                    {MOH731Data.start_art_10_19}
+                  </div>
+                </td>
+                <td>
+                  <div className={classNames(`${styles.textBox}`, `${styles.textBox2}`)}>
+                    <span>HV02-28</span>
+                    <div
+                      onClick={() => openLinelist('HV02-28')}
+                      className={styles.rectangle}
+                      title="Click to open linelist"
+                    >
+                      {MOH731Data.start_art_20_24}
+                    </div>
+                  </div>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+          <hr className={styles.divider} />
+          <table className={styles.block}>
+            <tbody>
+              <tr>
+                <td className={styles.blockTitle} colSpan={3}>
+                  2.6 Infant Prophylaxis
+                </td>
+              </tr>
+              <tr>
+                <td>Infant ARV Prophylaxis_ANC</td>
+                <td className={styles.textBox}>
+                  <span>HV02-29</span>
+                  <div
+                    onClick={() => openLinelist('HV02-29')}
+                    className={styles.rectangle}
+                    title="Click to open linelist"
+                  >
+                    {MOH731Data.infant_arv_anc}
+                  </div>
+                </td>
+                <td></td>
+              </tr>
+              <tr>
+                <td>Infant ARV Prophylaxis_L&D</td>
+                <td className={styles.textBox}>
+                  <span>HV02-30</span>
+                  <div
+                    onClick={() => openLinelist('HV02-30')}
+                    className={styles.rectangle}
+                    title="Click to open linelist"
+                  >
+                    {MOH731Data.infant_arv_ld}
+                  </div>
+                </td>
+                <td></td>
+              </tr>
+              <tr>
+                <td>Infant ARV Prophylaxis_PNC</td>
+                <td className={styles.textBox}>
+                  <span>HV02-31</span>
+                  <div
+                    onClick={() => openLinelist('HV02-31')}
+                    className={styles.rectangle}
+                    title="Click to open linelist"
+                  >
+                    {MOH731Data.infant_arv_pnc}
+                  </div>
+                </td>
+                <td></td>
+              </tr>
+            </tbody>
+          </table>
+          <hr className={styles.divider} />
+          <table className={styles.block}>
+            <tbody>
+              <tr>
+                <td className={styles.blockTitle} colSpan={3}>
+                  2.7 Infant Feeding
+                </td>
+              </tr>
+              <tr>
+                <td className={styles.groupTitle} colSpan={3}>
+                  Below 6 months
+                </td>
+              </tr>
+              <tr>
+                <td>Exclusive Breastfeeding (EBF)</td>
+                <td className={styles.textBox}>
+                  <span>HV02-32</span>
+                  <div
+                    onClick={() => openLinelist('HV02-32')}
+                    className={styles.rectangle}
+                    title="Click to open linelist"
+                  >
+                    {MOH731Data.exclusive_bf}
+                  </div>
+                </td>
+                <td></td>
+              </tr>
+              <tr>
+                <td className={styles.groupTitle} colSpan={3}>
+                  6 to 24 months
+                </td>
+              </tr>
+              <tr>
+                <td>Breastfeeding (BF)</td>
+                <td className={styles.textBox}>
+                  <span>HV02-33</span>
+                  <div
+                    onClick={() => openLinelist('HV02-33')}
+                    className={styles.rectangle}
+                    title="Click to open linelist"
+                  >
+                    {MOH731Data.bf}
+                  </div>
+                </td>
+                <td></td>
+              </tr>
+              <tr>
+                <td className={styles.spaceAfter}>Not Breastfeeding (NBF)</td>
+                <td className={styles.textBox}>
+                  <span>HV02-34</span>
+                  <div
+                    onClick={() => openLinelist('HV02-34')}
+                    className={styles.rectangle}
+                    title="Click to open linelist"
+                  >
+                    {MOH731Data.weaning}
+                  </div>
+                </td>
+                <td></td>
+              </tr>
+            </tbody>
+          </table>
+          <hr className={styles.divider} />
+        </div>
+      </div>
+    </>
+  );
+};
+
+export default PmtctComponent;