src/components/NavBar.vue

@@ -3,11 +3,22 @@
     <v-app-bar-nav-icon variant="text" @click.stop="drawer = !drawer"></v-app-bar-nav-icon>
     <v-toolbar-title>Menu</v-toolbar-title>
     <v-spacer></v-spacer>
-    <template v-if="$vuetify.display.mdAndUp">
-      <v-btn icon="mdi-magnify" variant="text"></v-btn>
-      <v-btn icon="mdi-filter" variant="text"></v-btn>
-    </template>
-    <v-btn icon="mdi-dots-vertical" variant="text"></v-btn>
+    <v-btn 
+      v-if="!isAuthenticated" 
+      prepend-icon="mdi-login" 
+      variant="text"
+      @click="navigate('/autenticarse')"
+    >
+      Login
+    </v-btn>
+    <v-btn 
+      v-else 
+      prepend-icon="mdi-logout" 
+      variant="text"
+      @click="logout"
+    >
+      Logout
+    </v-btn>
   </v-app-bar>
   <v-navigation-drawer v-model="drawer"
                        :location="$vuetify.display.mobile ? 'bottom' : undefined"
@@ -41,16 +52,17 @@
 
 <script>
  import trytonIcon from '../assets/icons/tryton-icon.svg';
+ import AuthService from '@/services/auth';
  export default {
      name: 'NavBar',
      data: () => ({
          drawer: false,
          group: null,
          showAdminMenu: false,
+         isAuthenticated: false,
          menuItems: [
              { title: 'Inicio', route: '/', icon: 'mdi-home'},
              { title: 'Comprar', route:'/comprar', icon: 'mdi-cart'},
-             { title: 'Salir', route:'/salir', icon: 'mdi-cart'},
          ],
          menuAdminItems: [
              { title: 'Cuadrar tarro', route: '/cuadrar_tarro', icon: 'mdi-calculator'},
@@ -62,12 +74,18 @@
              { title: 'Actualizar Ventas Tryton', route: '/sincronizar_ventas_tryton', icon: 'trytonIcon'}
          ],
      }),
+     mounted() {
+       this.checkAuth();
+     },
      watch: {
          group () {
              this.drawer = false
          },
      },
      methods: {
+         checkAuth() {
+           this.isAuthenticated = AuthService.isAuthenticated();
+         },
          navigate(route) {
              this.$router.push(route);
          },
@@ -78,6 +96,11 @@
          toggleAdminMenu() {
              this.showAdminMenu = !this.showAdminMenu;
          },
+         logout() {
+           AuthService.logout();
+           this.isAuthenticated = false;
+           this.$router.push('/');
+         },
      }
   }
-</script>
+ </script>