cambios en vista cambiar contrasena

This commit is contained in:
jls846
2025-11-26 18:04:55 -06:00
parent abfa11b931
commit 0dbe5783e4
3 changed files with 155 additions and 67 deletions
+1 -16
View File
@@ -62,7 +62,6 @@
"integrity": "sha512-e7jT4DxYvIDLk1ZHmU/m/mB19rex9sv0c2ftBtjSBv+kVM/902eh0fINUzD7UwLLNR+jU585GxUJ8/EBfAM5fw==",
"dev": true,
"license": "MIT",
"peer": true,
"dependencies": {
"@babel/code-frame": "^7.27.1",
"@babel/generator": "^7.28.5",
@@ -1634,7 +1633,6 @@
"integrity": "sha512-tBFxBp9Nfyy5rsmefN+WXc1JeW/j2BpBHFdLZbEVfs9wn3E3NRFxwV0pJg8M1qQAexFpvz73hJXFofV0ZAu92A==",
"dev": true,
"license": "MIT",
"peer": true,
"dependencies": {
"csstype": "^3.0.2"
}
@@ -1695,7 +1693,6 @@
"integrity": "sha512-tK3GPFWbirvNgsNKto+UmB/cRtn6TZfyw0D6IKrW55n6Vbs7KJoZtI//kpTKzE/DUmmnAFD8/Ca46s7Obs92/w==",
"dev": true,
"license": "MIT",
"peer": true,
"dependencies": {
"@typescript-eslint/scope-manager": "8.46.4",
"@typescript-eslint/types": "8.46.4",
@@ -2237,7 +2234,6 @@
"resolved": "https://registry.npmjs.org/@zxing/library/-/library-0.21.3.tgz",
"integrity": "sha512-hZHqFe2JyH/ZxviJZosZjV+2s6EDSY0O24R+FQmlWZBZXP9IqMo7S3nb3+2LBWxodJQkSurdQGnqE7KXqrYgow==",
"license": "MIT",
"peer": true,
"dependencies": {
"ts-custom-error": "^3.2.1"
},
@@ -2261,7 +2257,6 @@
"integrity": "sha512-NZyJarBfL7nWwIq+FDL6Zp/yHEhePMNnnJ0y3qfieCrmNvYct8uvtiV41UvlSe6apAfk0fY1FbWx+NwfmpvtTg==",
"dev": true,
"license": "MIT",
"peer": true,
"bin": {
"acorn": "bin/acorn"
},
@@ -2661,7 +2656,6 @@
}
],
"license": "MIT",
"peer": true,
"dependencies": {
"baseline-browser-mapping": "^2.8.25",
"caniuse-lite": "^1.0.30001754",
@@ -2879,8 +2873,7 @@
"version": "3.1.3",
"resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.3.tgz",
"integrity": "sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw==",
"license": "MIT",
"peer": true
"license": "MIT"
},
"node_modules/cwise-compiler": {
"version": "1.1.3",
@@ -3307,7 +3300,6 @@
"integrity": "sha512-BhHmn2yNOFA9H9JmmIVKJmd288g9hrVRDkdoIgRCRuSySRUHH7r/DI6aAXW9T1WwUuY3DFgrcaqB+deURBLR5g==",
"dev": true,
"license": "MIT",
"peer": true,
"dependencies": {
"@eslint-community/eslint-utils": "^4.8.0",
"@eslint-community/regexpp": "^4.12.1",
@@ -3493,7 +3485,6 @@
"integrity": "sha512-whOE1HFo/qJDyX4SnXzP4N6zOWn79WhnCUY/iDR0mPfQZO8wcYE4JClzI2oZrhBnnMUCBCHZhO6VQyoBU95mZA==",
"dev": true,
"license": "MIT",
"peer": true,
"dependencies": {
"@rtsao/scc": "^1.1.0",
"array-includes": "^3.1.9",
@@ -5721,7 +5712,6 @@
"resolved": "https://registry.npmjs.org/react/-/react-19.2.0.tgz",
"integrity": "sha512-tmbWg6W31tQLeB5cdIBOicJDJRR2KzXsV7uSK9iNfLWQ5bIZfxuPEHp7M8wiHyHnn0DD1i7w3Zmin0FtkrwoCQ==",
"license": "MIT",
"peer": true,
"engines": {
"node": ">=0.10.0"
}
@@ -5731,7 +5721,6 @@
"resolved": "https://registry.npmjs.org/react-dom/-/react-dom-19.2.0.tgz",
"integrity": "sha512-UlbRu4cAiGaIewkPyiRGJk0imDN2T3JjieT6spoL2UeSf5od4n5LB/mQ4ejmxhCFT1tYe8IvaFulzynWovsEFQ==",
"license": "MIT",
"peer": true,
"dependencies": {
"scheduler": "^0.27.0"
},
@@ -6036,7 +6025,6 @@
"integrity": "sha512-Dqh7SiYcaFtdv5Wvku6QgS5IGPm281L+ZtVD1U2FJa7Q0EFRlq8Z3sjYtz6gYObsYThUOz9ArwFqPZx+1azILQ==",
"devOptional": true,
"license": "MIT",
"peer": true,
"dependencies": {
"chokidar": "^4.0.0",
"immutable": "^5.0.2",
@@ -6571,7 +6559,6 @@
"integrity": "sha512-5gTmgEY/sqK6gFXLIsQNH19lWb4ebPDLA4SdLP7dsWkIXHWlG66oPuVvXSGFPppYZz8ZDZq0dYYrbHfBCVUb1Q==",
"dev": true,
"license": "MIT",
"peer": true,
"engines": {
"node": ">=12"
},
@@ -6774,7 +6761,6 @@
"integrity": "sha512-jl1vZzPDinLr9eUt3J/t7V6FgNEw9QjvBPdysz9KfQDD41fQrC2Y4vKQdiaUpFT4bXlb1RHhLpp8wtm6M5TgSw==",
"dev": true,
"license": "Apache-2.0",
"peer": true,
"bin": {
"tsc": "bin/tsc",
"tsserver": "bin/tsserver"
@@ -7079,7 +7065,6 @@
"integrity": "sha512-JInaHOamG8pt5+Ey8kGmdcAcg3OL9reK8ltczgHTAwNhMys/6ThXHityHxVV2p3fkw/c+MAvBHFVYHFZDmjMCQ==",
"dev": true,
"license": "MIT",
"peer": true,
"funding": {
"url": "https://github.com/sponsors/colinhacks"
}
@@ -3,17 +3,16 @@
import { useState } from "react";
import axios from "axios";
import toast from "react-hot-toast";
import Cookies from "js-cookie";
import "../../styles/layout/ForgotPasswordPage.scss";
export default function UpdateUserPage() {
const [id_User, setId_User] = useState("");
const [nombre, setNombre] = useState("");
const [contrasena, setContrasena] = useState("");
const [contrasenaN, setContrasenaN] = useState("");
const [contrasenaV, setContrasenaV] = useState("");
const [tipoUsuario, setTipoUsuario] = useState("");
const [loading, setLoading] = useState(false);
const userIdList = [1, 2, 3, 10, 11, 12, 100, 101, 150];
const handleSubmit = async (e: React.FormEvent<HTMLFormElement>) => {
e.preventDefault();
@@ -27,8 +26,13 @@ export default function UpdateUserPage() {
return;
}
if (contrasena && contrasena.length < 6) {
toast.error("La contraseña debe tener al menos 6 caracteres.");
if (contrasenaN && contrasenaN.length < 6) {
toast.error("La nueva contraseña debe tener al menos 6 caracteres.");
return;
}
if (contrasenaV && contrasenaV.length < 6) {
toast.error("La contraseña actual debe tener al menos 6 caracteres.");
return;
}
@@ -37,34 +41,30 @@ export default function UpdateUserPage() {
return;
}
// 🔒 Tu backend (dejado comentado)
/*
setLoading(true);
try {
const body = { id_User: Number(id_User) };
if (nombre) body.nombre = nombre;
if (contrasena) body.contrasena = contrasena;
if (tipoUsuario) body.tipoUsuario = Number(tipoUsuario);
setLoading(true);
await axios.post(
`${process.env.NEXT_PUBLIC_API_URL}/rauth/update`,
body
const token = Cookies.get("token");
const headers = { Authorization: `Bearer ${token}` };
const response = await axios.post(
`${process.env.NEXT_PUBLIC_API_URL}/auth/UpdateUsuario`,
{
id_User: Number(id_User),
nombre,
contrasenaN,
contrasenaV,
tipoUsuario: tipoUsuario ? Number(tipoUsuario) : undefined,
},
{ headers }
);
toast.success("Usuario actualizado correctamente.");
setId_User("");
setNombre("");
setContrasena("");
setTipoUsuario("");
} catch (err) {
...
toast.success("Usuario actualizado correctamente");
} catch (error: any) {
toast.error(error?.response?.data?.message || "Error al actualizar");
} finally {
setLoading(false);
}
*/
toast.success("✅ Listo para enviar. Backend aún en desarrollo.");
};
return (
@@ -74,18 +74,7 @@ export default function UpdateUserPage() {
<p>Ingresa el ID y los campos que deseas modificar.</p>
<form onSubmit={handleSubmit} className="forgot-form">
{/* Input con autocompletar */}
<div>
<label>ID de usuario *</label>
<input
type="text"
list="id_suggestions"
placeholder="ID del usuario"
value={id_User}
onChange={(e) => setId_User(e.target.value)}
required
/>
</div>
<div>
<label>Nombre (opcional)</label>
@@ -102,25 +91,24 @@ export default function UpdateUserPage() {
<input
type="password"
placeholder="Nueva contraseña"
value={contrasena}
onChange={(e) => setContrasena(e.target.value)}
value={contrasenaN}
onChange={(e) => setContrasenaN(e.target.value)}
/>
</div>
<div>
<label>Tipo de usuario (opcional)</label>
<select
value={tipoUsuario}
onChange={(e) => setTipoUsuario(e.target.value)}
>
<option value="">Seleccionar tipo</option>
<option value="1">1 - Administrador</option>
<option value="2">2 - Operador</option>
</select>
<label>Contraseña actual (opcional)</label>
<input
type="password"
placeholder="Contraseña actual"
value={contrasenaV}
onChange={(e) => setContrasenaV(e.target.value)}
/>
</div>
<button type="submit" disabled={loading}>
{loading ? "Actualizando..." : "Actualizar contraseña"}
{loading ? "Actualizando..." : "Actualizar"}
</button>
</form>
</div>
+115
View File
@@ -0,0 +1,115 @@
"use client";
import { useState } from "react";
import axios from "axios";
import toast from "react-hot-toast";
import Cookies from "js-cookie";
import "../../styles/layout/ForgotPasswordPage.scss";
export default function UpdateUserPage() {
const [id_User, setId_User] = useState("");
const [nombre, setNombre] = useState("");
const [contrasenaN, setContrasenaN] = useState("");
const [contrasenaV, setContrasenaV] = useState("");
const [tipoUsuario, setTipoUsuario] = useState("");
const [loading, setLoading] = useState(false);
const handleSubmit = async (e: React.FormEvent<HTMLFormElement>) => {
e.preventDefault();
if (!id_User || isNaN(Number(id_User))) {
toast.error("El ID de usuario es obligatorio y debe ser un número.");
return;
}
if (nombre && nombre.trim().length < 3) {
toast.error("El nombre debe tener al menos 3 caracteres.");
return;
}
if (contrasenaN && contrasenaN.length < 6) {
toast.error("La nueva contraseña debe tener al menos 6 caracteres.");
return;
}
if (contrasenaV && contrasenaV.length < 6) {
toast.error("La contraseña actual debe tener al menos 6 caracteres.");
return;
}
if (tipoUsuario && isNaN(Number(tipoUsuario))) {
toast.error("El tipo de usuario debe ser un número.");
return;
}
try {
setLoading(true);
const token = Cookies.get("token");
const headers = { Authorization: `Bearer ${token}` };
const response = await axios.post(
`${process.env.NEXT_PUBLIC_API_URL}/auth/UpdateUsuario`,
{
id_User: Number(id_User),
nombre,
contrasenaN,
contrasenaV,
tipoUsuario: tipoUsuario ? Number(tipoUsuario) : undefined,
},
{ headers }
);
toast.success("Usuario actualizado correctamente");
} catch (error: any) {
toast.error(error?.response?.data?.message || "Error al actualizar");
} finally {
setLoading(false);
}
};
return (
<section className="forgot-password-page">
<div className="forgot-form-container">
<h1>Actualizar contraseña</h1>
<p>Ingresa el ID y los campos que deseas modificar.</p>
<form onSubmit={handleSubmit} className="forgot-form">
<div>
<label>Nombre (opcional)</label>
<input
type="text"
placeholder="Nuevo nombre"
value={nombre}
onChange={(e) => setNombre(e.target.value)}
/>
</div>
<div>
<label>Nueva contraseña (opcional)</label>
<input
type="password"
placeholder="Nueva contraseña"
value={contrasenaN}
onChange={(e) => setContrasenaN(e.target.value)}
/>
</div>
<div>
<label>Contraseña actual (opcional)</label>
<input
type="password"
placeholder="Contraseña actual"
value={contrasenaV}
onChange={(e) => setContrasenaV(e.target.value)}
/>
</div>
<button type="submit" disabled={loading}>
{loading ? "Actualizando..." : "Actualizar"}
</button>
</form>
</div>
</section>
);
}