This repository has been archived on 2022-05-05. You can view files and clone it, but cannot push or open issues or pull requests.
userausfall/src/components/LoginForm.vue
2021-04-15 10:05:54 +02:00

45 lines
1.1 KiB
Vue

<template>
<form class="box" @submit.prevent="doAction">
<b-field label="E-Mail-Adresse">
<b-input type="email" v-model="user.email" />
</b-field>
<b-field label="Kennwort">
<b-input type="password" v-model="user.password" />
</b-field>
<div v-if="false" class="notification is-danger">
Email or password was wrong.
</div>
<div class="buttons">
<b-button
native-type="submit"
type="is-primary"
style="margin-left: auto; margin-right: 0; order: 10"
>
{{ mode === "login" ? "Anmelden" : "Konto anlegen" }}
</b-button>
</div>
</form>
</template>
<script lang="ts">
import { Component, Prop, Vue } from "vue-property-decorator";
import { User } from "@/api";
@Component
export default class LoginForm extends Vue {
@Prop() private user!: User;
private mode: "login" | "signup" = "login";
private async doAction() {
if (this.mode === "login") {
await this.user.login();
} else {
await this.user.signup();
}
// TODO: error handling, show confirmation page
}
}
</script>