feat: basic ui

frontend/src/components/cards/NavCard.vue

@@ -0,0 +1,31 @@
+<script setup lang="ts">
+import { Button, Card } from 'primevue';
+import { useRouter } from 'vue-router';
+
+const router = useRouter()
+
+const navigateTo = (path: string) => {
+  localStorage.setItem('app-selection', path)
+  router.push(path)
+}
+
+defineProps<{
+    to: string
+    title: string
+    content?: string
+}>()
+</script>
+
+<template>
+    <Card>
+      <template #title>
+        <h1 class="text-md">{{ title }}</h1>
+      </template>
+      <template #content v-if="content">
+        <p class="w-56">{{ content }}</p>
+      </template>
+      <template #footer>
+        <Button @click="navigateTo(to)" severity="contrast" size="small">Перейти</Button>
+      </template>
+    </Card>
+</template>

frontend/src/components/headers/VHeader.vue

@@ -0,0 +1,26 @@
+<script lang="ts" setup>
+import { Button, Toolbar } from 'primevue';
+import { useRoute, useRouter } from 'vue-router';
+
+const route = useRoute()
+const router = useRouter()
+
+const logout = () => {
+    localStorage.removeItem('app-selection')
+    router.replace('/')
+}
+
+</script>
+
+<template>
+    <header >
+        <Toolbar>
+            <template #start>
+                <p class="font-bold">{{ $route.matched?.[$route.matched.length - 2]?.name }} / {{ route.name }}</p>
+            </template>
+            <template #end>
+                <Button severity="danger" :size="'small'" @click="logout">Выйти</Button>
+            </template>
+        </Toolbar>
+    </header>
+</template>