<template>
    <div class="flex justify-center items-center">
        <UiButton
            class="text-xl uppercase bg-primary-500 text-white h-[50px] w-[272px]"
            :disabled="!hasCaseId"
            @click="printCaseReport"
        >
            Imprimer case {{ caseId || '-' }}
        </UiButton>
    </div>
</template>
<script setup lang="ts">
const route = useRoute()
const { printPdf } = usePdfPrinter()

const caseId = computed(() => Number(route.query.id))
const hasCaseId = computed(() => Number.isFinite(caseId.value) && caseId.value > 0)

const printCaseReport = async () => {
    if (!hasCaseId.value) {
        return
    }

    const filename = `tableau_poids_case_${caseId.value}.pdf`
    await printPdf(`/building_cases/${caseId.value}/weights-report`, filename)
}
</script>
