diff --git a/src/components/VnTable/VnContextMenu.vue b/src/components/VnTable/VnContextMenu.vue index f9922538e..7004469a9 100644 --- a/src/components/VnTable/VnContextMenu.vue +++ b/src/components/VnTable/VnContextMenu.vue @@ -9,18 +9,18 @@ const colField = ref(); let colValue = ''; let textValue = ''; +defineExpose({ handler }); + const arrayData = defineModel({ type: Array, }); -defineExpose({ - handler, -}); - function handler(event) { + const clickedElement = event.target.closest('td'); + if (!clickedElement) return; + target.value = event.target; qmenuRef.value.show(); - const clickedElement = event.target.closest('td'); colField.value = clickedElement.getAttribute('data-col-field'); colValue = isNaN(+clickedElement.getAttribute('data-col-value')) ? clickedElement.getAttribute('data-col-value') @@ -45,22 +45,22 @@ function getDeepestText(node) { return lastText; } -function selectionFilter() { - arrayData.value.addFilter({ params: { [colField.value]: colValue } }); +async function selectionFilter() { + await arrayData.value.addFilter({ params: { [colField.value]: colValue } }); } -function selectionExclude() { - arrayData.value.addFilter({ - params: { [colField.value]: { neq: +colValue } }, +async function selectionExclude() { + await arrayData.value.addFilter({ + params: { [colField.value]: { neq: colValue } }, }); } -function selectionRemoveFilter() { - arrayData.value.addFilter({ params: { [colField.value]: undefined } }); +async function selectionRemoveFilter() { + await arrayData.value.addFilter({ params: { [colField.value]: undefined } }); } -function removeAllFilters() { - arrayData.value.applyFilter({ params: {} }); +async function removeAllFilters() { + await arrayData.value.applyFilter({ params: {} }); } function copyValue() { @@ -72,12 +72,42 @@ function copyValue() { } - - {{ $t('Filter by selection') }} - - {{ $t('Remove filter') }} - {{ $t('Remove all filters') }} - {{ $t('Copy value') }} + + + + + + diff --git a/src/components/VnTable/VnFilter.vue b/src/components/VnTable/VnFilter.vue index 82d7c772c..1ebad1abe 100644 --- a/src/components/VnTable/VnFilter.vue +++ b/src/components/VnTable/VnFilter.vue @@ -136,6 +136,9 @@ async function addFilter(value, name) { value = value === '' ? undefined : value; let field = columnFilter.value?.name ?? $props.column.name ?? name; + delete arrayData.store?.userParams?.[field]; + delete arrayData.store?.filter?.where?.[field]; + if (columnFilter.value?.inWhere) { if (columnFilter.value.alias) field = columnFilter.value.alias + '.' + field; return await arrayData.addFilterWhere({ [field]: value }); diff --git a/src/components/VnTable/VnTable.vue b/src/components/VnTable/VnTable.vue index c94089604..3eea028d8 100644 --- a/src/components/VnTable/VnTable.vue +++ b/src/components/VnTable/VnTable.vue @@ -210,11 +210,11 @@ onBeforeMount(() => { }); onMounted(async () => { + if ($props.isEditable) document.addEventListener('click', clickHandler); document.addEventListener('contextmenu', (event) => { event.preventDefault(); contextMenuRef.value.handler(event); }); - if ($props.isEditable) document.addEventListener('click', clickHandler); mode.value = quasar.platform.is.mobile && !$props.disableOption?.card ? CARD_MODE @@ -238,6 +238,7 @@ onMounted(async () => { onUnmounted(async () => { if ($props.isEditable) document.removeEventListener('click', clickHandler); + document.removeEventListener('contextmenu', {}); }); watch( diff --git a/src/components/VnTable/VnTableFilter.vue b/src/components/VnTable/VnTableFilter.vue index a7b2108ed..5d24245ac 100644 --- a/src/components/VnTable/VnTableFilter.vue +++ b/src/components/VnTable/VnTableFilter.vue @@ -77,7 +77,12 @@ function columnName(col) { {{ getLocale(`${tag.label}`) }}: - {{ formatFn(tag.value) }} + {{ formatFn(tag) }} diff --git a/src/components/common/VnSelect.vue b/src/components/common/VnSelect.vue index 0cbe541fc..25e46c815 100644 --- a/src/components/common/VnSelect.vue +++ b/src/components/common/VnSelect.vue @@ -124,6 +124,7 @@ const { } = toRefs($props); const myOptions = ref([]); const myOptionsOriginal = ref([]); +const myOptionsMap = ref(new Map()); const vnSelectRef = ref(); const lastVal = ref(); const noOneText = t('globals.noOne'); @@ -140,7 +141,7 @@ const styleAttrs = computed(() => { } : {}; }); -const isLoading = ref(false); +const hasFocus = ref(false); const useURL = computed(() => $props.url); const value = computed({ get() { @@ -166,6 +167,10 @@ const computedSortBy = computed(() => { return $props.sortBy || $props.optionLabel + ' ASC'; }); +const valueIsObject = computed(() => { + return modelValue.value && typeof modelValue.value == 'object'; +}); + const getVal = (val) => ($props.useLike ? { like: `%${val}%` } : val); watch(options, (newValue) => { @@ -173,12 +178,22 @@ watch(options, (newValue) => { }); watch(modelValue, async (newValue) => { + if (newValue?.neq) newValue = newValue.neq; if (!myOptions?.value?.some((option) => option[optionValue.value] == newValue)) await fetchFilter(newValue); if ($props.noOne) myOptions.value.unshift(noOneOpt.value); }); +watch( + () => myOptionsOriginal.value, + (newValue) => { + for (const item of newValue) { + myOptionsMap.value.set(item[optionValue.value], item); + } + }, +); + onMounted(() => { setOptions(options.value); if (useURL.value && $props.modelValue && !findKeyInOptions()) @@ -186,7 +201,7 @@ onMounted(() => { if ($props.focusOnMount) setTimeout(() => vnSelectRef.value.showPopup(), 300); }); -const someIsLoading = computed(() => isLoading.value || !!arrayData?.isLoading?.value); +const isLoading = computed(() => !!arrayData?.isLoading?.value); function findKeyInOptions() { if (!$props.options) return; return filter($props.modelValue, $props.options)?.length; @@ -222,6 +237,9 @@ function filter(val, options) { async function fetchFilter(val) { if (!$props.url) return; + if (val && typeof val == 'object') { + val = val.neq; + } const { fields, include, limit } = $props; const sortBy = computedSortBy.value; @@ -296,13 +314,11 @@ async function onScroll({ to, direction, from, index }) { if (from === 0 && index === 0) return; if (!useURL.value && !$props.fetchRef) return; if (direction === 'decrease') return; - if (to === lastIndex && arrayData.store.hasMoreData && !isLoading.value) { - isLoading.value = true; + if (to === lastIndex && arrayData.store.hasMoreData) { await arrayData.loadMore(); setOptions(arrayData.store.data); vnSelectRef.value.scrollTo(lastIndex); await nextTick(); - isLoading.value = false; } } @@ -345,10 +361,20 @@ function getCaption(opt) { if (optionCaption.value === false) return; return opt[optionCaption.value] || opt[optionValue.value]; } + +function getOptionLabel(property) { + if (!myOptionsMap.value.size) return; + let value = modelValue.value; + if (property) { + value = modelValue.value[property]; + } + return myOptionsMap.value.get(value)?.[optionLabel.value]; +} { + hasFocus = true; + } + " + @blur="() => (hasFocus = false)" + @update:model-value="vnSelectRef.blur()" > { value = null; + vnSelectRef.blur(); emit('remove'); } " @@ -422,6 +454,11 @@ function getCaption(opt) { + + + + + @@ -429,4 +466,12 @@ function getCaption(opt) { .q-field--outlined { max-width: 100%; } +.q-field__native { + @extend .nowrap; +} + +.nowrap { + display: flex; + flex-wrap: nowrap !important; +} diff --git a/src/pages/Ticket/TicketList.vue b/src/pages/Ticket/TicketList.vue index 096aa101c..f7dd09b4f 100644 --- a/src/pages/Ticket/TicketList.vue +++ b/src/pages/Ticket/TicketList.vue @@ -460,6 +460,32 @@ function setReference(data) { dialogData.value.value.description = newDescription; } + +function exprBuilder(param, value) { + switch (param) { + case 'stateFk': + return { 'ts.stateFk': value }; + case 'provinceFk': + return { 'a.provinceFk': value }; + case 'hour': + return { 'z.hour': value }; + case 'shipped': + return { + 't.shipped': { + between: this.dateRange(value), + }, + }; + case 'departmentFk': + return { 'c.departmentFk': value }; + case 'id': + case 'refFk': + case 'zoneFk': + case 'nickname': + case 'agencyModeFk': + case 'warehouseFk': + return { [`t.${param}`]: value }; + } +} @@ -654,40 +680,34 @@ function setReference(data) { - - fetchAvailableAgencies(data)" - /> - + fetchAvailableAgencies(data)" + /> - - fetchAvailableAgencies(data)" - /> - + fetchAvailableAgencies(data)" + /> - - - +