Initial log funcionality

server/src/resolvers/Log.js

@@ -0,0 +1,7 @@
+const Log = {
+  tags: _ => `[${_.tags.join(', ')}]`,
+  data: _ => JSON.stringify(_.data),
+  timestamp: _ => _.timestamp?.toISOString()
+}
+
+export { Log }

server/src/resolvers/Query.js

@@ -146,16 +146,10 @@ const Query = {
   },
 
   async logs() {
-    const logs = await prisma.log.findMany({
+    return await prisma.log.findMany({
       orderBy: { timestamp: 'desc' },
       take: 500
     })
-
-    return logs.map(log => ({
-      ...log,
-      tags: `[${log.tags.join(', ')}]`,
-      data: JSON.stringify(log.data)
-    }))
   }
 }
 

server/src/resolvers/index.js

@@ -8,6 +8,7 @@ import { Group } from './Group'
 import { ResetToken } from './ResetToken'
 import { WifiDevice } from './WifiDevice'
 import { Stats } from './Stats'
+import { Log } from './Log'
 
 const resolvers = {
   Query,
@@ -18,7 +19,8 @@ const resolvers = {
   Group,
   ResetToken,
   WifiDevice,
-  Stats
+  Stats,
+  Log
 }
 
 export { resolvers }

web/src/mixins/Nav.js

@@ -79,7 +79,14 @@ export default {
       },
       {
         groupTitle: 'Sistema',
+
         items: [
+          {
+            title: 'Logs',
+            icon: 'mdi-clipboard-text-search',
+            route: { name: 'logs' },
+            role: 'superAdmin'
+          },
           {
             title: 'Administração',
             icon: 'mdi-shield-account',

web/src/router/index.js

@@ -177,6 +177,16 @@ const routes = [
       import(/* webpackChunkName: "wifi-users" */ '../views/WifiUsers.vue')
   },
 
+  {
+    path: '/logs',
+    name: 'logs',
+    meta: {
+      title: 'Logs',
+      superAdmin: true
+    },
+    component: () => import(/* webpackChunkName: "logs" */ '../views/Logs.vue')
+  },
+
   {
     path: '/system-administration',
     name: 'system-administration',

web/src/views/Logs.vue

@@ -0,0 +1,72 @@
+<template>
+  <div>
+    <v-toolbar> <v-text-field v-model="search" /> </v-toolbar>
+    <div>
+      <v-data-table
+        :items="items"
+        :headers="headers"
+        :search="search"
+      ></v-data-table>
+    </div>
+  </div>
+</template>
+
+<script>
+import gql from 'graphql-tag'
+import { format } from 'date-fns'
+export default {
+  data: () => ({
+    search: '',
+    showLow: true,
+    showInfo: true,
+    showWarning: true,
+    showError: true,
+    showSuccess: true,
+
+    headers: [
+      {
+        text: 'Timestamp',
+        value: 'timestamp'
+      },
+      {
+        text: 'Tags',
+        value: 'tags'
+      },
+      {
+        text: 'Mensagem',
+        value: 'message'
+      },
+      {
+        text: 'Severidade',
+        value: 'level'
+      }
+    ]
+  }),
+  computed: {
+    items() {
+      return this.logs?.map(log => ({
+        ...log,
+        timestamp: format(new Date(log.timestamp), 'yy/MM/dd HH:mm:ss')
+      }))
+    }
+  },
+  apollo: {
+    logs: {
+      query: gql`
+        query {
+          logs {
+            id
+            timestamp
+            level
+            tags
+            message
+            data
+          }
+        }
+      `
+    }
+  }
+}
+</script>
+
+<style></style>