From 25d2edb7266ecda70562cccf2a43fcbd6d2c1e9b Mon Sep 17 00:00:00 2001
From: Traym17 <51390112+Traym17@users.noreply.github.com>
Date: Wed, 13 Jul 2022 23:01:27 -0600
Subject: [PATCH] Listar y registrar completos

El registro y el listar de los administradores del sistema listo
---
 web-ui/web-react/src/App.js                   |  2 +-
 .../src/components/FormAdminSistema.js        | 56 ++++++++++++++-----
 2 files changed, 42 insertions(+), 16 deletions(-)

diff --git a/web-ui/web-react/src/App.js b/web-ui/web-react/src/App.js
index 22936c88..535d2727 100644
--- a/web-ui/web-react/src/App.js
+++ b/web-ui/web-react/src/App.js
@@ -162,7 +162,7 @@ const App = () => {
             label: 'Home',
             items: [
                 {label: 'Dashboard', icon: 'pi pi-fw pi-home', to: '/'},
-                {label: 'Registro admin sistema', icon: 'pi pi-fw pi-id-card', to: '/formAdminSistema'}
+                {label: 'Administradores del sistema', icon: 'pi pi-fw pi-id-card', to: '/formAdminSistema'}
             ]
         },
         {
diff --git a/web-ui/web-react/src/components/FormAdminSistema.js b/web-ui/web-react/src/components/FormAdminSistema.js
index cbb2eab7..5f82d6ef 100644
--- a/web-ui/web-react/src/components/FormAdminSistema.js
+++ b/web-ui/web-react/src/components/FormAdminSistema.js
@@ -1,10 +1,31 @@
-import React, { useRef, useState } from 'react';
+import React, { useEffect, useState } from 'react';
 import { InputText } from 'primereact/inputtext';
 import { Button } from 'primereact/button';
+import { DataTable } from 'primereact/datatable';
+import { Column } from 'primereact/column';
+import { CustomerService } from '../service/CustomerService';
 
 const FormAdminSistema = () => {
+
+    const [pokemones,setPokemones]=useState([]);
+    const [urlFetch,setUrlFetch]=useState('http://localhost:4000/user/allUsers');
+    async function fetchP(){
+    let nombres=await fetch(urlFetch, {method:'GET'});
+    let pokemonesRes= await nombres.json();
+    setPokemones(pokemonesRes.message);
+    console.log(pokemones);
+   }
+    useEffect(()=>{
+      fetchP();
+    },[])
+
+
+
+
+
+
     function registrarAdmin() {
-        var data2 = {
+        var data = {
             dni: document.getElementById('identificacion').value,
             name: document.getElementById('nombre').value,
             last_name: document.getElementById('apellidos').value,
@@ -14,21 +35,12 @@ const FormAdminSistema = () => {
             user_type: "1",
             status: "2"
         };
-        console.log(data2);
-        var data = {
-            dni: "12687",
-            name: "hola",
-            last_name: "buuu",
-            email: "tmora4c@ucenfotec.ac.cr",
-            phone: 84664515,
-            password: "1203",
-            user_type: "1",
-            status: "2"
-        };
+       // console.log(data);
+
          fetch('http://localhost:4000/user/createAdminSystem/', {
             cache: 'no-cache',
             method: 'POST',
-            body: JSON.stringify(data2),
+            body: JSON.stringify(data),
             headers: {
                 'Content-Type': 'application/json'
             }
@@ -43,7 +55,7 @@ const FormAdminSistema = () => {
         )
         .then(
             function (response) {
-                console.log(response.message);
+                fetchP();
             }
         )
         .catch(
@@ -53,6 +65,18 @@ const FormAdminSistema = () => {
 
     return (
         <div className="grid">
+            <div className="col-12">
+                <div className="card">
+                    <h5>Administradores del sistema</h5>
+                    <DataTable value={pokemones}  scrollable scrollHeight="400px" scrollDirection="both" className="mt-3">
+                        <Column field="name" header="Nombre" style={{ flexGrow: 1, flexBasis: '160px' }}></Column>
+                        <Column field="last_name" header="Apellidos" style={{ flexGrow: 1, flexBasis: '160px' }} alignFrozen="left"></Column>
+                        <Column field="dni" header="Identificación" style={{ flexGrow: 1, flexBasis: '160px' }}></Column>
+                        <Column field="email" header="Correo electrónico" style={{ flexGrow: 1, flexBasis: '160px' }}></Column>
+                        <Column field="phone" header="Telefóno" style={{ flexGrow: 1, flexBasis: '160px' }}></Column>
+                    </DataTable>
+                </div>
+            </div>
             <div className="col-12">
                 <div className="card">
                     <h5>Registro de un administrador del sistema</h5>
@@ -82,6 +106,8 @@ const FormAdminSistema = () => {
                 </div>
             </div>
         </div>
+
+        
     )
 }