Started implementation of profile / employee-form

src/components/VNavigation.vue

@@ -0,0 +1,36 @@
+<script setup lang="ts">
+
+import { useRouter } from 'vue-router';
+import { useUser } from '@/stores/user';
+
+const userStore = useUser()
+const router = useRouter()
+
+async function onLogout() {
+	if(await userStore.logout()){
+		router.push({name: 'Login'})
+	}
+}
+
+</script>
+
+<template>
+    <nav class="nav justify-content-center border-bottom mb-4 pb-2 d-flex">
+		<router-link class="nav-link" to="/">Home</router-link>
+        <div class="ms-auto"></div>
+        <router-link 
+            v-if="userStore.isLoggedIn" 
+            class="nav-link" 
+            :to="{name: 'Profile'}"
+        >
+            Profile
+        </router-link>
+
+		<a v-if="userStore.isLoggedIn" href="#" @click="onLogout()" class="nav-link">Logout</a>
+		<router-link v-else to="Login" class="nav-link">Login</router-link>
+	</nav>
+</template>
+
+<style scoped>
+
+</style>

src/components/VProfileControls.vue

@@ -0,0 +1,50 @@
+<script setup lang="ts">
+
+import { ref } from 'vue'
+import type { Ref } from 'vue'
+
+const isActive : Ref<boolean> = ref(false)
+
+function onEdit() {
+    isActive.value = true
+}
+
+function onSave() {
+
+}
+
+function onCancel() {
+    isActive.value = false
+}
+
+</script>
+
+<template>
+<div class="d-flex">
+    <router-link type="button" :to="{name: 'Home'}" class="btn btn-outline-secondary">
+        <i class="bi bi-chevron-left"></i>
+        Zurück
+    </router-link>
+
+    <button v-if="!isActive" type="button" @click="onEdit" class="btn btn-primary ms-auto">
+        <i class="bi bi-pen"></i>
+        Bearbeiten
+    </button>
+
+    <button v-if="isActive" type="button" @click="onSave" class="btn btn-success ms-auto">
+        <i class="bi bi-save"></i>
+        Speichern
+    </button>
+
+    <button v-if="isActive" type="button" @click="onCancel" class="btn btn-outline-secondary ms-3">
+        <i class="bi bi-x-lg"></i>
+        Abbrechen
+</button>
+</div>
+
+
+</template>
+
+<style scoped>
+
+</style>