Show todays birthdays

This commit is contained in:
Ferdinand Thiessen 2020-11-15 20:08:24 +01:00
parent 9b19dc225b
commit 01826fbc8b
1 changed files with 37 additions and 7 deletions

View File

@ -7,24 +7,35 @@
</q-avatar> </q-avatar>
</div> </div>
<div class="col-8"> <div class="col-8">
<span class="text-h6">{{ name }}</span <span class="text-h6">Hallo {{ name }}</span><br />
><br /> <span v-if="hasBirthday">Herzlichen Glückwunsch zum Geburtstag!<br /></span>
<span>Andere Infos wo ich aber nicht weiß was</span> <span v-if="birthday.length > 0">Heute <span v-if="birthday.length === 1">hat </span><span v-else>haben </span><span
v-for="(user, index) in birthday"
v-bind:key="index"
>{{user.display_name}}<span v-if="index < (birthday.length-1)">, </span></span> Geburtstag.</span>
<span v-else>Heute stehen keine Geburtstage an</span>
</div> </div>
</q-card-section> </q-card-section>
</q-card> </q-card>
</template> </template>
<script lang="ts"> <script lang="ts">
import { computed, defineComponent, ref } from '@vue/composition-api'; import {
computed,
defineComponent,
onMounted,
ref,
} from '@vue/composition-api';
import { Store } from 'vuex'; import { Store } from 'vuex';
import { StateInterface } from 'src/store'; import { StateInterface } from 'src/store';
import MD5 from 'crypto-js/md5'; import MD5 from 'crypto-js/md5';
export default defineComponent({ export default defineComponent({
name: 'DummyWidget', name: 'Greeting',
setup(_, { root }) { setup(_, { root }) {
const store = <Store<StateInterface>>root.$store; const store = <Store<StateInterface>>root.$store;
onMounted(() => store.dispatch('user/getUsers', false));
const avatarLink = computed(() => { const avatarLink = computed(() => {
const hash = MD5(store.state.user.currentUser?.mail || '').toString(); const hash = MD5(store.state.user.currentUser?.mail || '').toString();
return `https://www.gravatar.com/avatar/${hash}?s=500&d=robohash`; return `https://www.gravatar.com/avatar/${hash}?s=500&d=robohash`;
@ -32,7 +43,26 @@ export default defineComponent({
const name = ref(store.state.user.currentUser?.display_name); const name = ref(store.state.user.currentUser?.display_name);
return { avatarLink, name }; function userHasBirthday(user: FG.User) {
const today = new Date();
return (
user.birthday &&
user.birthday.getMonth === today.getMonth &&
user.birthday.getDate === today.getDate
);
} }
const hasBirthday = computed(() => {
return userHasBirthday(<FG.User>store.state.user.currentUser);
});
const birthday = computed(() =>
store.state.user.users
.filter(userHasBirthday)
.filter((user) => user.userid !== store.state.user.currentUser?.userid)
);
return { avatarLink, name, hasBirthday, birthday };
},
}); });
</script> </script>