feat:#5 added menubar link

frontend/package-lock.json

@@ -18,6 +18,7 @@
         "primeflex": "^3.3.1",
         "primeicons": "^6.0.1",
         "primevue": "^3.46.0",
+        "source-sans": "^3.46.0",
         "source-sans-pro": "^3.6.0",
         "vue": "^3.4.11",
         "vue-i18n": "^9.9.0",
@@ -3967,6 +3968,11 @@
         "source-map": "^0.6.0"
       }
     },
+    "node_modules/source-sans": {
+      "version": "3.46.0",
+      "resolved": "https://registry.npmjs.org/source-sans/-/source-sans-3.46.0.tgz",
+      "integrity": "sha512-bVC2YX4VNiv5vMcy77dL0XKsNp794ThfynNsr+FqSAwk8TGG0pZsg7eUQi6yHwaRBMVmZ3Aaf4FY46dxIIGgsg=="
+    },
     "node_modules/source-sans-pro": {
       "version": "3.6.0",
       "resolved": "https://registry.npmjs.org/source-sans-pro/-/source-sans-pro-3.6.0.tgz",

frontend/package.json

@@ -23,6 +23,7 @@
     "primeflex": "^3.3.1",
     "primeicons": "^6.0.1",
     "primevue": "^3.46.0",
+    "source-sans": "^3.46.0",
     "source-sans-pro": "^3.6.0",
     "vue": "^3.4.11",
     "vue-i18n": "^9.9.0",

frontend/src/components/MenuBar.vue

@@ -17,10 +17,21 @@ const items = computed(() => [
     route: "/edit",
   },
   {
-    label: t("roomFinder"),
+    label: t("rooms"),
-    icon: "pi pi-fw pi-calendar",
+    icon: "pi pi-fw pi-angle-down",
+    items: [
+      {
+        label: t("roomFinderPage.roomSchedule"),
+        icon: "pi pi-fw pi-hourglass",
         route: "/rooms",
       },
+      {
+        label: t("roomFinderPage.freeRooms"),
+        icon: "pi pi-fw pi-calendar",
+        route: "/rooms/free",
+      },
+    ],
+  },
   {
     label: t("faq"),
     icon: "pi pi-fw pi-book",
@@ -44,17 +55,17 @@ const items = computed(() => [
     <template #start>
       <router-link v-slot="{ navigate }" :to="`/`" custom>
         <Button severity="secondary" text class="p-0 mx-2" @click="navigate">
-          <img
+          <img width="50" height="50" src="../../public/htwk.svg" alt="Logo" />
-            width="50"
-            height="50"
-            src="../../public/htwk.svg"
-            alt="Logo"
-          />
         </Button>
       </router-link>
     </template>
     <template #item="{ item }">
-      <router-link v-slot="{ navigate }" :to="item.route" custom>
+      <router-link
+        v-if="item.route"
+        v-slot="{ navigate }"
+        :to="item.route"
+        custom
+      >
         <Button
           :label="String(item.label)"
           :icon="item.icon"
@@ -64,6 +75,15 @@ const items = computed(() => [
           @click="navigate"
         />
       </router-link>
+      <Button
+        v-else
+        :label="String(item.label)"
+        :icon="item.icon"
+        text
+        severity="secondary"
+        @click="item.url"
+      >
+      </Button>
     </template>
     <template #end>
       <div class="flex align-items-stretch justify-content-center">
@@ -80,6 +100,10 @@ const items = computed(() => [
   border: none;
 }
 
+:deep(.p-submenu-list) {
+  border-radius: 6px;
+}
+
 :deep(.p-button .p-button-label::after) {
   content: "";
   display: block;

frontend/src/i18n/translations/de.json

@@ -2,7 +2,7 @@
   "languageCode": "de",
   "createCalendar": "Kalender erstellen",
   "editCalendar": "Kalender bearbeiten",
-  "roomFinder": "Raumfinder",
+  "rooms": "Räume",
   "faq": "FAQ",
   "imprint": "Impressum",
   "privacy": "Datenschutz",
@@ -19,6 +19,8 @@
     "semesterDropDown": "Semester"
   },
   "roomFinderPage": {
+    "roomSchedule": "Raumbelegung",
+    "freeRooms": "Freie Räume",
     "headline": "Raumfinder",
     "detail": "Bitte wähle einen Raum aus, um die Belegung einzusehen",
     "dropDownSelect": "Bitte wähle einen Raum aus",

frontend/src/i18n/translations/en.json

@@ -2,7 +2,7 @@
   "languageCode": "en",
   "createCalendar": "create calendar",
   "editCalendar": "edit calendar",
-  "roomFinder": "room finder",
+  "rooms": "rooms",
   "faq": "faq",
   "imprint": "imprint",
   "privacy": "privacy",
@@ -19,6 +19,8 @@
     "semesterDropDown": "please select a semester"
   },
   "roomFinderPage": {
+    "roomSchedule": "room schedule",
+    "freeRooms": "free rooms",
     "headline": "room finder",
     "detail": "please select a room to view the occupancy",
     "dropDownSelect": "please select a room",

frontend/vite.config.ts

@@ -16,5 +16,12 @@ export default defineConfig({
     watch: {
       usePolling: true,
     },
+    proxy: {
+      "/api": {
+        target: "http://localhost:8090/api",
+        changeOrigin: true,
+        rewrite: (path) => path.replace(/^\/api/, ""),
+      },
+    },
   },
 });