<template>
  <q-select
    outlined
    v-model="value"
    dense
    :options="enumOptions"
    :label="label"
  />
</template>

<script setup>
import { ref, useAttrs, onMounted, computed } from 'vue';
import {QSelect} from 'quasar'

const props = defineProps(['modelValue']);
const emit = defineEmits(['update:modelValue']);

const value = computed({
  get() {
    return props.modelValue;
  },
  set(value) {
    emit('update:modelValue', value);
  },
});

const attrs = useAttrs();
const label = ref();
const enumOptions = ref();

onMounted(() => {
  if (attrs.title != '' && attrs.title != undefined) {
    label.value = attrs.title;
  } else if (attrs.description != null && attrs.description != undefined) {
    label.value = attrs.description;
  } else {
    label.value = 'No title';
  }

  if (attrs.enum != null || attrs.enum != undefined) {
    enumOptions.value = attrs.enum;
  }
});
</script>
