diff --git a/src/components/common/VnInput.vue b/src/components/common/VnInput.vue index 4cd964012..33b97e29d 100644 --- a/src/components/common/VnInput.vue +++ b/src/components/common/VnInput.vue @@ -93,7 +93,12 @@ const inputRules = [ name="close" size="xs" v-if="hover && value && !$attrs.disabled && $props.clearable" - @click="value = null" + @click=" + () => { + value = null; + emit('remove'); + } + " > diff --git a/src/components/common/VnSelect.vue b/src/components/common/VnSelect.vue index 52cb68438..3e5cd4216 100644 --- a/src/components/common/VnSelect.vue +++ b/src/components/common/VnSelect.vue @@ -61,6 +61,10 @@ const $props = defineProps({ type: Boolean, default: false, }, + useLike: { + type: Boolean, + default: true, + }, }); const { t } = useI18n(); @@ -114,11 +118,14 @@ async function fetchFilter(val) { if (!$props.url || !dataRef.value) return; const { fields, sortBy, limit } = $props; - let key = optionLabel.value; + let key = optionFilter.value ?? optionLabel.value; - if (new RegExp(/\d/g).test(val)) key = optionFilter.value ?? optionValue.value; + if (new RegExp(/\d/g).test(val)) key = optionValue.value; - const where = { ...{ [key]: { like: `%${val}%` } }, ...$props.where }; + const defaultWhere = $props.useLike + ? { [key]: { like: `%${val}%` } } + : { [key]: val }; + const where = { ...defaultWhere, ...$props.where }; const fetchOptions = { where, order: sortBy, limit }; if (fields) fetchOptions.fields = fields; return dataRef.value.fetch(fetchOptions); diff --git a/src/components/ui/VnFilterPanel.vue b/src/components/ui/VnFilterPanel.vue index 9eff3d322..16217946b 100644 --- a/src/components/ui/VnFilterPanel.vue +++ b/src/components/ui/VnFilterPanel.vue @@ -10,7 +10,7 @@ const { t } = useI18n(); const $props = defineProps({ modelValue: { type: Object, - default: () => {} + default: () => {}, }, dataKey: { type: String, @@ -58,7 +58,14 @@ const $props = defineProps({ }, }); -const emit = defineEmits(['refresh', 'clear', 'search', 'init', 'remove']); +const emit = defineEmits([ + 'update:modelValue', + 'refresh', + 'clear', + 'search', + 'init', + 'remove', +]); const arrayData = useArrayData($props.dataKey, { exprBuilder: $props.exprBuilder, @@ -67,9 +74,9 @@ const arrayData = useArrayData($props.dataKey, { }); const route = useRoute(); const store = arrayData.store; -const userParams = ref({}) +const userParams = ref({}); onMounted(() => { - userParams.value = $props.modelValue ?? {} + userParams.value = $props.modelValue ?? {}; emit('init', { params: userParams.value }); }); @@ -92,6 +99,11 @@ watch( (val) => setUserParams(val) ); +watch( + () => $props.modelValue, + (val) => (userParams.value = val ?? {}) +); + const isLoading = ref(false); async function search(evt) { if (evt && $props.disableSubmitEvent) return; @@ -145,6 +157,7 @@ async function clearFilters() { isLoading.value = false; emit('clear'); + emit('update:modelValue', userParams.value); } const tagsList = computed(() => { @@ -168,6 +181,7 @@ async function remove(key) { userParams.value[key] = undefined; search(); emit('remove', key); + emit('update:modelValue', userParams.value); } function formatValue(value) { diff --git a/src/pages/Customer/CustomerList.vue b/src/pages/Customer/CustomerList.vue index ccd53e8b2..32980bc29 100644 --- a/src/pages/Customer/CustomerList.vue +++ b/src/pages/Customer/CustomerList.vue @@ -65,6 +65,8 @@ const columns = computed(() => [ url: 'Workers/activeWithInheritedRole', fields: ['id', 'name'], where: { role: 'salesPerson' }, + optionFilter: 'firstName', + useLike: false, }, create: true, columnField: {