u

src/pages/lieferung/neu.jsx

@@ -26,6 +26,7 @@ import { requireArray, requireDefined, requireObject } from '../../utils/apiShap
 import { backendErrorFrom } from '../../utils/backendError';
 import { notifyError } from '../../utils/notify';
 import {
+  setId,
   setDeliveryEntities,
   setDate,
   setDeliveryEntity,
@@ -38,6 +39,7 @@ import {
   updateLineitem,
   removeLineitem,
   resetDelivery,
+  selectDeliveryId,
   selectDeliveryEntities,
   selectDeliveryDate,
   selectDeliveryEntity,
@@ -82,6 +84,9 @@ class LieferungNeuPage extends PureComponent {
     if (this.props.docId != null) {
       void this.loadEdit();
     } else {
+      if (this.props.deliveryId != null || this.props.number != null) {
+        this.props.resetDelivery();
+      }
       void this.loadPartiesOnly();
     }
   }
@@ -150,6 +155,7 @@ class LieferungNeuPage extends PureComponent {
       const lines =
         apiLines.length > 0 ? apiLines.map(lineFromApi) : [emptyLine()];
 
+      this.props.setId(doc.id ?? docId);
       this.props.setDate(dateInputValue(doc.date));
       if (doc[cfg.partyField] != null) this.props.setDeliveryEntity(doc[cfg.partyField]);
       if (doc.number != null) this.props.setNumber(doc.number);
@@ -191,10 +197,22 @@ class LieferungNeuPage extends PureComponent {
     this.props.setExternalNumber(externalNumber);
   }
 
+  findLineIndex(key) {
+    if (typeof key === 'number' && !Number.isNaN(key)) return key;
+    const lines = this.props.lines;
+    if (Array.isArray(lines)) {
+      const idx = lines.findIndex((l) => l.key === key);
+      if (idx !== -1) return idx;
+    }
+    const n = Number(key);
+    return Number.isInteger(n) ? n : -1;
+  }
+
   handleLineChange(key, field, value) {
-    const index = typeof key === 'number' ? key : Number(key);
+    const index = this.findLineIndex(key);
     this.props.updateLineitem({
       index,
+      key,
       [field]: value,
       ...(field === 'net' ? { netprice: value } : {}),
       ...(field === 'tax' ? { taxrate: value } : {}),
@@ -206,8 +224,8 @@ class LieferungNeuPage extends PureComponent {
   }
 
   handleRemoveLine(key) {
-    const index = typeof key === 'number' ? key : Number(key);
+    const index = this.findLineIndex(key);
-    this.props.removeLineitem(index);
+    this.props.removeLineitem(index >= 0 ? index : key);
   }
 
   async handlePdfUpload(file) {
@@ -268,7 +286,8 @@ class LieferungNeuPage extends PureComponent {
                 ? result.items.items
                 : null;
             const newLines = Array.isArray(rawItems)
-              ? rawItems.map((l) => ({
+              ? rawItems.map((l, idx) => ({
+                key: l.key ?? `${Date.now()}-${idx}-${Math.random().toString(36).slice(2, 8)}`,
                 name: l.name ?? l.articleName ?? null,
                 sku: l.sku ?? l.liefArtNr ?? '',
                 amount: (l.amount ?? l.count) != null ? String(l.amount ?? l.count) : '',
@@ -406,6 +425,7 @@ class LieferungNeuPage extends PureComponent {
         const apiLines = requireArray(doc.lines, `${cfg.docField}.lines`);
         const lines = apiLines.length > 0 ? apiLines.map(lineFromApi) : [emptyLine()];
 
+        this.props.setId(doc.id ?? docId);
         this.props.setDate(dateInputValue(doc.date));
         if (doc[cfg.partyField] != null) this.props.setDeliveryEntity(doc[cfg.partyField]);
         if (doc.number != null) this.props.setNumber(doc.number);
@@ -532,6 +552,7 @@ class LieferungNeuPage extends PureComponent {
 }
 
 const mapStateToProps = (state) => ({
+  deliveryId: selectDeliveryId(state),
   deliveryEntities: selectDeliveryEntities(state),
   date: selectDeliveryDate(state),
   partyId: selectDeliveryEntity(state),
@@ -542,6 +563,7 @@ const mapStateToProps = (state) => ({
 });
 
 const mapDispatchToProps = {
+  setId,
   setDeliveryEntities,
   setDate,
   setDeliveryEntity,

src/store/deliveryEditorSlice.js

@@ -3,6 +3,7 @@ import { createSlice } from '@reduxjs/toolkit';
 
 export function createEmptyLineitem(line = {}) {
   return {
+    key: line.key ?? `${Date.now()}-${Math.random().toString(36).slice(2, 8)}`,
     name: line.name ?? null,
     sku: line.sku ?? null,
     amount: line.amount ?? null,
@@ -14,6 +15,7 @@ export function createEmptyLineitem(line = {}) {
 }
 
 const initialDelivery = {
+  id: null,
   date: null,
   deliveryEntity: null,
   external_number: null,
@@ -34,6 +36,9 @@ const deliveryEditorSlice = createSlice({
   name: 'deliveryEditor',
   initialState,
   reducers: {
+    setId(state, action) {
+      state.delivery.id = action.payload;
+    },
     setDeliveryEntities(state, action) {
       state.deliveryEntities = action.payload ?? [];
     },
@@ -70,17 +75,28 @@ const deliveryEditorSlice = createSlice({
       state.delivery.lineitems.push(createEmptyLineitem(action.payload));
     },
     updateLineitem(state, action) {
-      const { index, ...fields } = action.payload;
+      const { index, key, ...fields } = action.payload;
-      if (index >= 0 && index < state.delivery.lineitems.length) {
+      let targetIndex = typeof index === 'number' && !Number.isNaN(index) ? index : -1;
-        state.delivery.lineitems[index] = {
+      if (targetIndex === -1 && key != null) {
-          ...state.delivery.lineitems[index],
+        targetIndex = state.delivery.lineitems.findIndex((l) => l.key === key);
+      }
+      if (targetIndex >= 0 && targetIndex < state.delivery.lineitems.length) {
+        state.delivery.lineitems[targetIndex] = {
+          ...state.delivery.lineitems[targetIndex],
           ...fields,
         };
       }
     },
     removeLineitem(state, action) {
-      const index = action.payload;
+      const payload = action.payload;
-      if (typeof index === 'number' && index >= 0 && index < state.delivery.lineitems.length) {
+      let index = typeof payload === 'number' && !Number.isNaN(payload) ? payload : -1;
+      if (index === -1 && payload != null) {
+        const key = typeof payload === 'string' ? payload : payload?.key;
+        if (key != null) {
+          index = state.delivery.lineitems.findIndex((l) => l.key === key);
+        }
+      }
+      if (index >= 0 && index < state.delivery.lineitems.length) {
         state.delivery.lineitems.splice(index, 1);
       }
     },
@@ -97,6 +113,7 @@ const deliveryEditorSlice = createSlice({
 });
 
 export const {
+  setId,
   setDeliveryEntities,
   setDelivery,
   setDate,
@@ -114,6 +131,7 @@ export const {
 } = deliveryEditorSlice.actions;
 
 // Selectors
+export const selectDeliveryId = (state) => state.deliveryEditor.delivery.id;
 export const selectDeliveryEntities = (state) => state.deliveryEditor.deliveryEntities;
 export const selectDelivery = (state) => state.deliveryEditor.delivery;
 export const selectDeliveryDate = (state) => state.deliveryEditor.delivery.date;