feat: refs #7936 add optionCaption

src/components/common/VnSelect.vue

@@ -4,6 +4,7 @@ import { useI18n } from 'vue-i18n';
 import { useArrayData } from 'src/composables/useArrayData';
 import { useRequired } from 'src/composables/useRequired';
 import dataByOrder from 'src/utils/dataByOrder';
+import { QItemLabel } from 'quasar';
 
 const emit = defineEmits(['update:modelValue', 'update:options', 'remove']);
 const $attrs = useAttrs();
@@ -33,6 +34,10 @@ const $props = defineProps({
         type: String,
         default: 'id',
     },
+    optionCaption: {
+        type: String,
+        default: null,
+    },
     optionFilter: {
         type: String,
         default: null,
@@ -373,13 +378,16 @@ function handleKeyDown(event) {
         </template>
         <template #option="{ opt, itemProps }">
             <QItem v-bind="itemProps">
-                <QItemSection>
-                    <QItemLabel v-if="opt[optionValue] == opt[optionLabel]">{{
-                        opt[optionLabel]
-                    }}</QItemLabel>
-                    <QItemLabel v-else>{{
-                        `#${opt[optionValue]} - ${opt[optionLabel]}`
-                    }}</QItemLabel>
+                <QItemSection v-if="opt[optionValue] == opt[optionLabel]">
+                    <QItemLabel>{{ opt[optionLabel] }}</QItemLabel>
+                </QItemSection>
+                <QItemSection v-else>
+                    <QItemLabel>
+                        {{ opt[optionLabel] }}
+                    </QItemLabel>
+                    <QItemLabel caption v-if="optionCaption !== false">
+                        {{ `#${opt[optionCaption] || opt[optionValue]}` }}
+                    </QItemLabel>
                 </QItemSection>
             </QItem>
         </template>