85 lines
2.3 KiB
TypeScript
85 lines
2.3 KiB
TypeScript
"use client";
|
|
import apiClient from "@/app/lib/apiClient";
|
|
import { useState } from "react";
|
|
import toast from "react-hot-toast";
|
|
|
|
export default function ChangePassword() {
|
|
const [password, setPass] = useState("");
|
|
const [newPassword, setNewPass] = useState("");
|
|
const [confirmNewPass, setconfirmNewPass] = useState("");
|
|
|
|
const handleChangePass = async (e: React.FormEvent<HTMLFormElement>) => {
|
|
e.preventDefault();
|
|
const data = { password, newPassword };
|
|
|
|
try{
|
|
const response = await apiClient.post("/user/changePassword", data);
|
|
toast.success( `${response.data.message}`)
|
|
}catch{
|
|
toast.error( `No es la contraseña actual`)
|
|
}
|
|
|
|
};
|
|
|
|
return (
|
|
<section className="centerGrid containerSection">
|
|
<form onSubmit={handleChangePass} className="pass">
|
|
<div className="containerInput relative">
|
|
<label className="label">Contraseña actual</label>
|
|
<input
|
|
placeholder="Coloca tu contraseña..."
|
|
value={password}
|
|
type="password"
|
|
onChange={(e) => {
|
|
setPass(e.target.value);
|
|
}}
|
|
/>
|
|
<span />
|
|
</div>
|
|
|
|
<div className="containerInput relative">
|
|
<label className="label">Nueva contraseña</label>
|
|
<input
|
|
placeholder="Coloca tu nueva contraseña..."
|
|
value={newPassword}
|
|
type="password"
|
|
onChange={(e) => {
|
|
setNewPass(e.target.value);
|
|
}}
|
|
/>
|
|
<span />
|
|
</div>
|
|
|
|
<div className="containerInput relative">
|
|
<label className="label">Confirmar la contraña</label>
|
|
<input
|
|
placeholder="Coloca tu nueva contraseña..."
|
|
value={confirmNewPass}
|
|
type="password"
|
|
onChange={(e) => {
|
|
setconfirmNewPass(e.target.value);
|
|
}}
|
|
/>
|
|
<span />
|
|
</div>
|
|
|
|
<div className="containerButton">
|
|
<button
|
|
className="button buttonSearch"
|
|
style={{ maxWidth: "100%", width: "100%" }}
|
|
>
|
|
Confirmar
|
|
</button>
|
|
|
|
<button
|
|
className="button buttonCancel"
|
|
style={{ maxWidth: "100%", width: "100%" }}
|
|
>
|
|
Cancelar
|
|
</button>
|
|
</div>
|
|
</form>
|
|
</section>
|
|
);
|
|
}
|
|
//IO
|