frontend: Owner management

frontend/app/pages/login.vue

@@ -0,0 +1,64 @@
+<script setup lang="ts">
+import { ref } from "vue"
+
+const username = ref("")
+const password = ref("")
+const error = ref("")
+
+const { setToken } = useAuth()
+const { apiFetch } = useApi()
+const router = useRouter()
+
+async function login() {
+  error.value = ""
+
+  try {
+    const data = await apiFetch("/auth/token", {
+      method: "POST",
+      body: new URLSearchParams({
+        username: username.value,
+        password: password.value
+      }),
+      headers: {
+        "Content-Type": "application/x-www-form-urlencoded"
+      }
+    })
+
+    setToken(data.access_token)
+    router.push("/")
+  } catch (e: any) {
+    error.value = "Login fehlgeschlagen"
+  }
+}
+</script>
+
+<template>
+  <div class="max-w-sm mx-auto mt-20 p-6 bg-white shadow rounded">
+    <h1 class="text-2xl font-bold mb-4">Login</h1>
+
+    <div class="space-y-4">
+      <input
+        v-model="username"
+        type="text"
+        placeholder="Username"
+        class="w-full p-2 border rounded"
+      />
+
+      <input
+        v-model="password"
+        type="password"
+        placeholder="Password"
+        class="w-full p-2 border rounded"
+      />
+
+      <button
+        @click="login"
+        class="w-full bg-blue-600 text-white p-2 rounded hover:bg-blue-700"
+      >
+        Login
+      </button>
+
+      <p v-if="error" class="text-red-600">{{ error }}</p>
+    </div>
+  </div>
+</template>