feat(frontend) : add tag, assignee and status filters on project page
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -10,13 +10,42 @@
|
|||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="mt-4">
|
<div class="mt-4 flex flex-wrap gap-3">
|
||||||
<MalioSelect
|
<MalioSelect
|
||||||
v-model="selectedGroupId"
|
v-model="selectedGroupId"
|
||||||
:options="groupFilterOptions"
|
:options="groupFilterOptions"
|
||||||
label="Groupe"
|
label="Groupe"
|
||||||
empty-option-label="Tous les groupes"
|
empty-option-label="Tous les groupes"
|
||||||
min-width="w-64"
|
min-width="!w-40"
|
||||||
|
text-field="text-sm"
|
||||||
|
text-value="text-sm"
|
||||||
|
/>
|
||||||
|
<MalioSelect
|
||||||
|
v-model="selectedTagId"
|
||||||
|
:options="tagFilterOptions"
|
||||||
|
label="Tags"
|
||||||
|
empty-option-label="Tous les tags"
|
||||||
|
min-width="!w-40"
|
||||||
|
text-field="text-sm"
|
||||||
|
text-value="text-sm"
|
||||||
|
/>
|
||||||
|
<MalioSelect
|
||||||
|
v-model="selectedAssigneeId"
|
||||||
|
:options="userFilterOptions"
|
||||||
|
label="User"
|
||||||
|
empty-option-label="Tous les users"
|
||||||
|
min-width="!w-40"
|
||||||
|
text-field="text-sm"
|
||||||
|
text-value="text-sm"
|
||||||
|
/>
|
||||||
|
<MalioSelect
|
||||||
|
v-model="selectedStatusId"
|
||||||
|
:options="statusFilterOptions"
|
||||||
|
label="Status"
|
||||||
|
empty-option-label="Tous les status"
|
||||||
|
min-width="!w-40"
|
||||||
|
text-field="text-sm"
|
||||||
|
text-value="text-sm"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@@ -175,6 +204,9 @@ const users = ref<UserData[]>([])
|
|||||||
const isLoading = ref(true)
|
const isLoading = ref(true)
|
||||||
|
|
||||||
const selectedGroupId = ref<number | null>(null)
|
const selectedGroupId = ref<number | null>(null)
|
||||||
|
const selectedTagId = ref<number | null>(null)
|
||||||
|
const selectedAssigneeId = ref<number | null>(null)
|
||||||
|
const selectedStatusId = ref<number | null>(null)
|
||||||
const dragOverStatusId = ref<number | null>(null)
|
const dragOverStatusId = ref<number | null>(null)
|
||||||
const dragCounter = ref(0)
|
const dragCounter = ref(0)
|
||||||
const taskDrawerOpen = ref(false)
|
const taskDrawerOpen = ref(false)
|
||||||
@@ -184,11 +216,32 @@ const groupFilterOptions = computed(() =>
|
|||||||
groups.value.filter(g => !g.archived).map(g => ({ label: g.title, value: g.id }))
|
groups.value.filter(g => !g.archived).map(g => ({ label: g.title, value: g.id }))
|
||||||
)
|
)
|
||||||
|
|
||||||
|
const tagFilterOptions = computed(() =>
|
||||||
|
tags.value.map(t => ({ label: t.label, value: t.id }))
|
||||||
|
)
|
||||||
|
|
||||||
|
const userFilterOptions = computed(() =>
|
||||||
|
users.value.map(u => ({ label: u.username, value: u.id }))
|
||||||
|
)
|
||||||
|
|
||||||
|
const statusFilterOptions = computed(() =>
|
||||||
|
statuses.value.map(s => ({ label: s.label, value: s.id }))
|
||||||
|
)
|
||||||
|
|
||||||
const filteredTasks = computed(() => {
|
const filteredTasks = computed(() => {
|
||||||
let result = tasks.value.filter(t => !t.archived)
|
let result = tasks.value.filter(t => !t.archived)
|
||||||
if (selectedGroupId.value) {
|
if (selectedGroupId.value) {
|
||||||
result = result.filter(t => t.group?.id === selectedGroupId.value)
|
result = result.filter(t => t.group?.id === selectedGroupId.value)
|
||||||
}
|
}
|
||||||
|
if (selectedTagId.value) {
|
||||||
|
result = result.filter(t => t.tags?.some(tag => tag.id === selectedTagId.value))
|
||||||
|
}
|
||||||
|
if (selectedAssigneeId.value) {
|
||||||
|
result = result.filter(t => t.assignee?.id === selectedAssigneeId.value)
|
||||||
|
}
|
||||||
|
if (selectedStatusId.value) {
|
||||||
|
result = result.filter(t => t.status?.id === selectedStatusId.value)
|
||||||
|
}
|
||||||
return result
|
return result
|
||||||
})
|
})
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user