<template>
  <div id="main">
    <div
      class="previewDoc"
    >
      <embed
        :src="fileurl"

      >
        {{documents}}
    </div>
    <div
      class="inputData"
    >
      <UFormGroup label="Lieferant:" required>
        <UInput />
      </UFormGroup>

      <UFormGroup label="Rechnungsreferenz:" required>
        <UInput />
      </UFormGroup>

      <UFormGroup label="Rechnungsdatum:" required>
        <UInput />
      </UFormGroup>

      <UButton @click="vendorInvoiceData.lineItems.push({})">+ Reihe</UButton>


      <div v-for="lineItem in vendorInvoiceData.lineItems" class="lineItemRow">
        <UFormGroup label="Text:" required>
          <UInput v-model="lineItem.text"/>
        </UFormGroup>
        <UFormGroup label="Produkt:" required>
          <UInput v-model="lineItem.productId"/>
        </UFormGroup>
        <UFormGroup label="Projekt:" required>
          <UInput v-model="lineItem.projectId"/>
        </UFormGroup>
        <UFormGroup label="Anzahl:" required>
          <UInput v-model="lineItem.quantity"/>
        </UFormGroup>
        <UFormGroup label="Einheit:" required>
          <UInput v-model="lineItem.unit"/>
        </UFormGroup>
        <UFormGroup label="Einzelpreis:" required>
          <UInput v-model="lineItem.unitPriceNet"/>
        </UFormGroup>
        <UFormGroup label="USt:" required>
          <UInput v-model="lineItem.vat"/>
        </UFormGroup>
        <UFormGroup label="Rabatt:" required>
          <UInput v-model="lineItem.discount"/>
        </UFormGroup>
        <UFormGroup label="Buchungskonto:" required>
          <UInput v-model="lineItem.skrAccountId"/>
        </UFormGroup>
        <UFormGroup label="Positionspreis:" required>
          <UInput disabled/>
        </UFormGroup>
      </div>
      {{vendorInvoiceData}}
    </div>
  </div>
</template>

<script setup>
const supabase = useSupabaseClient()
const route = useRoute()

const currentVendorInvoice = (await supabase.from('vendorInvoices').select().eq('id', route.params.id)).data
const document = (await supabase.from('documents').select().eq("id",18)).data[0]

console.log(currentVendorInvoice)
console.log(document)

let fileurl = (await supabase.storage.from('documents').createSignedUrl(document.path,60*60)).data.signedUrl


let vendorInvoiceData = ref({
  reference: "",
  date: "",
  vendorId: 0,
  lineItems: []
})






</script>

<style scoped>
#main {
  display: flex;
  flex-direction: row;
}

.previewDoc {
  width: 50vw;
  min-height: 80vh;
}

.previewDoc embed {
  width: 90%;
  height: 100%;
}

.inputData {

}




.lineItemRow {
  display: flex;
  flex-direction: row;
}
</style>