From dd757d30af5112782b9eca9e26e6c24cc86c41f5 Mon Sep 17 00:00:00 2001 From: IO <320154041@pcpuma.acatlan.unam.mx> Date: Mon, 9 Feb 2026 12:23:03 -0600 Subject: [PATCH] added new button lock --- app/(private)/AgregarTiempo/Addtime.tsx | 25 +++++++++++----- app/(private)/AgregarTiempo/addTime.css | 40 +++++++++++++++++++++++++ app/Components/Receipt/Inscripcion.tsx | 21 +++++++++++-- app/Components/Receipt/Receipt.css | 40 +++++++++++++++++++++++++ app/Components/Receipt/Receipt.tsx | 19 +++++++++--- public/lock-open.svg | 1 + public/lock.svg | 1 + 7 files changed, 133 insertions(+), 14 deletions(-) create mode 100644 public/lock-open.svg create mode 100644 public/lock.svg diff --git a/app/(private)/AgregarTiempo/Addtime.tsx b/app/(private)/AgregarTiempo/Addtime.tsx index 3b1b410..9d5a346 100644 --- a/app/(private)/AgregarTiempo/Addtime.tsx +++ b/app/(private)/AgregarTiempo/Addtime.tsx @@ -4,8 +4,6 @@ import { useState } from "react"; import toast from "react-hot-toast"; import { useRouter } from "next/navigation"; -import { PostReceipt } from "@/app/lib/postReceipt"; - import "./addTime.css"; import SelectionCo from "@/app/Components/Selection/SelectionCo"; import axios from "axios"; @@ -35,9 +33,10 @@ export default function AddTime({ const [folio, setFolio] = useState(""); const [amount, setAmount] = useState(""); + const [lock, setLock] = useState(true); const todayISO = new Date().toISOString().split("T")[0]; const [date, setDate] = useState(todayISO); - + const day = new Date(); const year = day.getFullYear(); const month = day.getMonth(); @@ -138,13 +137,16 @@ export default function AddTime({ value={amount} onChange={(e) => { const value = e.target.value; + if (/^\d*\.?\d*$/.test(value)) { const numericValue = parseFloat(value); - if (value === "" || numericValue <= 1000) { - setAmount(value); - } else { + + if (lock && numericValue > 1000) { toast.error("El monto no puede superar $1000.00"); + return; } + + setAmount(value); } }} placeholder="Monto recibido..." @@ -163,10 +165,19 @@ export default function AddTime({ /> -
+
+
diff --git a/app/(private)/AgregarTiempo/addTime.css b/app/(private)/AgregarTiempo/addTime.css index 1a94679..aaf7820 100644 --- a/app/(private)/AgregarTiempo/addTime.css +++ b/app/(private)/AgregarTiempo/addTime.css @@ -23,6 +23,46 @@ width: 100%; } +.buttonLock{ + padding: 0.8rem; + position: absolute; + right: 0; + background-color: #d32f2f; +} + +.buttonOpenLock{ + padding: 0.8rem; + position: absolute; + right: 0; + background-color: #8cd32f; +} + +.buttonOpenLock:hover{ + background-color: #78b32c; +} + +.buttonLock::after { + content: ""; + display: inline-block; + width: 20px; + height: 20px; + background: url('/lock.svg'); + filter: invert(1); + background-size: contain; + background-repeat: no-repeat; +} + +.buttonOpenLock::after { + content: ""; + display: inline-block; + width: 20px; + height: 20px; + background: url('/lock-open.svg'); + filter: invert(1); + background-size: contain; + background-repeat: no-repeat; +} + @media (max-width: 800px) { .containeInformationTime { flex-direction: column; diff --git a/app/Components/Receipt/Inscripcion.tsx b/app/Components/Receipt/Inscripcion.tsx index 995f5c8..39fc723 100644 --- a/app/Components/Receipt/Inscripcion.tsx +++ b/app/Components/Receipt/Inscripcion.tsx @@ -35,6 +35,7 @@ export default function Inscripcion({ const [folio, setFolio] = useState(""); const [amount, setAmount] = useState(""); + const [lock, setLock] = useState(true); const todayISO = new Date().toISOString().split("T")[0]; const [date, setDate] = useState(todayISO); @@ -193,11 +194,16 @@ export default function Inscripcion({ value={amount} onChange={(e) => { const value = e.target.value; + if (/^\d*\.?\d*$/.test(value)) { const numericValue = parseFloat(value); - if (value === "" || numericValue <= 1000) { - setAmount(value); + + if (lock && numericValue > 1000) { + toast.error("El monto no puede superar $1000.00"); + return; } + + setAmount(value); } }} placeholder="Monto recibido..." @@ -216,8 +222,17 @@ export default function Inscripcion({ /> -
+
+
diff --git a/app/Components/Receipt/Receipt.css b/app/Components/Receipt/Receipt.css index 94a4965..037aa26 100644 --- a/app/Components/Receipt/Receipt.css +++ b/app/Components/Receipt/Receipt.css @@ -22,3 +22,43 @@ border: 1px solid #cfcfcf; background-color: #cfcfcf; } + +.buttonLock{ + padding: 0.8rem; + position: absolute; + right: 0; + background-color: #d32f2f; +} + +.buttonOpenLock{ + padding: 0.8rem; + position: absolute; + right: 0; + background-color: #8cd32f; +} + +.buttonOpenLock:hover{ + background-color: #78b32c; +} + +.buttonLock::after { + content: ""; + display: inline-block; + width: 20px; + height: 20px; + background: url('/lock.svg'); + filter: invert(1); + background-size: contain; + background-repeat: no-repeat; +} + +.buttonOpenLock::after { + content: ""; + display: inline-block; + width: 20px; + height: 20px; + background: url('/lock-open.svg'); + filter: invert(1); + background-size: contain; + background-repeat: no-repeat; +} \ No newline at end of file diff --git a/app/Components/Receipt/Receipt.tsx b/app/Components/Receipt/Receipt.tsx index a270a4c..6c7f4bd 100644 --- a/app/Components/Receipt/Receipt.tsx +++ b/app/Components/Receipt/Receipt.tsx @@ -16,6 +16,7 @@ function Receipt({ numAcount }: ReceiptsProps) { const [folio, setFolio] = useState(""); const [amount, setAmount] = useState(""); + const [lock, setLock] = useState(true); const todayISO = new Date().toISOString().split("T")[0]; const [date, setDate] = useState(todayISO); @@ -105,11 +106,12 @@ function Receipt({ numAcount }: ReceiptsProps) { if (/^\d*\.?\d*$/.test(value)) { const numericValue = parseFloat(value); - if (value === "" || numericValue <= 1000) { - setAmount(value); - } else { + if (lock && numericValue > 1000) { toast.error("El monto no puede superar $1000.00"); + return; } + + setAmount(value); } }} placeholder="Monto recibido..." @@ -129,8 +131,17 @@ function Receipt({ numAcount }: ReceiptsProps) { /> -
+
+
diff --git a/public/lock-open.svg b/public/lock-open.svg new file mode 100644 index 0000000..63a208f --- /dev/null +++ b/public/lock-open.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/public/lock.svg b/public/lock.svg new file mode 100644 index 0000000..99c183d --- /dev/null +++ b/public/lock.svg @@ -0,0 +1 @@ + \ No newline at end of file