diff --git a/sanitas_frontend/src/views/History/Traumatological/index.jsx b/sanitas_frontend/src/views/History/Traumatological/index.jsx index 58b320dd..08ea6465 100644 --- 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} />

@@ -455,6 +466,34 @@ function TraumatologicView({ justifyContent: "center", }} > +

+
+ {!addingNew && + (isEditable ? ( +
+ + setIsEditable(false)} + /> +
+ ) : ( + setIsEditable(true)} + /> + ))} +
+
{addingNew && ( <>