diff --git a/pages/createdletters/[mode]/[[id]].vue b/pages/createdletters/[mode]/[[id]].vue
new file mode 100644
index 0000000..147b7c1
--- /dev/null
+++ b/pages/createdletters/[mode]/[[id]].vue
@@ -0,0 +1,108 @@
+<script setup>
+import {useFunctions} from "~/composables/useFunctions.js";
+import dayjs from "dayjs";
+
+const profileStore = useProfileStore();
+
+const preloadedContent = ref("")
+const letterheads = ref([])
+const itemInfo = ref({
+  contentHTML: "",
+  contentJSON: {},
+  contentText: ""
+})
+const showDocument = ref(false)
+const uri = ref("")
+
+const setupPage = async () => {
+  letterheads.value = await useSupabaseSelect("letterheads","*")
+
+  preloadedContent.value = `<p></p><p></p><p></p>`
+}
+
+setupPage()
+
+const onChangeTab = (index) => {
+  if(index === 1) {
+    generateDocument()
+  }
+}
+
+const getDocumentData = () => {
+  /*const returnData = {
+    adressLine: `${businessInfo.name}, ${businessInfo.street}, ${businessInfo.zip} ${businessInfo.city}`,
+    recipient: [
+      customerData.name,
+      ... customerData.nameAddition ? [customerData.nameAddition] : [],
+      ... contactData ? [`${contactData.firstName} ${contactData.lastName}`] : [],
+      itemInfo.value.address.street,
+      ... itemInfo.value.address.special ? [itemInfo.value.address.special] : [],
+      `${itemInfo.value.address.zip} ${itemInfo.value.address.city}`,
+
+    ],
+  }*/
+
+  const returnData = {
+    adressLine: `Federspiel Technology UG, Am Schwarzen Brack 14, 26452 Sande`,
+    recipient: [
+      "Federspiel Technology",
+      "UG haftungsbeschränkt",
+      "Florian Federspiel",
+      "Am Schwarzen Brack 14",
+      "Zusatz",
+      "26452 Sande",
+    ],
+    contentJSON: itemInfo.value.contentJSON,
+  }
+
+  return returnData
+}
+
+const generateDocument = async () => {
+  const ownTenant = profileStore.ownTenant
+  const path = letterheads.value[0].path
+
+  uri.value = await useFunctions().useCreateLetterPDF(getDocumentData(), path)
+
+  showDocument.value = true
+}
+
+const contentChanged = (content) => {
+  itemInfo.value.contentHTML = content.html
+  itemInfo.value.contentJSON = content.json
+  itemInfo.value.contentText = content.text
+}
+</script>
+
+<template>
+  <UDashboardNavbar title="Anschreiben bearbeiten"/>
+  {{itemInfo}}
+  <UDashboardPanelContent>
+    <UTabs @change="onChangeTab" :items="[{label: 'Editor'},{label: 'Vorschau'}]">
+      <template #item="{item}">
+        <div v-if="item.label === 'Editor'">
+          <Tiptap
+              class="mt-3"
+              @updateContent="contentChanged"
+              :preloadedContent="preloadedContent"
+          />
+        </div>
+        <div v-else-if="item.label === 'Vorschau'">
+          <object
+              :data="uri"
+              v-if="showDocument"
+              type="application/pdf"
+              class="w-full previewDocumentMobile"
+          />
+        </div>
+      </template>
+    </UTabs>
+  </UDashboardPanelContent>
+
+</template>
+
+<style scoped>
+.previewDocumentMobile {
+  aspect-ratio: 1 / 1.414;
+}
+</style>
\ No newline at end of file
diff --git a/pages/standardEntity/[type]/[[mode]]/[[id]].vue b/pages/standardEntity/[type]/[[mode]]/[[id]].vue
index 113b77e..e5f4e4c 100644
--- a/pages/standardEntity/[type]/[[mode]]/[[id]].vue
+++ b/pages/standardEntity/[type]/[[mode]]/[[id]].vue
@@ -23,30 +23,29 @@ const items = ref([])
 const item = ref({})
 
 
-
-const setupPage = async (sort_column = null,sort_direction = null) => {
+const setupPage = async (sort_column = null, sort_direction = null) => {
   loaded.value = false
 
-  if(await useCapacitor().getIsPhone()) {
+  if (await useCapacitor().getIsPhone()) {
     setPageLayout("mobile")
   }
 
-  if(route.params.mode) mode.value = route.params.mode
+  if (route.params.mode) mode.value = route.params.mode
 
-  if(mode.value === "show") {
+  if (mode.value === "show") {
     //Load Data for Show
-    item.value = await useEntities(type).selectSingle(route.params.id,"*",true)
-  } else if(mode.value === "edit") {
+    item.value = await useEntities(type).selectSingle(route.params.id, "*", true)
+  } else if (mode.value === "edit") {
     //Load Data for Edit
     item.value = JSON.stringify(await useEntities(type).selectSingle(route.params.id))
 
-  }  else if(mode.value === "create") {
+  } else if (mode.value === "create") {
     //Load Data for Create
     item.value = JSON.stringify({})
     console.log(item.value)
-  } else if(mode.value === "list") {
+  } else if (mode.value === "list") {
     //Load Data for List
-    items.value = await useEntities(type).select(dataType.supabaseSelectWithInformation, sort_column || dataType.supabaseSortColumn , sort_direction === "asc")
+    items.value = await useEntities(type).select(dataType.supabaseSelectWithInformation, sort_column || dataType.supabaseSortColumn, sort_direction === "asc")
   }
 
   loaded.value = true