ami/tl-vikunja
1
0
Fork 0
Code Activity

docs(filter): add filter query explanation

Browse Source
This commit is contained in:
kolaente
2024-03-09 18:25:14 +01:00
parent e0a7f46e5d
commit d0b762d761
6 changed files with 184 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

72
frontend/src/components/project/partials/FilterInputDocs.vue Normal file
View File

@ -0,0 +1,72 @@
<script setup lang="ts">
import {ref} from 'vue'
import BaseButton from '@/components/base/BaseButton.vue'
const showDocs = ref(false)
</script>
<template>
<BaseButton @click="showDocs = !showDocs" class="has-text-primary">
{{ $t('filters.query.help.link') }}
</BaseButton>
<Transition>
<div v-if="showDocs" class="content">
<p>{{ $t('filters.query.help.intro') }}</p>
<ul>
<li><code>done</code>: {{ $t('filters.query.help.fields.done') }}</li>
<li><code>priority</code>: {{ $t('filters.query.help.fields.priority') }}</li>
<li><code>percentDone</code>: {{ $t('filters.query.help.fields.percentDone') }}</li>
<li><code>dueDate</code>: {{ $t('filters.query.help.fields.dueDate') }}</li>
<li><code>startDate</code>: {{ $t('filters.query.help.fields.startDate') }}</li>
<li><code>endDate</code>: {{ $t('filters.query.help.fields.endDate') }}</li>
<li><code>doneAt</code>: {{ $t('filters.query.help.fields.doneAt') }}</li>
<li><code>assignees</code>: {{ $t('filters.query.help.fields.assignees') }}</li>
<li><code>labels</code>: {{ $t('filters.query.help.fields.labels') }}</li>
<li><code>project</code>: {{ $t('filters.query.help.fields.project') }}</li>
</ul>
<p>{{ $t('filters.query.help.canUseDatemath') }}</p>
<p>{{ $t('filters.query.help.operators.intro') }}</p>
<ul>
<li><code>!=</code>: {{ $t('filters.query.help.operators.notEqual') }}</li>
<li><code>=</code>: {{ $t('filters.query.help.operators.equal') }}</li>
<li><code>&gt;</code>: {{ $t('filters.query.help.operators.greaterThan') }}</li>
<li><code>&gt;=</code>: {{ $t('filters.query.help.operators.greaterThanOrEqual') }}</li>
<li><code>&lt;</code>: {{ $t('filters.query.help.operators.lessThan') }}</li>
<li><code>&lt;=</code>: {{ $t('filters.query.help.operators.lessThanOrEqual') }}</li>
<li><code>like</code>: {{ $t('filters.query.help.operators.like') }}</li>
<li><code>in</code>: {{ $t('filters.query.help.operators.in') }}</li>
</ul>
<p>{{ $t('filters.query.help.logicalOperators.intro') }}</p>
<ul>
<li><code>&amp;&amp;</code>: {{ $t('filters.query.help.logicalOperators.and') }}</li>
<li><code>||</code>: {{ $t('filters.query.help.logicalOperators.or') }}</li>
<li><code>(</code> and <code>)</code>: {{ $t('filters.query.help.logicalOperators.parentheses') }}</li>
</ul>
<p>{{ $t('filters.query.help.examples.intro') }}</p>
<ul>
<li><code>priority = 4</code>: {{ $t('filters.query.help.examples.priorityEqual') }}</li>
<li><code>dueDate &lt; now</code>: {{ $t('filters.query.help.examples.dueDatePast') }}</li>
<li><code>done = false &amp;&amp; priority &gt;= 3</code>:
{{ $t('filters.query.help.examples.undoneHighPriority') }}
</li>
<li><code>assignees in [user1, user2]</code>: {{ $t('filters.query.help.examples.assigneesIn') }}</li>
<li><code>(priority = 1 || priority = 2) &amp;&amp; dueDate &lt;= now</code>:
{{ $t('filters.query.help.examples.priorityOneOrTwoPastDue') }}
</li>
</ul>
</div>
</Transition>
</template>
<style scoped lang="scss">
.v-enter-active,
.v-leave-active {
transition: all $transition-duration ease;
}
.v-enter-from,
.v-leave-to {
transform: scaleY(0);
}
</style>

3
frontend/src/components/project/partials/filters.vue
View File

@ -19,6 +19,8 @@
</Fancycheckbox>
</div>
<FilterInputDocs/>
<template #footer>
<x-button
variant="primary"
@ -44,6 +46,7 @@ import type {TaskFilterParams} from '@/services/taskCollection'
import {useLabelStore} from '@/stores/labels'
import {useProjectStore} from '@/stores/projects'
import {FILTER_OPERATORS, transformFilterStringForApi, transformFilterStringFromApi} from '@/helpers/filters'
import FilterInputDocs from '@/components/project/partials/FilterInputDocs.vue'
const props = defineProps({
hasTitle: {