ferfissimo
/
flaschengeist-frontend
forked from Flaschengeist/flaschengeist-frontend
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

[notifications] Make text clickable if link is present

This commit is contained in:
Ferdinand Thiessen 2021-03-30 15:48:15 +02:00
parent b7aeea0a23
commit 6891a3ffba
2 changed files with 21 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
src/boot/store.ts
View File

@ -1,9 +1,13 @@
import { createPinia } from 'pinia'; import { createPinia, Pinia } from 'pinia';
import { boot } from 'quasar/wrappers'; import { boot } from 'quasar/wrappers';
import { useMainStore } from 'src/stores'; import { useMainStore } from 'src/stores';
import { ref } from 'vue';
export const pinia = ref<Pinia>();
export default boot(({ app }) => { export default boot(({ app }) => {
app.use(createPinia()); pinia.value = createPinia();
app.use(pinia.value);
const store = useMainStore(); const store = useMainStore();
void store.init(); void store.init();

24
src/components/Notification.vue
View File

@ -1,7 +1,13 @@
<template> <template>
<q-card bordered class="row q-ma-xs q-pa-xs" style="position: relative"> <q-card
bordered
class="row q-ma-xs q-pa-xs"
style="position: relative; min-height: 3em"
:class="{ 'cursor-pointer': modelValue.link }"
@click="click"
>
<div class="col-12 text-weight-light">{{ dateString }}</div> <div class="col-12 text-weight-light">{{ dateString }}</div>
<div :id="`ntfctn-${modelValue.id}`" class="col-12" @click="click">{{ modelValue.text }}</div> <div :id="`ntfctn-${modelValue.id}`" class="col-12">{{ modelValue.text }}</div>
<q-btn <q-btn
round round
dense dense
@ -16,11 +22,11 @@
v-if="modelValue.accept !== undefined" v-if="modelValue.accept !== undefined"
round round
dense dense
icon="close" icon="check"
size="sm" size="sm"
color="positive" color="positive"
class="q-ma-xs" class="q-ma-xs"
style="position: absolute; top: 50px; right: 0" style="position: absolute; top: 0; right: 3em"
@click="accept" @click="accept"
/> />
</q-card> </q-card>
@ -52,15 +58,15 @@ export default defineComponent({
} }
function accept() { function accept() {
if (props.modelValue.accept) if (typeof props.modelValue.accept === 'function')
void props.modelValue.accept().then(() => emit('remove', props.modelValue.id)); void props.modelValue.accept().finally(() => emit('remove', props.modelValue.id));
else emit('remove', props.modelValue.id); else emit('remove', props.modelValue.id);
} }
function remove() { function remove() {
if (props.modelValue.reject) if (typeof props.modelValue.reject === 'function')
void props.modelValue.reject().then(() => emit('remove', props.modelValue.id)); void props.modelValue.reject().finally(() => emit('remove', props.modelValue.id));
emit('remove', props.modelValue.id); else emit('remove', props.modelValue.id);
} }
return { accept, click, dateString, remove }; return { accept, click, dateString, remove };