blob: c2dfcb54bd4ae78b88e460921d5acf362936df2d (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
|
import MainContentLayout from "../../components/main_content_layout";
import Token from "../../lib/token";
import { Form, useLoaderData } from "react-router-dom";
import "../../components/stylesheets/shared.css";
export function EditAccount() {
const account = useLoaderData()[0].data.data.attributes;
const token = new Token();
return(
<>
<MainContentLayout>
<div className="w-4/5 my-6">
<h1 className="my-6 text-3xl">
Editar cuenta
</h1>
<Form method="post" id="account-form">
<div className="mb-6">
<label className="block mb-2 text-lg text-gray-900 dark:text-white">Correo electrónico</label>
<input type="email" id="email" name="email" className="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500" placeholder={account.email}/>
</div>
<div className="mb-6">
<label className="block mb-2 text-lg text-gray-900 dark:text-white">Nombre</label>
<input type="text" id="first_name" name="first_name" className="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500" placeholder={account.first_name}/>
</div>
<div className="mb-6">
<label className="block mb-2 text-lg text-gray-900 dark:text-white">Apellido</label>
<input type="text" id="last_name" name="last_name" className="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500" placeholder={account.last_name}/>
</div>
<div className="mb-6">
<label className="block mb-2 text-lg text-gray-900 dark:text-white">Contraseña</label>
<input type="password" id="password" name="password" className="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500"/>
</div>
<button type="submit" className="text-white bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm w-full sm:w-auto px-5 py-2.5 text-center dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800">Enviar</button>
</Form>
</div>
</MainContentLayout>
</>
);
}
|