67 lines
1.6 KiB
Vue
67 lines
1.6 KiB
Vue
<script setup lang="ts">
|
|
import { useUserStore } from "@/stores/user";
|
|
import * as log from "loglevel";
|
|
import { reactive } from "vue";
|
|
import { useRoute } from "vue-router";
|
|
|
|
const route = useRoute();
|
|
|
|
log.debug("LoginView.vue created");
|
|
log.debug(route.query);
|
|
|
|
const state = reactive({
|
|
username: "",
|
|
password: "",
|
|
});
|
|
|
|
const userStore = useUserStore();
|
|
</script>
|
|
|
|
<template>
|
|
<main class="px-8 py-8 lg:px-12 lg:py-12 bg-gray-200">
|
|
<div class="container-medium">
|
|
<h1 class="mb-8">Login</h1>
|
|
|
|
<form
|
|
class="bg-white p-4 lg:p-8"
|
|
@submit.prevent="
|
|
userStore.handleLogin(state.username, state.password, route.query.next)
|
|
"
|
|
>
|
|
<div class="mb-4">
|
|
<label class="block mb-1" for="email">Username</label>
|
|
<input
|
|
id="username"
|
|
v-model="state.username"
|
|
type="text"
|
|
name="username"
|
|
class="py-2 px-3 border border-gray-500 mt-1 block w-96"
|
|
/>
|
|
</div>
|
|
<div class="mb-4">
|
|
<label class="block mb-1" for="password">Password</label>
|
|
<input
|
|
id="password"
|
|
v-model="state.password"
|
|
type="password"
|
|
name="password"
|
|
class="py-2 px-3 border border-gray-500 mt-1 block w-96"
|
|
/>
|
|
</div>
|
|
|
|
<div>
|
|
<input
|
|
data-cy="login-button"
|
|
type="submit"
|
|
value="Login"
|
|
class="btn-primary"
|
|
/>
|
|
</div>
|
|
</form>
|
|
<p class="pt-8"><a href="/sso/login/">Login mit SSO</a></p>
|
|
</div>
|
|
</main>
|
|
</template>
|
|
|
|
<style scoped></style>
|