diff --git a/src/components/LeftMenuItem.vue b/src/components/LeftMenuItem.vue index ab74c1de5..a3112b17f 100644 --- a/src/components/LeftMenuItem.vue +++ b/src/components/LeftMenuItem.vue @@ -44,7 +44,6 @@ const itemComputed = computed(() => { - diff --git a/src/components/common/VnInput.vue b/src/components/common/VnInput.vue index 1246eedcd..f389ca842 100644 --- a/src/components/common/VnInput.vue +++ b/src/components/common/VnInput.vue @@ -130,4 +130,30 @@ const mixinRules = [ .q-field__append { padding-inline: 0; } + +.q-field__append.q-field__marginal.row.no-wrap.items-center.row { + height: 20px; +} +.q-field--outlined .q-field__append.q-field__marginal.row.no-wrap.items-center.row { + height: auto; +} +.q-field__control { + height: unset; +} +.q-field__control.relative-position.row.no-wrap + > .q-field__control-container + > input.q-field__native + ~ div.q-field__label { + height: 41px; +} + +.q-field--labeled { + .q-field__native, + .q-field__prefix, + .q-field__suffix, + .q-field__input { + padding-bottom: 0; + min-height: 15px; + } +} diff --git a/src/components/common/VnLocation.vue b/src/components/common/VnLocation.vue index e5ed14a40..633d32b85 100644 --- a/src/components/common/VnLocation.vue +++ b/src/components/common/VnLocation.vue @@ -12,14 +12,43 @@ const props = defineProps({ default: null, }, }); +const formatLocation = (obj, properties) => { + const parts = properties.map((prop) => { + if (typeof prop === 'string') { + return obj[prop]; + } else if (typeof prop === 'function') { + return prop(obj); + } + return null; + }); + + const filteredParts = parts.filter( + (part) => part !== null && part !== undefined && part !== '' + ); + + return filteredParts.join(', '); +}; + +const locationProperties = [ + 'postcode', + (obj) => + obj.city + ? `${obj.city}${obj.province?.name ? `(${obj.province.name})` : ''}` + : null, + (obj) => obj.country?.name, +]; const modelValue = ref( - props.location - ? `${props.location?.postcode}, ${props.location?.city}(${props.location?.province?.name}), ${props.location?.country?.name}` - : null + props.location ? formatLocation(props.location, locationProperties) : null ); function showLabel(data) { - return `${data.code}, ${data.town}(${data.province}), ${data.country}`; + const dataProperties = [ + 'code', + (obj) => (obj.town ? `${obj.town}(${obj.province})` : null), + 'country', + ]; + return formatLocation(data, dataProperties); } + const handleModelValue = (data) => { emit('update:model-value', data); }; diff --git a/src/components/common/VnSelect.vue b/src/components/common/VnSelect.vue index aa629767d..84ab4b4b6 100644 --- a/src/components/common/VnSelect.vue +++ b/src/components/common/VnSelect.vue @@ -283,4 +283,15 @@ const getVal = (val) => ($props.useLike ? { like: `%${val}%` } : val); .q-field--outlined { max-width: 100%; } +.q-field__inner { + .q-field__control { + min-height: auto !important; + + display: flex; + align-items: flex-end; + .q-field__native.row { + min-height: auto !important; + } + } +} diff --git a/src/components/ui/VnFilterPanel.vue b/src/components/ui/VnFilterPanel.vue index ef07b7bef..43d634ad9 100644 --- a/src/components/ui/VnFilterPanel.vue +++ b/src/components/ui/VnFilterPanel.vue @@ -3,7 +3,6 @@ import { onMounted, ref, computed, watch } from 'vue'; import { useI18n } from 'vue-i18n'; import { useArrayData } from 'composables/useArrayData'; import { useRoute } from 'vue-router'; -import { date } from 'quasar'; import toDate from 'filters/toDate'; import VnFilterPanelChip from 'components/ui/VnFilterPanelChip.vue'; @@ -59,7 +58,6 @@ const $props = defineProps({ }); defineExpose({ search, sanitizer }); - const emit = defineEmits([ 'update:modelValue', 'refresh', @@ -114,9 +112,9 @@ watch( ); const isLoading = ref(false); -async function search() { +async function search(evt) { try { - if ($props.disableSubmitEvent) return; + if (evt && $props.disableSubmitEvent) return; store.filter.where = {}; isLoading.value = true; @@ -167,7 +165,7 @@ const tagsList = computed(() => { for (const key of Object.keys(userParams.value)) { const value = userParams.value[key]; if (value == null || ($props.hiddenTags || []).includes(key)) continue; - tagList.push({ label: aliasField(key), value }); + tagList.push({ label: key, value }); } return tagList; }); @@ -187,7 +185,6 @@ async function remove(key) { } function formatValue(value) { - if (value instanceof Date) return date.formatDate(value, 'DD/MM/YYYY'); if (typeof value === 'boolean') return value ? t('Yes') : t('No'); if (isNaN(value) && !isNaN(Date.parse(value))) return toDate(value); @@ -203,11 +200,6 @@ function sanitizer(params) { } return params; } - -function aliasField(field) { - const split = field.split('.'); - return split[1] ?? split[0]; -}