diff --git a/spaces/pages/createDocument/edit/[[id]].vue b/spaces/pages/createDocument/edit/[[id]].vue
index c6d92e5..1b5d035 100644
--- a/spaces/pages/createDocument/edit/[[id]].vue
+++ b/spaces/pages/createDocument/edit/[[id]].vue
@@ -32,6 +32,7 @@ const itemInfo = ref({
   deliveryDate: dayjs(),
   deliveryDateType: "Lieferdatum",
   dateOfPerformance: null,
+  paymentDays: 7,
   createdBy: user.value.id,
   title: null,
   description: null,
@@ -287,7 +288,7 @@ const getDocumentData = () => {
     },
     title: itemInfo.value.title,
     description: itemInfo.value.description,
-    endText: templateEndText({zahlungsziel_in_tagen: 14}),
+    endText: templateEndText({zahlungsziel_in_tagen: itemInfo.value.paymentDays}),
     startText: templateStartText({vorname: contactData.firstName, nachname: contactData.lastName}),
     rows: rows,
     total: documentTotal.value
@@ -455,53 +456,73 @@ setupPage()
               <UFormGroup
                   label="Kunde:"
               >
-                <USelectMenu
-                    :options="dataStore.customers"
-                    option-attribute="name"
-                    value-attribute="id"
-                    :search-attributes="['name']"
-                    searchable
-                    searchable-placeholder="Suche..."
-                    v-model="itemInfo.customer"
-                    @change="setCustomerData"
-                >
-                  <UButton
-                      :color="itemInfo.customer ? 'primary' : 'rose'"
-                      variant="outline"
-                      class="flex-1 justify-between">
-                    {{dataStore.getCustomerById(itemInfo.customer) ? dataStore.getCustomerById(itemInfo.customer).name : "Kein Kunde ausgewählt"}}
+                <InputGroup>
+                  <USelectMenu
+                      :options="dataStore.customers"
+                      option-attribute="name"
+                      value-attribute="id"
+                      :search-attributes="['name']"
+                      searchable
+                      searchable-placeholder="Suche..."
+                      v-model="itemInfo.customer"
+                      @change="setCustomerData"
+                      class="flex-auto"
+                  >
+                    <UButton
+                        :color="itemInfo.customer ? 'primary' : 'rose'"
+                        variant="outline"
+                        class="flex-1 justify-between">
+                      {{dataStore.getCustomerById(itemInfo.customer) ? dataStore.getCustomerById(itemInfo.customer).name : "Kein Kunde ausgewählt"}}
+
+                      <UIcon name="i-heroicons-chevron-right-20-solid" class="w-5 h-5 transition-transform text-gray-400 dark:text-gray-500" :class="['transform rotate-90']" />
+                    </UButton>
+                    <!--                    <template #label>
+                                          {{dataStore.getCustomerById(itemInfo.customer) ? dataStore.getCustomerById(itemInfo.customer).name : "Kein Kunde ausgewählt"}}
+                                        </template>-->
+                  </USelectMenu>
+                  <UButton
+                      variant="outline"
+                      v-if="itemInfo.customer"
+                      icon="i-heroicons-arrow-right-end-on-rectangle"
+                      @click="router.push(`/customers/show/${itemInfo.customer}`)"
+                  >Kunde</UButton>
+                </InputGroup>
 
-                    <UIcon name="i-heroicons-chevron-right-20-solid" class="w-5 h-5 transition-transform text-gray-400 dark:text-gray-500" :class="['transform rotate-90']" />
-                  </UButton>
-                  <!--                    <template #label>
-                                        {{dataStore.getCustomerById(itemInfo.customer) ? dataStore.getCustomerById(itemInfo.customer).name : "Kein Kunde ausgewählt"}}
-                                      </template>-->
-                </USelectMenu>
               </UFormGroup>
               <UFormGroup
                   label="Ansprechpartner:"
               >
-                <USelectMenu
-                    :options="dataStore.getContactsByCustomerId(itemInfo.customer)"
-                    option-attribute="fullName"
-                    value-attribute="id"
-                    :search-attributes="['name']"
-                    searchable
-                    searchable-placeholder="Suche..."
-                    v-model="itemInfo.contact"
-                >
-                  <UButton
-                      :color="itemInfo.contact ? 'primary' : 'rose'"
-                      variant="outline"
-                      class="flex-1 justify-between">
-                    {{dataStore.getContactById(itemInfo.contact) ? dataStore.getContactById(itemInfo.contact).fullName : "Kein Kontakt ausgewählt"}}
+                <InputGroup>
+                  <USelectMenu
+                      :options="dataStore.getContactsByCustomerId(itemInfo.customer)"
+                      option-attribute="fullName"
+                      value-attribute="id"
+                      :search-attributes="['name']"
+                      searchable
+                      searchable-placeholder="Suche..."
+                      v-model="itemInfo.contact"
+                      class="flex-auto"
+                  >
+                    <UButton
+                        :color="itemInfo.contact ? 'primary' : 'rose'"
+                        variant="outline"
+                        class="flex-1 justify-between">
+                      {{dataStore.getContactById(itemInfo.contact) ? dataStore.getContactById(itemInfo.contact).fullName : "Kein Kontakt ausgewählt"}}
+
+                      <UIcon name="i-heroicons-chevron-right-20-solid" class="w-5 h-5 transition-transform text-gray-400 dark:text-gray-500" :class="['transform rotate-90']" />
+                    </UButton>
+                    <template #label>
+                      {{dataStore.getContactById(itemInfo.contact) ? dataStore.getContactById(itemInfo.contact).fullName : "Kein Kontakt ausgewählt"}}
+                    </template>
+                  </USelectMenu>
+                  <UButton
+                      variant="outline"
+                      v-if="itemInfo.contact"
+                      icon="i-heroicons-arrow-right-end-on-rectangle"
+                      @click="router.push(`/contacts/show/${itemInfo.contact}`)"
+                  >Kontakt</UButton>
+                </InputGroup>
 
-                    <UIcon name="i-heroicons-chevron-right-20-solid" class="w-5 h-5 transition-transform text-gray-400 dark:text-gray-500" :class="['transform rotate-90']" />
-                  </UButton>
-                  <template #label>
-                    {{dataStore.getContactById(itemInfo.contact) ? dataStore.getContactById(itemInfo.contact).fullName : "Kein Kontakt ausgewählt"}}
-                  </template>
-                </USelectMenu>
               </UFormGroup>
 
               <UFormGroup
@@ -544,46 +565,67 @@ setupPage()
                 />
               </UFormGroup>
 
+              <InputGroup class="w-full">
+                <UFormGroup
+                    label="Datum:"
+                >
+                  <UPopover :popper="{ placement: 'bottom-start' }">
+                    <UButton
+                        icon="i-heroicons-calendar-days-20-solid"
+                        :label="itemInfo.documentDate ? dayjs(itemInfo.documentDate).format('DD.MM.YYYY') : 'Datum auswählen'"
+                        variant="outline"
+                    />
 
-              <UFormGroup
-                  label="Datum:"
-              >
-                <UPopover :popper="{ placement: 'bottom-start' }">
-                  <UButton
-                      icon="i-heroicons-calendar-days-20-solid"
-                      :label="itemInfo.documentDate ? dayjs(itemInfo.documentDate).format('DD.MM.YYYY') : 'Datum auswählen'"
-                      variant="outline"
+                    <template #panel="{ close }">
+                      <LazyDatePicker v-model="itemInfo.documentDate" @close="close" />
+                    </template>
+                  </UPopover>
+                </UFormGroup>
+                <UFormGroup
+                    class="mt-3 w-80"
+                    label="Lieferdatumsart:"
+                >
+                  <USelectMenu
+                      :options="['Lieferdatum'/*,'Lieferzeitraum'*/,'Leistungsdatum'/*,'Leistungszeitraum'*/,'Kein Lieferdatum anzeigen']"
+                      v-model="itemInfo.deliveryDateType"
+                      class="mb-2"
                   />
 
-                  <template #panel="{ close }">
-                    <LazyDatePicker v-model="itemInfo.documentDate" @close="close" />
-                  </template>
-                </UPopover>
-              </UFormGroup>
 
+                </UFormGroup>
+                <UFormGroup
+                  :label="itemInfo.deliveryDateType"
+                >
+                  <UPopover :popper="{ placement: 'bottom-start' }">
+                    <UButton
+                        icon="i-heroicons-calendar-days-20-solid"
+                        :label="itemInfo.deliveryDate ? dayjs(itemInfo.deliveryDate).format('DD.MM.YYYY') : 'Datum auswählen'"
+                        variant="outline"
+                    />
 
+                    <template #panel="{ close }">
+                      <LazyDatePicker v-model="itemInfo.deliveryDate" @close="close" />
+                    </template>
+                  </UPopover>
+                </UFormGroup>
 
-
-              <UFormGroup
-                  class="mt-3"
-              >
-                <USelectMenu
-                    :options="['Lieferdatum'/*,'Lieferzeitraum'*/,'Leistungsdatum'/*,'Leistungszeitraum'*/,'Kein Lieferdatum anzeigen']"
-                    v-model="itemInfo.deliveryDateType"
-                    class="mb-2"
-                />
-                <UPopover :popper="{ placement: 'bottom-start' }">
-                  <UButton
-                      icon="i-heroicons-calendar-days-20-solid"
-                      :label="itemInfo.deliveryDate ? dayjs(itemInfo.deliveryDate).format('DD.MM.YYYY') : 'Datum auswählen'"
-                      variant="outline"
+                <UFormGroup
+                  label="Zahlungziel in Tagen:"
+                  class="flex-auto"
+                >
+                  <UInput
+                    type="number"
+                    v-model="itemInfo.paymentDays"
                   />
+                </UFormGroup>
+              </InputGroup>
+
+
+
+
+
+
 
-                  <template #panel="{ close }">
-                    <LazyDatePicker v-model="itemInfo.deliveryDate" @close="close" />
-                  </template>
-                </UPopover>
-              </UFormGroup>
               <UFormGroup
                   label="Ansprechpartner:"
               >