Entry latest buys side filter panel
This commit is contained in:
parent
2774c68f19
commit
6eee05249d
|
|
@ -587,13 +587,8 @@ const redirectToEntryBuys = (entryFk) => {
|
|||
|
||||
const applyColumnFilter = async (col) => {
|
||||
try {
|
||||
if (!col.columnFilter.filterValue) {
|
||||
delete params[col.field];
|
||||
} else {
|
||||
params[col.field] = col.columnFilter.filterValue;
|
||||
}
|
||||
|
||||
await arrayData.applyFilter({ params });
|
||||
params[col.field] = col.columnFilter.filterValue;
|
||||
await arrayData.addFilter({ params });
|
||||
} catch (err) {
|
||||
console.error('Error applying column filter', err);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -7,6 +7,7 @@ import FetchData from 'components/FetchData.vue';
|
|||
import VnInputDate from 'src/components/common/VnInputDate.vue';
|
||||
import VnFilterPanel from 'src/components/ui/VnFilterPanel.vue';
|
||||
import VnSelectFilter from 'components/common/VnSelectFilter.vue';
|
||||
import VnFilterPanelChip from 'components/ui/VnFilterPanelChip.vue';
|
||||
|
||||
import axios from 'axios';
|
||||
|
||||
|
|
@ -50,8 +51,8 @@ const selectedType = computed(() => {
|
|||
|
||||
const selectCategory = async (params, categoryId, search) => {
|
||||
if (params.categoryFk === categoryId) {
|
||||
resetCategory();
|
||||
params.categoryFk = null;
|
||||
resetCategory(params);
|
||||
search();
|
||||
return;
|
||||
}
|
||||
selectedCategoryFk.value = categoryId;
|
||||
|
|
@ -60,12 +61,25 @@ const selectCategory = async (params, categoryId, search) => {
|
|||
search();
|
||||
};
|
||||
|
||||
const resetCategory = () => {
|
||||
const resetCategory = (params) => {
|
||||
selectedCategoryFk.value = null;
|
||||
itemTypesOptions.value = null;
|
||||
if (params) {
|
||||
params.categoryFk = null;
|
||||
params.typeFk = null;
|
||||
}
|
||||
};
|
||||
|
||||
const applyTags = () => {};
|
||||
const applyTags = (params, search) => {
|
||||
params.tags = tagValues.value
|
||||
.filter((tag) => tag.selectedTag && tag.value)
|
||||
.map((tag) => ({
|
||||
tagFk: tag.selectedTag.id,
|
||||
tagName: tag.selectedTag.name,
|
||||
value: tag.value,
|
||||
}));
|
||||
search();
|
||||
};
|
||||
|
||||
const fetchItemTypes = async (id) => {
|
||||
try {
|
||||
|
|
@ -92,7 +106,7 @@ const getCategoryClass = (category, params) => {
|
|||
|
||||
const getSelectedTagValues = async (tag) => {
|
||||
try {
|
||||
console.log('tag:: ', tag);
|
||||
tag.value = null;
|
||||
const filter = {
|
||||
fields: ['value'],
|
||||
order: 'value ASC',
|
||||
|
|
@ -104,11 +118,15 @@ const getSelectedTagValues = async (tag) => {
|
|||
params,
|
||||
});
|
||||
tag.valueOptions = data;
|
||||
console.log('tag.valueOptions:: ', tag.valueOptions);
|
||||
} catch (err) {
|
||||
console.error('Error getting selected tag values');
|
||||
}
|
||||
};
|
||||
|
||||
const removeTag = (index, params, search) => {
|
||||
(tagValues.value || []).splice(index, 1);
|
||||
applyTags(params, search);
|
||||
};
|
||||
</script>
|
||||
|
||||
<template>
|
||||
|
|
@ -142,6 +160,7 @@ const getSelectedTagValues = async (tag) => {
|
|||
<VnFilterPanel
|
||||
:data-key="props.dataKey"
|
||||
:expr-builder="exprBuilder"
|
||||
:custom-tags="['tags']"
|
||||
@init="onFilterInit"
|
||||
@remove="clearFilter"
|
||||
>
|
||||
|
|
@ -157,6 +176,21 @@ const getSelectedTagValues = async (tag) => {
|
|||
<span>{{ formatFn(tag.value) }}</span>
|
||||
</div>
|
||||
</template>
|
||||
<template #customTags="{ tags: customTags, params }">
|
||||
<template v-for="tag in customTags" :key="tag.label">
|
||||
<VnFilterPanelChip
|
||||
v-for="chip in tag.value"
|
||||
:key="chip"
|
||||
removable
|
||||
@remove="removeTagChip(chip, params, searchFn)"
|
||||
>
|
||||
<div class="q-gutter-x-xs">
|
||||
<strong>{{ chip.tagName }}: </strong>
|
||||
<span>"{{ chip.value }}"</span>
|
||||
</div>
|
||||
</VnFilterPanelChip>
|
||||
</template>
|
||||
</template>
|
||||
<template #body="{ params, searchFn }">
|
||||
<QItem class="category-filter q-mt-md">
|
||||
<QBtn
|
||||
|
|
@ -303,7 +337,7 @@ const getSelectedTagValues = async (tag) => {
|
|||
<QItem
|
||||
v-for="(value, index) in tagValues"
|
||||
:key="value"
|
||||
class="q-mt-md filter-value bg-red"
|
||||
class="q-mt-md filter-value"
|
||||
>
|
||||
<QItemSection class="col">
|
||||
<VnSelectFilter
|
||||
|
|
@ -316,12 +350,13 @@ const getSelectedTagValues = async (tag) => {
|
|||
rounded
|
||||
:emit-value="false"
|
||||
use-input
|
||||
:is-clearable="false"
|
||||
@update:model-value="getSelectedTagValues(value)"
|
||||
/>
|
||||
</QItemSection>
|
||||
<QItemSection class="col">
|
||||
<VnSelectFilter
|
||||
v-if="!value?.isFree && value.valueOptions"
|
||||
v-if="!value?.selectedTag?.isFree && value.valueOptions"
|
||||
:label="t('params.value')"
|
||||
v-model="value.value"
|
||||
:options="value.valueOptions || []"
|
||||
|
|
@ -333,8 +368,9 @@ const getSelectedTagValues = async (tag) => {
|
|||
emit-value
|
||||
use-input
|
||||
:disable="!value"
|
||||
:is-clearable="false"
|
||||
class="filter-input"
|
||||
@update:model-value="applyTags()"
|
||||
@update:model-value="applyTags(params, searchFn)"
|
||||
/>
|
||||
<VnInput
|
||||
v-else
|
||||
|
|
@ -343,12 +379,14 @@ const getSelectedTagValues = async (tag) => {
|
|||
:disable="!value"
|
||||
is-outlined
|
||||
class="filter-input"
|
||||
:is-clearable="false"
|
||||
@keyup.enter="applyTags(params, searchFn)"
|
||||
/>
|
||||
</QItemSection>
|
||||
<QIcon
|
||||
name="delete"
|
||||
class="filter-icon"
|
||||
@click="(tagValues || []).splice(index, 1)"
|
||||
@click="removeTag(index, params, searchFn)"
|
||||
/>
|
||||
</QItem>
|
||||
<QItem class="q-mt-lg">
|
||||
|
|
@ -427,13 +465,10 @@ es:
|
|||
typeFk: Tipo
|
||||
tag: Etiqueta
|
||||
value: Valor
|
||||
|
||||
Plant: Planta
|
||||
Flower: Flor
|
||||
Handmade: Confección
|
||||
Green: Verde
|
||||
Accessories: Complemento
|
||||
Fruit: Fruta
|
||||
|
||||
|
||||
</i18n>
|
||||
|
|
|
|||
Loading…
Reference in New Issue