48 lines
939 B
Vue
48 lines
939 B
Vue
|
|
<script setup lang="ts">
|
|
|
|
import { onMounted, reactive } from "vue";
|
|
import { useRoute, useRouter } from "vue-router";
|
|
|
|
import type { LoginDto } from "../models/User.ts";
|
|
import * as authApi from "../api/AuthApi";
|
|
|
|
const router = useRouter();
|
|
|
|
const user = reactive<LoginDto>({ // the template ensures type consistency
|
|
name: "",
|
|
password: "",
|
|
});
|
|
|
|
onMounted(() => {
|
|
|
|
});
|
|
|
|
async function login(): Promise<void> {
|
|
|
|
const success: boolean = await authApi.login(user);
|
|
|
|
if(success) {
|
|
router.push("/users"); // redirect
|
|
} else {
|
|
// prompt try again
|
|
}
|
|
|
|
}
|
|
|
|
</script>
|
|
|
|
<template>
|
|
|
|
<div>
|
|
<h2>Login</h2>
|
|
|
|
<form @submit.prevent="login">
|
|
<input v-model="user.name" placeholder="username" />
|
|
<input v-model="user.password" type="password" placeholder="password" />
|
|
|
|
<button type="submit">Submit</button>
|
|
</form>
|
|
</div>
|
|
|
|
</template> |