Merge stable version before large change #16
@ -1,22 +1,22 @@
|
|||||||
<template>
|
<template>
|
||||||
<div v-if="!userLoaded" class="bg-neutral-100 dark:bg-neutral-900 text-primary h-screen flex justify-center items-center">
|
<div v-if="!userLoaded" class="bg-neutral-100 dark:bg-neutral-900 text-primary h-screen flex justify-center items-center">
|
||||||
<div>
|
<div>
|
||||||
<Icon size="4em" name="ion:load-c" class="animate-spin" />
|
<Icon size="4em" name="ion:load-c" class="animate-spin" />
|
||||||
<h2 class="mt-2 font-bold">Loading...</h2>
|
<h2 class="mt-2 font-bold">Loading...</h2>
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
<div v-else class="">
|
</div>
|
||||||
<div v-if="isAuthenticated" class="bg-neutral-100 dark:bg-neutral-900 text-primary h-screen flex flex-col">
|
<div v-else class="">
|
||||||
<LayoutTopbar />
|
<div v-if="isAuthenticated" class="bg-neutral-100 dark:bg-neutral-900 text-primary h-screen flex flex-col">
|
||||||
<div class="overflow-y-auto pt-3">
|
<LayoutTopbar />
|
||||||
<NuxtPage />
|
<div class="overflow-y-auto pt-3">
|
||||||
</div>
|
<NuxtPage />
|
||||||
<LayoutNavbar class="mt-auto" />
|
</div>
|
||||||
</div>
|
<LayoutNavbar class="mt-auto" />
|
||||||
<div v-else class="bg-neutral-100 dark:bg-neutral-900 text-primary h-screen flex flex-col">
|
|
||||||
<Login />
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
|
<div v-else class="bg-neutral-100 dark:bg-neutral-900 text-primary h-screen flex flex-col">
|
||||||
|
<Login />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup>
|
<script setup>
|
||||||
|
|||||||
@ -1,43 +1,43 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="flex flex-col justify-center items-center px-2">
|
<div class="flex flex-col justify-center items-center px-2">
|
||||||
<h1 class="font-bold text-3xl text-center m-10">Reddingsbrigade Waddinxveen</h1>
|
<h1 class="font-bold text-3xl text-center m-10">Reddingsbrigade Waddinxveen</h1>
|
||||||
<div class="max-w-sm w-full">
|
<div class="max-w-sm w-full">
|
||||||
<form v-if="!creatingAccount" @submit.prevent="submitLoginForm" class="flex flex-col">
|
<form v-if="!creatingAccount" @submit.prevent="submitLoginForm" class="flex flex-col">
|
||||||
<label class="font-bold">Email</label>
|
<label class="font-bold">Email</label>
|
||||||
<input v-model="form.email" required="true" placeholder="user@example.com" class="input mb-5" type="email">
|
<input v-model="form.email" required="true" placeholder="user@example.com" class="input mb-5" type="email">
|
||||||
|
|
||||||
<label class="font-bold">Wachtwoord</label>
|
<label class="font-bold">Wachtwoord</label>
|
||||||
<input v-model="form.password" required="true" class="input" :type="showPassword ? 'text' : 'password'">
|
<input v-model="form.password" required="true" class="input" :type="showPassword ? 'text' : 'password'">
|
||||||
<div class="mb-5 mt-1 flex items-center text-default">
|
<div class="mb-5 mt-1 flex items-center text-default">
|
||||||
<input v-model="showPassword" type="checkbox" class="mr-1 checkbox ">
|
<input v-model="showPassword" type="checkbox" class="mr-1 checkbox ">
|
||||||
<span>Toon wachtwoord</span>
|
<span>Toon wachtwoord</span>
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="w-full flex flex-wrap justify-between">
|
|
||||||
<input :disabled="disableButtons" type="submit" value="Login" class="btn w-full sm:w-24 mb-1">
|
|
||||||
<button @click="forgotPassword" class="hover:underline font-bold w-full sm:w-max sm:ml-auto">Wachtwoord vergeten?</button>
|
|
||||||
</div>
|
|
||||||
</form>
|
|
||||||
<form v-else @submit.prevent="submitCreateForm" class="flex flex-col">
|
|
||||||
<h3 class="text-center text-default text-lg mb-5">Account aanmaken voor <br><b>{{ form.email }}</b></h3>
|
|
||||||
<label class="font-bold">Nieuw wachtwoord</label>
|
|
||||||
<input v-model="form.newPassword" required="true" class="input mb-1" :type="showPassword ? 'text' : 'password'">
|
|
||||||
<span class="mb-5 text-default italic text-sm">Minimaal 8 karakters</span>
|
|
||||||
|
|
||||||
<label class="font-bold">Herhaal nieuw wachtwoord</label>
|
|
||||||
<input v-model="form.confirmNewPassword" required="true" class="input" :type="showPassword ? 'text' : 'password'">
|
|
||||||
<div class="mb-5 mt-1 flex items-center text-default">
|
|
||||||
<input v-model="showPassword" type="checkbox" class="mr-1 checkbox ">
|
|
||||||
<span>Toon wachtwoord</span>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="w-full flex flex-wrap">
|
|
||||||
<input :disabled="disableButtons" type="submit" value="Account Aanmaken" class="btn w-full sm:w-40 mb-1">
|
|
||||||
<button @click="goBack" class="hover:underline font-bold w-full sm:w-max sm:ml-auto">Jij niet? Ga terug</button>
|
|
||||||
</div>
|
|
||||||
</form>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<div class="w-full flex flex-wrap justify-between">
|
||||||
|
<input :disabled="disableButtons" type="submit" value="Login" class="btn w-full sm:w-24 mb-1">
|
||||||
|
<button @click="forgotPassword" class="hover:underline font-bold w-full sm:w-max sm:ml-auto">Wachtwoord vergeten?</button>
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
<form v-else @submit.prevent="submitCreateForm" class="flex flex-col">
|
||||||
|
<h3 class="text-center text-default text-lg mb-5">Account aanmaken voor <br><b>{{ form.email }}</b></h3>
|
||||||
|
<label class="font-bold">Nieuw wachtwoord</label>
|
||||||
|
<input v-model="form.newPassword" required="true" class="input mb-1" :type="showPassword ? 'text' : 'password'">
|
||||||
|
<span class="mb-5 text-default italic text-sm">Minimaal 8 karakters</span>
|
||||||
|
|
||||||
|
<label class="font-bold">Herhaal nieuw wachtwoord</label>
|
||||||
|
<input v-model="form.confirmNewPassword" required="true" class="input" :type="showPassword ? 'text' : 'password'">
|
||||||
|
<div class="mb-5 mt-1 flex items-center text-default">
|
||||||
|
<input v-model="showPassword" type="checkbox" class="mr-1 checkbox ">
|
||||||
|
<span>Toon wachtwoord</span>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="w-full flex flex-wrap">
|
||||||
|
<input :disabled="disableButtons" type="submit" value="Account Aanmaken" class="btn w-full sm:w-40 mb-1">
|
||||||
|
<button @click="goBack" class="hover:underline font-bold w-full sm:w-max sm:ml-auto">Jij niet? Ga terug</button>
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup>
|
<script setup>
|
||||||
@ -46,7 +46,7 @@ import { createUserWithEmailAndPassword, signInWithEmailAndPassword, sendPasswor
|
|||||||
import { doc, setDoc } from "firebase/firestore";
|
import { doc, setDoc } from "firebase/firestore";
|
||||||
|
|
||||||
|
|
||||||
const { auth, db } = inject('firebase')
|
const { auth, db, userAllPersons } = inject('firebase')
|
||||||
|
|
||||||
const toast = useToast()
|
const toast = useToast()
|
||||||
|
|
||||||
@ -55,125 +55,123 @@ const creatingAccount = ref(false)
|
|||||||
const disableButtons = ref(false)
|
const disableButtons = ref(false)
|
||||||
|
|
||||||
const form = ref({
|
const form = ref({
|
||||||
email: '',
|
email: '',
|
||||||
password: '',
|
password: '',
|
||||||
newPassword: '',
|
newPassword: '',
|
||||||
confirmNewPassword: ''
|
confirmNewPassword: ''
|
||||||
})
|
})
|
||||||
|
|
||||||
const submitLoginForm = () => {
|
const submitLoginForm = () => {
|
||||||
disableButtons.value = true
|
disableButtons.value = true
|
||||||
|
|
||||||
signInWithEmailAndPassword(auth.value, form.value.email, form.value.password)
|
signInWithEmailAndPassword(auth.value, form.value.email, form.value.password)
|
||||||
.then(() => disableButtons.value = false)
|
.then(() => disableButtons.value = false)
|
||||||
.catch(async (error) => {
|
.catch(async (error) => {
|
||||||
const errorCode = error.code;
|
|
||||||
const errorMessage = error.message;
|
|
||||||
|
|
||||||
if (error.code === 'auth/user-not-found') {
|
if (error.code === 'auth/user-not-found') {
|
||||||
|
const { error: err, data } = await useFetch('/api/checkrelatiecode', {
|
||||||
|
method: 'post',
|
||||||
|
body: { email: form.value.email, relatiecode: form.value.password.toUpperCase() }
|
||||||
|
})
|
||||||
|
|
||||||
fetch('https://api.xeovalyte.com/checkrelatiecode', {
|
if (err.value) {
|
||||||
method: 'POST',
|
console.log(err.value)
|
||||||
headers: {
|
disableButtons.value = false
|
||||||
Authorization: 'Basic WGVvdmFseXRlOmtNKjhuRXMzNTchalJlXm1KYnZrRSFOIw==',
|
return toast.error('Error tijdens het controleren van relatiecode')
|
||||||
'content-type': 'application/json'
|
}
|
||||||
},
|
|
||||||
body: JSON.stringify({ email: form.value.email, relatiecode: form.value.password.toUpperCase() })
|
|
||||||
}).then(response => response.json())
|
|
||||||
.then(response => {
|
|
||||||
disableButtons.value = false
|
|
||||||
if (response.code === 'incorrect') return toast.error('Email, wachtwoord of relatiecode onjuist')
|
|
||||||
else if (response.code === 'correct') return creatingAccount.value = true
|
|
||||||
})
|
|
||||||
.catch(err => {
|
|
||||||
disableButtons.value = false
|
|
||||||
console.log(err)
|
|
||||||
|
|
||||||
toast.error('Error met het controleren van relatiecode')
|
disableButtons.value = false
|
||||||
});
|
if (data.value.code === 'incorrect') return toast.error('Email, wachtwoord of relatiecode onjuist')
|
||||||
} else if (error.code === 'auth/wrong-password') {
|
else if (data.value.code === 'correct') return creatingAccount.value = true
|
||||||
toast.error('Verkeerde wachtwoord')
|
|
||||||
} else {
|
|
||||||
toast.error('Error met inloggen')
|
|
||||||
}
|
|
||||||
|
|
||||||
disableButtons.value = false
|
} else if (error.code === 'auth/wrong-password') {
|
||||||
console.log(error.message)
|
toast.error('Verkeerde wachtwoord')
|
||||||
});
|
} else {
|
||||||
|
toast.error('Error met inloggen')
|
||||||
|
}
|
||||||
|
|
||||||
|
disableButtons.value = false
|
||||||
|
console.log(error.message)
|
||||||
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
const submitCreateForm = () => {
|
const submitCreateForm = () => {
|
||||||
if (form.value.newPassword !== form.value.confirmNewPassword) return toast.error('Wachtwoorden zijn niet hetzelfde');
|
if (form.value.newPassword !== form.value.confirmNewPassword) return toast.error('Wachtwoorden zijn niet hetzelfde');
|
||||||
if (form.value.newPassword.length < 8) return toast.error('Wachtwoord heeft te weinig karakters');
|
if (form.value.newPassword.length < 8) return toast.error('Wachtwoord heeft te weinig karakters');
|
||||||
|
|
||||||
disableButtons.value = true
|
disableButtons.value = true
|
||||||
|
|
||||||
createUserWithEmailAndPassword(auth.value, form.value.email, form.value.newPassword)
|
createUserWithEmailAndPassword(auth.value, form.value.email, form.value.newPassword)
|
||||||
.then((userCredential) => {
|
.then(async (userCredential) => {
|
||||||
fetch('https://api.xeovalyte.com/getrelatiecodes', {
|
const idToken = await auth.value.currentUser.getIdToken(true)
|
||||||
method: 'POST',
|
const { error, data } = await useFetch('/api/getrelatiecodes', {
|
||||||
headers: {
|
method: 'post',
|
||||||
Authorization: 'Basic WGVvdmFseXRlOmtNKjhuRXMzNTchalJlXm1KYnZrRSFOIw==',
|
body: { email: form.value.email, token: idToken }
|
||||||
'content-type': 'application/json'
|
})
|
||||||
},
|
|
||||||
body: JSON.stringify({ email: form.value.email })
|
|
||||||
}).then(response => response.json())
|
|
||||||
.then(response => {
|
|
||||||
disableButtons.value = false
|
|
||||||
if (response.code === 'error') return toast.error('Error tijdens maken van account')
|
|
||||||
else if (response.code === 'success') {
|
|
||||||
setDoc(doc(db, "users", userCredential.user.uid), {
|
|
||||||
email: form.value.email,
|
|
||||||
relatiecodes: [form.value.password.toUpperCase()],
|
|
||||||
allRelatiecodes: response.relatiecodes,
|
|
||||||
});
|
|
||||||
|
|
||||||
if (response.relatiecodes.length > 1) {
|
if (error.value) {
|
||||||
return navigateTo('/settings/config/managerelatiecodes')
|
console.log(error.value)
|
||||||
}
|
disableButtons.value = false
|
||||||
}
|
return toast.error('Error tijdens het controleren van relatiecode')
|
||||||
})
|
}
|
||||||
.catch(err => {
|
|
||||||
disableButtons.value = false
|
|
||||||
console.log(err)
|
|
||||||
|
|
||||||
toast.error('Error met het controleren van relatiecode')
|
disableButtons.value = false
|
||||||
});
|
if (data.value.code === 'error') return toast.error('Error tijdens maken van account')
|
||||||
})
|
else if (data.value.code === 'success') {
|
||||||
.catch((error) => {
|
await setDoc(doc(db, "users", userCredential.user.uid), {
|
||||||
const errorCode = error.code;
|
email: form.value.email,
|
||||||
const errorMessage = error.message;
|
relatiecodes: [form.value.password.toUpperCase()],
|
||||||
|
allRelatiecodes: data.value.relatiecodes,
|
||||||
console.log(error)
|
|
||||||
|
|
||||||
toast.error('Error tijdens het maken van account')
|
|
||||||
});
|
});
|
||||||
|
|
||||||
|
data.value.persons.forEach(person => {
|
||||||
|
if (person.relatiecode === form.value.password.toUpperCase()) {
|
||||||
|
person.checked = true
|
||||||
|
} else {
|
||||||
|
person.checked = false
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
userAllPersons.value = data.value.persons
|
||||||
|
|
||||||
|
if (data.value.relatiecodes.length > 1) {
|
||||||
|
return navigateTo('/settings/config/managerelatiecodes')
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
|
.catch((error) => {
|
||||||
|
const errorCode = error.code;
|
||||||
|
const errorMessage = error.message;
|
||||||
|
|
||||||
|
console.log(error)
|
||||||
|
|
||||||
|
toast.error('Error tijdens het maken van account')
|
||||||
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
const forgotPassword = () => {
|
const forgotPassword = () => {
|
||||||
sendPasswordResetEmail(auth.value, form.value.email)
|
sendPasswordResetEmail(auth.value, form.value.email)
|
||||||
.then(() => {
|
.then(() => {
|
||||||
toast.info('Wachtwoord vergeten email verstuurd!')
|
toast.info('Wachtwoord vergeten email verstuurd!')
|
||||||
})
|
})
|
||||||
.catch((error) => {
|
.catch((error) => {
|
||||||
const errorCode = error.code;
|
const errorCode = error.code;
|
||||||
const errorMessage = error.message;
|
const errorMessage = error.message;
|
||||||
|
|
||||||
console.log(error)
|
console.log(error)
|
||||||
|
|
||||||
toast.error('Error tijdens het versturen van het wachtwoord vergeten email')
|
toast.error('Error tijdens het versturen van het wachtwoord vergeten email')
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
const goBack = () => {
|
const goBack = () => {
|
||||||
creatingAccount.value = false
|
creatingAccount.value = false
|
||||||
form.value = {
|
form.value = {
|
||||||
email: form.value.email,
|
email: form.value.email,
|
||||||
password: form.value.password,
|
password: form.value.password,
|
||||||
newPassword: '',
|
newPassword: '',
|
||||||
confirmNewPassword: ''
|
confirmNewPassword: ''
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user