OAM-210: Added unit/packs switch

src/stock-physical-inventory-draft/_physical-inventory-draft.scss

@@ -3,4 +3,8 @@
     flex-direction: row;
     gap: .5rem;
     align-items: center;
+
+    .units-package-switch {
+        @include flex-layout(row);
+    }
 }

src/stock-physical-inventory-draft/messages_en.json

@@ -1,5 +1,8 @@
 {
     "stockPhysicalInventoryDraft.addUnit": "Create unit",
     "stockPhysicalInventoryDraft.quantity": "Quantity",
-    "stockPhysicalInventoryDraft.unit": "Unit"
+    "stockPhysicalInventoryDraft.unit": "Unit",
+    "stockPhysicalInventoryDraft.packsQuantity": "Packs quantity",
+    "stockPhysicalInventoryDraft.doses": "Doses",
+    "stockPhysicalInventoryDraft.packs": "packs"
 }

src/stock-physical-inventory-draft/physical-inventory-draft.controller.js

@@ -257,6 +257,20 @@
          */
         vm.unitsOfOrderable = undefined;
 
+        vm.PACKS_DISPLAY_TYPE = 'packs';
+        vm.DOSES_DISPLAY_TYPE = 'doses';
+
+        /**
+         * @ngdoc property
+         * @propertyOf stock-physical-inventory-draft.controller:PhysicalInventoryDraftController
+         * @name activeDisplayType
+         * @type {string}
+         *
+         * @description
+         * Based on this the units are displayed
+         */
+        vm.activeDisplayType = vm.DOSES_DISPLAY_TYPE;
+
         /**
          * @ngdoc method
          * @methodOf stock-physical-inventory-draft.controller:PhysicalInventoryDraftController
@@ -272,6 +286,19 @@
             return messageService.get(VVM_STATUS.$getDisplayName(status));
         };
 
+        vm.setActiveDisplayType = function(displayType) {
+            if (displayType === vm.PACKS_DISPLAY_TYPE || displayType === vm.DOSES_DISPLAY_TYPE) {
+                vm.activeDisplayType = displayType;
+
+                if (displayType === vm.PACKS_DISPLAY_TYPE) {
+                    calculateItemsPacksQuantity();
+                }
+            } else {
+                // eslint-disable-next-line no-console
+                console.error('No such display type: ' + displayType);
+            }
+        };
+
         /**
          * @ngdoc method
          * @methodOf stock-physical-inventory-draft.controller:PhysicalInventoryDraftController
@@ -814,13 +841,64 @@
                 return vm.pagedLineItems;
             }, function(newList) {
                 vm.groupedCategories = $filter('groupByProgramProductCategory')(newList, vm.program.id);
+                findStockCardsById();
             }, true);
 
             if (!$stateParams.noReload) {
                 vm.cacheDraft();
             }
         }
 
+        function findStockCardsById() {
+            if (!vm.groupedCategories || Object.keys(vm.groupedCategories).length === 0) {
+                return;
+            }
+            var stockCardIds = [];
+            for (var key in vm.groupedCategories) {
+                var categories = vm.groupedCategories[key];
+                categories.forEach(function(category) {
+                    category.forEach(function(item) {
+                        stockCardIds.push(item.stockCardId);
+                    });
+                });
+            }
+
+            var stockCardPromises = stockCardIds.map(function(id) {
+                return stockCardService.getStockCard(id);
+            });
+
+            $q.all(stockCardPromises).then(function(responses) {
+                var unitIds = responses.map(function(stockCard) {
+                    return stockCard.unitOfOrderableId;
+                });
+                assignUnitToLineItems(unitIds);
+            });
+        }
+
+        function assignUnitToLineItems(unitsIds) {
+            for (var key in vm.groupedCategories) {
+                var categories = vm.groupedCategories[key];
+                categories.forEach(function(category) {
+                    category.forEach(function(item, index) {
+                        item.unit = getUnitById(unitsIds[index]);
+                    });
+                });
+            }
+        }
+
+        function getUnitById(unitId) {
+            if (!unitId) {
+                return {
+                    name: 'Single Dose',
+                    factor: 1
+                };
+            }
+
+            return vm.unitsOfOrderable.find(function(unit) {
+                return unit.id === unitId;
+            });
+        }
+
         /**
          * @ngdoc method
          * @methodOf stock-physical-inventory-draft.controller:PhysicalInventoryDraftController
@@ -848,14 +926,34 @@
          *
          * @param   {Object}    lineItem    the lineItem containing quantity
          */
-        function quantityChanged(lineItem) {
+        function quantityChanged(lineItem, withUnit) {
+            if (withUnit) {
+                lineItem.quantity = lineItem.unit.factor * lineItem.packsQuantity;
+            }
+
             vm.updateProgress();
             vm.validateQuantity(lineItem);
             vm.checkUnaccountedStockAdjustments(lineItem);
             vm.dataChanged = !vm.dataChanged;
             physicalInventoryDraftCacheService.cacheSingleItemWithNewLot(draft, lineItem);
         }
 
+        function calculateItemsPacksQuantity() {
+            for (var key in vm.groupedCategories) {
+                var categories = vm.groupedCategories[key];
+                categories.forEach(function(category) {
+                    category.forEach(function(lineItem) {
+                        if (lineItem.quantity) {
+                            lineItem.packsQuantity = Math.floor(lineItem.quantity / lineItem.unit.factor);
+                            lineItem.quantity = lineItem.packsQuantity * lineItem.unit.factor;
+                            lineItem.unaccountedQuantity =
+                                stockReasonsCalculations.calculateUnaccounted(lineItem, lineItem.stockAdjustments);
+                        }
+                    });
+                });
+            }
+        }
+
         /**
          * @ngdoc method
          * @methodOf stock-physical-inventory-draft.controller:PhysicalInventoryDraftController

src/stock-physical-inventory-draft/physical-inventory-draft.html

@@ -49,6 +49,22 @@ <h2>
         <button ui-sref="openlmis.stockmanagement.physicalInventory.draft.unitAdd">
             {{:: 'stockPhysicalInventoryDraft.addUnit' | message}}
         </button>
+        <div class="units-package-switch">
+            <button
+                class="btn"
+                ng-click="vm.setActiveDisplayType(vm.DOSES_DISPLAY_TYPE)"
+                ng-class="{'primary': vm.activeDisplayType === vm.DOSES_DISPLAY_TYPE}"
+            >
+                {{:: 'stockPhysicalInventoryDraft.doses' | message}}
+            </button>
+            <button
+                class="btn"
+                ng-click="vm.setActiveDisplayType(vm.PACKS_DISPLAY_TYPE)"
+                ng-class="{'primary': vm.activeDisplayType === vm.PACKS_DISPLAY_TYPE}"
+            >
+                {{:: 'stockPhysicalInventoryDraft.packs' | message}}
+            </button>
+        </div>
     </section>
 
     <table>
@@ -65,12 +81,13 @@ <h2>
                 <th>{{'stockPhysicalInventoryDraft.lotCode' | message}}</th>
                 <th>{{'stockPhysicalInventoryDraft.expiryDate' | message}}</th>
                 <th class="col-sticky sticky-right">{{'stockPhysicalInventoryDraft.soh' | message}}</th>
+                <th ng-if="vm.activeDisplayType === vm.PACKS_DISPLAY_TYPE">{{:: 'stockPhysicalInventoryDraft.unit' | message }}</th>
+                <th ng-if="vm.activeDisplayType === vm.PACKS_DISPLAY_TYPE">{{:: 'stockPhysicalInventoryDraft.packsQuantity' | message }}</th>
                 <th class="col-sticky sticky-right">{{'stockPhysicalInventoryDraft.currentStock' | message}}</th>
                 <th ng-if="vm.showVVMStatusColumn" class="col-sticky sticky-right">
                     {{'stockPhysicalInventoryDraft.VVMStatus' | message}}</th>
                 <th class="col-sticky sticky-right">{{'stockPhysicalInventoryDraft.reasons' | message}}</th>
                 <th class="col-sticky sticky-right">{{'stockPhysicalInventoryDraft.unaccountedQuantity' | message}}</th>
-                <th class="col-sticky sticky-right">{{:: 'stockPhysicalInventoryDraft.unit' | message}}</th>
                 <th ng-if="vm.showHideButtonColumn">{{'stockPhysicalInventoryDraft.actions' | message}}</th>
             </tr>
         </thead>
@@ -81,11 +98,12 @@ <h2>
                 <td></td>
                 <td></td>
                 <td align="right">{{vm.calculate(lineItems, 'stockOnHand')}}</td>
+                <td ng-if="vm.activeDisplayType === vm.PACKS_DISPLAY_TYPE" align="right"></td>
+                <td ng-if="vm.activeDisplayType === vm.PACKS_DISPLAY_TYPE" align="right"></td>
                 <td align="right">{{vm.calculate(lineItems, 'quantity')}}</td>
                 <td align="right" ng-if="vm.showVVMStatusColumn"></td>
                 <td align="right"></td>
                 <td align="right"></td>
-                <td align="right"></td>
                 <td align="right" ng-if="vm.showHideButtonColumn"></td>
             </tr>
             <tr ng-repeat="lineItem in lineItems | orderBy:'lot?lot.lotCode:\'\''" ng-repeat-end>
@@ -101,15 +119,30 @@ <h2>
                 </td>
                 <td>{{lineItem.lot.expirationDate | openlmisDate}}</td>
                 <td align="right">{{lineItem.stockOnHand}}</td>
-                <td class="digit-cell" >
+                <td align="right" ng-if="vm.activeDisplayType === vm.PACKS_DISPLAY_TYPE">
+                    {{ lineItem.unit.name }}
+                </td>
+                <td align="right" ng-if="vm.activeDisplayType === vm.PACKS_DISPLAY_TYPE">
+                    <input
+                        class="form-control" ng-blur="vm.validateQuantity(lineItem)"
+                        ng-class="{'has-popover is-invalid': vm.validateOnPageChange()}"
+                        ng-change="vm.quantityChanged(lineItem, true)"
+                        ng-model="lineItem.packsQuantity"
+                        openlmis-invalid="{{lineItem.quantityInvalid ? lineItem.quantityInvalid : ''}}"
+                        positive-integer/>
+                </td>
+                <td class="digit-cell" ng-if="vm.activeDisplayType === vm.DOSES_DISPLAY_TYPE">
                     <input
                         class="form-control" ng-blur="vm.validateQuantity(lineItem)"
                         ng-class="{'has-popover is-invalid': vm.validateOnPageChange()}"
-                        ng-change="vm.quantityChanged(lineItem)"
+                        ng-change="vm.quantityChanged(lineItem, false)"
                         ng-model="lineItem.quantity"
                         openlmis-invalid="{{lineItem.quantityInvalid ? lineItem.quantityInvalid : ''}}"
                         positive-integer/>
                 </td>
+                <td align="right" class="digit-cell" ng-if="vm.activeDisplayType === vm.PACKS_DISPLAY_TYPE">
+                    {{ lineItem.quantity }}
+                </td>
                 <td ng-if="vm.showVVMStatusColumn" class="digit-cell">
                     <select ng-if="lineItem.orderable.extraData.useVVM == 'true'"
                         ng-model="lineItem.vvmStatus"
@@ -130,11 +163,6 @@ <h2>
                     ng-class="{'has-popover is-invalid': vm.validateOnPageChange()}"
                     openlmis-invalid="{{lineItem.unaccountedQuantityInvalid | message}}">{{lineItem.unaccountedQuantity}}</td>
                 </td>
-                <td align="right">
-                    <select ng-model="lineItem.unitOfOrderableId"
-                            ng-options="unit.id as unit.name for unit in vm.unitsOfOrderable">
-                    </select>
-                </td>
                 <td ng-if="vm.showHideButtonColumn">
                     <button type="button" class="danger"
                         ng-if="lineItem.stockOnHand === 0 && lineItem.active && !lineItem.$isNewItem"