Merge branch 'origin/develop' into feat-refactor-psichiatric

SanitasUVG · Aug 26, 2024 · 1f5558a · 1f5558a
2 parents c34907f + 3fb1f9d
commit 1f5558a
Showing 1 changed file with 40 additions and 1 deletion.
diff --git a/sanitas_frontend/src/views/History/Traumatological/index.jsx b/sanitas_frontend/src/views/History/Traumatological/index.jsx
@@ -9,6 +9,10 @@ import Throbber from "src/components/Throbber";
 import { colors, fonts, fontSize } from "src/theme.mjs";
 import InformationCard from "src/components/InformationCard";
 import WrapPromise from "src/utils/promiseWrapper";
+import IconButton from "src/components/Button/Icon";
+import CheckIcon from "@tabler/icons/outline/check.svg";
+import EditIcon from "@tabler/icons/outline/edit.svg";
+import CancelIcon from "@tabler/icons/outline/x.svg";
 
 /**
  * @typedef {Object} TraumatologicHistoryProps
@@ -145,6 +149,9 @@ function TraumatologicView({
 	const [selectedTrauma, setSelectedTrauma] = useState(null);
 	const [addingNew, setAddingNew] = useState(false);
 	const [yearOptions, setYearOptions] = useState([]);
+	const [isEditable, setIsEditable] = useState(false);
+
+	const isFirstTime = addingNew;
 
 	const birthYearResult = birthdayResource.read();
 	const traumatologicHistoryResult = traumatologicHistoryResource.read();
@@ -255,6 +262,7 @@ function TraumatologicView({
 		}
 	};
 
+
 	const handleSelectTrauma = (traumatological) => {
 		setSelectedTrauma({
 			whichBone: traumatological.whichBone,
@@ -365,13 +373,13 @@ function TraumatologicView({
 							})
 						}
 						placeholder="Ingrese el hueso fracturado"
-						readOnly={!addingNew}
 						style={{
 							width: "95%",
 							height: "2.5rem",
 							fontFamily: fonts.textFont,
 							fontSize: "1rem",
 						}}
+						disabled={!isEditable}
 					/>
 
 					<p
@@ -400,6 +408,7 @@ function TraumatologicView({
 							option: {},
 							indicator: {},
 						}}
+						disabled={!isEditable}
 					/>
 
 					<p
@@ -432,6 +441,7 @@ function TraumatologicView({
 								})
 							}
 							style={{ label: { fontFamily: fonts.textFont } }}
+							disabled={!isEditable}
 						/>
 						<RadioInput
 							label="Conservador (yeso, canal, inmovilizador)"
@@ -445,6 +455,7 @@ function TraumatologicView({
 								})
 							}
 							style={{ label: { fontFamily: fonts.textFont } }}
+							disabled={!isEditable}
 						/>
 					</div>
 
@@ -455,6 +466,34 @@ function TraumatologicView({
 							justifyContent: "center",
 						}}
 					>
+						<div
+							style={{
+								display: "flex",
+								flexDirection: "column",
+								width: "100%",
+							}}
+						>
+							<div style={{ display: "flex", justifyContent: "flex-end" }}>
+								{!addingNew &&
+									(isEditable ? (
+										<div style={{ display: "flex", gap: "1rem" }}>
+											<IconButton
+												icon={CheckIcon}
+												onClick={handleSaveNewTrauma}
+											/>
+											<IconButton
+												icon={CancelIcon}
+												onClick={() => setIsEditable(false)}
+											/>
+										</div>
+									) : (
+										<IconButton
+											icon={EditIcon}
+											onClick={() => setIsEditable(true)}
+										/>
+									))}
+							</div>
+						</div>
 						{addingNew && (
 							<>
 								<BaseButton