<script setup>
import { onBeforeMount, ref, useAttrs } from 'vue';
import axios from 'axios';
import VnSelect from 'components/common/VnSelect.vue';

const { schema, table, column, translation, defaultOptions } = defineProps({
    schema: {
        type: String,
        default: 'vn',
    },
    table: {
        type: String,
        required: true,
    },
    column: {
        type: String,
        required: true,
    },
    translation: {
        type: Function,
        default: null,
    },
    defaultOptions: {
        type: Array,
        default: () => [],
    },
});

const $attrs = useAttrs();
const options = ref([]);
onBeforeMount(async () => {
    options.value = [].concat(defaultOptions);
    const { data } = await axios.get(`Applications/get-enum-values`, {
        params: { schema, table, column },
    });

    for (const value of data)
        options.value.push({
            [$attrs['option-value'] ?? 'id']: value,
            [$attrs['option-label'] ?? 'name']: translation ? translation(value) : value,
        });
});
</script>

<template>
    <VnSelect
        v-bind="$attrs"
        :options="options"
        :key="options.length"
        :input-debounce="0"
    />
</template>
