lfk/selfservice
3
0
Fork 0
Code Issues Pull Requests Actions Projects Releases Wiki Activity

Register - reactive AGB registration button

Browse Source
This commit is contained in:
Philipp Dormann 2021-02-26 19:47:55 +01:00
parent e63367e84e
commit 9effcb4575
1 changed files with 22 additions and 28 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

50
src/components/Register.vue
View File

@ -9,9 +9,9 @@
class="mx-auto leading-relaxed text-base text-center"
>Jetzt für den Lauf für Kaya! 2021 registrieren.</p>
<div class="mt-4">
<label for="first_name" class="block text-sm font-medium">
<label for="first_name" class="block font-medium">
Vorname
<span class="font-bold">(*)</span>
<span class="font-bold">*</span>
</label>
<input
name="firstname"
@ -21,7 +21,7 @@
type="text"
class="dark:bg-gray-800 mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2"
/>
<label for="middle_name" class="block text-sm font-medium">Mittelname</label>
<label for="middle_name" class="block font-medium">Mittelname</label>
<input
name="middlename"
id="middle_name"
@ -30,9 +30,9 @@
type="text"
class="dark:bg-gray-800 mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2"
/>
<label for="last_name" class="block text-sm font-medium">
<label for="last_name" class="block font-medium">
Nachname
<span class="font-bold">(*)</span>
<span class="font-bold">*</span>
</label>
<input
name="lastname"
@ -42,13 +42,13 @@
type="text"
class="dark:bg-gray-800 mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2"
/>
<label for="email_address" class="block text-sm font-medium">
<label for="email_address" class="block font-medium">
E-Mail Adresse
<span class="font-bold">(*)</span>
<span class="font-bold">*</span>
</label>
<input
name="emailname"
id="email_name"
name="email_address"
id="email_address"
autocomplete="off"
placeholder="E-Mail Adresse"
type="text"
@ -71,7 +71,7 @@
</div>
<div class="col-span-6">
<div class="col-span-6">
<label for="street" class="block text-sm font-medium">Straße</label>
<label for="street" class="block font-medium">Straße</label>
<input
type="text"
name="street"
@ -82,7 +82,7 @@
/>
</div>
<div class="col-span-6 sm:col-span-6 lg:col-span-2">
<label for="city" class="block text-sm font-medium">Ort</label>
<label for="city" class="block font-medium">Ort</label>
<input
type="text"
name="city"
@ -92,7 +92,7 @@
/>
</div>
<div class="col-span-6 sm:col-span-3 lg:col-span-2">
<label for="postal_code" class="block text-sm font-medium">PLZ</label>
<label for="postal_code" class="block font-medium">PLZ</label>
<input
type="text"
name="postal_code"
@ -108,6 +108,7 @@
<div class="flex items-start mt-12">
<div class="flex items-center h-5">
<input
v-model="agb_accepted"
id="agb_accepted"
name="agb_accepted"
type="checkbox"
@ -117,15 +118,17 @@
<div class="ml-3 text-sm">
<label
for="agb_accepted"
class="font-medium text-gray-400"
class="font-medium text-gray-400 select-none"
>Ich habe die AGBs gelesen und akzeptiert.</label>
</div>
</div>
<div class="mt-6">
<a
href="./login"
<button
@click="login"
:disabled="(agb_accepted === false)"
:class="{ 'opacity-50': (agb_accepted === false), 'cursor-not-allowed': (agb_accepted === false) }"
class="text-white block w-full text-center py-2 px-3 border border-gray-300 rounded-md p-1 bg-blue-800 font-medium hover:border-gray-400 focus:outline-none focus:border-gray-400 sm:text-sm"
>Registrieren</a>
>Registrieren</button>
</div>
</div>
<div class="mt-6">
@ -154,18 +157,9 @@ import axios from "redaxios";
import Toastify from "toastify-js";
let mail = ref("");
let loading = ref(false);
let agb_accepted = ref(true);
function login() {
console.log("ihi");
console.log(mail.value);
loading.value = true;
axios.get("").then((res) => {
console.log(res.data);
loading.value = false;
Toastify({
text: "This is a toast",
duration: 3000,
}).showToast();
});
// console.log(agb_accepted.value);
// alert("AGB was " + (agb_accepted.value === true ? "accepted" : "not accepted"));
}
</script>