From cbebedd51e1b4a2f709341b792dd073bac83f15d Mon Sep 17 00:00:00 2001
From: HombreLaser <sebastian-440@live.com>
Date: Fri, 12 May 2023 23:01:55 -0600
Subject: Añadido formulario de edición de cuenta
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/routes/account/account.tsx |  2 +-
 src/routes/account/edit.tsx    | 40 ++++++++++++++++++++++++++++++++++++++++
 2 files changed, 41 insertions(+), 1 deletion(-)
 create mode 100644 src/routes/account/edit.tsx

(limited to 'src/routes')

diff --git a/src/routes/account/account.tsx b/src/routes/account/account.tsx
index 8458285..8a04427 100644
--- a/src/routes/account/account.tsx
+++ b/src/routes/account/account.tsx
@@ -29,7 +29,7 @@ export default function Account() {
               <span className="mx-1 field_name">Correo electrónico:</span> {email}
             </div>
             <div>
-              <a type="button" className="button text-white hover:bg-blue-300 hover:text-gray focus:ring-4 focus:ring-blue-300 font-medium rounded-lg text-sm px-5 py-2.5 mr-2 mb-2 dark:bg-blue-600 dark:hover:bg-blue-700 focus:outline-none dark:focus:ring-blue-800" href="#">
+              <a type="button" className="button text-white hover:bg-blue-300 hover:text-gray focus:ring-4 focus:ring-blue-300 font-medium rounded-lg text-sm px-5 py-2.5 mr-2 mb-2 dark:bg-blue-600 dark:hover:bg-blue-700 focus:outline-none dark:focus:ring-blue-800" href="/account/edit">
                 Editar
               </a>
             </div>
diff --git a/src/routes/account/edit.tsx b/src/routes/account/edit.tsx
new file mode 100644
index 0000000..c2dfcb5
--- /dev/null
+++ b/src/routes/account/edit.tsx
@@ -0,0 +1,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>
+    </>
+  );
+}
\ No newline at end of file
-- 
cgit v1.2.3