Fix for Object Create from Customer

frontend/components/EntityEdit.vue

@@ -29,7 +29,6 @@ const props = defineProps({
 
 const emit = defineEmits(["returnData"])
 
-
 const {type} = props
 
 defineShortcuts({
@@ -53,11 +52,10 @@ const route = useRoute()
 const dataStore = useDataStore()
 const modal = useModal()
 
-
 const dataType = dataStore.dataTypes[type]
 const openTab = ref(0)
 const item = ref(JSON.parse(props.item))
-console.log(item.value)
+// console.log(item.value)
 
 const oldItem = ref(null)
 const generateOldItemData = () => {
@@ -66,6 +64,39 @@ const generateOldItemData = () => {
 generateOldItemData()
 
 
+// --- ÄNDERUNG START: Computed Property statt Watcher/Function ---
+// Dies berechnet den Status automatisch neu, egal woher die Daten kommen (Init oder User-Eingabe)
+const saveAllowed = computed(() => {
+  if (!item.value) return false
+
+  let allowedCount = 0
+  // Nur Input-Felder berücksichtigen
+  const relevantColumns = dataType.templateColumns.filter(i => i.inputType)
+
+  relevantColumns.forEach(datapoint => {
+    if(datapoint.required) {
+      if(datapoint.key.includes(".")){
+        const [parentKey, childKey] = datapoint.key.split('.')
+        // Prüfung: Existiert Parent UND ist Child "truthy" (nicht null/undefined/empty)
+        if(item.value[parentKey] && item.value[parentKey][childKey]) {
+          allowedCount += 1
+        }
+      } else {
+        if(item.value[datapoint.key]) {
+          allowedCount += 1
+        }
+      }
+    } else {
+      // Wenn nicht required, zählt es immer als "erlaubt"
+      allowedCount += 1
+    }
+  })
+
+  return allowedCount >= relevantColumns.length
+})
+// --- ÄNDERUNG ENDE ---
+
+
 const setupCreate = () => {
   dataType.templateColumns.forEach(datapoint => {
     if(datapoint.key.includes(".")){
@@ -78,10 +109,7 @@ const setupCreate = () => {
       } else {
         item.value[datapoint.key] = {}
       }
-
-
     }
-
   })
 }
 setupCreate()
@@ -91,7 +119,6 @@ const setupQuery = () => {
   console.log(props.mode)
   if(props.mode === "create" && (route.query || props.createQuery)) {
 
-
     let data = !props.inModal ? route.query : props.createQuery
 
     Object.keys(data).forEach(key => {
@@ -127,13 +154,10 @@ const setupQuery = () => {
           } else {
             item.value[holder] = [id]
           }
-
-
         })
-
-
       }
     })
+    // calcSaveAllowed() -> Entfernt, da computed automatisch reagiert
   }
 }
 setupQuery()
@@ -166,40 +190,16 @@ loadOptions()
 
 const contentChanged = (content, datapoint) => {
   if (datapoint.key.includes(".")) {
-    item[datapoint.key.split('.')[0]][datapoint.key.split('.')[1]].html = content.html
+    item.value[datapoint.key.split('.')[0]][datapoint.key.split('.')[1]].html = content.html
-    item[datapoint.key.split('.')[0]][datapoint.key.split('.')[1]].text = content.text
+    item.value[datapoint.key.split('.')[0]][datapoint.key.split('.')[1]].text = content.text
-    item[datapoint.key.split('.')[0]][datapoint.key.split('.')[1]].json = content.json
+    item.value[datapoint.key.split('.')[0]][datapoint.key.split('.')[1]].json = content.json
   } else {
-    item[datapoint.key].html = content.html
+    item.value[datapoint.key].html = content.html
-    item[datapoint.key].text = content.text
+    item.value[datapoint.key].text = content.text
-    item[datapoint.key].json = content.json
+    item.value[datapoint.key].json = content.json
   }
 }
 
-const saveAllowed = ref(false)
-const calcSaveAllowed = (item) => {
-  let allowedCount = 0
-
-  dataType.templateColumns.filter(i => i.inputType).forEach(datapoint => {
-    if(datapoint.required) {
-
-      if(datapoint.key.includes(".")){
-        if(item[datapoint.key.split('.')[0]][datapoint.key.split('.')[1]]) allowedCount += 1
-      } else {
-        if(item[datapoint.key]) allowedCount += 1
-      }
-    } else {
-      allowedCount += 1
-    }
-  })
-
-  saveAllowed.value = allowedCount >= dataType.templateColumns.filter(i => i.inputType).length
-}
-//calcSaveAllowed()
-
-watch(item.value, async (newItem, oldItem) => {
-  calcSaveAllowed(newItem)
-})
 
 const createItem = async () => {
   let ret = null
@@ -226,11 +226,7 @@ const updateItem = async () => {
     ret = await useEntities(type).update(item.value.id, item.value)
     emit('returnData', ret)
   }
-
-
 }
-
-
 </script>
 
 <template>
@@ -245,9 +241,8 @@ const updateItem = async () => {
       <UButton
           icon="i-heroicons-chevron-left"
           variant="outline"
-          @click="router.back()/*router.push(`/standardEntity/${type}`)*/"
+          @click="router.back()"
       >
-<!--        {{dataType.label}}-->
       </UButton>
     </template>
     <template #center>
@@ -332,10 +327,6 @@ const updateItem = async () => {
         >
           <UDivider>{{ columnName }}</UDivider>
 
-          <!--
-           Die Form Group darf nur in der ersten bearbeitet werden und muss dann runterkopiert werden
-           -->
-
           <div
               v-for="datapoint in dataType.templateColumns.filter(i => i.inputType && i.inputColumn === columnName)"
           >
@@ -436,7 +427,6 @@ const updateItem = async () => {
                     />
                   </template>
                 </UPopover>
-                <!-- TODO: DISABLED FOR TIPTAP -->
                 <Tiptap
                     v-else-if="datapoint.inputType === 'editor'"
                     @updateContent="(i) => contentChanged(i,datapoint)"
@@ -537,7 +527,6 @@ const updateItem = async () => {
                     />
                   </template>
                 </UPopover>
-                <!-- TODO: Color/Required for TipTap and MaterialComposing -->
                 <Tiptap
                     v-else-if="datapoint.inputType === 'editor'"
                     @updateContent="(i) => contentChanged(i,datapoint)"
@@ -562,35 +551,8 @@ const updateItem = async () => {
                     icon="i-heroicons-x-mark"
                 />
               </InputGroup>
-              <!--        <div
-                          v-if="profileStore.ownTenant.ownFields"
-                      >
-                        <UDivider
-                            class="mt-3"
-                        >Eigene Felder</UDivider>
-
-                        <UFormGroup
-                            v-for="field in profileStore.ownTenant.ownFields.contracts"
-                            :key="field.key"
-                            :label="field.label"
-                        >
-                          <UInput
-                              v-if="field.type === 'text'"
-                              v-model="item.ownFields[field.key]"
-                          />
-                          <USelectMenu
-                              v-else-if="field.type === 'select'"
-                              :options="field.options"
-                              v-model="item.ownFields[field.key]"
-                          />
-                        </UFormGroup>
-                      </div>-->
-
             </UFormGroup>
           </div>
-
-
-
         </div>
       </div>
       <UFormGroup
@@ -690,7 +652,6 @@ const updateItem = async () => {
               />
             </template>
           </UPopover>
-          <!-- TODO: DISABLED FOR TIPTAP -->
           <Tiptap
               v-else-if="datapoint.inputType === 'editor'"
               @updateContent="(i) => contentChanged(i,datapoint)"
@@ -791,7 +752,6 @@ const updateItem = async () => {
               />
             </template>
           </UPopover>
-          <!-- TODO: Color/Required for TipTap and MaterialComposing -->
           <Tiptap
               v-else-if="datapoint.inputType === 'editor'"
               @updateContent="(i) => contentChanged(i,datapoint)"
@@ -816,30 +776,6 @@ const updateItem = async () => {
               icon="i-heroicons-x-mark"
           />
         </InputGroup>
-<!--        <div
-            v-if="profileStore.ownTenant.ownFields"
-        >
-          <UDivider
-              class="mt-3"
-          >Eigene Felder</UDivider>
-
-          <UFormGroup
-              v-for="field in profileStore.ownTenant.ownFields.contracts"
-              :key="field.key"
-              :label="field.label"
-          >
-            <UInput
-                v-if="field.type === 'text'"
-                v-model="item.ownFields[field.key]"
-            />
-            <USelectMenu
-                v-else-if="field.type === 'select'"
-                :options="field.options"
-                v-model="item.ownFields[field.key]"
-            />
-          </UFormGroup>
-        </div>-->
-
       </UFormGroup>
     </UForm>
   </UDashboardPanelContent>