74 lines
1.8 KiB
Vue
74 lines
1.8 KiB
Vue
<template>
|
|
<div>
|
|
<el-form :model="form" label-width="auto">
|
|
<el-form-item label="Username">
|
|
<el-input v-model="form.username" />
|
|
</el-form-item>
|
|
<el-form-item label="Password">
|
|
<el-input type="password" v-model="form.password" show-password />
|
|
</el-form-item>
|
|
</el-form>
|
|
<el-button @click="register">Register</el-button>
|
|
<el-button @click="login">Login</el-button>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
data() {
|
|
return {
|
|
message: "Hello world!",
|
|
apiBaseUrl: "http://localhost:8000",
|
|
form: {
|
|
username: "gourav",
|
|
password: "hello123",
|
|
},
|
|
};
|
|
},
|
|
|
|
methods: {
|
|
async login() {
|
|
const url = `${this.apiBaseUrl}/login`;
|
|
const requestOptions = {
|
|
method: "POST",
|
|
headers: { "Content-Type": "application/json" },
|
|
body: JSON.stringify(this.form),
|
|
};
|
|
|
|
const response = await fetch(url, requestOptions)
|
|
.then((response) => response.json())
|
|
.then((data) => {
|
|
console.log(data);
|
|
return data;
|
|
})
|
|
.catch((err) => {
|
|
console.log(err);
|
|
return false;
|
|
});
|
|
console.log("response: ", response);
|
|
if ("message" in response) {
|
|
if (response.message === "authenticated") {
|
|
const token = response.accessToken;
|
|
localStorage.setItem("token", token);
|
|
this.$emit("loggedin", true);
|
|
}
|
|
}
|
|
},
|
|
|
|
async register() {
|
|
const url = `${this.apiBaseUrl}/register`;
|
|
const requestOptions = {
|
|
method: "POST",
|
|
headers: { "Content-Type": "application/json" },
|
|
body: JSON.stringify(this.form),
|
|
};
|
|
|
|
await fetch(url, requestOptions)
|
|
.then((response) => response.json())
|
|
.then((data) => console.log(data));
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
<style scoped></style>
|