Frontend início

2026-06-11 22:17:58 -03:00
parent 65111a45f9
commit 7301aea8f8
6 changed files with 80 additions and 1 deletions
@@ -1,9 +1,12 @@
 import express from "express";
 import usuarioRouter from "./routers/usuarioRouter.js";
+import cors from "cors";

 // Inicialização do Express
 const app = express();

+app.use(cors);
+
 // Rota de saúde, utilizada para testar se a API-REST está no ar
 app.get("/health", (req, res) => {
    res.json({
@@ -10,6 +10,7 @@
      "license": "ISC",
      "dependencies": {
        "bcryptjs": "^3.0.3",
+        "cors": "^2.8.6",
        "dotenv": "^17.4.2",
        "express": "^5.2.1",
        "express-validator": "^7.3.2",
@@ -241,6 +242,23 @@
        "node": ">=6.6.0"
      }
    },
+    "node_modules/cors": {
+      "version": "2.8.6",
+      "resolved": "https://registry.npmjs.org/cors/-/cors-2.8.6.tgz",
+      "integrity": "sha512-tJtZBBHA6vjIAaF6EnIaq6laBBP9aq/Y3ouVJjEfoHbRBcHBAHYcMh/w8LDrk2PvIMMq8gmopa5D4V8RmbrxGw==",
+      "license": "MIT",
+      "dependencies": {
+        "object-assign": "^4",
+        "vary": "^1"
+      },
+      "engines": {
+        "node": ">= 0.10"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/express"
+      }
+    },
    "node_modules/debug": {
      "version": "4.4.3",
      "resolved": "https://registry.npmjs.org/debug/-/debug-4.4.3.tgz",
@@ -887,6 +905,15 @@
        "node": ">=0.10.0"
      }
    },
+    "node_modules/object-assign": {
+      "version": "4.1.1",
+      "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",
+      "integrity": "sha512-rJgTQnkUnH1sFw8yT6VSU3zD3sWmu6sZhIseY8VX+GRu3P6F7Fu+JNDoXfklElbLJSnc3FUQHVe4cU5hj+BcUg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
    "node_modules/object-inspect": {
      "version": "1.13.4",
      "resolved": "https://registry.npmjs.org/object-inspect/-/object-inspect-1.13.4.tgz",
@@ -12,6 +12,7 @@
  "license": "ISC",
  "dependencies": {
    "bcryptjs": "^3.0.3",
+    "cors": "^2.8.6",
    "dotenv": "^17.4.2",
    "express": "^5.2.1",
    "express-validator": "^7.3.2",
@@ -1,7 +1,10 @@
 import {executarSQL} from "../config/database.js";

 export async function findAll() {
-    return executarSQL(`select usuario.id, usuario.nome, usuario.email, perfil.nome 
+    return executarSQL(`select usuario.id, 
+                        usuario.nome as usuario_nome, 
+                        usuario.email, 
+                        perfil.nome as perfil_nome 
                from usuario inner join perfil on 
                usuario.perfil_id = perfil.id 
                where usuario.ativo = true`)
@@ -0,0 +1,20 @@
+async function carregarUsuarios(){
+    const tbody = document.querySelector("#conteudo_tabela_usuarios");
+
+    const resposta = await fetch("http://localhost:5000/api/v1/usuarios");
+    const usuarios = await resposta.json();
+
+    usuarios.forEach(usuario => {
+        const linha = document.createElement("tr");
+        linha.innerHTML = `
+                            <td>${usuario.usuario_nome}</td>
+                            <td>${usuario.email}</td>
+                            <td>${usuario.perfil_nome}</td>
+                          `;
+        tbody.appendChild(linha);
+    });
+}
+
+window.onload = () => {
+    carregarUsuarios();
+};
@@ -0,0 +1,25 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Document</title>
+</head>
+<body>
+    
+    <div>
+        <table>
+            <thead>
+                <th>Nome</th>
+                <th>E-mail</th>
+                <th>Perfil</th>
+            </thead>
+            <tbody id="conteudo_tabela_usuarios">
+
+            </tbody>
+        </table>
+    </div>
+
+    <script src="app.js"></script>
+</body>
+</html>