"new_specie/utils.py" did not exist on "a28d2605c666dda2b8ae55665d643afb8b8aaf5a"
Select Git revision
center_blob.html
RegisterForm.vue 2.36 KiB
<template>
<form action="">
<div class="modal-card" style="width: auto">
<header class="modal-card-head">
<p class="modal-card-title">Sign up</p>
</header>
<section class="modal-card-body">
<h2 class="subtitle has-text-danger">{{errorMessage}}</h2>
<b-field label="Email">
<b-input type="email" v-model="email" placeholder="email" required maxlength="50"/>
</b-field>
<b-field label="Username">
<b-input v-model="username" placeholder="username" required maxlength="30"/>
</b-field>
<b-field label="Password">
<b-input type="password" v-model="password" password-reveal placeholder="password" required maxlength="50"/>
</b-field>
<b-field label="Confirm password">
<b-input type="password" v-model="passwordConfirm" password-reveal placeholder="password" required maxlength="50"/>
</b-field>
</section>
<footer class="modal-card-foot">
<button class="button is-primary" @click="onRegister">Make account</button>
</footer>
</div>
</form>
</template>
<script>
export default {
name: 'RegisterForm',
data () {
return {
email: '',
username: '',
password: '',
passwordConfirm: '',
errorMessage: null
}
},
methods: {
async onRegister () {
if (this.password !== this.passwordConfirm) {
this.errorMessage = 'Passwords are different'
return
}
const response = await this.register(this.username, this.email, this.password)
if (response.error) {
this.errorMessage = response.message
} else {
await localStorage.setItem('token', response.token)
this.$parent.close()
this.$router.go()
}
},
async register (username, email, password) {
const url = this.$serverurl + 'user'
try {
const response = await fetch(
url, {
method: 'POST',
headers: {
Accept: 'application/json',
'Content-Type': 'application/json'
},
body: JSON.stringify({
email: email,
username: username,
password: password
})
}
)
return await response.json()
} catch (error) {
return null
}
}
}
}
</script>
<style scoped>
</style>