diff --git a/src/components/VnTable/VnFilter.vue b/src/components/VnTable/VnFilter.vue index 000683670..ba573f612 100644 --- a/src/components/VnTable/VnFilter.vue +++ b/src/components/VnTable/VnFilter.vue @@ -89,11 +89,15 @@ const components = { async function addFilter(value) { if (value && typeof value === 'object') value = model.value; - value = value === '' ? null : value; + value = value === '' ? undefined : value; let field = columnFilter.value?.name ?? $props.column.name; - const toFilter = { [field]: value }; - await arrayData.addFilter({ params: toFilter }); + let params = { [field]: value }; + if (columnFilter.value?.inWhere) { + if (columnFilter.value.prefix) field = columnFilter.value.prefix + '.' + field; + params = { filter: { where: params } }; + } + await arrayData.addFilter({ params }); } function alignRow() { diff --git a/src/pages/Customer/ExtendedList/CustomerExtendedList.vue b/src/pages/Customer/ExtendedList/CustomerExtendedList.vue index f857abf4c..e865c7224 100644 --- a/src/pages/Customer/ExtendedList/CustomerExtendedList.vue +++ b/src/pages/Customer/ExtendedList/CustomerExtendedList.vue @@ -75,11 +75,17 @@ const columns = computed(() => [ align: 'left', label: t('customer.extendedList.tableVisibleColumns.credit'), name: 'credit', + columnFilter: { + inWhere: true, + }, }, { align: 'left', label: t('customer.extendedList.tableVisibleColumns.creditInsurance'), name: 'creditInsurance', + columnFilter: { + inWhere: true, + }, }, { align: 'left', @@ -98,6 +104,9 @@ const columns = computed(() => [ label: t('customer.extendedList.tableVisibleColumns.mobile'), name: 'mobile', cardVisible: true, + columnFilter: { + inWhere: true, + }, }, { align: 'left', @@ -108,12 +117,29 @@ const columns = computed(() => [ { align: 'left', label: t('customer.extendedList.tableVisibleColumns.countryFk'), - name: 'country', + name: 'countryFk', + columnFilter: { + component: 'select', + inWhere: true, + prefix: 'c', + attrs: { + url: 'Countries', + }, + }, + format: (row, dashIfEmpty) => dashIfEmpty(row.country), }, { align: 'left', label: t('customer.extendedList.tableVisibleColumns.provinceFk'), name: 'provinceFk', + component: 'select', + attrs: { + url: 'Provinces', + }, + columnField: { + component: null, + }, + format: (row, dashIfEmpty) => dashIfEmpty(row.province), }, { align: 'left',