<template>
  <q-select
    v-model="model"
    :label="label"
    outlined
    clearable
    :options="ownersOptions"
    :loading="loading"
    option-label="name"
    emit-value
    map-options
  />
</template>

<script setup>
import { getOwners } from "src/api/owner";
import { onMounted, ref } from "vue";

const { label } = defineProps({
  label: {
    type: String,
    default: "Selecione um usuário",
  },
});

const model = defineModel();
const owners = ref([]);
const loading = ref(false);
const ownersOptions = ref([]);

const fetchOwners = async () => {
  try {
    loading.value = true;
    owners.value = await getOwners();
    ownersOptions.value = owners.value;
  } catch (error) {
    console.error("Erro ao carregar empreendimentos:", error);
  } finally {
    loading.value = false;
  }
};

onMounted(fetchOwners);

defineExpose({
  owner: owners,
  getOwnerById: (id) => owners.value.find((b) => b.id === id),
});
</script>
