Panel admin

src/components/login.vue

@@ -53,7 +53,7 @@ import Header from "./../view/headerAdmin.vue";
 export default {
   components: {
     //HelloWorld
-    Header,
+    Header
   },
   data() {
     return {
@@ -61,7 +61,7 @@ export default {
       password: "",
       error: false,
       mal: null,
-      resp: null,
+      resp: null
     };
   },
   methods: {
@@ -75,33 +75,33 @@ export default {
     entrar() {
       const data = {
         usuario: this.usuario,
-        password: this.password,
+        password: this.password
       };
 
       axios
         .post(`${config.api}/login`, data)
-        .then(async (respose) => {
+        .then(async respose => {
           this.resp = respose.data;
           if (respose.data.err == false) {
             await swal(`Bienvenido ${this.usuario}`, "", "success");
 
             window.localStorage.setItem("id_usuario", respose.data.id_usuario);
-            this.$router.push("/");
+            this.$router.push("/Registros");
           } else {
             this.error = true;
             await swal(" Usuario o Contraseña incorrecta.", "", "error");
           }
         })
-        .catch((err) => {
+        .catch(err => {
           swal(" Usuario o Contraseña incorrecta.", "", "error");
           this.resp = err;
           this.error = true;
         });
-    },
+    }
   },
   beforeCreate() {
     localStorage.clear();
-  },
+  }
 };
 </script>
 

src/components/panelAdmin.vue

@@ -0,0 +1,111 @@
+<template>
+  <section class="admin-login">
+    <!--Importar componente de header para login -->
+    <Header />
+    <div>
+      <h1>Hackaton UNAM-AWS</h1>
+    </div>
+    <div class="container">
+      <div class="row">
+        <table class="table">
+          <thead class="thead-dark">
+            <tr class="titulo">
+              <th scope="col">#</th>
+              <th scope="col">Nombre del Equipo</th>
+              <th scope="col">Numero de Integrantes</th>
+              <th scope="col">Nombre del Lider</th>
+              <th scope="col">Correo</th>
+              <th scope="col">Carrera</th>
+              <th scope="col">Campus</th>
+              <th scope="col">Fecha de Registro</th>
+            </tr>
+          </thead>
+          <tbody>
+            <tr v-for="item in registros" :key="item.idEquipo">
+              <th scope="row">{{ item.idEquipo }}</th>
+              <td>{{ item.nombreEquipo }}</td>
+              <td>{{ item.numeroIntegrantes }}</td>
+              <td>{{ item.nombre }}</td>
+              <td>{{ item.correo }}</td>
+              <td>{{ item.carrera }}</td>
+              <td>{{ item.campus }}</td>
+              <td>{{ item.fecha }}</td>
+            </tr>
+          </tbody>
+        </table>
+      </div>
+    </div>
+  </section>
+</template>
+
+<script>
+import axios from "axios";
+import config from "../config/config.js";
+
+import Header from "./../view/headerAdmin.vue";
+
+export default {
+  components: {
+    //HelloWorld
+    Header
+  },
+  data() {
+    return {
+      registros: []
+    };
+  },
+
+  async created() {
+    let equipos = await axios.get(`${config.api}/getRegistro`);
+    equipos = equipos.data.data;
+    for (let i = 0; i < equipos.length; i++) {
+      console.log(`   Fecha ${equipos[i].fechaRegistro}`);
+      if (equipos[i].fechaRegistro !== null) {
+        equipos[i].fechaRegistro = new Date(equipos[i].fechaRegistro)
+          .toISOString()
+          .slice(0, 19)
+          .replace("T", " / ");
+        //console.log(  `   Nueva Fecha de registro Fecha ${equipos[i].fechaRegistro}`);
+      }
+      this.registros.push({
+        idEquipo: i+1,
+        nombreEquipo: equipos[i].nombreEquipo,
+        numeroIntegrantes: equipos[i].numeroIntegrantes,
+        nombre: equipos[i].nombre,
+        correo: equipos[i].correo,
+        carrera: equipos[i].carrera,
+        campus: equipos[i].campus,
+        fecha: equipos[i].fechaRegistro
+      });
+    }
+  },
+  beforeCreate() {
+    if (!window.localStorage.getItem("id_usuario")) this.$router.push("/");
+    else this.id = window.localStorage.getItem("id_usuario");
+  }
+};
+</script>
+
+<style scoped>
+h1 {
+  margin-top: 2.5rem;
+  margin-bottom: 3.5rem;
+  font-size: 1.5rem;
+}
+
+.titulo{
+  font-size: .8rem;
+}
+td{
+  font-size: .8rem;
+}
+
+
+@media screen and (min-width: 1024px) {
+  h1 {
+    margin-top: 3rem;
+    margin-bottom: 4rem;
+    font-size: 2.5rem;
+  }
+}
+</style>

src/components/usuario.vue

@@ -16,8 +16,8 @@ export default {
     //HelloWorld
     Header,
     Form,
-    Footer,
-  },
+    Footer
+  }
 };
 </script>
 

src/config/config.js

@@ -1,5 +1,13 @@
 const config = {
+
+  //Local
   //api: "http://localhost:3001"
-  api: "https://venus.acatlan.unam.mx/indiana_hackaton"
+
+  //Pruebas
+  api: "https://venus.acatlan.unam.mx/hackaton"
+
+  //Produccion
+  //api: "https://venus.acatlan.unam.mx/indiana_hackaton"
+  
 };
 module.exports = config;

src/routes.js

@@ -1,6 +1,8 @@
 import Form from "./components/usuario.vue";
 import Login from "./components/login.vue";
+import Panel from "./components/panelAdmin.vue";
 export const routes = [
   { path: "/", component: Form, name: "form" },
   { path: "/panelAdmin", component: Login, name: "Login" },
+  { path: "/Registros", component: Panel, name: "Panel" }
 ];