<script setup>
definePageMeta({
  middleware: "auth"
})

defineShortcuts({
  'backspace': () => {
    router.push("/createDocument")
  },
})


const dataStore = useDataStore()
const route = useRoute()
const router = useRouter()

const itemInfo = ref({})

const setupPage = () => {
  if(route.params) {
    if(route.params.id) itemInfo.value = dataStore.getCreatedDocumentById(Number(route.params.id))
  }
}

setupPage()
</script>

<template>
  <UDashboardNavbar
    title="Erstelltes Dokument anzeigen"
  >

  </UDashboardNavbar>
  <UDashboardToolbar>
    <template #left>
      <UButton
          @click="router.push(`/createDocument/edit/${itemInfo.id}`)"
      >
        Bearbeiten
      </UButton>
      <UButton
          :to="dataStore.documents.find(i => i.createdDocument === itemInfo.id) ? dataStore.documents.find(i => i.createdDocument === itemInfo.id).url : ''"
          target="_blank"
      >In neuen Tab anzeigen</UButton>
    </template>
  </UDashboardToolbar>

  <object
    :data="dataStore.documents.find(i => i.createdDocument === itemInfo.id) ? dataStore.documents.find(i => i.createdDocument === itemInfo.id).url : ''"
    class="h-full"
  />





<!--  <DocumentDisplay
    :document-data="dataStore.documents.find(i => i.createdDocument === itemInfo.id)"
  />-->

</template>

<style scoped>

</style>