index.vue 1.3 KB

1234567891011121314151617181920212223242526272829303132333435363738394041
  1. <template>
  2. <div :style="{ width: item.width ? item.width + 'px' : '100%' }">
  3. <v-combobox
  4. v-model="value"
  5. :rules="item.rules"
  6. :attach="!item.noAttach"
  7. :label="item.label"
  8. :placeholder="item.placeholder || item.label"
  9. :item-title="item.itemText || 'label'"
  10. :item-value="item.itemValue || 'value'"
  11. :items="item.items"
  12. variant="outlined"
  13. :density="item.dense || 'compact'"
  14. :clearable="item.clearable"
  15. :disabled="item.disabled"
  16. :return-object="item.returnObject || false"
  17. @update:search="search"
  18. @update:modelValue="modelValueUpDate"
  19. ></v-combobox>
  20. </div>
  21. </template>
  22. <script setup>
  23. import { ref } from 'vue';
  24. defineOptions({ name:'FormUI-v-combobox'})
  25. const props = defineProps({item: Object, modelValue: [String, Number]})
  26. const emit = defineEmits(['update:modelValue', 'change', 'search'])
  27. const item = props.item
  28. const value = ref(props.modelValue)
  29. const modelValueUpDate = (val) => {
  30. value.value = val
  31. emit('update:modelValue', value.value)
  32. // let obj = null // if (item.getObject) obj = item.items.find(e => e[item.itemValue] === value.value) || null
  33. emit('change', value.value)
  34. }
  35. const search = (val) => {
  36. emit('search', val)
  37. }
  38. </script>
  39. <style lang="scss" scoped>
  40. </style>