Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

More Improvements on Program Dasboards #634

Merged
merged 4 commits into from
Dec 6, 2023
Merged

More Improvements on Program Dasboards #634

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
29e39b1
Apply a specific single filter for default programm dashboards filter
mozzy11 Dec 6, 2023
cc78866
Ready for Release should only be available when Lab tech and patholog…
mozzy11 Dec 6, 2023
57a6f3d
fix confirm dialogue box
mozzy11 Dec 6, 2023
02800ca
add confirm popup when selecting negative diagnosis for Cytology
mozzy11 Dec 6, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
8 changes: 0 additions & 8 deletions frontend/src/components/admin/calculatedValue/CalculatedValueForm.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -81,7 +81,6 @@ const CalculatedValue: React.FC<CalculatedValueProps> = () => {
const [calculationList, setCalculationList] = useState([
CalculatedValueFormValues,
]);
const [showConfirmBox, setShowConfirmBox] = useState(true);
const [sampleList, setSampleList] = useState([]);
const [sampleTestList, setSampleTestList] = useState(TestListObj);
const [loading, setLoading] = useState(true);
Expand Down Expand Up @@ -172,7 +171,6 @@ const CalculatedValue: React.FC<CalculatedValueProps> = () => {
handleDelete,
);
}
setShowConfirmBox(false);
};

const handleDelete = (status) => {
Expand All @@ -192,9 +190,6 @@ const CalculatedValue: React.FC<CalculatedValueProps> = () => {
}
};

const handleCancelDelete = () => {
setShowConfirmBox(false);
};

const addOperation = (index: number, type: OperationType) => {
const list = [...calculationList];
Expand Down Expand Up @@ -917,10 +912,7 @@ const CalculatedValue: React.FC<CalculatedValueProps> = () => {
modalLabel={
<FormattedMessage id="label.button.confirmDelete" />
}
open={showConfirmBox}
onRequestClose={() => setShowConfirmBox(false)}
handleSubmit={() => handleRuleRemove(index, calculation.id)}
onSecondarySubmit={handleCancelDelete}
primaryButtonText={
<FormattedMessage id="label.button.confirm" />
}
Expand Down
8 changes: 0 additions & 8 deletions frontend/src/components/admin/reflexTests/ReflexRuleForm.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -85,7 +85,6 @@ function ReflexRule() {
const [errors, setErrors] = useState({});
const { notificationVisible, setNotificationVisible, setNotificationBody } =
useContext(NotificationContext);
const [showConfirmBox, setShowConfirmBox] = useState(true);

useEffect(() => {
getFromOpenElisServer("/rest/samples", fetchSamples);
Expand Down Expand Up @@ -266,9 +265,6 @@ function ReflexRule() {
);
};

const handleCancelDelete = () => {
setShowConfirmBox(false);
};

const handleRuleRemove = (index, id) => {
const list = [...ruleList];
Expand All @@ -281,7 +277,6 @@ function ReflexRule() {
handleDelete,
);
}
setShowConfirmBox(false);
};

const handleDelete = (status) => {
Expand Down Expand Up @@ -1152,10 +1147,7 @@ function ReflexRule() {
modalLabel={
<FormattedMessage id="label.button.confirmDelete" />
}
open={showConfirmBox}
onRequestClose={() => setShowConfirmBox(false)}
handleSubmit={() => handleRuleRemove(index, rule.id)}
onSecondarySubmit={handleCancelDelete}
primaryButtonText={
<FormattedMessage id="label.button.confirm" />
}
Expand Down
39 changes: 39 additions & 0 deletions frontend/src/components/common/ConfirmPopup.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,39 @@
import React from "react";
import {
Button,
ComposedModal,
ModalHeader,
ModalBody,
ModalFooter,
} from "@carbon/react";

import { FormattedMessage, useIntl } from "react-intl";

const ConfirmPopup = ({ isOpen, onClose, onConfirm, messageCode }) => {
const intl = useIntl();
return (
<ComposedModal open={isOpen} onClose={onClose}>
<ModalHeader
label={intl.formatMessage({
id: "label.button.confirmAction",
})}
title={intl.formatMessage({
id: "label.button.confirmTitle",
})}
/>
<ModalBody>
<FormattedMessage id={messageCode} />
</ModalBody>
<ModalFooter>
<Button kind="secondary" onClick={onClose}>
<FormattedMessage id="label.button.cancel" />
</Button>
<Button kind="primary" onClick={onConfirm}>
<FormattedMessage id="label.button.confirm" />
</Button>
</ModalFooter>
</ComposedModal>
);
};

export default ConfirmPopup;
129 changes: 85 additions & 44 deletions frontend/src/components/cytology/CytologyCaseView.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,7 @@ import {
Loading,
RadioButtonGroup,
RadioButton,
InlineLoading
InlineLoading,
} from "@carbon/react";
import { Launch, Subtract } from "@carbon/react/icons";
import {
Expand All @@ -33,6 +33,7 @@ import UserSessionDetailsContext from "../../UserSessionDetailsContext";
import { NotificationContext } from "../layout/Layout";
import { AlertDialog, NotificationKinds } from "../common/CustomNotification";
import { FormattedMessage, useIntl } from "react-intl";
import ConfirmPopup from "../common/ConfirmPopup";
import "../pathology/PathologyDashboard.css";

export const QuestionnaireResponse = ({ questionnaireResponse }) => {
Expand Down Expand Up @@ -141,6 +142,18 @@ function CytologyCaseView() {
const [reportTypes, setReportTypes] = useState([]);
const intl = useIntl();
const [slidesToAdd, setSlidesToAdd] = useState(1);
const [isConfirmOpen, setConfirmOpen] = useState(false);

const handleConfirm = () => {
var diagnosis = { ...pathologySampleInfo.diagnosis };
diagnosis.negativeDiagnosis = true;
diagnosis.diagnosisResultsMaps = [];
setPathologySampleInfo({
...pathologySampleInfo,
diagnosis: diagnosis,
});
setConfirmOpen(false);
};

async function displayStatus(response) {
var body = await response.json();
Expand Down Expand Up @@ -168,7 +181,7 @@ function CytologyCaseView() {

const reportStatus = (pdfGenerated) => {
setNotificationVisible(true);
setLoadingReport(false)
setLoadingReport(false);
if (pdfGenerated) {
setNotificationBody({
kind: NotificationKinds.success,
Expand All @@ -182,8 +195,7 @@ function CytologyCaseView() {
message: "Error while Generating Report",
});
}
}

};

const toBase64 = (file) =>
new Promise((resolve, reject) => {
Expand Down Expand Up @@ -487,6 +499,12 @@ function CytologyCaseView() {
<Grid fullWidth={true} className="orderLegendBody">
{notificationVisible === true ? <AlertDialog /> : ""}
{loading && <Loading description="Loading Dasboard..." />}
<ConfirmPopup
isOpen={isConfirmOpen}
onClose={() => setConfirmOpen(false)}
onConfirm={handleConfirm}
messageCode="cytology.label.confirmSelect"
/>
<Column lg={16} md={8} sm={4}>
<Button
id="pathology_save"
Expand Down Expand Up @@ -585,7 +603,9 @@ function CytologyCaseView() {
<>
<Column lg={2} md={8} sm={4}>
<IconButton
label={intl.formatMessage({ id: "label.button.remove.slide" })}
label={intl.formatMessage({
id: "label.button.remove.slide",
})}
onClick={() => {
var info = { ...pathologySampleInfo };
info["slides"].splice(index, 1);
Expand All @@ -605,7 +625,9 @@ function CytologyCaseView() {
<FormattedMessage id="pathology.label.slide.number" />
}
hideLabel={true}
placeholder={intl.formatMessage({ id: "pathology.label.slide.number" })}
placeholder={intl.formatMessage({
id: "pathology.label.slide.number",
})}
value={slide.slideNumber}
type="number"
onChange={(e) => {
Expand All @@ -625,7 +647,9 @@ function CytologyCaseView() {
<FormattedMessage id="pathology.label.location" />
}
hideLabel={true}
placeholder={intl.formatMessage({ id: "pathology.label.location" })}
placeholder={intl.formatMessage({
id: "pathology.label.location",
})}
value={slide.location}
onChange={(e) => {
var newSlides = [...pathologySampleInfo.slides];
Expand Down Expand Up @@ -711,13 +735,17 @@ function CytologyCaseView() {
<Column lg={2} md={8} sm={4}>
<TextInput
id="slidesToAdd"
labelText={intl.formatMessage({ id: "pathology.label.slide.add.number" })}
labelText={intl.formatMessage({
id: "pathology.label.slide.add.number",
})}
hideLabel={true}
placeholder={intl.formatMessage({ id: "pathology.label.slide.add.number" })}
placeholder={intl.formatMessage({
id: "pathology.label.slide.add.number",
})}
value={slidesToAdd}
type="number"
onChange={(e) => {
setSlidesToAdd(e.target.value);
onChange={(e) => {
setSlidesToAdd(e.target.value);
}}
/>
</Column>
Expand All @@ -726,23 +754,23 @@ function CytologyCaseView() {
onClick={() => {
const maxSlideNumber = pathologySampleInfo.slides.reduce(
(max, slide) => {
const slideNumber = slide.slideNumber || 0;
const slideNumber = slide.slideNumber || 0;
return Math.ceil(Math.max(max, slideNumber));
},
0,
);
);

var allSlides = pathologySampleInfo.slides || [];
Array.from({ length: slidesToAdd }, (_, index) => {
allSlides.push({
id: "",
slideNumber: maxSlideNumber + 1 + index,
});
})
});

setPathologySampleInfo({
...pathologySampleInfo,
slides: allSlides
slides: allSlides,
});
}}
>
Expand Down Expand Up @@ -774,7 +802,9 @@ function CytologyCaseView() {
<SelectItem
disabled
value="ADD"
text={intl.formatMessage({ id: "immunohistochemistry.label.addreport" })}
text={intl.formatMessage({
id: "immunohistochemistry.label.addreport",
})}
/>
{reportTypes.map((report, index) => {
return (
Expand Down Expand Up @@ -803,7 +833,9 @@ function CytologyCaseView() {
<>
<Column lg={2} md={8} sm={4}>
<IconButton
label={intl.formatMessage({ id: "label.button.remove.report" })}
label={intl.formatMessage({
id: "label.button.remove.report",
})}
onClick={() => {
var info = { ...pathologySampleInfo };
info["reports"].splice(index, 1);
Expand Down Expand Up @@ -849,11 +881,13 @@ function CytologyCaseView() {
/>
</Column>
<Column lg={4}>
<h6>{
reportTypes.filter(
(type) => type.id === report.reportType,
)[0]?.value
}</h6>
<h6>
{
reportTypes.filter(
(type) => type.id === report.reportType,
)[0]?.value
}
</h6>
</Column>
<Column lg={2} md={1} sm={2}>
{pathologySampleInfo.reports[index].image && (
Expand All @@ -878,7 +912,7 @@ function CytologyCaseView() {
</Column>
<Column lg={3} md={2} sm={2}>
<Button
id ={"generate_report_"+index}
id={"generate_report_" + index}
onClick={(e) => {
setLoadingReport(true);
const form = {
Expand All @@ -896,7 +930,7 @@ function CytologyCaseView() {
<FormattedMessage id="button.label.genarateReport" />
</Button>
</Column>
<Column lg={2} md={2} sm={2}/>
<Column lg={2} md={2} sm={2} />
<Column lg={16} md={8} sm={4}>
<div> &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;</div>
</Column>
Expand Down Expand Up @@ -1035,13 +1069,17 @@ function CytologyCaseView() {
labelText={<FormattedMessage id="cytology.label.negative" />}
id="checked"
onChange={(e) => {
var diagnosis = { ...pathologySampleInfo.diagnosis };
diagnosis.negativeDiagnosis = e.target.checked;
diagnosis.diagnosisResultsMaps = [];
setPathologySampleInfo({
...pathologySampleInfo,
diagnosis: diagnosis,
});
if (e.target.checked) {
setConfirmOpen(true);
} else {
var diagnosis = { ...pathologySampleInfo.diagnosis };
diagnosis.negativeDiagnosis = e.target.checked;
diagnosis.diagnosisResultsMaps = [];
setPathologySampleInfo({
...pathologySampleInfo,
diagnosis: diagnosis,
});
}
}}
/>
</Column>
Expand Down Expand Up @@ -1699,18 +1737,21 @@ function CytologyCaseView() {
)}
</>
)}
<Column lg={16}>
<Checkbox
labelText={<FormattedMessage id="pathology.label.release" />}
id="release"
onChange={() => {
setPathologySampleInfo({
...pathologySampleInfo,
release: !pathologySampleInfo.release,
});
}}
/>
</Column>
{pathologySampleInfo.assignedPathologistId &&
pathologySampleInfo.assignedTechnicianId && (
<Column lg={16}>
<Checkbox
labelText={<FormattedMessage id="pathology.label.release" />}
id="release"
onChange={() => {
setPathologySampleInfo({
...pathologySampleInfo,
release: !pathologySampleInfo.release,
});
}}
/>
</Column>
)}
<Column lg={16}>
<Button
id="pathology_save2"
Expand All @@ -1719,7 +1760,7 @@ function CytologyCaseView() {
save(e);
}}
>
<FormattedMessage id="label.button.save" />
<FormattedMessage id="label.button.save" />
</Button>
</Column>
</Grid>
Expand Down
Loading