feat: added medication view to dashboard - Ref gestion-de-projet#2677

aphp · Sep 30, 2024 · 5d63c1e · 5d63c1e
1 parent 3c73e9a
commit 5d63c1e
Show file tree

Hide file tree

Showing 11 changed files with 828 additions and 36 deletions.
diff --git a/src/components/Dashboard/MedicationList/index.tsx b/src/components/Dashboard/MedicationList/index.tsx
diff --git a/src/components/DataTable/DataTableMedication.tsx b/src/components/DataTable/DataTableMedication.tsx
@@ -7,14 +7,15 @@ import CommentIcon from '@mui/icons-material/Comment'
 
 import DataTable from 'components/DataTable/DataTable'
 import ModalAdministrationComment from 'components/Patient/PatientMedication/ModalAdministrationComment/ModalAdministrationComment'
+import SearchIcon from 'assets/icones/search.svg?react'
 
 import displayDigit from 'utils/displayDigit'
 
 import { Column, CohortMedication } from 'types'
 
 import useStyles from './styles'
 import { MedicationAdministration, MedicationRequest } from 'fhir/r4'
-import { OrderBy } from 'types/searchCriterias'
+import { Order, OrderBy } from 'types/searchCriterias'
 import { ResourceType } from 'types/requestCriterias'
 import { AppConfig } from 'config'
 
@@ -28,6 +29,8 @@ type DataTableMedicationProps = {
   page?: number
   setPage?: (page: number) => void
   total?: number
+  showIpp?: boolean
+  groupId?: string
 }
 const DataTableMedication: React.FC<DataTableMedicationProps> = ({
   loading,
@@ -38,20 +41,25 @@ const DataTableMedication: React.FC<DataTableMedicationProps> = ({
   setOrderBy,
   page,
   setPage,
-  total
+  total,
+  showIpp,
+  groupId
 }) => {
   const { classes } = useStyles()
 
   const columns = [
-    { label: `NDA${deidentified ? ' chiffré' : ''}`, code: 'encounter' },
+    ...(showIpp ? [{ label: `IPP${deidentified ? ' chiffré' : ''}`, align: 'left' }] : []),
+    { label: `NDA${deidentified ? ' chiffré' : ''}`, align: showIpp ? 'center' : 'left', code: Order.ENCOUNTER },
     {
       label: selectedTab === ResourceType.MEDICATION_REQUEST ? 'Date de prescription' : "Date d'administration",
-      code: 'Period-start'
+      code: Order.PERIOD_START
     },
-    { label: 'Code ATC', code: 'medication-atc' },
-    { label: 'Code UCD', code: 'medication-ucd' },
-    selectedTab === ResourceType.MEDICATION_REQUEST ? { label: 'Type de prescription', code: 'category-name' } : null,
-    { label: "Voie d'administration", code: 'route' },
+    { label: 'Code ATC', code: Order.MEDICATION_ATC },
+    { label: 'Code UCD', code: Order.MEDICATION_UCD },
+    selectedTab === ResourceType.MEDICATION_REQUEST
+      ? { label: 'Type de prescription', code: Order.PRESCRIPTION_TYPES }
+      : null,
+    { label: "Voie d'administration", code: Order.ADMINISTRATION_MODE },
     selectedTab === ResourceType.MEDICATION_ADMINISTRATION ? { label: 'Quantité' } : null,
     { label: 'Unité exécutrice' },
     selectedTab === ResourceType.MEDICATION_ADMINISTRATION && !deidentified ? { label: 'Commentaire' } : null
@@ -62,12 +70,20 @@ const DataTableMedication: React.FC<DataTableMedicationProps> = ({
       {!loading && medicationsList && medicationsList.length > 0 ? (
         <>
           {medicationsList.map((medication) => {
-            return <DataTableMedicationLine key={medication.id} deidentified={deidentified} medication={medication} />
+            return (
+              <DataTableMedicationLine
+                key={medication.id}
+                deidentified={deidentified}
+                medication={medication}
+                showIpp={showIpp}
+                groupId={groupId}
+              />
+            )
           })}
         </>
       ) : (
         <TableRow className={classes.emptyTableRow}>
-          <TableCellWrapper colSpan={8} align="left">
+          <TableCellWrapper colSpan={columns.length} align="left">
             <Grid container justifyContent="center">
               {loading ? (
                 <CircularProgress />
@@ -99,8 +115,8 @@ const getCodes = (
     )
 
   return [
-    coding && coding.code ? coding.code : 'Non Renseigné',
-    coding && coding.display ? coding.display : 'Non Renseigné',
+    coding?.code ? coding.code : 'Non Renseigné',
+    coding?.display ? coding.display : 'Non Renseigné',
     !!standardCoding,
     coding?.system
   ]
@@ -109,12 +125,15 @@ const getCodes = (
 const DataTableMedicationLine: React.FC<{
   medication: CohortMedication<MedicationRequest | MedicationAdministration>
   deidentified: boolean
-}> = ({ medication, deidentified }) => {
+  showIpp?: boolean
+  groupId?: string
+}> = ({ medication, deidentified, showIpp, groupId }) => {
   const { classes } = useStyles()
   const appConfig = useContext(AppConfig)
 
   const [open, setOpen] = useState<string | null>(null)
 
+  const ipp = medication.IPP
   const nda = medication.NDA
   const date =
     medication.resourceType === 'MedicationRequest'
@@ -144,8 +163,21 @@ const DataTableMedicationLine: React.FC<{
 
   const comment = medication.resourceType === 'MedicationAdministration' ? medication.dosage?.text : null
 
+  const groupIdSearch = groupId ? `?groupId=${groupId}` : ''
+
   return (
     <TableRow className={classes.tableBodyRows} key={medication.id}>
+      {showIpp && (
+        <TableCellWrapper style={{ minWidth: 150 }}>
+          {ipp}
+          <IconButton
+            onClick={() => window.open(`/patients/${medication.idPatient}${groupIdSearch}`, '_blank')}
+            className={classes.searchIcon}
+          >
+            <SearchIcon height="15px" fill="#ED6D91" className={classes.iconMargin} />
+          </IconButton>
+        </TableCellWrapper>
+      )}
       <TableCellWrapper align="left">{nda ?? 'Inconnu'}</TableCellWrapper>
       <TableCellWrapper>{date ? new Date(date).toLocaleDateString('fr-FR') : 'Date inconnue'}</TableCellWrapper>
       <TableCellWrapper>

diff --git a/src/components/Patient/PatientMedication/PatientMedication.tsx b/src/components/Patient/PatientMedication/PatientMedication.tsx
@@ -6,7 +6,7 @@ import FilterList from 'assets/icones/filter.svg?react'
 
 import DataTableMedication from 'components/DataTable/DataTableMedication'
 
-import { LoadingStatus, TabType } from 'types'
+import { LoadingStatus, MedicationTab, TabType } from 'types'
 
 import { useAppSelector, useAppDispatch } from 'state'
 import { fetchMedication } from 'state/patient'
@@ -55,6 +55,11 @@ type MedicationSearchResults = {
   label: string
 }
 
+export const medicationTabs: MedicationTab[] = [
+  { id: ResourceType.MEDICATION_REQUEST, label: MedicationLabel.PRESCRIPTION },
+  { id: ResourceType.MEDICATION_ADMINISTRATION, label: MedicationLabel.ADMINISTRATION }
+]
+
 const PatientMedication = ({ groupId }: PatientMedicationProps) => {
   const { classes } = useStyles()
   const [searchParams, setSearchParams] = useSearchParams()
@@ -80,17 +85,8 @@ const PatientMedication = ({ groupId }: PatientMedicationProps) => {
     id: ResourceType.MEDICATION_REQUEST,
     label: MedicationLabel.PRESCRIPTION
   })
-  const [oldTabs, setOldTabs] = useState<TabType<
-    ResourceType.MEDICATION_ADMINISTRATION | ResourceType.MEDICATION_REQUEST,
-    MedicationLabel
-  > | null>(null)
-  const medicationTabs: TabType<
-    ResourceType.MEDICATION_ADMINISTRATION | ResourceType.MEDICATION_REQUEST,
-    MedicationLabel
-  >[] = [
-    { id: ResourceType.MEDICATION_REQUEST, label: MedicationLabel.PRESCRIPTION },
-    { id: ResourceType.MEDICATION_ADMINISTRATION, label: MedicationLabel.ADMINISTRATION }
-  ]
+  const [oldTabs, setOldTabs] = useState<MedicationTab | null>(null)
+
   const {
     allSavedFilters,
     savedFiltersErrors,

diff --git a/src/mappers/medication.ts b/src/mappers/medication.ts
@@ -0,0 +1,14 @@
+import { ResourceType } from 'types/requestCriterias'
+import { Order } from 'types/searchCriterias'
+
+export const mapMedicationToOrderByCode = (
+  code: Order,
+  resourceType: ResourceType.MEDICATION_REQUEST | ResourceType.MEDICATION_ADMINISTRATION
+) => {
+  const dateName = {
+    [ResourceType.MEDICATION_REQUEST]: Order.PERIOD_START,
+    [ResourceType.MEDICATION_ADMINISTRATION]: Order.EFFECTIVE_TIME
+  }
+
+  return code === Order.PERIOD_START ? dateName[resourceType] : code
+}
diff --git a/src/reducers/searchCriteriasReducer.ts b/src/reducers/searchCriteriasReducer.ts
@@ -90,6 +90,7 @@ export const initMedSearchCriterias: SearchCriterias<MedicationFilters> = {
   searchBy: SearchByTypes.TEXT,
   filters: {
     nda: '',
+    ipp: '',
     startDate: null,
     endDate: null,
     executiveUnits: [],

diff --git a/src/services/aphp/callApi.ts b/src/services/aphp/callApi.ts
@@ -739,6 +739,7 @@ type fetchMedicationRequestProps = {
   sortDirection?: Direction
   _text?: string
   encounter?: string
+  patientIds?: string
   subject?: string
   type?: string[]
   minDate: string | null
@@ -747,6 +748,7 @@ type fetchMedicationRequestProps = {
   signal?: AbortSignal
   executiveUnits?: string[]
   encounterStatus?: string[]
+  uniqueFacet?: string[]
 }
 export const fetchMedicationRequest = async (
   args: fetchMedicationRequestProps
@@ -768,9 +770,10 @@ export const fetchMedicationRequest = async (
     encounterStatus
   } = args
   const _sortDirection = sortDirection === Direction.DESC ? '-' : ''
-  let { _list } = args
+  let { _list, uniqueFacet } = args
 
   _list = _list ? _list.filter(uniq) : []
+  uniqueFacet = uniqueFacet ? uniqueFacet.filter(uniq) : []
 
   // By default, all the calls to `/MedicationRequest` will have 'patient.active=true' in parameter
   let options: string[] = ['subject.active=true']
@@ -792,6 +795,8 @@ export const fetchMedicationRequest = async (
     options = [...options, `${PrescriptionParamsKeys.EXECUTIVE_UNITS}=${executiveUnits}`]
   if (encounterStatus && encounterStatus.length > 0)
     options = [...options, `${PrescriptionParamsKeys.ENCOUNTER_STATUS}=${encounterStatus}`]
+  if (uniqueFacet && uniqueFacet.length > 0)
+    options = [...options, `unique-facet=${uniqueFacet.reduce(paramValuesReducer, '')}`]
 
   if (_list && _list.length > 0) options = [...options, `_list=${_list.reduce(paramValuesReducer)}`]
 
@@ -821,6 +826,7 @@ type fetchMedicationAdministrationProps = {
   signal?: AbortSignal
   executiveUnits?: string[]
   encounterStatus?: string[]
+  uniqueFacet?: string[]
 }
 export const fetchMedicationAdministration = async (
   args: fetchMedicationAdministrationProps
@@ -842,9 +848,10 @@ export const fetchMedicationAdministration = async (
     encounterStatus
   } = args
   const _sortDirection = sortDirection === Direction.DESC ? '-' : ''
-  let { _list } = args
+  let { _list, uniqueFacet } = args
 
   _list = _list ? _list.filter(uniq) : []
+  uniqueFacet = uniqueFacet ? uniqueFacet.filter(uniq) : []
 
   // By default, all the calls to `/MedicationAdministration` will have 'patient.active=true' in parameter
   let options: string[] = ['subject.active=true']
@@ -866,6 +873,8 @@ export const fetchMedicationAdministration = async (
     options = [...options, `${AdministrationParamsKeys.EXECUTIVE_UNITS}=${executiveUnits}`] // eslint-disable-line
   if (encounterStatus && encounterStatus.length > 0)
     options = [...options, `${AdministrationParamsKeys.ENCOUNTER_STATUS}=${encounterStatus}`]
+  if (uniqueFacet && uniqueFacet.length > 0)
+    options = [...options, `unique-facet=${uniqueFacet.reduce(paramValuesReducer, '')}`]
 
   if (_list && _list.length > 0) options = [...options, `_list=${_list.reduce(paramValuesReducer)}`]