Skip to content

Commit

Permalink
ft : order status color (#9)
Browse files Browse the repository at this point in the history 
* ft : order status color

* ft : add lab results view

* ft : add resulting lab tests

* ft : change expectedResults to range column

* ft : add results

* ft : add ranges

* ft : fix

* ft : fix lab
  • Loading branch information
@jabahum
jabahum authored Oct 26, 2023
1 parent 23bf5ea commit 9ae952d
Show file tree
Hide file tree
Showing 19 changed files with 878 additions and 143 deletions.
38 changes: 19 additions & 19 deletions i18next-parser.config.js
View file
Original file line number Diff line number Diff line change
@@ -1,14 +1,14 @@
module.exports = {
contextSeparator: '_',
contextSeparator: "_",
// Key separator used in your translation keys

createOldCatalogs: false,
// Save the \_old files

defaultNamespace: 'translations',
defaultNamespace: "translations",
// Default namespace used in your i18next config

defaultValue: '',
defaultValue: "",
// Default value to give to empty keys
// You may also specify a function accepting the locale, namespace, and key as arguments

Expand All @@ -18,43 +18,43 @@ module.exports = {
keepRemoved: false,
// Keep keys from the catalog that are no longer in code

keySeparator: '.',
keySeparator: ".",
// Key separator used in your translation keys
// If you want to use plain english keys, separators such as `.` and `:` will conflict. You might want to set `keySeparator: false` and `namespaceSeparator: false`. That way, `t('Status: Loading...')` will not think that there are a namespace and three separator dots for instance.

// see below for more details
lexers: {
hbs: ['HandlebarsLexer'],
handlebars: ['HandlebarsLexer'],
hbs: ["HandlebarsLexer"],
handlebars: ["HandlebarsLexer"],

htm: ['HTMLLexer'],
html: ['HTMLLexer'],
htm: ["HTMLLexer"],
html: ["HTMLLexer"],

mjs: ['JavascriptLexer'],
js: ['JavascriptLexer'], // if you're writing jsx inside .js files, change this to JsxLexer
ts: ['JavascriptLexer'],
jsx: ['JsxLexer'],
tsx: ['JsxLexer'],
mjs: ["JavascriptLexer"],
js: ["JavascriptLexer"], // if you're writing jsx inside .js files, change this to JsxLexer
ts: ["JavascriptLexer"],
jsx: ["JsxLexer"],
tsx: ["JsxLexer"],

default: ['JavascriptLexer'],
default: ["JavascriptLexer"],
},

lineEnding: 'auto',
lineEnding: "auto",
// Control the line ending. See options at https://github.com/ryanve/eol

locales: ['en', 'am', 'es', 'fr', 'km', 'he'],
locales: ["en", "am", "es", "fr", "km", "he"],
// An array of the locales in your applications

namespaceSeparator: ':',
namespaceSeparator: ":",
// Namespace separator used in your translation keys
// If you want to use plain english keys, separators such as `.` and `:` will conflict. You might want to set `keySeparator: false` and `namespaceSeparator: false`. That way, `t('Status: Loading...')` will not think that there are a namespace and three separator dots for instance.

output: '$NAMESPACE/$LOCALE.json',
output: "$NAMESPACE/$LOCALE.json",
// Supports $LOCALE and $NAMESPACE injection
// Supports JSON (.json) and YAML (.yml) file formats
// Where to write the locale files relative to process.cwd()

pluralSeparator: '_',
pluralSeparator: "_",
// Plural separator used in your translation keys
// If you want to use plain english keys, separators such as `_` might conflict. You might want to set `pluralSeparator` to a different string that does not occur in your keys.

Expand Down
2 changes: 1 addition & 1 deletion package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@
"main": "src/index.ts",
"source": true,
"scripts": {
"start": "openmrs develop --backend http://167.71.32.250:8080",
"start": "openmrs develop --backend https://ugandaemr-backend.mets.or.ug",
"serve": "webpack serve --mode=development",
"build": "webpack --mode production",
"analyze": "webpack --mode=production --env analyze=true",
Expand Down
5 changes: 5 additions & 0 deletions src/config-schema.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,6 +21,11 @@ export const configSchema = {
_default: "214e27a1-606a-4b1e-a96e-d736c87069d5",
_description: "Concept uuid for the laboratory tool encounter type.",
},
laboratoryOrderTypeUuid: {
_type: Type.String,
_default: "52a447d3-a64a-11e3-9aeb-50e549534c5e",
_description: "Uuid for orderType",
},
};

export type Config = {
Expand Down
9 changes: 5 additions & 4 deletions src/patient-chart/laboratory-item/view-laboratory-item.component.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,24 +3,25 @@ import { useTranslation } from "react-i18next";
import { Button, Tooltip } from "@carbon/react";
import { View } from "@carbon/react/icons";
import { launchPatientWorkspace } from "@openmrs/esm-patient-common-lib";
import { EncounterResponse } from "./view-laboratory-item.resource";

interface ViewLaboratoryItemActionMenuProps {
closeModal: () => void;
encounterUuid: string;
encounter: EncounterResponse;
}

const ViewLaboratoryItemActionMenu: React.FC<
ViewLaboratoryItemActionMenuProps
> = ({ encounterUuid }) => {
> = ({ encounter }) => {
const { t } = useTranslation();

const handleClick = useCallback(
() =>
launchPatientWorkspace("results-summary", {
workspaceTitle: `Results Summary Form`,
encounterUuid,
encounter,
}),
[encounterUuid]
[encounter]
);

return (
Expand Down
2 changes: 1 addition & 1 deletion src/patient-chart/laboratory-item/view-laboratory-item.resource.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -136,7 +136,7 @@ export interface Ob {
groupMembers: any;
comment: any;
location: Location2;
order: any;
order: Order;
encounter: Encounter;
voided: boolean;
value: any;
Expand Down
108 changes: 89 additions & 19 deletions src/patient-chart/laboratory-order.component.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,7 @@ import {
openmrsFetch,
parseDate,
ErrorState,
useLayoutType,
} from "@openmrs/esm-framework";

import {
Expand All @@ -29,9 +30,13 @@ import {
DataTableHeader,
Tile,
Pagination,
TableExpandHeader,
TableExpandRow,
TableExpandedRow,
} from "@carbon/react";
import ViewLaboratoryItemActionMenu from "./laboratory-item/view-laboratory-item.component";
import { useLabOrders } from "./laboratory-order.resource";
import { getOrderColor, useLabOrders } from "./laboratory-order.resource";
import TestsResults from "./results-summary/test-results-table.component";

interface LaboratoryOrderOverviewProps {
patientUuid: string;
Expand All @@ -50,6 +55,8 @@ const LaboratoryOrder: React.FC<LaboratoryOrderOverviewProps> = ({
}) => {
const { t } = useTranslation();

const isTablet = useLayoutType() === "tablet";

const {
labRequests,
isLoading: loading,
Expand All @@ -70,8 +77,8 @@ const LaboratoryOrder: React.FC<LaboratoryOrderOverviewProps> = ({
let columns = [
{
id: 0,
header: t("encounterDate", "Encouter Date"),
key: "encounterDate",
header: t("orderDate", "Order Date"),
key: "orderDate",
},
{ id: 1, header: t("orders", "Order"), key: "orders" },
{ id: 2, header: t("location", "Location"), key: "location" },
Expand Down Expand Up @@ -135,11 +142,11 @@ const LaboratoryOrder: React.FC<LaboratoryOrderOverviewProps> = ({
return paginatedLabEntries?.map((entry) => ({
...entry,
id: entry.uuid,
encounterDate: {
orderDate: {
content: (
<span>
{formatDate(parseDate(entry.encounterDatetime), {
time: true,
time: false,
})}
</span>
),
Expand All @@ -148,17 +155,22 @@ const LaboratoryOrder: React.FC<LaboratoryOrderOverviewProps> = ({
content: (
<>
{entry.orders.map((order) => {
return (
<Tag
style={{
background: "rgb(111 111 111 / 97%)",
color: "white",
}}
role="tooltip"
>
{order?.concept?.display}
</Tag>
);
if (order?.type === "testorder") {
return (
<Tag
style={{
background: `${getOrderColor(
order.dateActivated,
order.dateStopped
)}`,
color: "white",
}}
role="tooltip"
>
{order?.concept?.display}
</Tag>
);
}
})}
</>
),
Expand All @@ -174,7 +186,7 @@ const LaboratoryOrder: React.FC<LaboratoryOrderOverviewProps> = ({
<>
<ViewLaboratoryItemActionMenu
closeModal={() => true}
encounterUuid={entry.uuid}
encounter={entry}
/>
</>
),
Expand All @@ -198,6 +210,7 @@ const LaboratoryOrder: React.FC<LaboratoryOrderOverviewProps> = ({
headers={columns}
useZebraStyles
filterRows={handleFilter}
size={isTablet ? "lg" : "sm"}
>
{({ rows, headers, getHeaderProps, getTableProps, getRowProps }) => (
<TableContainer className={styles.tableContainer}>
Expand All @@ -210,6 +223,47 @@ const LaboratoryOrder: React.FC<LaboratoryOrderOverviewProps> = ({
}}
>
<TableToolbarContent>
<div
style={{
fontSize: "10px",
margin: "5px",
display: "flex",
flexDirection: "row",
alignItems: "center",
}}
>
Key:
<Tag
size="sm"
style={{
background: "green",
color: "white",
}}
title="Result Complete"
>
{"Completed"}
</Tag>
<Tag
size="sm"
style={{
background: "red",
color: "white",
}}
title="Result Rejected"
>
{"Rejected"}
</Tag>
<Tag
size="sm"
style={{
background: "#6F6F6F",
color: "white",
}}
title="Result Requested"
>
{"Requested"}
</Tag>
</div>
<Layer>
<TableToolbarSearch
value={searchTerm}
Expand All @@ -226,6 +280,7 @@ const LaboratoryOrder: React.FC<LaboratoryOrderOverviewProps> = ({
>
<TableHead>
<TableRow>
<TableExpandHeader />
{headers.map((header) => (
<TableHeader {...getHeaderProps({ header })}>
{header.header}
Expand All @@ -237,13 +292,28 @@ const LaboratoryOrder: React.FC<LaboratoryOrderOverviewProps> = ({
{rows.map((row, index) => {
return (
<React.Fragment key={row.id}>
<TableRow {...getRowProps({ row })}>
<TableExpandRow {...getRowProps({ row })}>
{row.cells.map((cell) => (
<TableCell key={cell.id}>
{cell.value?.content ?? cell.value}
</TableCell>
))}
</TableRow>
</TableExpandRow>
{row.isExpanded ? (
<TableExpandedRow
className={styles.expandedActiveVisitRow}
colSpan={headers.length + 2}
>
<TestsResults
obs={paginatedLabEntries[index].obs}
/>
</TableExpandedRow>
) : (
<TableExpandedRow
className={styles.hiddenRow}
colSpan={headers.length + 2}
/>
)}
</React.Fragment>
);
})}
Expand Down
Loading

0 comments on commit 9ae952d

Please sign in to comment.