diff --git a/src/Components/Facility/ConsultationDoctorNotes/index.tsx b/src/Components/Facility/ConsultationDoctorNotes/index.tsx
index dd96ef9af1e..3853dc5decc 100644
--- a/src/Components/Facility/ConsultationDoctorNotes/index.tsx
+++ b/src/Components/Facility/ConsultationDoctorNotes/index.tsx
@@ -31,6 +31,8 @@ const ConsultationDoctorNotes = (props: ConsultationDoctorNotesProps) => {
notes: [],
cPage: 1,
totalPages: 1,
+ facilityId: facilityId,
+ patientId: patientId,
};
const [state, setState] = useState(initialData);
@@ -98,8 +100,6 @@ const ConsultationDoctorNotes = (props: ConsultationDoctorNotesProps) => {
diff --git a/src/Components/Facility/DoctorNote.tsx b/src/Components/Facility/DoctorNote.tsx
index 85703a1e3d8..5777f9e3fb1 100644
--- a/src/Components/Facility/DoctorNote.tsx
+++ b/src/Components/Facility/DoctorNote.tsx
@@ -5,11 +5,12 @@ import { PatientNoteStateType } from "./models";
interface DoctorNoteProps {
state: PatientNoteStateType;
+ setReload: any;
handleNext: () => void;
}
const DoctorNote = (props: DoctorNoteProps) => {
- const { state, handleNext } = props;
+ const { state, handleNext, setReload } = props;
return (
{
scrollableTarget="patient-notes-list"
>
{state.notes.map((note: any) => (
-
+
))}
) : (
diff --git a/src/Components/Facility/PatientConsultationNotesList.tsx b/src/Components/Facility/PatientConsultationNotesList.tsx
index f38de51110b..86aa99abc3d 100644
--- a/src/Components/Facility/PatientConsultationNotesList.tsx
+++ b/src/Components/Facility/PatientConsultationNotesList.tsx
@@ -10,8 +10,6 @@ import request from "../../Utils/request/request";
interface PatientNotesProps {
state: PatientNoteStateType;
setState: any;
- patientId: string;
- facilityId: string;
reload?: boolean;
setReload?: any;
}
@@ -28,7 +26,7 @@ const PatientConsultationNotesList = (props: PatientNotesProps) => {
setIsLoading(true);
const { data }: any = await request(routes.getPatientNotes, {
pathParams: {
- patientId: props.patientId,
+ patientId: props.state.patientId,
},
query: {
consultation: consultationId,
@@ -81,7 +79,9 @@ const PatientConsultationNotesList = (props: PatientNotesProps) => {
);
}
- return
;
+ return (
+
+ );
};
export default PatientConsultationNotesList;
diff --git a/src/Components/Facility/PatientNoteCard.tsx b/src/Components/Facility/PatientNoteCard.tsx
index 2f07702504a..88c64914321 100644
--- a/src/Components/Facility/PatientNoteCard.tsx
+++ b/src/Components/Facility/PatientNoteCard.tsx
@@ -1,36 +1,202 @@
import { relativeDate, formatDateTime, classNames } from "../../Utils/utils";
import { USER_TYPES_MAP } from "../../Common/constants";
-import { PatientNotesModel } from "./models";
+import { PatientNoteStateType, PatientNotesModel } from "./models";
+import ButtonV2 from "../Common/components/ButtonV2";
+import CareIcon from "../../CAREUI/icons/CareIcon";
+import { useState } from "react";
+import { Error, Success } from "../../Utils/Notifications";
+import request from "../../Utils/request/request";
+import routes from "../../Redux/api";
+import DialogModal from "../Common/Dialog";
+import { t } from "i18next";
+
+const PatientNoteCard = ({
+ state,
+ note,
+ setReload,
+}: {
+ state: PatientNoteStateType;
+ note: PatientNotesModel;
+ setReload: any;
+}) => {
+ const [isEditing, setIsEditing] = useState(false);
+ const [noteField, setNoteField] = useState(note.note);
+ const [showEditHistory, setShowEditHistory] = useState(false);
+
+ const onUpdateNote = async () => {
+ if (noteField === note.note) {
+ setIsEditing(false);
+ return;
+ }
+ const payload = {
+ note: noteField,
+ };
+ if (!/\S+/.test(noteField)) {
+ Error({
+ msg: "Note Should Contain At Least 1 Character",
+ });
+ return;
+ }
+
+ const { res } = await request(routes.updatePatientNote, {
+ pathParams: { patientId: state.patientId, noteId: note.id },
+ body: payload,
+ });
+ if (res?.status === 200) {
+ Success({ msg: "Note updated successfully" });
+ setIsEditing(false);
+ setReload(true);
+ }
+ };
-const PatientNoteCard = ({ note }: { note: PatientNotesModel }) => {
return (
-
-
-
- {note.created_by_object?.first_name || "Unknown"}{" "}
- {note.created_by_object?.last_name}
-
- {note.user_type && (
-
- {`(${USER_TYPES_MAP[note.user_type]})`}
-
+ <>
+ {" "}
+
-
{note.note}
-
-
-
- {formatDateTime(note.created_date)}
-
- {relativeDate(note.created_date)}
+ >
+
+
+
+
+ {note.created_by_object?.first_name || "Unknown"}{" "}
+ {note.created_by_object?.last_name}
+
+ {note.user_type && (
+
+ {`(${USER_TYPES_MAP[note.user_type]})`}
+
+ )}
+
+
+
+
+ {formatDateTime(note.created_date)}
+
+ Created {relativeDate(note.created_date, true)}
+
+
+ {note.edits.length > 1 && (
+
+
{
+ setShowEditHistory(true);
+ }}
+ >
+
+
+ {formatDateTime(note.edits[0].edited_on)}
+
+ Edited {relativeDate(note.edits[0].edited_on, true)}
+
+
+
+
+ )}
+
+
+
{
+ if (!isEditing) setIsEditing(true);
+ }}
+ >
+ {isEditing ? (
+
+ ) : (
+
+ )}
+
+ {
+
+ {isEditing ? (
+
+ ) : (
+
{noteField}
+ )}
+
+ }
-
+ {showEditHistory && (
+
setShowEditHistory(false)}
+ title={t("edit_history")}
+ >
+
+
+
+ Edit History for note
+ {note.id}
+
+
+
+ {note.edits.map((edit, index) => {
+ const isLast = index === note.edits.length - 1;
+ return (
+
+
+
+
+ {isLast ? "Created" : "Edited"} On
+
+
+ {formatDateTime(edit.edited_on)}
+
+
+
+
+ {isLast ? "Created" : "Edited"} By
+
+
+ {edit.edited_by.username}
+
+
+
+
+
+ );
+ })}
+
+
+ {
+ setShowEditHistory(false);
+ }}
+ >
+ {t("close")}
+
+
+
+
+ )}
+ >
);
};
diff --git a/src/Components/Facility/PatientNotesList.tsx b/src/Components/Facility/PatientNotesList.tsx
index 96f9dcad871..a36762072b9 100644
--- a/src/Components/Facility/PatientNotesList.tsx
+++ b/src/Components/Facility/PatientNotesList.tsx
@@ -74,7 +74,9 @@ const PatientNotesList = (props: PatientNotesProps) => {
);
}
- return
;
+ return (
+
+ );
};
export default PatientNotesList;
diff --git a/src/Components/Facility/PatientNotesSlideover.tsx b/src/Components/Facility/PatientNotesSlideover.tsx
index 8b08d9767db..9b2674ec84a 100644
--- a/src/Components/Facility/PatientNotesSlideover.tsx
+++ b/src/Components/Facility/PatientNotesSlideover.tsx
@@ -29,6 +29,8 @@ export default function PatientNotesSlideover(props: PatientNotesProps) {
notes: [],
cPage: 1,
totalPages: 1,
+ patientId: props.patientId,
+ facilityId: props.facilityId,
};
const [state, setState] = useState(initialData);
@@ -141,8 +143,6 @@ export default function PatientNotesSlideover(props: PatientNotesProps) {
@@ -157,6 +157,11 @@ export default function PatientNotesSlideover(props: PatientNotesProps) {
errorClassName="hidden"
placeholder="Type your Note"
disabled={!patientActive}
+ onKeyDown={(e) => {
+ if (e.key === "Enter") {
+ onAddNote();
+ }
+ }}
/>
& {
leadingPadding?: string | undefined;
min?: string | number;
max?: string | number;
+ onKeyDown?: (event: React.KeyboardEvent) => void;
onFocus?: (event: React.FocusEvent) => void;
onBlur?: (event: React.FocusEvent) => void;
};
@@ -62,6 +63,7 @@ const TextFormField = forwardRef((props: TextFormFieldProps, ref) => {
onFocus={props.onFocus}
onBlur={props.onBlur}
onChange={(e) => field.handleChange(e.target.value)}
+ onKeyDown={props.onKeyDown}
/>
);
diff --git a/src/Redux/api.tsx b/src/Redux/api.tsx
index 9634036e6c4..09c682261e5 100644
--- a/src/Redux/api.tsx
+++ b/src/Redux/api.tsx
@@ -624,6 +624,11 @@ const routes = {
method: "POST",
TRes: Type(),
},
+ updatePatientNote: {
+ path: "/api/v1/patient/{patientId}/notes/{noteId}/",
+ method: "PUT",
+ TRes: Type(),
+ },
sampleTestList: {
path: "/api/v1/patient/{patientId}/test_sample/",
},
diff --git a/src/Utils/utils.ts b/src/Utils/utils.ts
index df6bd46d131..23f07fae5a0 100644
--- a/src/Utils/utils.ts
+++ b/src/Utils/utils.ts
@@ -99,9 +99,9 @@ export const formatDate = (date: DateLike, format = DATE_FORMAT) =>
export const formatTime = (date: DateLike, format = TIME_FORMAT) =>
formatDateTime(date, format);
-export const relativeDate = (date: DateLike) => {
+export const relativeDate = (date: DateLike, withoutSuffix = false) => {
const obj = dayjs(date);
- return `${obj.fromNow()} at ${obj.format(TIME_FORMAT)}`;
+ return `${obj.fromNow(withoutSuffix)} at ${obj.format(TIME_FORMAT)}`;
};
export const formatName = (user: { first_name: string; last_name: string }) => {