Display both 'allocated' and 'fulfilled' quantity values in salesorder table

InvenTree/order/serializers.py

@@ -553,7 +553,6 @@ class SOLineItemSerializer(InvenTreeModelSerializer):
     quantity = InvenTreeDecimalField()
 
     allocated = serializers.FloatField(source='allocated_quantity', read_only=True)
-    fulfilled = serializers.FloatField(source='fulfilled_quantity', read_only=True)
 
     shipped = InvenTreeDecimalField(read_only=True)
 
@@ -576,7 +575,6 @@ class SOLineItemSerializer(InvenTreeModelSerializer):
             'allocated',
             'allocations',
             'quantity',
-            'fulfilled',
             'reference',
             'notes',
             'order',

InvenTree/templates/js/translated/order.js

@@ -1918,7 +1918,7 @@ function loadSalesOrderLineItemTable(table, options={}) {
         */
         {
             sortable: true,
-            sortName: 'part__name',
+            sortName: 'part_detail.name',
             field: 'part',
             title: '{% trans "Part" %}',
             switchable: false,
@@ -2015,24 +2015,22 @@ function loadSalesOrderLineItemTable(table, options={}) {
                 },
             },
         );
-    }
 
         columns.push(
             {
                 field: 'allocated',
-            title: pending ? '{% trans "Allocated" %}' : '{% trans "Fulfilled" %}',
+                title: '{% trans "Allocated" %}',
                 switchable: false,
+                sortable: true,
                 formatter: function(value, row, index, field) {
-
+                        return makeProgressBar(row.allocated, row.quantity, {
-                var quantity = pending ? row.allocated : row.fulfilled;
-                return makeProgressBar(quantity, row.quantity, {
                         id: `order-line-progress-${row.pk}`,
                     });
                 },
                 sorter: function(valA, valB, rowA, rowB) {
     
-                var A = pending ? rowA.allocated : rowA.fulfilled;
+                    var A = rowA.allocated;
-                var B = pending ? rowB.allocated : rowB.fulfilled;
+                    var B = rowB.allocated;
     
                     if (A == 0 && B == 0) {
                         return (rowA.quantity > rowB.quantity) ? 1 : -1;
@@ -2044,11 +2042,39 @@ function loadSalesOrderLineItemTable(table, options={}) {
                     return (progressA < progressB) ? 1 : -1;
                 }
             },
+        );
+    }
+
+    columns.push({
+        field: 'shipped',
+        title: '{% trans "Shipped" %}',
+        switchable: false,
+        sortable: true,
+        formatter: function(value, row) {
+            return makeProgressBar(row.shipped, row.quantity, {
+                id: `order-line-shipped-${row.pk}`
+            });
+        },
+        sorter: function(valA, valB, rowA, rowB) {
+            var A = rowA.shipped;
+            var B = rowB.shipped;
+
+            if (A == 0 && B == 0) {
+                return (rowA.quantity > rowB.quantity) ? 1 : -1;
+            }
+
+            var progressA = parseFloat(A) / rowA.quantity;
+            var progressB = parseFloat(B) / rowB.quantity;
+
+            return (progressA < progressB) ? 1 : -1;
+        }
+    });
+
+    columns.push(
     {
         field: 'notes',
         title: '{% trans "Notes" %}',
-        },
+    });
-    );
 
     if (pending) {
         columns.push({
@@ -2230,7 +2256,7 @@ function loadSalesOrderLineItemTable(table, options={}) {
     $(table).inventreeTable({
         onPostBody: setupCallbacks,
         name: 'salesorderlineitems',
-        sidePagination: 'server',
+        sidePagination: 'client',
         formatNoMatches: function() {
             return '{% trans "No matching line items" %}';
         },
@@ -2246,7 +2272,7 @@ function loadSalesOrderLineItemTable(table, options={}) {
                 // Order is pending
                 return row.allocated > 0;
             } else {
-                return row.fulfilled > 0;
+                return row.shipped > 0;
             }
         },
         detailFormatter: function(index, row, element) {