From d5af81ad4831190e469426717a49e32f19f92d09 Mon Sep 17 00:00:00 2001
From: marcelo rojas <marcelojavier.rojas@alumnos.ulagos.cl>
Date: Sun, 14 Jul 2024 09:38:42 -0400
Subject: [PATCH 1/2] findusers

---
 app/users/findusers/page.js | 120 ++++++++++++++++++++++++++++++++++++
 components/Navbar.js        |   4 ++
 services/AuthService.js     |  18 ++++++
 3 files changed, 142 insertions(+)
 create mode 100755 app/users/findusers/page.js

diff --git a/app/users/findusers/page.js b/app/users/findusers/page.js
new file mode 100755
index 0000000..12739b7
--- /dev/null
+++ b/app/users/findusers/page.js
@@ -0,0 +1,120 @@
+"use client";
+import React, { useState } from "react";
+import { Container, TextField, Button, Checkbox } from "@mui/material";
+import AuthService from "../../../services/AuthService";
+import Navbar from "../../../components/Navbar";
+
+export default function FindUsersPage() {
+  const [filters, setFilters] = useState({
+    name: "",
+    login_before_date: "",
+    login_after_date: "",
+    active: false,
+  });
+  const [users, setUsers] = useState([]);
+
+  const handleInputChange = (event) => {
+    const { name, value } = event.target;
+    let finalValue = value;
+
+    if (value === "true" || value === "false") {
+      finalValue = value === "true";
+    }
+
+    setFilters({ ...filters, [name]: finalValue });
+  };
+
+  const handleSearch = async () => {
+    const users = await AuthService.findUsers(filters);
+    setUsers(users);
+  };
+
+  return (
+    <>
+      <Navbar />
+      <div>
+        <Container>
+          <TextField label="name" name="name" onChange={handleInputChange} />
+          <TextField
+            label="login_before_date"
+            name="login_before_date"
+            type="date"
+            onChange={handleInputChange}
+            InputLabelProps={{
+              shrink: true,
+            }}
+          />
+          <TextField
+            label="login_after_date"
+            name="login_after_date"
+            InputLabelProps={{
+              shrink: true,
+            }}
+            type="date"
+            onChange={handleInputChange}
+          />
+          <Checkbox
+            checked={filters.active}
+            onChange={(e) =>
+              setFilters({ ...filters, active: e.target.checked })
+            }
+            name="active"
+          />
+          <Button onClick={handleSearch}>Buscar</Button>
+          <Container>
+            {users && users.length > 0 && (
+              <table style={{ width: "100%", borderCollapse: "collapse" }}>
+                <thead>
+                  <tr>
+                    <th
+                      style={{
+                        border: "1px solid black",
+                        padding: "8px",
+                        textAlign: "left",
+                      }}
+                    >
+                      Name
+                    </th>
+                    <th
+                      style={{
+                        border: "1px solid black",
+                        padding: "8px",
+                        textAlign: "left",
+                      }}
+                    >
+                      Email
+                    </th>
+                    <th
+                      style={{
+                        border: "1px solid black",
+                        padding: "8px",
+                        textAlign: "left",
+                      }}
+                    >
+                      Status
+                    </th>
+                  </tr>
+                </thead>
+                <tbody>
+                  {users.map((user) => (
+                    <tr key={user.id}>
+                      <td style={{ border: "1px solid black", padding: "8px" }}>
+                        {user.name}
+                      </td>
+                      <td style={{ border: "1px solid black", padding: "8px" }}>
+                        {user.email}
+                      </td>
+                      <td style={{ border: "1px solid black", padding: "8px" }}>
+                        {user.status ? "Active" : "Inactive"}
+                      </td>
+                    </tr>
+                  ))}
+                </tbody>
+              </table>
+            )}
+          </Container>
+        </Container>
+      </div>
+    </>
+  );
+}
diff --git a/components/Navbar.js b/components/Navbar.js
index c281d22..4662dd0 100644
--- a/components/Navbar.js
+++ b/components/Navbar.js
@@ -26,9 +26,13 @@ const Navbar = () => {
                 {user?.name}
             </div>
             <div className="navbar-item">
+                <Button onClick={() => {router.push("/users/findusers")}}>
+                    Find Users
+                </Button>
                 <Button onClick={handleLogout}>
                     Logout
                 </Button>
+                
             </div>
         </div>
     )
diff --git a/services/AuthService.js b/services/AuthService.js
index 3b7920a..74726ee 100644
--- a/services/AuthService.js
+++ b/services/AuthService.js
@@ -18,6 +18,23 @@ const handleLogin = async (user, pass) => {
     }
 }
 
+const findUsers = async ({ name, login_before_date, login_after_date, active }) => {
+    try {
+        const response = await axios.get('http://localhost:3001/api/v1/users/findUsers', {
+            params: {
+                nombre: name,
+                antesSesion: login_before_date,
+                despuesSesion: login_after_date,
+                eliminados: active,
+            },
+        });
+        return response.data;
+    } catch (e) {
+        console.error(e);
+        return [];
+    }
+};
+
 const getUsers = async () => {
     try {
         //const response = await axios.get('fakeapi');
@@ -116,6 +133,7 @@ const updateUser = async (id, user, token) => {
 
 export default {
     handleLogin,
+    findUsers,
     getUsers,
     getUserById,
     logOut,

From 10271881f6f6b299dab999eca2b6a5d1ac3e37bc Mon Sep 17 00:00:00 2001
From: marcelo rojas <marcelojavier.rojas@alumnos.ulagos.cl>
Date: Sun, 14 Jul 2024 09:40:20 -0400
Subject: [PATCH 2/2] bulkcreate y cambios menores

---
 app/users/bulkcreate/page.js | 101 +++++++++++++++++++++++++++++++++++
 app/users/findusers/page.js  |  14 ++++-
 components/Navbar.js         |   3 ++
 services/AuthService.js      |  28 +++++++++-
 4 files changed, 142 insertions(+), 4 deletions(-)
 create mode 100755 app/users/bulkcreate/page.js

diff --git a/app/users/bulkcreate/page.js b/app/users/bulkcreate/page.js
new file mode 100755
index 0000000..b79613f
--- /dev/null
+++ b/app/users/bulkcreate/page.js
@@ -0,0 +1,101 @@
+"use client";
+import React, { useEffect, useState } from "react";
+import AuthService from "@/services/AuthService";
+import { Button, TextField, IconButton } from "@mui/material";
+import { Add, Delete } from "@mui/icons-material";
+
+import { useRouter } from "next/navigation";
+import Navbar from "../../../components/Navbar";
+
+const BulkCreateUsers = () => {
+  const router = useRouter();
+  const [users, setUsers] = useState([]);
+
+  useEffect(() => {
+    const user = JSON.parse(localStorage.getItem("user"));
+    if (!user) {
+      router.push("/login");
+    }
+  });
+
+  const handleAddUser = () => {
+    setUsers([
+      ...users,
+      {
+        name: "",
+        email: "",
+        password: "",
+        password_second: "",
+        cellphone: "",
+      },
+    ]);
+  };
+
+  const handleRemoveUser = (index) => {
+    const newUsers = [...users];
+    newUsers.splice(index, 1);
+    setUsers(newUsers);
+  };
+
+  const handleChange = (index, field, value) => {
+    const newUsers = [...users];
+    newUsers[index][field] = value;
+    setUsers(newUsers);
+  };
+
+  const handleSubmit = async () => {
+    const response = await AuthService.bulkCreateUsers(users);
+    console.log(response);
+  };
+
+  return (
+    <>
+      <Navbar />
+      <div>
+        <h1>Bulk create</h1>
+        {users.map((user, index) => (
+          <div key={index}>
+            <TextField
+              label="Nombre"
+              value={user.name}
+              onChange={(e) => handleChange(index, "name", e.target.value)}
+            />
+            <TextField
+              label="Email"
+              value={user.email}
+              onChange={(e) => handleChange(index, "email", e.target.value)}
+            />
+            <TextField
+              label="Contraseña"
+              type="password"
+              value={user.password}
+              onChange={(e) => handleChange(index, "password", e.target.value)}
+            />
+            <TextField
+              label="Confirmar Contraseña"
+              type="password"
+              value={user.password_second}
+              onChange={(e) =>
+                handleChange(index, "password_second", e.target.value)
+              }
+            />
+            <TextField
+              label="Teléfono"
+              value={user.cellphone}
+              onChange={(e) => handleChange(index, "cellphone", e.target.value)}
+            />
+            <IconButton onClick={() => handleRemoveUser(index)}>
+              <Delete />
+            </IconButton>
+          </div>
+        ))}
+        <Button onClick={handleAddUser}>
+          <Add /> Añadir Usuario
+        </Button>
+        <Button onClick={handleSubmit}>Enviar</Button>
+      </div>
+    </>
+  );
+};
+
+export default BulkCreateUsers;
diff --git a/app/users/findusers/page.js b/app/users/findusers/page.js
index 12739b7..23bed75 100755
--- a/app/users/findusers/page.js
+++ b/app/users/findusers/page.js
@@ -1,10 +1,13 @@
 "use client";
-import React, { useState } from "react";
+import React, { useState, useEffect } from "react";
 import { Container, TextField, Button, Checkbox } from "@mui/material";
 import AuthService from "../../../services/AuthService";
 import Navbar from "../../../components/Navbar";
 
+import { useRouter } from "next/navigation";
+
 export default function FindUsersPage() {
+  const router = useRouter();
   const [filters, setFilters] = useState({
     name: "",
     login_before_date: "",
@@ -13,6 +16,13 @@ export default function FindUsersPage() {
   });
   const [users, setUsers] = useState([]);
 
+  useEffect(() => {
+    const user = JSON.parse(localStorage.getItem("user"));
+    if (!user) {
+      router.push("/login");
+    }
+  })
+
   const handleInputChange = (event) => {
     const { name, value } = event.target;
     let finalValue = value;
@@ -117,4 +127,4 @@ export default function FindUsersPage() {
       </div>
     </>
   );
-}
+}
\ No newline at end of file
diff --git a/components/Navbar.js b/components/Navbar.js
index 4662dd0..c5e4b21 100644
--- a/components/Navbar.js
+++ b/components/Navbar.js
@@ -26,6 +26,9 @@ const Navbar = () => {
                 {user?.name}
             </div>
             <div className="navbar-item">
+                <Button onClick={() => {router.push("/users/bulkcreate")}}>
+                    Bulk Create
+                </Button>
                 <Button onClick={() => {router.push("/users/findusers")}}>
                     Find Users
                 </Button>
diff --git a/services/AuthService.js b/services/AuthService.js
index 74726ee..7a9aee1 100644
--- a/services/AuthService.js
+++ b/services/AuthService.js
@@ -26,8 +26,14 @@ const findUsers = async ({ name, login_before_date, login_after_date, active })
                 antesSesion: login_before_date,
                 despuesSesion: login_after_date,
                 eliminados: active,
-            },
-        });
+            }
+        },
+        {
+            headers: {
+                token: localStorage.getItem('token')
+            }
+        }
+    );
         return response.data;
     } catch (e) {
         console.error(e);
@@ -35,6 +41,23 @@ const findUsers = async ({ name, login_before_date, login_after_date, active })
     }
 };
 
+const bulkCreateUsers = async (users) => {
+    try {
+        const response = await axios.post('http://localhost:3001/api/v1/users/bulkCreate', 
+            users,
+            {
+                headers: {
+                    token: localStorage.getItem('token')
+                }
+            }
+        );
+        console.log(response)
+        return response.data
+    } catch (e) {
+        return null;
+    }
+}
+
 const getUsers = async () => {
     try {
         //const response = await axios.get('fakeapi');
@@ -134,6 +157,7 @@ const updateUser = async (id, user, token) => {
 export default {
     handleLogin,
     findUsers,
+    bulkCreateUsers,
     getUsers,
     getUserById,
     logOut,