From b3e85d9aaaf8cff5e61e8af22a93b21030844e6e Mon Sep 17 00:00:00 2001
From: Douglas Barone <douglasvbarone@gmail.com>
Date: Mon, 29 Nov 2021 10:22:32 -0400
Subject: [PATCH] Refactor

---
 web/src/views/SystemAdministration/index.vue | 38 +++++++++++++-------
 1 file changed, 25 insertions(+), 13 deletions(-)

diff --git a/web/src/views/SystemAdministration/index.vue b/web/src/views/SystemAdministration/index.vue
index 7828394..d73a020 100644
--- a/web/src/views/SystemAdministration/index.vue
+++ b/web/src/views/SystemAdministration/index.vue
@@ -1,18 +1,10 @@
 <template>
   <div>
     <v-toolbar dense flat>
-      <v-toolbar-items>
-        <v-btn color="primary" :to="{ name: 'logs' }" text>
-          <v-icon left>mdi-comment-text-outline</v-icon>
-          Logs
-        </v-btn>
-        <v-btn color="primary" :to="{ name: 'paloalto' }" text>
-          <v-icon left>mdi-router</v-icon>
-          Palo Alto
-        </v-btn>
-        <v-btn color="primary" :to="{ name: 'maintenance' }" text>
-          <v-icon left>mdi-tools</v-icon>
-          Manutenção
+      <v-toolbar-items v-for="tab in tabs" :key="tab.name">
+        <v-btn color="primary" :to="{ name: tab.name }" text>
+          <v-icon left>{{ tab.icon }}</v-icon>
+          {{ tab.title }}
         </v-btn>
       </v-toolbar-items>
     </v-toolbar>
@@ -24,9 +16,29 @@
 
 <script>
 export default {
+  name: 'SystemAdministration',
+  data: () => ({
+    tabs: [
+      {
+        name: 'paloalto',
+        title: 'Palo Alto',
+        icon: 'mdi-router'
+      },
+      {
+        name: 'maintenance',
+        title: 'Manutenção',
+        icon: 'mdi-tools'
+      },
+      {
+        name: 'logs',
+        title: 'Logs',
+        icon: 'mdi-comment-text'
+      }
+    ]
+  }),
   mounted() {
     if (this.$route.name == 'system-administration')
-      this.$router.replace({ name: 'logs' })
+      this.$router.replace({ name: 'paloalto' })
   }
 }
 </script>