Piped/src/components/RegisterPage.vue

106 lines
3.3 KiB
Vue
Raw Normal View History

<template>
<h1 v-t="'titles.register'" class="my-4 text-center font-bold" />
2022-07-20 20:20:10 +00:00
<hr />
2022-01-12 12:13:04 +00:00
<div class="text-center">
<form class="children:pb-3">
<div>
<input
v-model="username"
2022-01-12 12:13:04 +00:00
class="input"
type="text"
autocomplete="username"
:placeholder="$t('login.username')"
:aria-label="$t('login.username')"
2023-07-27 11:46:05 +00:00
@keyup.enter="register"
/>
</div>
2022-01-12 12:13:04 +00:00
<div>
<input
v-model="password"
2022-01-12 12:13:04 +00:00
class="input"
type="password"
autocomplete="password"
:placeholder="$t('login.password')"
:aria-label="$t('login.password')"
2023-07-27 11:46:05 +00:00
@keyup.enter="register"
/>
</div>
<div>
<input
v-model="passwordConfirm"
class="input"
type="password"
autocomplete="password"
:placeholder="$t('login.password_confirm')"
:aria-label="$t('login.password_confirm')"
@keyup.enter="register"
/>
</div>
2022-01-12 12:13:04 +00:00
<div>
2023-07-27 11:46:05 +00:00
<a v-t="'titles.register'" class="btn w-auto" @click="register" />
</div>
</form>
</div>
<ConfirmModal
v-if="showUnsecureRegisterDialog"
2023-07-27 11:46:05 +00:00
:message="$t('info.register_no_email_note')"
@close="showUnsecureRegisterDialog = false"
@confirm="
forceUnsecureRegister = true;
showUnsecureRegisterDialog = false;
register();
"
/>
</template>
<script>
import { isEmail } from "../utils/Misc.js";
import ConfirmModal from "./ConfirmModal.vue";
export default {
2023-07-27 11:46:05 +00:00
components: { ConfirmModal },
data() {
return {
username: null,
password: null,
showUnsecureRegisterDialog: false,
forceUnsecureRegister: false,
};
},
mounted() {
//TODO: Add Server Side check
if (this.getAuthToken()) {
this.$router.push("/");
}
},
activated() {
document.title = "Register - Piped";
},
methods: {
register() {
2022-08-18 11:47:10 +00:00
if (!this.username || !this.password) return;
if (this.password != this.passwordConfirm) {
alert(this.$t("login.passwords_incorrect"));
return;
}
if (isEmail(this.username) && !this.forceUnsecureRegister) {
this.showUnsecureRegisterDialog = true;
return;
}
this.fetchJson(this.authApiUrl() + "/register", null, {
method: "POST",
body: JSON.stringify({
username: this.username,
password: this.password,
}),
}).then(resp => {
if (resp.token) {
this.setPreference("authToken" + this.hashCode(this.authApiUrl()), resp.token);
window.location = "/"; // done to bypass cache
} else alert(resp.error);
});
},
},
};
</script>