ami/tl-vikunja
1
0
Fork 0
Code

fix(filter): don't immediately re-trigger prepareFilter

Browse Source
This commit is contained in:
kolaente 2023-11-18 16:40:20 +01:00
parent cc3c1a9429
commit 602d15985b
No known key found for this signature in database
GPG Key ID: F40E70337AB24C9B
2 changed files with 11 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
src/components/date/datepickerWithRange.vue
View File

@ -117,6 +117,7 @@ const to = ref('')
watch( watch(
() => props.modelValue, () => props.modelValue,
newValue => { newValue => {
console.log('got new values via model', {...newValue})
from.value = newValue.dateFrom from.value = newValue.dateFrom
to.value = newValue.dateTo to.value = newValue.dateTo
// Only set the date back to flatpickr when it's an actual date. // Only set the date back to flatpickr when it's an actual date.

18
src/components/project/partials/filters.vue
View File

@ -179,6 +179,7 @@ export const ALPHABETICAL_SORT = 'title'
<script setup lang="ts"> <script setup lang="ts">
import {computed, nextTick, onMounted, reactive, ref, shallowReactive, toRefs, watch} from 'vue' import {computed, nextTick, onMounted, reactive, ref, shallowReactive, toRefs, watch} from 'vue'
import {camelCase} from 'camel-case' import {camelCase} from 'camel-case'
import {watchDebounced} from '@vueuse/core'
import type {ILabel} from '@/modelTypes/ILabel' import type {ILabel} from '@/modelTypes/ILabel'
import type {IUser} from '@/modelTypes/IUser' import type {IUser} from '@/modelTypes/IUser'
@ -274,15 +275,16 @@ onMounted(() => {
filters.value.requireAllFilters = params.value.filter_concat === 'and' filters.value.requireAllFilters = params.value.filter_concat === 'and'
}) })
watch( // Using watchDebounced to prevent the filter re-triggering itself.
// FIXME: Only here until this whole component changes a lot with the new filter syntax.
watchDebounced(
modelValue, modelValue,
(value) => { (value) => {
// FIXME: filters should only be converted to snake case in // FIXME: filters should only be converted to snake case in the last moment
// the last moment
params.value = objectToSnakeCase(value) params.value = objectToSnakeCase(value)
prepareFilters() prepareFilters()
}, },
{immediate: true}, {immediate: true, debounce: 500, maxWait: 1000},
) )
const sortAlphabetically = computed({ const sortAlphabetically = computed({
@ -311,7 +313,7 @@ function prepareFilters() {
prepareDate('end_date', 'endDate') prepareDate('end_date', 'endDate')
prepareSingleValue('priority', 'priority', 'usePriority', true) prepareSingleValue('priority', 'priority', 'usePriority', true)
prepareSingleValue('percent_done', 'percentDone', 'usePercentDone', true) prepareSingleValue('percent_done', 'percentDone', 'usePercentDone', true)
prepareDate('reminders') prepareDate('reminders', 'reminders')
prepareRelatedObjectFilter('users', 'assignees') prepareRelatedObjectFilter('users', 'assignees')
prepareProjectsFilter() prepareProjectsFilter()
@ -387,13 +389,13 @@ function setDateFilter(filterName, {dateFrom, dateTo}) {
change() change()
} }
function prepareDate(filterName, variableName) { function prepareDate(filterName: string, variableName: 'dueDate' | 'startDate' | 'endDate' | 'reminders') {
if (typeof params.value.filter_by === 'undefined') { if (typeof params.value.filter_by === 'undefined') {
return return
} }
let foundDateStart = false let foundDateStart: boolean | string = false
let foundDateEnd = false let foundDateEnd: boolean | string = false
for (const i in params.value.filter_by) { for (const i in params.value.filter_by) {
if (params.value.filter_by[i] === filterName && params.value.filter_comparator[i] === 'greater_equals') { if (params.value.filter_by[i] === filterName && params.value.filter_comparator[i] === 'greater_equals') {
foundDateStart = i foundDateStart = i