-
Notifications
You must be signed in to change notification settings - Fork 72
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
ft : split order handler from base-handlers file
- Loading branch information
Showing
5 changed files
with
181 additions
and
64 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,61 @@ | ||
| import React, { useContext, useEffect, useState } from 'react'; | ||
| import { OHRIFormFieldProps } from '../../api/types'; | ||
| import { OHRIFormContext } from '../../ohri-form-context'; | ||
| import { getFieldControlWithFallback, isUnspecifiedSupported } from '../section/helpers'; | ||
| import { OHRIUnspecified } from '../inputs/unspecified/ohri-unspecified.component'; | ||
| import { useField } from 'formik'; | ||
| import styles from './ohri-orders.scss'; | ||
|
|
||
| export interface OrdersProps extends OHRIFormFieldProps { | ||
| deleteControl?: any; | ||
| } | ||
|
|
||
| export const OHRIOrders: React.FC<OrdersProps> = ({ question, onChange, deleteControl }) => { | ||
| const [ordersControlMap, setOrdersControlMap] = useState([]); | ||
| const { formFieldHandlers } = useContext(OHRIFormContext); | ||
|
|
||
| useEffect(() => { | ||
| if (question.questions) { | ||
| Promise.all( | ||
| question.questions.map((field) => { | ||
| return getFieldControlWithFallback(field)?.then((result) => ({ field, control: result })); | ||
| }), | ||
| ).then((results) => { | ||
| setOrdersControlMap(results); | ||
| }); | ||
| } | ||
| }, [question.questions]); | ||
|
|
||
| // get order content | ||
| const groupContent = ordersControlMap | ||
| .filter((orderMapItem) => !!orderMapItem && !orderMapItem.field.isHidden) | ||
| .map((orderMapItem, index) => { | ||
| const { control, field } = orderMapItem; | ||
| if (control) { | ||
| const questionFragment = React.createElement(control, { | ||
| question: field, | ||
| onChange: onChange, | ||
| key: index, | ||
| handler: formFieldHandlers[field.type], | ||
| useField, | ||
| }); | ||
| return ( | ||
| <div className={`${styles.flexColumn} ${styles.ordersColumn} `}> | ||
| {isUnspecifiedSupported(field) ? ( | ||
| <> | ||
| {questionFragment} | ||
| <OHRIUnspecified question={field} onChange={onChange} handler={formFieldHandlers[field.type]} /> | ||
| </> | ||
| ) : ( | ||
| questionFragment | ||
| )} | ||
| </div> | ||
| ); | ||
| } | ||
| }); | ||
| if (groupContent && deleteControl) { | ||
| groupContent.push(deleteControl); | ||
| } | ||
| // return component | ||
| return <div className={styles.flexRow}>{groupContent}</div>; | ||
| }; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,36 @@ | ||
| .flexColumn { | ||
| display: flex; | ||
| flex-direction: column; | ||
| margin-right: 2.5rem; | ||
| flex: 1; | ||
| } | ||
|
|
||
| .flexRow { | ||
| display: flex; | ||
| flex-direction: row; | ||
| flex-wrap: wrap; | ||
| width: 100%; | ||
| } | ||
|
|
||
| .ordersColumn { | ||
| max-width: 18rem; | ||
| } | ||
|
|
||
| .ordersColumn input[class*="cds--date-picker__input"] { | ||
| width: 18rem !important; | ||
| } | ||
|
|
||
| .ordersColumn > div, .ordersColumn div[class*="cds--number"] { | ||
| margin-top: 0 !important; | ||
| } | ||
|
|
||
| /** Targets carbon's multiselect */ | ||
| .ordersColumn > div > div > div { | ||
| max-width: 18rem !important; | ||
| } | ||
|
|
||
| /** Targets carbon's dropdown */ | ||
| .ordersColumn > div > div > div > div { | ||
| max-width: 18rem !important; | ||
| } | ||
|
|
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,83 @@ | ||
| import { OHRIFormField, OpenmrsEncounter, Order, SubmissionHandler } from '../api/types'; | ||
| import { EncounterContext } from '../ohri-form-context'; | ||
|
|
||
| export let assignedOrdersIds: string[] = []; | ||
|
|
||
| /** | ||
| * Order handler | ||
| */ | ||
| export const OrderSubmissionHandler: SubmissionHandler = { | ||
| getInitialValue: function ( | ||
| encounter: OpenmrsEncounter, | ||
| field: OHRIFormField, | ||
| allFormFields?: OHRIFormField[], | ||
| context?: EncounterContext, | ||
| ): {} { | ||
| const rendering = field.questionOptions.rendering; | ||
|
|
||
| throw new Error('Function not implemented.'); | ||
| }, | ||
| handleFieldSubmission: function (field: OHRIFormField, value: any, context: EncounterContext): {} { | ||
| if (field.questionOptions.rendering == 'checkbox') { | ||
| return multiSelectOrdersHandler(field, value, context); | ||
| } | ||
| if (field.questionOptions.rendering == 'toggle') { | ||
| return constructOrder(value, context, field); | ||
| } | ||
| }, | ||
| getDisplayValue: function (field: OHRIFormField, value: any) { | ||
| const rendering = field.questionOptions.rendering; | ||
| if (!field.value) { | ||
| return null; | ||
| } | ||
| if (field.questionOptions.rendering == 'checkbox') { | ||
| return value.map( | ||
| (chosenOption) => field.questionOptions.answers?.find((option) => option.concept == chosenOption)?.label, | ||
| ); | ||
| } | ||
| if (rendering == 'content-switcher' || rendering == 'select' || rendering == 'toggle') { | ||
| const concept = typeof field.value.value === 'object' ? field.value.value.uuid : field.value.value; | ||
| return field.questionOptions.answers?.find((option) => option.concept == concept)?.label; | ||
| } | ||
| if (rendering == 'radio') { | ||
| return field.questionOptions.answers?.find((option) => option.concept == value)?.label; | ||
| } | ||
| return value; | ||
| }, | ||
| }; | ||
|
|
||
| // orders helpers | ||
| const constructOrder = (value: any, context: EncounterContext, field: OHRIFormField) => { | ||
| return { | ||
| action: 'new', | ||
| urgency: 'ROUTINE', | ||
| patient: context.patient?.id, | ||
| concept: value, | ||
| }; | ||
| }; | ||
|
|
||
| export const findOrderByFormField = ( | ||
| ordersList: Array<Order>, | ||
| claimedOrderIds: string[], | ||
| field: OHRIFormField, | ||
| ): Order[] => { | ||
| const orders = ordersList.filter((o) => o.formFieldPath == `ohri-forms-${field.id}`); | ||
| // We shall fall back to mapping by the associated concept | ||
| // That being said, we shall find all matching obs and pick the one that wasn't previously claimed. | ||
| if (!orders?.length) { | ||
| const ordersByConcept = ordersList.filter((orders) => orders.concept == field.questionOptions.concept); | ||
| return ordersByConcept; | ||
| } | ||
| return orders; | ||
| }; | ||
| function multiSelectOrdersHandler(field: OHRIFormField, values: Array<string>, context: EncounterContext): {} { | ||
| if (!field.value) { | ||
| field.value = []; | ||
| } | ||
|
|
||
| if (Array.isArray(values)) { | ||
| values.forEach((value) => { | ||
| field.value.push(constructOrder(value, context, field)); | ||
| }); | ||
| } | ||
| } |