@ampath/esm-dha-workflow-app 4.0.0-next.33 → 4.0.0-next.331

package/src/billing/extensions/visit-billing/visit-billing.extension.tsx

@@ -0,0 +1,509 @@
+import React, { useEffect, useMemo, useState } from 'react';
+import styles from './visit-billing.extension.scss';
+import { ComboBox, Select, SelectItem, TextInput } from '@carbon/react';
+import {
+  createBill,
+  fetchBillableServices,
+  fetchCashPoints,
+  fetchPaymentModes,
+} from '../../../shared/services/billing.resource';
+import {
+  type ServicePrice,
+  type PaymentMode,
+  type PayableBillableService,
+  type CashPoint,
+  type BillableService,
+  type CreateBillDto,
+} from '../../../shared/types';
+import { PaymentDetail, VisitAttribute, type QueueEntryDto, type ServiceQueue } from '../../../registry/types';
+import { PatientCategories } from '../../../shared/constants/patient-category';
+import { QUEUE_PRIORITIES_UUIDS, QUEUE_STATUS_UUIDS } from '../../../shared/constants/concepts';
+import { showSnackbar, useConfig, usePatient, useSession, useVisit, type Visit } from '@openmrs/esm-framework';
+import { PatientTypes } from '../../../shared/constants/patient-type';
+
+interface VisitBillingFormProps {
+  patientUuid: string;
+  setExtraVisitInfo: (state) => void;
+}
+const VisitBillingForm: React.FC<VisitBillingFormProps> = ({ patientUuid, setExtraVisitInfo }) => {
+  const { isLoading, error, patient } = usePatient(patientUuid);
+  const [paymentModes, setPaymentModes] = useState<PaymentMode[]>([]);
+  const [selectedPatientType, setSelectedPatientType] = useState<string>();
+  const [selectedPaymentDetail, setSelectedPaymentDetail] = useState<string>();
+  const [selectedBillableService, setSelectedBillableService] = useState<ServicePrice>(null);
+  const [filteredBillableServices, setFilteredBillableServices] = useState<ServicePrice[]>(null);
+  const [selectedPaymentMode, setSelectedPaymentMode] = useState<PaymentMode>(null);
+  const [selectedInsuranceScheme, setSelectedInsuranceScheme] = useState<string>('');
+  const [selectedInsurancePolicy, setSelectedInsurancePolicy] = useState<string>('');
+  const [servicePrices, setServicePrices] = useState<ServicePrice[]>([]);
+  const [selectedCashPoint, setSelectedCashPoint] = useState<CashPoint>(null);
+  const [selectedPriority, setSelectedPriority] = useState<string>('');
+  const [selectedPatientCategory, setSelectedPatientCategory] = useState<string>('');
+  const [selectedServiceQueue, setSelectedServiceQueue] = useState<string>();
+  const [serviceQueues, setServiceQueues] = useState<ServiceQueue[]>();
+  const [cashPoints, setCashPoints] = useState<CashPoint[]>([]);
+  const [billableServices, setBillableServices] = useState<BillableService[]>([]);
+  const { currentVisit, activeVisit } = useVisit(patientUuid);
+  const session = useSession();
+  const locationUuid = session.sessionLocation.uuid;
+  const facilityCashPoints = useMemo(() => getfacilityCashpoints(), [cashPoints, locationUuid]);
+  const { registrationBillableServices, nonSHAPaymentModes } = useConfig();
+  const hasCrNo = useMemo(()=>patientHasCrNo(),[patient])
+  const patientTypeOptions = useMemo(
+      () => [
+        {
+          text: 'Walk-in',
+          id: PatientTypes.WALK_IN_UUID,
+        },
+        {
+          text: 'Self-referral',
+          id: PatientTypes.SELF_RERERRAL_UUID,
+        },
+       {
+          text: 'Referral from other Facility',
+          id: PatientTypes.REFERRAL_FROM_ANOTHER_FACILITY_UUID,
+        },
+        {
+          text: 'Referral from Community',
+          id: PatientTypes.REFERRED_BY_COMMUNITY_HEALTH_WORKER_UUID,
+        },
+      ],
+      [patient],
+    );
+
+  useEffect(() => {
+    getPaymentMethods();
+    getBillableServices();
+    getCashPoints();
+  }, []);
+
+  useEffect(() => {
+    if (selectedBillableService && selectedCashPoint) {
+      setExtraVisitInfo({
+        handleCreateExtraVisitInfo: createPatientBill,
+        attributes: getVisitAttributes(),
+      });
+    }
+  }, [selectedBillableService, selectedCashPoint,selectedPatientType,selectedPaymentMode,selectedInsurancePolicy]);
+
+  if(isLoading || error){
+     return <></>
+  }
+
+  async function getCashPoints() {
+    const cp = await fetchCashPoints();
+    setCashPoints(cp);
+  }
+
+  async function getBillableServices() {
+    const billableServices = await fetchBillableServices();
+    setBillableServices(billableServices);
+    generateServiceTypesList(billableServices);
+  }
+
+  function generateServiceTypesList(billableServices: BillableService[]) {
+    const sp: ServicePrice[] = [];
+    for (let bs of billableServices) {
+      if (bs.servicePrices) {
+        const servicePrices = bs.servicePrices;
+        for (let servicePrice of servicePrices) {
+          sp.push(servicePrice);
+        }
+      }
+    }
+    setServicePrices(sp);
+  }
+
+  async function getPaymentMethods() {
+    const methods = await fetchPaymentModes();
+    let allowedPaymentMethods = [];
+    if(!hasCrNo){
+       allowedPaymentMethods = methods.filter((p)=>{
+           return nonSHAPaymentModes.includes(p.uuid);
+       });
+    }else{
+       allowedPaymentMethods = methods;
+    }
+    setPaymentModes(allowedPaymentMethods);
+  }
+  function patientHasCrNo(){
+    let identifiers = [];
+    if(patient && patient.identifier){
+        identifiers = patient.identifier ?? [];
+    }
+     const hasCrNo = identifiers.some((id)=>{
+        if(!id || !id.type){
+          return false;
+        }
+        return id.type.text === 'CR';
+     });
+     return hasCrNo;
+  }
+  const paymentMethodHandler = (selectedPaymentModeUuid: string) => {
+    const selectedPaymentMode = paymentModes.find((pm) => {
+      return pm.uuid === selectedPaymentModeUuid;
+    });
+    setSelectedPaymentMode(selectedPaymentMode);
+    const paymentModeBillableServices = getBillableServiceByPaymentMode(selectedPaymentMode);
+    setFilteredBillableServices(paymentModeBillableServices);
+    setSelectedInsuranceScheme('');
+    setSelectedInsurancePolicy('');
+    setSelectedPriority('');
+  };
+
+  const getBillableServiceByPaymentMode = (paymentMode: PaymentMode): PayableBillableService[] => {
+    const paymentBillableServices: ServicePrice[] = [];
+    servicePrices.forEach((sp) => {
+      if (sp.paymentMode) {
+        if (
+          sp.paymentMode.uuid === paymentMode.uuid &&
+          registrationBillableServices.includes(sp.billableService.uuid)
+        ) {
+          paymentBillableServices.push(sp);
+        }
+      }
+    });
+    return paymentBillableServices;
+  };
+
+  const paymentDetailsHandler = (paymentDetailSelected: string) => {
+    setSelectedPaymentDetail(paymentDetailSelected);
+  };
+  const paymentDetails = Object.values(PaymentDetail).map((value) => {
+    return {
+      id: value,
+      label: value,
+    };
+  });
+
+  const billableServicesHandler = (selectedBillableServiceUuid: string) => {
+    const selectedBillableService = servicePrices.find((sp) => {
+      return sp.uuid === selectedBillableServiceUuid;
+    });
+    setSelectedBillableService(selectedBillableService);
+  };
+
+  function hasSelectedPaymentMode(paymentMode: string): boolean {
+    if (!selectedPaymentMode) {
+      return false;
+    }
+    return selectedPaymentMode.name.trim().toLowerCase().includes(paymentMode.trim().toLowerCase());
+  }
+  const insuranceSchemeHandler = (selectedInsuranceScheme: string) => {
+    setSelectedInsuranceScheme(selectedInsuranceScheme);
+  };
+
+  const insurancePolicyHandler = (selectedInsurancePolicy: string) => {
+    setSelectedInsurancePolicy(selectedInsurancePolicy);
+  };
+
+  const cashPointsHandler = (selectedCashPointUuid: string) => {
+    const selectedCashPoint = cashPoints.find((cp) => {
+      return cp.uuid === selectedCashPointUuid;
+    });
+    setSelectedCashPoint(selectedCashPoint);
+  };
+
+  function getfacilityCashpoints() {
+    return cashPoints.filter((cp) => {
+      return cp && cp.location?.uuid === locationUuid;
+    });
+  }
+
+  const patientCategoryHandler = (categoryUuid: string) => {
+    setSelectedPatientCategory(categoryUuid);
+  };
+
+  function validateVisitQueueBill(): boolean {
+    if (!selectedPaymentDetail) {
+      showAlert('error', 'Please select a paying or non paying option', '');
+      return false;
+    }
+
+    if (selectedPaymentDetail === PaymentDetail.Paying) {
+      if (!selectedPaymentMode) {
+        showAlert('error', 'Please select a payment method', '');
+        return false;
+      }
+      if (!selectedBillableService) {
+        showAlert('error', 'Please select a billable service', '');
+        return false;
+      }
+      if (!selectedCashPoint) {
+        showAlert('error', 'Please select a cashpoint', '');
+        return false;
+      }
+    }
+    if (selectedPaymentDetail === PaymentDetail.NonPaying) {
+      if (!selectedPatientCategory) {
+        showAlert('error', 'Please select a patient category', '');
+        return false;
+      }
+    }
+    return true;
+  }
+
+  const showAlert = (alertType: 'error' | 'success', title: string, subtitle: string) => {
+    showSnackbar({
+      kind: alertType,
+      title: title,
+      subtitle: subtitle,
+    });
+  };
+
+  function isValidCreateBillDto(createBillDto: CreateBillDto): boolean {
+    if (!createBillDto.patient) {
+      showAlert('error', 'Please select a patient', '');
+      return false;
+    }
+    if (!createBillDto.status) {
+      showAlert('error', 'Bill does not have a status', '');
+      return false;
+    }
+    if (!createBillDto.cashPoint) {
+      showAlert('error', 'Please select a valid cashpoint', '');
+      return false;
+    }
+    if (!createBillDto.lineItems || createBillDto.lineItems.length === 0) {
+      showAlert('error', 'Please select a valid billable service', '');
+      return false;
+    }
+    return true;
+  }
+
+  async function createPatientBill() {
+    if (!validateVisitQueueBill()) return;
+    try {
+      // add bill if it was a paying client
+      let createBillResp = null;
+      if (selectedPaymentDetail === PaymentDetail.Paying) {
+        const createBillDto = generateCreateBillDto();
+        if (isValidCreateBillDto(createBillDto)) {
+          createBillResp = await createBill(createBillDto);
+          if (createBillResp) {
+            showAlert('success', 'Bill succesfully created', '');
+          }
+        } else {
+          return false;
+        }
+      }
+    } catch (error) {
+      console.log({ error });
+    }
+  }
+
+  const generateAddToTriageDto = (newVisit: Visit): QueueEntryDto => {
+    const payload: QueueEntryDto = {
+      visit: {
+        uuid: newVisit.uuid,
+      },
+      queueEntry: {
+        status: {
+          uuid: QUEUE_STATUS_UUIDS.WAITING_UUID,
+        },
+        priority: {
+          uuid: selectedPriority ?? QUEUE_PRIORITIES_UUIDS.NORMAL_PRIORITY_UUID,
+        },
+        queue: {
+          uuid: selectedServiceQueue,
+        },
+        patient: {
+          uuid: patientUuid,
+        },
+        startedAt: newVisit.startDatetime,
+        sortWeight: 0,
+      },
+    };
+    return payload;
+  };
+
+  function generateCreateBillDto(): CreateBillDto {
+    const payload: CreateBillDto = {
+      lineItems: [
+        {
+          billableService: selectedBillableService.billableService.uuid,
+          quantity: 1,
+          price: selectedBillableService.price,
+          priceName: selectedBillableService.name,
+          priceUuid: selectedBillableService.uuid,
+          lineItemOrder: 0,
+          status: 'PENDING',
+        },
+      ],
+      cashPoint: selectedCashPoint.uuid,
+      patient: patientUuid,
+      visit: activeVisit?.uuid ?? '',
+      status: 'PENDING',
+      payments: [],
+    };
+    return payload;
+  }
+
+  const patientTypeHandler = (selectedPatientType: { selectedItem: { id: string; text: string } }) => {
+    const pt = selectedPatientType.selectedItem.id;
+    setSelectedPatientType(pt);
+  };
+
+    function getVisitAttributes(): VisitAttribute[] {
+      const attributes: VisitAttribute[] = [];
+      if (selectedInsuranceScheme) {
+        attributes.push({
+          attributeType: '3a988e33-a6c0-4b76-b924-01abb998944b',
+          value: selectedInsuranceScheme,
+        });
+      }
+      if (selectedInsurancePolicy) {
+        attributes.push({
+          attributeType: 'aac48226-d143-4274-80e0-264db4e368ee',
+          value: selectedInsurancePolicy,
+        });
+      }
+      if (selectedPaymentMode) {
+        attributes.push({
+          attributeType: '8553afa0-bdb9-4d3c-8a98-05fa9350aa85',
+          value: selectedPaymentMode.uuid,
+        });
+      }
+      if(selectedPatientType) {
+          attributes.push({
+            attributeType: 'fbc0702d-b4c9-4968-be63-af8ad3ad6239',
+            value: selectedPatientType,
+          });
+      }
+      if(selectedPaymentDetail === PaymentDetail.NonPaying){
+          attributes.push({
+              attributeType: 'df0362f9-782e-4d92-8bb2-3112e9e9eb3c',
+              value: 'true',
+          });
+      }
+      return attributes;
+  }
+
+  return (
+    <>
+      <div className={styles.visitLayout}>
+        <div className={styles.formSection}>
+          <div className={styles.formRow}>
+             <div className={styles.formControl}>
+                          <ComboBox
+                            onChange={patientTypeHandler}
+                            id="patient-type-combobox"
+                            items={patientTypeOptions}
+                            itemToString={(item) => (item ? item.text : '')}
+                            titleText="Patient Type"
+                          />
+            </div>
+            <div className={styles.formControl}>
+              <Select
+                id="payment-details"
+                labelText="Payment Details"
+                onChange={($event) => paymentDetailsHandler($event.target.value)}
+              >
+                <SelectItem value="" text="Select" />;
+                {paymentDetails.map((pd) => {
+                  return <SelectItem value={pd.id} text={pd.label} />;
+                })}
+              </Select>
+            </div>
+          </div>
+        </div>
+        <div className={styles.formSection}>
+          {selectedPaymentDetail === PaymentDetail.Paying ? (
+            <>
+              <div className={styles.formRow}>
+                <div className={styles.formControl}>
+                  <Select
+                    id="payment-method"
+                    labelText="Payment Method"
+                    onChange={($event) => paymentMethodHandler($event.target.value)}
+                  >
+                    <SelectItem value="" text="Select" />;
+                    {paymentModes &&
+                      paymentModes.map((pm) => {
+                        return <SelectItem value={pm.uuid} text={pm.name} />;
+                      })}
+                  </Select>
+                </div>
+                <div className={styles.formControl}>
+                  <Select
+                    id="billable-service"
+                    labelText="Billable Services"
+                    onChange={($event) => billableServicesHandler($event.target.value)}
+                  >
+                    <SelectItem value="" text="Select" />;
+                    {filteredBillableServices &&
+                      filteredBillableServices.map((sp) => {
+                        return (
+                          <SelectItem value={sp.uuid} text={`${sp.billableService.display}(${sp.name}:${sp.price})`} />
+                        );
+                      })}
+                  </Select>
+                </div>
+              </div>
+              {hasSelectedPaymentMode('insurance') ? (
+                <>
+                  <div className={styles.formRow}>
+                    <div className={styles.formControl}>
+                      <TextInput
+                        id="insurance-scheme"
+                        labelText="Insurance scheme"
+                        onChange={(e) => insuranceSchemeHandler(e.target.value)}
+                      />
+                    </div>
+                    <div className={styles.formControl}>
+                      <TextInput
+                        id="policy-number"
+                        labelText="Policy number"
+                        onChange={(e) => insurancePolicyHandler(e.target.value)}
+                      />
+                    </div>
+                  </div>
+                </>
+              ) : (
+                <></>
+              )}
+              <div className={styles.formRow}>
+                <div className={styles.formControl}>
+                  <Select
+                    id="cash-point"
+                    labelText="Cash Point"
+                    onChange={($event) => cashPointsHandler($event.target.value)}
+                  >
+                    <SelectItem value="" text="Select" />;
+                    {facilityCashPoints &&
+                      facilityCashPoints.map((cp) => {
+                        return <SelectItem value={cp.uuid} text={cp.name} />;
+                      })}
+                  </Select>
+                </div>
+              </div>
+            </>
+          ) : (
+            <></>
+          )}
+
+          {selectedPaymentDetail === PaymentDetail.NonPaying ? (
+            <>
+              <div className={styles.formRow}>
+                <div className={styles.formControl}>
+                  <Select
+                    id="patient-category"
+                    labelText="Patient Category"
+                    onChange={($event) => patientCategoryHandler($event.target.value)}
+                  >
+                    <SelectItem value="" text="Select" />;
+                    <SelectItem value={PatientCategories.CCC_PATIENT_UUID} text="CCC" />;
+                    <SelectItem value={PatientCategories.MCH_PATIENT_UUID} text="MCH" />;
+                  </Select>
+                </div>
+              </div>
+            </>
+          ) : (
+            <></>
+          )}
+        </div>
+      </div>
+    </>
+  );
+};
+export default VisitBillingForm;

package/src/billing/invoice/bill.resource.ts

@@ -0,0 +1,47 @@
+import { openmrsFetch, restBaseUrl } from '@openmrs/esm-framework';
+import { type EditBillLineItemDto, type Bill, type PayBillDto, type Payment } from '../types';
+
+export async function fetchBill(billUuid: string): Promise<Bill> {
+  const billUrl = `${restBaseUrl}/billing/bill/${billUuid}`;
+  const resp = await openmrsFetch<Bill>(billUrl);
+  const result = await resp.json();
+  return result;
+}
+
+export async function payBill(billUuid: string, payBillDto: PayBillDto): Promise<Payment> {
+  const billUrl = `${restBaseUrl}/billing/bill/${billUuid}/payment`;
+  const resp = await openmrsFetch<Bill>(billUrl, {
+    method: 'POST',
+    headers: { 'Content-Type': 'application/json' },
+    body: JSON.stringify(payBillDto),
+  });
+  const result = await resp.json();
+  return result;
+}
+
+export async function deleteBillLineItem(billLineItemUuid: string, deleteReason: string) {
+  const deleteBillLineItemUrl = `${restBaseUrl}/billing/billLineItem/${billLineItemUuid}?reason=${deleteReason}`;
+  const resp = await openmrsFetch<Bill>(deleteBillLineItemUrl, {
+    method: 'DELETE',
+    headers: { 'Content-Type': 'application/json' },
+  });
+  return resp;
+}
+
+export async function editBillLineItem(billUuid: string, editBillLineItemDto: EditBillLineItemDto): Promise<Payment> {
+  const billUrl = `${restBaseUrl}/billing/bill/${billUuid}`;
+  const resp = await openmrsFetch<Bill>(billUrl, {
+    method: 'POST',
+    headers: { 'Content-Type': 'application/json' },
+    body: JSON.stringify(editBillLineItemDto),
+  });
+  const result = await resp.json();
+  return result;
+}
+
+export async function fetchPatientBills(patientUuid: string): Promise<Bill[]> {
+  const billUrl = `${restBaseUrl}/billing/bill?v=full&patientUuid=${patientUuid}`;
+  const resp = await openmrsFetch<Bill>(billUrl);
+  const result = await resp.json();
+  return result.results ?? [];
+}

package/src/billing/invoice/invoice-header/header-card/header-card.scss

@@ -0,0 +1,17 @@
+.headerCardLayout{
+    display: flex;
+    flex-direction: column;
+    width: 20%;
+    .headerTitle{
+        display: flex;
+        flex-direction: column;
+        width: 100%;
+        row-gap: 5px;
+    }
+    .headerDetails{
+        display: flex;
+        flex-direction: column;
+        width: 100%;
+        row-gap: 5px;
+    }
+}

package/src/billing/invoice/invoice-header/header-card/header-card.tsx

@@ -0,0 +1,21 @@
+import React from 'react';
+import styles from './header-card.scss';
+interface HeaderCardProps {
+  title: string;
+  subTitle: string;
+}
+const HeaderCard: React.FC<HeaderCardProps> = ({ title, subTitle }) => {
+  return (
+    <>
+      <div className={styles.headerCardLayout}>
+        <div className={styles.headerTitle}>
+          <h5>{title}</h5>
+        </div>
+        <div className={styles.headerDetails}>
+          <p>{subTitle}</p>
+        </div>
+      </div>
+    </>
+  );
+};
+export default HeaderCard;