Basic design created

app/Domains/UserManagement/Views/Login.vue

@@ -0,0 +1,64 @@
+<script setup>
+import AppLayout from '../../../../resources/js/layouts/AppLayout.vue'
+import {onMounted, ref} from 'vue'
+import { toast } from 'vue3-toastify'
+import ShadowedBox from "../../../Views/Components/ShadowedBox.vue";
+
+
+const props = defineProps({
+    navbar: Object,
+    tenant: String,
+    user: Object,
+    currentPath: String,
+    errors: Object,
+})
+
+
+onMounted(() => {
+    if (undefined !== props.errors && undefined !== props.errors.username) {
+        toast.error(props.errors.username[0])
+    }
+})
+
+//console.log(props.errors.password[0])
+const username = ref('')
+const password = ref('')
+
+const csrfToken = document.querySelector('meta[name="csrf-token"]').getAttribute('content')
+</script>
+
+<template>
+    <AppLayout title='Anmelden' :user="props.user" :navbar="props.navbar" :tenant="props.tenant" :currentPath="props.currentPath">
+        <form method="POST" action="/login">
+            <input type="hidden" name="_token" :value="csrfToken" />
+            <shadowed-box style="width: 50%; margin: 150px auto; padding: 20px;">
+                <table>
+                    <tr>
+                        <th>Anmeldename</th>
+                        <td>
+                            <input type="text" name="username" id="username"></input>
+                        </td>
+                    </tr>
+
+                    <tr>
+                        <th>Passwort</th>
+                        <td><input type="password" name="password" id="password"></input></td>
+                    </tr>
+
+                    <tr>
+                        <td colspan="2">
+                            <input type="submit" value="Anmelden" style="margin-top: 20px;" />
+                        </td>
+                    </tr>
+                </table>
+            </shadowed-box>
+        </form>
+    </AppLayout>
+</template>
+
+<style>
+    th {
+        width: 100px;
+    }
+
+</style>