Updated NewOrderItem component to set default state to 'draft' and added an optional section for shipment details.

New actions for editing, canceling edits, finishing edits, and deleting items, along with visibility and disabled states based on item status.

src/components/Dashboard/Inventory/OrderItems/NewOrderItem.jsx

@@ -8,7 +8,12 @@ const NewOrderItem = ({ onOk, reset, defaultValues }) => {
     <NewObjectForm
       type={'orderItem'}
       reset={reset}
-      defaultValues={{ syncAmount: null, quantity: 1, ...defaultValues }}
+      defaultValues={{
+        state: { type: 'draft' },
+        syncAmount: null,
+        quantity: 1,
+        ...defaultValues
+      }}
     >
       {({ handleSubmit, submitLoading, objectData, formValid }) => {
         const steps = [
@@ -54,6 +59,23 @@ const NewOrderItem = ({ onOk, reset, defaultValues }) => {
               />
             )
           },
+          {
+            title: 'Optional',
+            key: 'optional',
+            content: (
+              <ObjectInfo
+                type='orderItem'
+                column={1}
+                bordered={false}
+                isEditing={true}
+                required={false}
+                objectData={objectData}
+                visibleProperties={{
+                  shipment: true
+                }}
+              />
+            )
+          },
           {
             title: 'Summary',
             key: 'summary',
@@ -65,7 +87,8 @@ const NewOrderItem = ({ onOk, reset, defaultValues }) => {
                 visibleProperties={{
                   _id: false,
                   createdAt: false,
-                  updatedAt: false
+                  updatedAt: false,
+                  _reference: false
                 }}
                 isEditing={false}
                 objectData={objectData}

src/database/models/OrderItem.js

@@ -1,5 +1,9 @@
 import OrderItemIcon from '../../components/Icons/OrderItemIcon'
 import InfoCircleIcon from '../../components/Icons/InfoCircleIcon'
+import EditIcon from '../../components/Icons/EditIcon'
+import BinIcon from '../../components/Icons/BinIcon'
+import CheckIcon from '../../components/Icons/CheckIcon'
+import XMarkIcon from '../../components/Icons/XMarkIcon'
 
 export const OrderItem = {
   name: 'orderItem',
@@ -14,6 +18,63 @@ export const OrderItem = {
       row: true,
       icon: InfoCircleIcon,
       url: (_id) => `/dashboard/inventory/orderitems/info?orderItemId=${_id}`
+    },
+    {
+      name: 'edit',
+      label: 'Edit',
+      type: 'button',
+      icon: EditIcon,
+      url: (_id) =>
+        `/dashboard/inventory/orderitems/info?orderItemId=${_id}&action=edit`,
+      visible: (objectData) => {
+        return !(objectData?._isEditing && objectData?._isEditing == true)
+      },
+      disabled: (objectData) => {
+        return objectData?.state?.type != 'draft'
+      }
+    },
+    {
+      name: 'cancelEdit',
+      label: 'Cancel Edit',
+      type: 'button',
+      icon: XMarkIcon,
+      url: (_id) =>
+        `/dashboard/inventory/orderitems/info?orderItemId=${_id}&action=cancelEdit`,
+      visible: (objectData) => {
+        return objectData?._isEditing && objectData?._isEditing == true
+      },
+      disabled: (objectData) => {
+        return objectData?.state?.type != 'draft'
+      }
+    },
+    {
+      name: 'finishEdit',
+      label: 'Finish Edit',
+      type: 'button',
+      icon: CheckIcon,
+      url: (_id) =>
+        `/dashboard/inventory/orderitems/info?orderItemId=${_id}&action=finishEdit`,
+      visible: (objectData) => {
+        return objectData?._isEditing && objectData?._isEditing == true
+      },
+      disabled: (objectData) => {
+        return objectData?.state?.type != 'draft'
+      }
+    },
+    {
+      name: 'delete',
+      label: 'Delete',
+      type: 'button',
+      icon: BinIcon,
+      danger: true,
+      url: (_id) =>
+        `/dashboard/inventory/orderitems/info?orderItemId=${_id}&action=delete`,
+      visible: (objectData) => {
+        return !(objectData?._isEditing && objectData?._isEditing == true)
+      },
+      disabled: (objectData) => {
+        return objectData?.state?.type != 'draft'
+      }
     }
   ],
   group: [],
@@ -21,7 +82,8 @@ export const OrderItem = {
   sorters: ['createdAt', 'updatedAt', 'itemAmount', 'quantity'],
   columns: [
     '_id',
-
+    '_reference',
+    'state',
     'itemType',
     'item',
     'itemAmount',
@@ -30,6 +92,7 @@ export const OrderItem = {
     'taxRate',
     'totalAmountWithTax',
     'order',
+    'shipment',
     'createdAt',
     'updatedAt'
   ],
@@ -88,7 +151,16 @@ export const OrderItem = {
       type: 'object',
       objectType: 'shipment',
       showHyperlink: true,
-      required: true
+      required: false,
+      columnWidth: 250,
+      readOnly: (objectData) => {
+        return objectData?.state?.type != 'draft'
+      },
+      masterFilter: (objectData) => {
+        return {
+          order: objectData?.order?._id
+        }
+      }
     },
     {
       name: 'itemType',
@@ -96,7 +168,7 @@ export const OrderItem = {
       type: 'objectType',
       masterFilter: ['part', 'packaging', 'filament'],
       required: true,
-      columnWidth: 125
+      columnWidth: 175
     },
     {
       name: 'item',