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

const $props = defineProps({
    row: {
        type: [Object],
        default: null,
    },
    find: {
        type: [String, Object],
        default: null,
        description: 'search in row to add default options',
    },
});
const options = ref([]);

onBeforeMount(async () => {
    const { url, optionValue, optionLabel } = useAttrs();
    const findBy = $props.find ?? url?.charAt(0)?.toLocaleLowerCase() + url?.slice(1, -1);
    if (!findBy || !$props.row) return;
    // is object
    if (typeof findBy == 'object') {
        const { value, label } = findBy;
        if (!$props.row[value] || !$props.row[label]) return;
        return (options.value = [
            {
                [optionValue ?? 'id']: $props.row[value],
                [optionLabel ?? 'name']: $props.row[label],
            },
        ]);
    }
    // is string
    if ($props.row[findBy]) options.value = [$props.row[findBy]];
});
</script>
<template>
    <VnSelect v-bind="$attrs" :options="$attrs.options ?? options" />
</template>
