flfeders/FEDEO
2
1
Fork 0
Code Issues 62 Pull Requests Actions Packages Projects 21 Releases Wiki Activity

Added New Viewport Config

Browse Source
This commit is contained in:
Florian Federspiel
2023-12-11 20:30:10 +01:00
parent 2721a3b2d4
commit 2dd31690e5
4 changed files with 107 additions and 64 deletions
Download Patch File Download Diff File Expand all files Collapse all files

130
spaces/pages/tasks.vue
View File

@@ -112,72 +112,84 @@
</USelectMenu>-->
</div>
<div v-if="viewport.isLessThan('tablet')" class="scrollList">
<a
v-for="task in tasks.filter(item => item.categorie != 'Erledigt')"
>
<UCard class="listItem">
<template #header>
<UBadge>{{task.categorie}}</UBadge> {{task.name}}
</template>
{{task.description}}
</UCard>
</a>
</div>
<div v-else>
<div id="taskCatList">
<div id="catNew">
<h3>Offene Aufgaben</h3>
<div class="taskScrollList" v-if="tasks.length > 0">
<a
v-for="taskNew in tasks.filter(task => task.categorie == 'Offen')"
@click="inspectTask(taskNew)"
>
<UCard class="listItem">
{{taskNew.name}}
<UBadge
v-for="user in taskNew.users"
class="mr-2"
>
{{user}}
</UBadge>
</UCard>
</a>
</div>
<div id="taskCatList">
<div id="catNew">
<h3>Offene Aufgaben</h3>
<div class="taskScrollList" v-if="tasks.length > 0">
<a
v-for="taskNew in tasks.filter(task => task.categorie == 'Offen')"
@click="inspectTask(taskNew)"
>
<UCard class="listItem">
{{taskNew.name}}
<UBadge
v-for="user in taskNew.users"
class="mr-2"
>
{{user}}
</UBadge>
</UCard>
</a>
</div>
<div id="catInProgress">
<h3>Aufgaben in Bearbeitung</h3>
<div class="taskScrollList" v-if="tasks.length > 0">
<a
v-for="taskNew in tasks.filter(task => task.categorie == 'In Bearbeitung')"
@click="inspectTask(taskNew)"
>
<UCard class="listItem">
{{taskNew.name}}
<UBadge
v-for="user in taskNew.users"
class="mr-2"
>
{{user}}
</UBadge>
</UCard>
</a>
</div>
</div>
<div id="catInProgress">
<h3>Aufgaben in Bearbeitung</h3>
<div class="taskScrollList" v-if="tasks.length > 0">
<a
v-for="taskNew in tasks.filter(task => task.categorie == 'In Bearbeitung')"
@click="inspectTask(taskNew)"
>
<UCard class="listItem">
{{taskNew.name}}
<UBadge
v-for="user in taskNew.users"
class="mr-2"
>
{{user}}
</UBadge>
</UCard>
</a>
</div>
<div id="catUrgent">
<h3>Dringende Aufgaben</h3>
<div class="taskScrollList" v-if="tasks.length > 0">
<a
v-for="taskNew in tasks.filter(task => task.categorie == 'Dringend')"
@click="inspectTask(taskNew)"
>
<UCard class="listItem">
{{taskNew.name}}
<UBadge
v-for="user in taskNew.users"
class="mr-2"
>
{{user}}
</UBadge>
</UCard>
</a>
</div>
</div>
<div id="catUrgent">
<h3>Dringende Aufgaben</h3>
<div class="taskScrollList" v-if="tasks.length > 0">
<a
v-for="taskNew in tasks.filter(task => task.categorie == 'Dringend')"
@click="inspectTask(taskNew)"
>
<UCard class="listItem">
{{taskNew.name}}
<UBadge
v-for="user in taskNew.users"
class="mr-2"
>
{{user}}
</UBadge>
</UCard>
</a>
</div>
</div>
</div>
</UPage>
@@ -189,6 +201,12 @@ definePageMeta({
middleware: "auth",
})
const viewport = useViewport()
watch(viewport.breakpoint, (newBreakpoint, oldBreakpoint) => {
console.log('Breakpoint updated:', oldBreakpoint, '->', newBreakpoint)
})
const toast = useToast()
const supabase = useSupabaseClient()
const {tasks} = storeToRefs(useDataStore())