diff options
Diffstat (limited to 'iridescence/src/components/Navbar.vue')
| -rw-r--r-- | iridescence/src/components/Navbar.vue | 30 |
1 files changed, 29 insertions, 1 deletions
diff --git a/iridescence/src/components/Navbar.vue b/iridescence/src/components/Navbar.vue index b83834a..8c2f0a6 100644 --- a/iridescence/src/components/Navbar.vue +++ b/iridescence/src/components/Navbar.vue @@ -1,6 +1,6 @@ <template> <div id="navbar"> - <nav class="navbar is-primary"> + <nav class="navbar is-fixed-top is-transparent"> <div class="navbar-brand"> <div class="navbar-item"> <img src="@/assets/logo.png" /> @@ -26,6 +26,24 @@ </router-link> </div> <div class="navbar-end"> + <div + class="navbar-item has-dropdown is-active" + v-for="category in categories.keys()" + :key="category" + > + <div class="navbar-link"> + {{ category }} + </div> + + <div + class="navbar-dropdown" + v-for="subcategory in categories.get(category)" + :key="subcategory" + > + {{ subcategory }} + </div> + </div> + <div class="navbar-item"> <div class="buttons"> <button class="button"> @@ -43,6 +61,8 @@ </template> <script> +import Category from "~models/category.js"; + export default { name: "Navbar", data() { @@ -57,6 +77,14 @@ export default { } else { return "navbar-menu"; } + }, + categories() { + const inventory = this.$store.getters.inventory; + console.log(inventory); + console.log(inventory.map(item => item.categories)); + + //console.log(cats); + return []; } }, methods: { |