<script setup lang="ts">
const isOpen = ref(false)

const state = reactive({
  total_votes: 2,
})

const { refresh: onClick, status } = useFetch<any>(`admin/add-total-votes-all`, {
  method: 'POST',
  body: state,
  immediate: false,
  watch: false,
  async onResponse({ response }) {
    if (response.ok) {
      useToast().add({
        icon: 'i-heroicons-check-circle-solid',
        title: 'Es wurden allen Nutzern 2 Votes hinzugefügt.',
        color: 'emerald',
      })
    }

    isOpen.value = false
  },
})
</script>

<template>
  <UButton icon="i-heroicons-check-circle" solid label="Nutzern Votes hinzufügen" @click="isOpen = true" />
  <UDashboardModal
    v-model="isOpen"
    title="Votes hinzufügen"
    description="Bist du dir sicher das du jedem Benutzer 2 Votes geben möchtest?"
    icon="i-heroicons-check-circle"
    :ui="{
      icon: { base: 'text-primary dark:text-primary-400' } as any,
      footer: { base: 'ml-16' } as any,
    }"
  >
    <template #footer>
      <UButton color="primary" label="Bestätigen" :loading="status === 'pending'" @click="onClick" />
      <UButton color="white" label="Abbrechen" @click="isOpen = false" />
    </template>
  </UDashboardModal>
</template>

<style scoped>

</style>
