<template>
  <div>
    <!-- :location="$vuetify.display.mobile ? 'bottom' : undefined" -->
    <v-navigation-drawer style="border: 0;" v-model="drawer">
      <v-list-item class="ml-2 mt-3">
        <v-img
          :aspect-ratio="1"
          max-height="42px"
          max-width="132px"
          class="bg-white"
          src="images/logo.png"
        ></v-img>
      </v-list-item>
    </v-navigation-drawer>

    <v-app-bar class="elevation-0">
      <v-app-bar-nav-icon @click="drawer = !drawer"></v-app-bar-nav-icon>

      <v-app-bar-title>Application</v-app-bar-title>
    </v-app-bar>
  </div>
</template>

<script type="module">
  export default {
    name: "NavbarComponent",
    data() {
      return {
        drawer: false,
      };
    },
    computed: {
      // Akses state dari store
      count() {
        return this.$store.state.coba2.count;
      },
      email() {
        return this.$store.state.coba2.email;
      },
    },
    methods: {
      // Dispatch action ke store
      increment() {
        this.$store.dispatch("increment");
      },
    },
  };
</script>

<style scoped>
  h1 {
    color: blue;
  }
</style>
