No changes made

frontend/src/components/TopMenubar.vue

@@ -0,0 +1,109 @@
+<template>
+  <div>
+    <Menubar :model="items">
+      <template #start>
+        <router-link to="/">
+          Load Data Manager
+        </router-link>
+        <i class="ml-3 mr-3 fa-thin fa-gun"></i>
+        ::
+      </template>
+    </Menubar>
+  </div>
+</template>
+<script lang="ts" setup>
+import { defineAsyncComponent, ref } from 'vue'
+import { MenuItem } from 'primevue/menuitem'
+import { useRouter } from 'vue-router'
+import { icons } from '../lib/icons.ts'
+
+const Menubar = defineAsyncComponent(() => import('primevue/menubar'))
+
+const router = useRouter()
+
+const items = ref<MenuItem[]>([
+  {
+    label: 'Loads',
+    items: [
+      {
+        label: 'New',
+        command: () => router.push('/loads/add'),
+        icon: icons.add
+      },
+      {
+        label: 'Edit/Search',
+        command: () => router.push('/loads/search'),
+        icon: icons.edit
+      }
+    ]
+  },
+  {
+    label: 'Components',
+    items: [
+      {
+        label: 'Bullets',
+        items: [
+          {
+            label: 'New',
+            command: () => router.push('/bullets/add'),
+            icon: icons.add
+          },
+          {
+            label: 'List',
+            command: () => router.push('/bullets'),
+            icon: icons.list
+          }
+        ]
+      },
+      {
+        label: 'Powders',
+        items: [
+          {
+            label: 'New',
+            command: () => router.push('/powders/add'),
+            icon: icons.add
+          },
+          {
+            label: 'List',
+            command: () => router.push('/powders'),
+            icon: icons.list
+          }
+        ]
+      },
+      {
+        label: 'Primers',
+        items: [
+          {
+            label: 'New',
+            command: () => router.push('/primers/add'),
+            icon: icons.add
+          },
+          {
+            label: 'List',
+            command: () => router.push('/primers'),
+            icon: icons.list
+          }
+        ]
+      },
+    ]
+  },
+  {
+    label: 'Manufacturers',
+    items: [
+      {
+        label: 'Manage Manufacturers',
+        command: () => router.push('/manufacturers'),
+        icon: icons.add
+      },
+      {
+        label: 'Add Manufacturer',
+        command: () => router.push('/manufacturers/add'),
+        icon: icons.edit
+      }
+    ]
+  },
+  {
+    separator: true
+  }
+])
+</script>