Extend document title levels

frontend/pages/createDocument/edit/[[id]].vue

@@ -108,6 +108,11 @@ const taxTypeItems = [
   { key: '19 UStG', label: '19 UStG Kleinunternehmer' },
   { key: '12.3 UStG', label: '12.3 UStG' }
 ]
+const titleLevelItems = [
+  { label: 'Titel Ebene 1', value: 1 },
+  { label: 'Untertitel Ebene 2', value: 2 },
+  { label: 'Untertitel Ebene 3', value: 3 }
+]
 const deliveryDateTypeItems = ['Lieferdatum', 'Lieferzeitraum', 'Leistungsdatum', 'Leistungszeitraum', 'Kein Lieferdatum anzeigen']
 const paymentTypeItems = [
   { key: 'transfer', label: 'Überweisung' },
@@ -832,6 +837,7 @@ const positionAddOptions = [
   { mode: 'free', label: 'Freie Position', icon: 'i-heroicons-pencil-square' },
   { mode: 'pagebreak', label: 'Seitenumbruch', icon: 'i-heroicons-document-minus' },
   { mode: 'title', label: 'Titel', icon: 'i-heroicons-bars-3-bottom-left' },
+  { mode: 'subtitle', label: 'Untertitel', icon: 'i-heroicons-list-bullet' },
   { mode: 'text', label: 'Text', icon: 'i-heroicons-document-text' }
 ]
 
@@ -895,10 +901,11 @@ const createPositionRow = (mode, taxPercentage) => {
     }
   }
 
-  if (mode === "title") {
+  if (mode === "title" || mode === "subtitle") {
     return {
       id: uuidv4(),
       mode: "title",
+      titleLevel: mode === "subtitle" ? 2 : 1,
       linkedEntitys: []
     }
   }
@@ -1152,12 +1159,10 @@ const documentTotal = computed(() => {
     if (row.mode === 'title') {
       let title = `${row.pos} - ${row.text}`
       titleSums[title] = 0
+      if (lastTitle) {
+        titleSumsTransfer[title] = transferCounter
+      }
       lastTitle = title
-
-      //Übertrag berechnen
-      titleSumsTransfer[Object.keys(titleSums)[row.pos - 2]] = transferCounter
-
-
     } else if (!['pagebreak', 'text'].includes(row.mode) && lastTitle !== "" && !row.optional && !row.alternative) {
       titleSums[lastTitle] = Number(titleSums[lastTitle]) + Number(Number(row.quantity) * Number(row.price) * (1 - Number(row.discountPercent) / 100))
       transferCounter += Number(Number(row.quantity) * Number(row.price) * (1 - Number(row.discountPercent) / 100))
@@ -1610,16 +1615,33 @@ const onChangeTab = (index) => {
 }
 
 const setPosNumbers = () => {
-  let mainIndex = 1
-  let subIndex = 1
+  let titleCounters = [0, 0, 0]
+  let positionIndex = 1
+  let currentTitlePath = []
+  const hasTitles = itemInfo.value.rows.some(row => row.mode === "title")
+
   let rows = itemInfo.value.rows.map(row => {
     if (row.mode === 'title') {
-      row.pos = mainIndex
-      mainIndex += 1
-      subIndex = 1
+      const titleLevel = Math.min(Math.max(Number(row.titleLevel) || 1, 1), titleCounters.length)
+      row.titleLevel = titleLevel
+
+      for (let index = 0; index < titleLevel - 1; index += 1) {
+        if (titleCounters[index] === 0) {
+          titleCounters[index] = 1
+        }
+      }
+
+      titleCounters[titleLevel - 1] += 1
+      for (let index = titleLevel; index < titleCounters.length; index += 1) {
+        titleCounters[index] = 0
+      }
+
+      currentTitlePath = titleCounters.slice(0, titleLevel)
+      row.pos = currentTitlePath.join(".")
+      positionIndex = 1
     } else if (!['pagebreak', 'title', 'text'].includes(row.mode)) {
-      row.pos = itemInfo.value.rows.filter(i => i.mode === "title").length === 0 ? `${subIndex}` : `${mainIndex - 1}.${subIndex}`
-      subIndex += 1
+      row.pos = hasTitles && currentTitlePath.length > 0 ? `${currentTitlePath.join(".")}.${positionIndex}` : `${positionIndex}`
+      positionIndex += 1
     }
 
     if (!row.id) {
@@ -3471,12 +3493,22 @@ const setRowData = async (row, service = {sellingPriceComposed: {}}, product = {
                       v-if="row.mode === 'title'"
                       :colspan="getTitlePositionColspan()"
                   >
-                    <UInput
-                        :disabled="itemInfo.type === 'cancellationInvoices'"
-                        v-model="row.text"
-                        placeholder="Titel"
-                        class="w-full"
-                    />
+                    <InputGroup class="w-full">
+                      <USelect
+                          :disabled="itemInfo.type === 'cancellationInvoices'"
+                          v-model="row.titleLevel"
+                          :items="titleLevelItems"
+                          value-key="value"
+                          class="w-44 shrink-0"
+                          @update:model-value="setPosNumbers"
+                      />
+                      <UInput
+                          :disabled="itemInfo.type === 'cancellationInvoices'"
+                          v-model="row.text"
+                          placeholder="Titel"
+                          class="w-full min-w-0"
+                      />
+                    </InputGroup>
                   </td>
                   <td>
                     <UDropdownMenu