<template>
  <q-select
    v-model="model"
    label="Selecione serviço"
    outlined
    clearable
    :options="serviceOptions"
    :loading="loading"
    option-label="name"
    :error-message="'teste'"
    emit-value
    map-options
  />
</template>

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

const model = defineModel();
const services = ref([]);
const loading = ref(false);
const serviceOptions = ref([]);

const fetchBusiness = async () => {
  try {
    loading.value = true;
    services.value = await getAllServices();
    serviceOptions.value = services.value;
  } catch (error) {
    console.error("Erro ao carregar serviços:", error);
  } finally {
    loading.value = false;
  }
};

onMounted(fetchBusiness);
</script>
