diff --git a/src/components/Pages/ClientPage.tsx b/src/components/Pages/ClientPage.tsx index 1aba569..bf147fe 100644 --- a/src/components/Pages/ClientPage.tsx +++ b/src/components/Pages/ClientPage.tsx @@ -163,7 +163,7 @@ const ClientPage = (props: IProps): JSX.Element | null => { setSearchText(changeEvent.target.value)} onKeyDown={(keyboardEvent: React.KeyboardEvent) => { diff --git a/src/components/Pages/Grids/RxLookupGrid.tsx b/src/components/Pages/Grids/RxLookupGrid.tsx new file mode 100644 index 0000000..1883c04 --- /dev/null +++ b/src/components/Pages/Grids/RxLookupGrid.tsx @@ -0,0 +1,34 @@ +import Table from 'react-bootstrap/Table'; +import React from 'reactn'; +import {randomString} from 'utility/common'; + +interface IProps { + lookupList: {Drug: string; LastName: string; FirstName: string}[]; +} + +const RxLookupGrid = (props: IProps) => { + const lookupList = props.lookupList; + + return ( + + + + + + + {lookupList.map((rxItem, index) => { + const key = index || randomString(); + + return ( + + + + + ); + })} + +
ClientDrug
{rxItem.FirstName.trim() + ' ' + rxItem.LastName.trim()}{rxItem.Drug}
+ ); +}; + +export default RxLookupGrid; diff --git a/src/components/Pages/RxLookup.tsx b/src/components/Pages/RxLookup.tsx index be841e4..a2bc23d 100644 --- a/src/components/Pages/RxLookup.tsx +++ b/src/components/Pages/RxLookup.tsx @@ -1,5 +1,6 @@ -import Button from 'react-bootstrap/Button'; -import React, {useGlobal, useState} from 'reactn'; +import RxLookupGrid from 'components/Pages/Grids/RxLookupGrid'; +import Form from 'react-bootstrap/Form'; +import React, {useEffect, useGlobal, useState} from 'reactn'; interface IProps { activeTabKey: string; @@ -10,42 +11,61 @@ const RxLookup = (props: IProps) => { const [providers] = useGlobal('providers'); const [clientList] = useGlobal('clientList'); const medicineProvider = providers.medicineProvider; - const [rxResult, setRxResult] = useState(null); - - const findRx = async (drugName: string) => { - const result = []; - const medicineSearchCriteria = { - where: [['Drug', 'LIKE', drugName + '%']], - orderBy: [['ResidentId']] - }; - const meds = await medicineProvider.search(medicineSearchCriteria); - - for (const m of meds) { - if (m.ResidentId) { - const client = clientList.find((c) => c.Id === m.ResidentId); - - if (client?.Id) { - // eslint-disable-next-line no-console - console.log('client', client); - result.push({firstName: client.FirstName, lastName: client.LastName, Drug: m.Drug}); + const [rxResult, setRxResult] = useState<{Drug: string; LastName: string; FirstName: string}[] | []>([]); + const [searchText, setSearchText] = useState(''); + + useEffect(() => { + if (searchText.length > 1) { + const findRx = async (drugName: string) => { + const result = [] as {Drug: string; LastName: string; FirstName: string}[]; + const medicineSearchCriteria = { + where: [['Drug', 'LIKE', drugName + '%']], + orderBy: [['ResidentId']] + }; + const meds = await medicineProvider.search(medicineSearchCriteria); + + for (const m of meds) { + if (m.ResidentId) { + const client = clientList.find((c) => c.Id === m.ResidentId); + + if (client?.Id) { + // eslint-disable-next-line no-console + console.log('client', client); + result.push({FirstName: client.FirstName, LastName: client.LastName, Drug: m.Drug}); + } + } } - } + setRxResult(result); + }; + findRx(searchText); + } else { + setRxResult([]); } - return result; - }; + }, [clientList, medicineProvider, searchText]); if (activeTabKey !== 'rx-lookup') return null; - const handleClick = async () => { - const rxFound = await findRx('Hy'); - setRxResult(rxFound); - }; - return ( - <> - -

{JSON.stringify(rxResult, null, '\t')}

- +
+ setSearchText(changeEvent.target.value)} + onKeyDown={(keyboardEvent: React.KeyboardEvent) => { + if (keyboardEvent.key === 'Enter') keyboardEvent.preventDefault(); + }} + placeholder="Drug name" + style={{width: '350px'}} + type="search" + value={searchText} + /> + + {rxResult.length > 0 && ( +
+ {' '} +
+ )} + ); }; diff --git a/src/types/RecordTypes.ts b/src/types/RecordTypes.ts index 9443896..80bcbed 100644 --- a/src/types/RecordTypes.ts +++ b/src/types/RecordTypes.ts @@ -10,7 +10,6 @@ export type ClientRecord = { Nickname: string; Notes: string; HMIS: number; - EnrollmentId: number; Updated?: null | Date; UserId?: number; deleted_at?: null | Date;