<script lang="ts" setup name="DataTypeSelector">
const props = withDefaults(defineProps<{
  modelValue: number
}>(), {
  modelValue: 0,
})
const emit = defineEmits(['update:modelValue'])
interface DataType {
  dataTypeId: number
  dataTypeTitle: string
}
const dataTypeId = computed({
  get: () => {
    return props.modelValue
  },
  set: (val) => {
    emit('update:modelValue', val)
  },
})

const dataType = [
  { dataType: 0, dataName: '请选择' },
  { dataType: 1, dataName: '整数' },
  { dataType: 2, dataName: '字符串' },
  { dataType: 3, dataName: '浮点小数' },
  { dataType: 4, dataName: '日期' },
  { dataType: 5, dataName: '日期时间' },
]

const state = reactive({
  loading: false,
  dataList: dataType,
})

const getData = async () => {
}
onMounted(() => {
  getData ()
})
</script>

<template>
  <el-select v-model="dataTypeId" size="small" v-loading="state.loading" style="width: 100%" filterable placeholder="请选择数据类型" value-key="dataType">
    <el-option key="0" label="请选择" :value="0" disabled />
    <el-option
      v-for="item in dataType"
      :key="item.dataType"
      :label="item.dataName"
      :value="item.dataType"
    />
  </el-select>
</template>
