filter by query parameter

This commit is contained in:
Hayden 2022-10-31 21:40:27 -08:00
parent bbd09a6f0a
commit bb20cb8678
No known key found for this signature in database
GPG key ID: 17CF79474E257545

View file

@ -23,7 +23,12 @@
const locations = selectedLocations.value.map(l => l.id); const locations = selectedLocations.value.map(l => l.id);
const labels = selectedLabels.value.map(l => l.id); const labels = selectedLabels.value.map(l => l.id);
const { data, error } = await api.items.getAll({ q: query.value, locations, labels }); const { data, error } = await api.items.getAll({
q: query.value,
locations,
labels,
includeArchived: includeArchived.value,
});
if (error) { if (error) {
loading.value = false; loading.value = false;
return; return;
@ -46,6 +51,7 @@
const advanced = ref(false); const advanced = ref(false);
const selectedLocations = ref([]); const selectedLocations = ref([]);
const selectedLabels = ref([]); const selectedLabels = ref([]);
const includeArchived = ref(false);
watchEffect(() => { watchEffect(() => {
if (!advanced.value) { if (!advanced.value) {
@ -57,6 +63,7 @@
watchDebounced(query, search, { debounce: 250, maxWait: 1000 }); watchDebounced(query, search, { debounce: 250, maxWait: 1000 });
watchDebounced(selectedLocations, search, { debounce: 250, maxWait: 1000 }); watchDebounced(selectedLocations, search, { debounce: 250, maxWait: 1000 });
watchDebounced(selectedLabels, search, { debounce: 250, maxWait: 1000 }); watchDebounced(selectedLabels, search, { debounce: 250, maxWait: 1000 });
watch(includeArchived, search);
</script> </script>
<template> <template>
@ -77,6 +84,13 @@
<div class="px-4 pb-4"> <div class="px-4 pb-4">
<FormMultiselect v-model="selectedLabels" label="Labels" :items="labels ?? []" /> <FormMultiselect v-model="selectedLabels" label="Labels" :items="labels ?? []" />
<FormMultiselect v-model="selectedLocations" label="Locations" :items="locations ?? []" /> <FormMultiselect v-model="selectedLocations" label="Locations" :items="locations ?? []" />
<div class="flex pb-2 pt-5">
<label class="label cursor-pointer mr-auto">
<input v-model="includeArchived" type="checkbox" class="toggle toggle-primary" />
<span class="label-text ml-4"> Include Archived Items </span>
</label>
<Spacer />
</div>
</div> </div>
</BaseCard> </BaseCard>
<section class="mt-10"> <section class="mt-10">