<script setup>
const router = useRouter()
const printPreview = usePrintPreview()
const printParam = usePrintParam()

const props = defineProps({
  params: Object
})

const viewHandler = () => {
  router.push(`/procurements/invoices/${props.params.data.id}/view`)
}
const printHandler = () => {
  //router.push(`/procurements/invoices/${props.params.data.id}/print`)
  printParam.value = props.params.data
  printPreview.value = true
}
const editHandler = () => {
  router.push(`/procurements/invoices/${props.params.data.id}/edit`)
}
const deleteHandler = async () => {
  const confirmation = confirm('Are you sure want to delete this record?')
  if(confirmation) {
    await $fetch('/api/invoices/'+props.params.data.id, {
      method: 'DELETE',
      headers: useRequestHeaders(['cookie'])
    })
    location.reload()
  }
}
</script>

<template>
  <div class="p-1.5rem overflowY-auto h-100pct">
    <div class="columns mb-3">
      <div class="column is-full mb-3">
        <ProcurementsInvoiceDetailRecord action="view" :info="params.data" tab="invoice_line" />
      </div>
    </div>
  </div>
</template>

<style scoped>
@ref fs-28pt fs-18pt fw-bold justify-center mb-4;
</style>