wbuezas
/
salix-front-mindshore-fork2
forked from verdnatura/salix-front
0
0
Fork 0
Code Pull Requests Activity

refactor: revert catalog changes

This commit is contained in:
Jon Elias 2024-10-23 13:02:28 +02:00
parent 1346a2e7fd
commit 37b3affdbf
4 changed files with 50 additions and 77 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
src/components/ui/VnFilterPanel.vue
View File

@ -185,9 +185,6 @@ async function remove(key) {
}
function formatValue(value) {
if (typeof value === 'object') {
return value;
}
if (typeof value === 'boolean') return value ? t('Yes') : t('No');
if (isNaN(value) && !isNaN(Date.parse(value))) return toDate(value);
@ -196,13 +193,6 @@ function formatValue(value) {
function sanitizer(params) {
for (const [key, value] of Object.entries(params)) {
if (key == 'and') {
value.forEach((andValue) => {
params = { ...params, ...andValue };
});
delete params[key];
}
if (value && typeof value === 'object') {
const param = Object.values(value)[0];
if (typeof param == 'string') params[key] = param.replaceAll('%', '');
@ -221,7 +211,7 @@ function sanitizer(params) {
icon="search"
@click="search()"
></QBtn>
<QForm @submit="search" id="filterPanelForm" @keyup.enter.prevent="search(true)">
<QForm @submit="search" id="filterPanelForm" @keyup.enter="search()">
<QList dense>
<QItem class="q-mt-xs">
<QItemSection top>

2
src/components/ui/VnSearchbar.vue
View File

@ -9,7 +9,6 @@ import { useStateStore } from 'src/stores/useStateStore';
const quasar = useQuasar();
const { t } = useI18n();
const state = useStateStore();
const emit = defineEmits(['onSearch']);
const props = defineProps({
dataKey: {
@ -119,7 +118,6 @@ async function search() {
delete filter.params.search;
}
await arrayData.applyFilter(filter);
emit('onSearch', store.data);
}
</script>
<template>

5
src/pages/Order/Card/OrderCatalog.vue
View File

@ -86,8 +86,11 @@ function extractValueTags(items) {
<div class="full-width">
<VnPaginate
data-key="OrderCatalogList"
url="Orders/CatalogFilter"
:limit="50"
:user-params="catalogParams"
@on-fetch="extractTags"
:update-router="false"
@on-change="extractTags"
>
<template #body="{ rows }">
<div class="catalog-list">

108
src/pages/Order/Card/OrderCatalogFilter.vue
View File

@ -1,13 +1,14 @@
<script setup>
import { computed, ref, onMounted, watch } from 'vue';
import { computed, ref } from 'vue';
import { useI18n } from 'vue-i18n';
import { useRoute } from 'vue-router';
import axios from 'axios';
import FetchData from 'components/FetchData.vue';
import VnFilterPanel from 'src/components/ui/VnFilterPanel.vue';
import VnSelect from 'components/common/VnSelect.vue';
import VnFilterPanelChip from 'components/ui/VnFilterPanelChip.vue';
import VnInput from 'src/components/common/VnInput.vue';
import getParamWhere from 'src/filters/getParamWhere';
import VnFilterPanelChip from 'src/components/ui/VnFilterPanelChip.vue';
const { t } = useI18n();
@ -47,19 +48,6 @@ const orderWayList = ref([
const orderBySelected = ref('relevancy DESC, name');
const orderWaySelected = ref('ASC');
const routeQuery = JSON.parse(route?.query.params ?? '{}');
const paramsSearch = ref({});
const tagData = ref([]);
onMounted(() => {
paramsSearch.value = JSON.parse(routeQuery.filter ?? '{}')?.where ?? {};
if (Object.keys(paramsSearch.value).length > 0) vnFilterPanelRef.value.search();
if (routeQuery.categoryFk && routeQuery.typeFk) {
selectedCategoryFk.value = routeQuery.categoryFk;
selectedTypeFk.value = routeQuery.typeFk;
}
});
const createValue = (val, done) => {
if (val.length > 2) {
if (!tagOptions.value.includes(val)) {
@ -73,21 +61,19 @@ const resetCategory = () => {
typeList.value = null;
};
const selectCategory = (category, search) => {
if (!paramsSearch.value?.filter) paramsSearch.value.filter = { where: {} };
const where = paramsSearch.value.filter.where;
if (where.categoryFk === category?.id) {
const clearFilter = (key) => {
if (key === 'categoryFk') {
resetCategory();
where.categoryFk = null;
} else {
if (where.categoryFk && where.categoryFk !== category?.id) {
paramsSearch.value.typeFk = null;
selectedTypeFk.value = null;
typeList.value = [];
}
}
};
const selectCategory = (params, category, search) => {
if (params.categoryFk === category?.id) {
resetCategory();
params.categoryFk = null;
} else {
selectedCategoryFk.value = category?.id;
where.categoryFk = category?.id;
params.categoryFk = category?.id;
loadTypes(category?.id);
}
search();
@ -100,10 +86,6 @@ const loadTypes = async (categoryFk = selectedCategoryFk.value) => {
typeList.value = data;
};
watch(selectedTypeFk, (newValue) => {
paramsSearch.value.typeFk = newValue;
});
const selectedCategory = computed(() =>
(categoryList.value || []).find(
(category) => category?.id === selectedCategoryFk.value
@ -121,17 +103,26 @@ const selectedType = computed(() => {
return (typeList.value || []).find((type) => type?.id === selectedTypeFk.value);
});
function exprBuilder(param, value) {
switch (param) {
case 'categoryFk':
case 'typeFk':
return { [param]: value };
case 'search':
if (/^\d+$/.test(value)) return { 'i.id': value };
else return { 'i.name': { like: `%${value}%` } };
}
}
const applyTagFilter = (params, search) => {
if (!tagValues.value?.length) {
params.tagGroups = null;
search();
return;
}
if (!params.tagGroups || typeof params.tagGroups === 'string') {
if (!params.tagGroups) {
params.tagGroups = [];
}
params.tagGroups.push(
JSON.stringify({
values: tagValues.value.filter((obj) => Object.keys(obj).length > 0),
@ -142,29 +133,17 @@ const applyTagFilter = (params, search) => {
tagFk: selectedTag?.value?.tagFk,
})
);
tagData.value.push(JSON.parse(params.tagGroups[params.tagGroups.length - 1]));
search();
selectedTag.value = null;
tagValues.value = [{}];
};
const removeTagChip = (selection, params, search) => {
if (typeof params.tagGroups === 'string') {
try {
params.tagGroups = JSON.parse(params.tagGroups);
} catch (error) {
console.error('Error parsing tagGroups:', error);
params.tagGroups = [];
}
if (params.tagGroups) {
params.tagGroups = (params.tagGroups || []).filter(
(value) => value !== selection
);
}
console.log('params.tagGroups: ', params.tagGroups);
console.log('selection: ', selection);
if (Array.isArray(params.tagGroups)) {
params.tagGroups = params.tagGroups.filter((value) => value !== selection);
}
search();
};
@ -199,12 +178,12 @@ function addOrder(value, field, params) {
<VnFilterPanel
ref="vnFilterPanelRef"
:data-key="props.dataKey"
v-model="paramsSearch"
:redirect="false"
:hidden-tags="['orderFk', 'orderBy', 'filter', 'search', 'or', 'and']"
:hidden-tags="['orderFk', 'orderBy']"
:un-removable-params="['orderFk', 'orderBy']"
:expr-builder="exprBuilder"
:custom-tags="['tagGroups']"
:unremovable-params="['orderFk', 'orderBy']"
:disable-submit-event="true"
@remove="clearFilter"
:redirect="false"
>
<template #tags="{ tag, formatFn }">
<strong v-if="tag.label === 'categoryFk'">
@ -222,13 +201,17 @@ function addOrder(value, field, params) {
<template v-for="tag in customTags" :key="tag.label">
<template v-if="tag.label === 'tagGroups'">
<VnFilterPanelChip
v-for="chip in tagData"
v-for="chip in tag.value"
:key="chip"
removable
@remove="removeTagChip(chip, params, searchFn)"
>
<strong>{{ chip.tagSelection?.name }}: </strong>
<span>{{ chip.values[0].value }}</span>
<strong> {{ JSON.parse(chip).tagSelection?.name }}: </strong>
<span>{{
(JSON.parse(chip).values || [])
.map((item) => item.value)
.join(' | ')
}}</span>
</VnFilterPanelChip>
</template>
</template>
@ -243,7 +226,7 @@ function addOrder(value, field, params) {
<QIcon
:name="category.icon"
class="category-icon"
@click="selectCategory(category, searchFn)"
@click="selectCategory(params, category, searchFn)"
>
<QTooltip>
{{ t(category.name) }}
@ -337,7 +320,7 @@ function addOrder(value, field, params) {
>
<FetchData
v-if="selectedTag"
:url="`Tags/${selectedTag.id}/filterValue`"
:url="`Tags/${selectedTag}/filterValue`"
limit="30"
auto-load
@on-fetch="(data) => (tagOptions = data)"
@ -360,7 +343,7 @@ function addOrder(value, field, params) {
@update:model-value="applyTagFilter(params, searchFn)"
/>
<VnSelect
v-else-if="selectedTag.id === 1"
v-else-if="selectedTag === 1"
:label="t('params.value')"
v-model="value.value"
:options="tagOptions || []"
@ -375,7 +358,7 @@ function addOrder(value, field, params) {
@new-value="createValue"
@update:model-value="applyTagFilter(params, searchFn)"
/>
<QInput
<VnInput
v-else
:label="t('params.value')"
v-model="value.value"
@ -396,7 +379,6 @@ function addOrder(value, field, params) {
icon="add_circle"
shortcut="+"
flat
size="md"
class="filter-icon"
@click="tagValues.push({})"
/>