completed mangerelatiecodes

This commit is contained in:
Xeovalyte 2022-09-26 16:23:45 +02:00
parent 9b16bdb4dc
commit 7e26b4d7de
6 changed files with 138 additions and 5 deletions

View File

@ -69,12 +69,15 @@ app.post('/getrelatiecodes', async (req, res) => {
}
let relatiecodes = [];
let persons = [];
snapshot.forEach(doc => {
relatiecodes.push(doc.id)
const data = doc.data()
persons.push({ fullName: data.fullName, relatiecode: doc.id })
});
res.status(200).send({ code: 'success', relatiecodes: relatiecodes })
res.status(200).send({ code: 'success', relatiecodes: relatiecodes, persons: persons })
} catch (e) {

View File

@ -29,6 +29,7 @@ const auth = ref(null)
const userLoaded = ref(false)
const userData = ref(null)
const userPersons = ref([])
const userAllPersons = ref([])
onMounted(() => {
auth.value = getAuth()
@ -74,5 +75,5 @@ const getPersons = async (persons) => {
const ledenlijst = ref([])
provide('firebase', { db, ledenlijst, isAuthenticated, user, userData, userPersons, auth })
provide('firebase', { db, ledenlijst, isAuthenticated, user, userData, userPersons, auth, userAllPersons, getPersons })
</script>

View File

@ -0,0 +1,12 @@
<template>
<div>
Change Email
</div>
</template>
<script setup>
definePageMeta({
title: 'Change Email',
key: 'back'
})
</script>

View File

@ -0,0 +1,12 @@
<template>
<div>
Change Password
</div>
</template>
<script setup>
definePageMeta({
title: 'Change Password',
key: 'back'
})
</script>

View File

@ -1,12 +1,102 @@
<template>
<div>
Manage relatiecodes
<div class="flex flex-col gap-5 mx-auto p-2 w-full max-w-md">
<div v-if="userAllPersons.length !== 0 && userPersons.length !== 0" class="flex flex-col gap-3">
<div v-for="person in userAllPersons" :key="person.relatiecode">
<div @click="updateCheckbox(person)" class="item container flex flex-wrap" :class="person.relatiecode === userPersons[0].relatiecode ? 'bg-neutral-200 dark:bg-neutral-850 text-neutral-400 dark:text-neutral-500 hover:cursor-not-allowed' : 'hover:cursor-pointer'">
<input v-model="person.checked" :disabled="person.relatiecode === userPersons[0].relatiecode" class="checkbox my-auto mr-3 disabled:bg-neutral-300 disabled:hover:text-neutral-300 dark:disabled:bg-neutral-600 dark:disabled:hover:text-neutral-600 disabled:hover:cursor-not-allowed" type="checkbox">
<span><b>{{ person.fullName }}</b></span>
</div>
</div>
<div class="w-full flex flex-wrap">
<button :disabled="buttonsDisabled" @click="save" class="btn w-full sm:w-40 mb-1">Save</button>
<span @click="router.back()" class="hover:underline font-bold w-full text-center sm:w-max sm:ml-auto hover:cursor-pointer">Cancel</span>
</div>
</div>
</div>
</template>
<script setup>
import { updateDoc, doc } from 'firebase/firestore'
import { useToast } from 'vue-toastification'
const router = useRouter()
definePageMeta({
title: 'Beheer Personen',
key: 'back'
})
const { user, userAllPersons, userPersons, db, getPersons } = inject('firebase')
const toast = useToast
const buttonsDisabled = ref(false)
onMounted(() => {
if (userAllPersons.value.length === 0) {
getAllPersons()
} else {
userAllPersons.value.forEach(person => {
if (userPersons.value.map(a => a.relatiecode).includes(person.relatiecode)) {
person.checked = true
} else {
person.checked = false
}
})
}
})
const save = async () => {
buttonsDisabled.value = true
const newRelatiecodes = []
userAllPersons.value.forEach(person => {
if (person.checked) {
newRelatiecodes.push(person.relatiecode)
}
})
await updateDoc(doc(db, "users", user.value.uid), {
relatiecodes: newRelatiecodes
})
getPersons(newRelatiecodes)
buttonsDisabled.value = false
navigateTo('/settings')
}
const updateCheckbox = (person) => {
if (person.relatiecode === userPersons.value[0].relatiecode) return;
person.checked = !person.checked
}
const getAllPersons = () => {
if (userPersons.value.length === 0) return setTimeout(() => getAllPersons(), 50)
fetch('http://test.xeovalyte.com:7289/getrelatiecodes', {
method: 'POST',
headers: {
Authorization: 'Basic WGVvdmFseXRlOmtNKjhuRXMzNTchalJlXm1KYnZrRSFOIw==',
'content-type': 'application/json'
},
body: JSON.stringify({ email: user.value.email })
}).then(response => response.json())
.then(response => {
response.persons.forEach(person => {
if (userPersons.value.map(a => a.relatiecode).includes(person.relatiecode)) {
person.checked = true
} else {
person.checked = false
}
})
userAllPersons.value = response.persons
})
.catch(err => {
console.log(err)
toast.error('Error met het controleren van relatiecode')
});
}
</script>

View File

@ -23,7 +23,22 @@
<div>
<h1 class="text-xl ml-2 font-bold">Account</h1>
<div class="container">
<div @click="logout" class="item-hover">
<NuxtLink to="/settings/config/managerelatiecodes" class="item-hover py-2 rounded-t flex items-center">
<span>Beheer Personen</span>
<Icon class="ml-auto" size="2em" name="ion:arrow-forward"/>
</NuxtLink>
<div class="divider" />
<NuxtLink to="/settings/config/changepassword" class="item-hover py-2 flex items-center">
<span>Change Password</span>
<Icon class="ml-auto" size="2em" name="ion:arrow-forward"/>
</NuxtLink>
<div class="divider" />
<NuxtLink to="/settings/config/changeemail" class="item-hover py-2 flex items-center">
<span>Change Email</span>
<Icon class="ml-auto" size="2em" name="ion:arrow-forward"/>
</NuxtLink>
<div class="divider" />
<div @click="logout" class="item-hover rounded-b flex items-center">
Logout
</div>
</div>