From 61942c45c4d3f399ac4d5fb73cb9ece6d8b5ba2f Mon Sep 17 00:00:00 2001 From: manishjha-04 Date: Sun, 17 Mar 2024 17:25:02 +0530 Subject: [PATCH 1/2] rewrite nonconformity reports --- frontend/src/App.js | 7 + frontend/src/components/Reports/Study.js | 16 +- .../Reports/study/common/ReportByDate.js | 141 ++++++++++++++++++ .../Reports/study/common/ReportByLabNo.js | 102 +++++++++++++ .../src/components/Reports/study/index.js | 100 +++++++++++++ frontend/src/languages/en.json | 6 + frontend/src/languages/fr.json | 6 + 7 files changed, 366 insertions(+), 12 deletions(-) create mode 100644 frontend/src/components/Reports/study/common/ReportByDate.js create mode 100644 frontend/src/components/Reports/study/common/ReportByLabNo.js create mode 100644 frontend/src/components/Reports/study/index.js diff --git a/frontend/src/App.js b/frontend/src/App.js index a2b20f641d..4e267f906d 100644 --- a/frontend/src/App.js +++ b/frontend/src/App.js @@ -34,6 +34,7 @@ import ImmunohistochemistryCaseView from "./components/immunohistochemistry/Immu import RoutedResultsViewer from "./components/patient/resultsViewer/results-viewer.tsx"; import EOrderPage from "./components/eOrder/Index"; import RoutineIndex from "./components/Reports/routine/Index.js"; +import StudyIndex from "./components/Reports/study/index.js"; import PrintBarcode from "./components/printBarcode/Index"; @@ -390,6 +391,12 @@ export default function App() { component={() => } role="Reports" /> + } + role="Reports" + /> , }, { - link: - config.serverBaseUrl + - "/Report?type=patient&report=retroCInonConformityBySectionReason", + link:"/StudyReport?type=patient&report=retroCInonConformityBySectionReason", label: config.serverBaseUrl + , }, { - link: - config.serverBaseUrl + - "/Report?type=patient&report=retroCINonConformityByLabno", + link:"/StudyReport?type=patient&report=retroCINonConformityByLabno", label: , }, { @@ -178,9 +172,7 @@ export const RoutineReportsMenu = { label: , }, { - link: - config.serverBaseUrl + - "/Report?type=patient&report=retroCIFollowupRequiredByLocation", + link:"/StudyReport?type=patient&report=retroCIFollowupRequiredByLocation", label:, }, ], diff --git a/frontend/src/components/Reports/study/common/ReportByDate.js b/frontend/src/components/Reports/study/common/ReportByDate.js new file mode 100644 index 0000000000..5797565d50 --- /dev/null +++ b/frontend/src/components/Reports/study/common/ReportByDate.js @@ -0,0 +1,141 @@ +import React, { useEffect, useState } from 'react'; +import { + Form, + FormLabel, + Grid, + Column, + Section, + Button, + Loading, + } from "@carbon/react"; +import { FormattedMessage, useIntl } from 'react-intl'; +import "../../../Style.css"; +import { AlertDialog } from "../../../common/CustomNotification"; +import CustomDatePicker from "../../../common/CustomDatePicker"; +import config from "../../../../config.json"; + + +const ReportByDate = (props) => { + const intl = useIntl(); + const [loading, setLoading] = useState(false); + const [notificationVisible, setNotificationVisible] = useState(false); + const [reportFormValues, setReportFormValues] = useState({ + startDate: null, + endDate: null + }); + + + + function encodeDate(dateString) { + if (typeof dateString === "string" && dateString.trim() !== "") { + return dateString.split("/").map(encodeURIComponent).join("%2F"); + } else { + return ""; + } + } + + const handleDatePickerChangeDate = (datePicker, date) => { + let updatedDate = encodeDate(date); + let obj = null; + switch (datePicker) { + case "startDate": + obj = { + ...reportFormValues, + startDate: updatedDate, + }; + break; + case "endDate": + obj = { + ...reportFormValues, + endDate: updatedDate, + }; + break; + default: + } + setReportFormValues(obj); + }; + + const handleSubmit = () => { + setLoading(true); + + const baseParams = `report=${props.report}&type=patient`; + const baseUrl = `${config.serverBaseUrl}/ReportPrint`; + const url = `${baseUrl}?${baseParams}&upperDateRange=${reportFormValues.startDate}&lowerDateRange=${reportFormValues.endDate}`; + + window.open(url, '_blank'); + setLoading(false); + setNotificationVisible(true); + }; + + return ( + <> + +
+
+

+ +

+
+
+ + {notificationVisible && } + {loading && } + + +
+ + +
+
+
+
+ + +
+
+
+ + handleDatePickerChangeDate("startDate", date) + } + /> + + handleDatePickerChangeDate("endDate", date) + } + /> +
+ + +
+
+
+ +
+
+ + + + + ); +}; + +export default ReportByDate; \ No newline at end of file diff --git a/frontend/src/components/Reports/study/common/ReportByLabNo.js b/frontend/src/components/Reports/study/common/ReportByLabNo.js new file mode 100644 index 0000000000..ddb843b04b --- /dev/null +++ b/frontend/src/components/Reports/study/common/ReportByLabNo.js @@ -0,0 +1,102 @@ +import React, { useState } from "react"; +import { FormattedMessage, injectIntl, useIntl } from "react-intl"; +import { Form, Grid, Column, Section, Button } from "@carbon/react"; +import CustomLabNumberInput from "../../../common/CustomLabNumberInput"; +import config from "../../../../config.json"; + + +function ReportByLabNo(props) { + + const intl = useIntl(); + const [values, setValues] = useState({ from: '', to: '' }); + + const handleChange = (e) => { + const { name, value } = e.target; + setValues(prevState => ({ + ...prevState, + [name]: value + })); + }; + + const handleSubmit = (e) => { + e.preventDefault(); + + const baseParams = `report=${props.report}&type=patient`; + const baseUrl = `${config.serverBaseUrl}/ReportPrint`; + const url = `${baseUrl}?${baseParams}&accessionDirect=${values.from}&highAccessionDirect=${values.to}`; + + window.open(url, '_blank'); + }; + + return ( + <> +
+ +
+
+

+ +

+
+
+
+ + +
+
+ +
+ + + + +
+ + +
+ + + + + + + + + +
+
+ + +
+ +
+ + +
+ + ); +} + +export default injectIntl(ReportByLabNo); \ No newline at end of file diff --git a/frontend/src/components/Reports/study/index.js b/frontend/src/components/Reports/study/index.js new file mode 100644 index 0000000000..2353a58a74 --- /dev/null +++ b/frontend/src/components/Reports/study/index.js @@ -0,0 +1,100 @@ +import React, { useContext, useState, useEffect } from "react"; +import { AlertDialog } from "../../common/CustomNotification"; +import { NotificationContext } from "../../layout/Layout"; +import { + Heading, + Grid, + Column, + Section, + Breadcrumb, + BreadcrumbItem, + Loading, +} from "@carbon/react"; +import { injectIntl, FormattedMessage, useIntl } from "react-intl"; +import ReportByDate from "./common/ReportByDate"; +import ReportByLabNo from "./common/ReportByLabNo"; +import PageBreadCrumb from "../../common/PageBreadCrumb"; + +const StudyIndex = () => { + const intl = useIntl(); + const { setNotificationVisible, addNotification, notificationVisible } = useContext(NotificationContext); + + const [type, setType] = useState(""); + const [report, setReport] = useState(""); + const [source, setSource] = useState(""); + const [isLoading, setIsLoading] = useState(true); + const [breadcrumbs, setBreadcrumbs] = useState([]); + const breadcrumbMap = { + "patient_retroCINonConformityByDate": "header.label.nonconformityByDate", + "patient_retroCInonConformityBySectionReason": "reports.nonConformity.bySectionReason.title", + "patient_retroCINonConformityByLabno": "header.label.intialFollowup", + "patient_retroCIFollowupRequiredByLocation": "reports.followupRequired.byLocation" + }; + + useEffect(() => { + const params = new URLSearchParams(window.location.search); + const paramType = params.get("type"); + const paramReport = params.get("report"); + + setType(paramType); + setReport(paramReport); + + // Updating breadcrumbs based on paramType and paramReport + if (paramType && paramReport) { + const breadcrumbId = breadcrumbMap[`${paramType}_${paramReport}`]; + if (breadcrumbId) { + const breadcrumbLabel = intl.formatMessage({ id: breadcrumbId }); + setBreadcrumbs([ + { label: intl.formatMessage({ id: "home.label" }), link: "/" }, + { label: intl.formatMessage({ id: "label.study.Reports" }), link: "/StudyReports" }, + { + label: breadcrumbLabel, + link: `/StudyReport?type=${paramType}&report=${paramReport}`, + }, + ]); + } + setIsLoading(false); + } else { + window.location.href = "/StudyReports"; + } + }, [type, report]); + + return ( + <> +
+ + + +
+
+ + + +
+
+ + +
+ {notificationVisible === true && } + {isLoading && } + {!isLoading && ( + <> + {type === "patient" && report === "retroCINonConformityByDate" && + ()} + + {type === "patient" && report === "retroCInonConformityBySectionReason" && + ()} + + {type === "patient" && report === "retroCINonConformityByLabno" && + ()} + + {type === "patient" && report === "retroCIFollowupRequiredByLocation" && + ()} + + )} +
+ + ); +}; + +export default injectIntl(StudyIndex); \ No newline at end of file diff --git a/frontend/src/languages/en.json b/frontend/src/languages/en.json index c549da6c76..6719c35368 100644 --- a/frontend/src/languages/en.json +++ b/frontend/src/languages/en.json @@ -12,6 +12,9 @@ "label.button.confirmAction": "Confirm Action", "label.button.confirmTitle": "Are You Sure ?", "label.button.generatePrintableVersion": "Generate Printable Version", + "label.study.Reports":"Study Reports", + "report.enter.labNumber.headline":"Generate a report or range of reports by Lab Number", + "sample.search.scanner.instructions":"Scan or Enter Manually. For a single report, leave the box at the right empty", "login.title": "Login", "login.subtitle": "Login", "login.msg.username": "Username", @@ -649,6 +652,8 @@ "header.rejection.reason":"Reject Reason", "header.reject":"Reject", "header.ID":"ID", + "header.label.intialFollowup": "ARV -->Initial-FollowUp-VL", + "header.label.nonconformityByDate": "Non-conformity Report By Date", "label.equals":"equals", "label.notequals":"does not equal", "label.inside.normalrange":"is inside the normal range", @@ -656,6 +661,7 @@ "label.any":"Any", "label.test.add":"Add test to order", "label.add.notification":"Add pop up notification to user", + "label.select.dateRange":"Select the Date Range you want the Report For", "rulebuilder.label.add.internaltrigger":"Add Internal `triggered by` message", "rulebuilder.label.add.externaltrigger":"Add External `triggered by` message", "error.duplicate.calculationname":"Duplicate Calculation Name or Error while saving", diff --git a/frontend/src/languages/fr.json b/frontend/src/languages/fr.json index 6e6f7dcf3b..57fa7acc1a 100644 --- a/frontend/src/languages/fr.json +++ b/frontend/src/languages/fr.json @@ -17,6 +17,9 @@ "label.button.confirmDelete": "Confirmation de la suppression", "label.button.generatePrintableVersion": "Générer une version imprimable", "login.title": "Identifiant", + "label.study.Reports":"Études Rapports", + "report.enter.labNumber.headline": "Générer un rapport ou une plage de rapports par numéro de numéro de laboratoire", + "sample.search.scanner.instructions": "Scanner ou saisir manuellement.Pour un seul rapport, laissez la case à droite vide", "login.subtitle": "Identifiant", "login.msg.username": "Nom d'utilisateur", "login.msg.password": "Mot de passe", @@ -155,6 +158,8 @@ "header.label.version" :"Version:", "header.label.logout" :"Déconnexion", "header.label.selectlocale": "Sélectionner la Langue", + "header.label.intialFollowup": "ARV -->Suivi initial-VL", + "header.label.nonconformityByDate": "Rapport de non-conformité par date", "banner.menu.sample" : "Commande", "banner.menu.sampleAdd" : "Ajouter une commande", "banner.menu.sampleEdit" : "Modifier la commande", @@ -269,6 +274,7 @@ "order.title": "COMMANDE", "label.text.generate": "générer", "label.order.scan.text": "Scanner OU Saisir manuellement OU", + "label.select.dateRange":"Sélectionnez la plage de dates pour laquelle vous souhaitez le rapport", "order.reception.time": "Heure de réception (hh:mm) :", "order.site.name": "Nom du site:", "order.search.site.name": "Rechercher le nom du site", From 232a50e35d5ca11de041c7535c4aa9526e5e9d8e Mon Sep 17 00:00:00 2001 From: manishjha-04 Date: Sun, 17 Mar 2024 18:07:46 +0530 Subject: [PATCH 2/2] made responsive --- .../Reports/study/common/ReportByDate.js | 31 ++++++------- .../Reports/study/common/ReportByLabNo.js | 45 ++++++++----------- 2 files changed, 32 insertions(+), 44 deletions(-) diff --git a/frontend/src/components/Reports/study/common/ReportByDate.js b/frontend/src/components/Reports/study/common/ReportByDate.js index 5797565d50..28e01ad58b 100644 --- a/frontend/src/components/Reports/study/common/ReportByDate.js +++ b/frontend/src/components/Reports/study/common/ReportByDate.js @@ -1,20 +1,19 @@ import React, { useEffect, useState } from 'react'; import { - Form, - FormLabel, - Grid, - Column, - Section, - Button, - Loading, - } from "@carbon/react"; + Form, + FormLabel, + Grid, + Column, + Section, + Button, + Loading, +} from "@carbon/react"; import { FormattedMessage, useIntl } from 'react-intl'; import "../../../Style.css"; import { AlertDialog } from "../../../common/CustomNotification"; import CustomDatePicker from "../../../common/CustomDatePicker"; import config from "../../../../config.json"; - const ReportByDate = (props) => { const intl = useIntl(); const [loading, setLoading] = useState(false); @@ -24,8 +23,6 @@ const ReportByDate = (props) => { endDate: null }); - - function encodeDate(dateString) { if (typeof dateString === "string" && dateString.trim() !== "") { return dateString.split("/").map(encodeURIComponent).join("%2F"); @@ -73,24 +70,23 @@ const ReportByDate = (props) => {

- -

+ +
{notificationVisible && } {loading && } - +
- +


- - +
@@ -133,7 +129,6 @@ const ReportByDate = (props) => { - ); }; diff --git a/frontend/src/components/Reports/study/common/ReportByLabNo.js b/frontend/src/components/Reports/study/common/ReportByLabNo.js index ddb843b04b..80f868ac9a 100644 --- a/frontend/src/components/Reports/study/common/ReportByLabNo.js +++ b/frontend/src/components/Reports/study/common/ReportByLabNo.js @@ -4,9 +4,7 @@ import { Form, Grid, Column, Section, Button } from "@carbon/react"; import CustomLabNumberInput from "../../../common/CustomLabNumberInput"; import config from "../../../../config.json"; - function ReportByLabNo(props) { - const intl = useIntl(); const [values, setValues] = useState({ from: '', to: '' }); @@ -26,36 +24,32 @@ function ReportByLabNo(props) { const url = `${baseUrl}?${baseParams}&accessionDirect=${values.from}&highAccessionDirect=${values.to}`; window.open(url, '_blank'); - }; + }; return ( <>
- -
+
+

+ +

+
+
+ +
-

- -

-
-
-
- - -
- -
+
- + - + -
-
+
- -
- -
+ +
+ +