Show spinner on label creation (#4458)

* eeej small files * show spinner on add label * semicolon --------- Co-authored-by: Hannah Eslinger <[email protected]> Co-authored-by: Katherine Fleming <[email protected]>
SEED-platform · Jan 18, 2024 · 04f66bb · 04f66bb
1 parent 87c1663
commit 04f66bb
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 7 deletions.
diff --git a/seed/static/seed/js/controllers/update_item_labels_modal_controller.js b/seed/static/seed/js/controllers/update_item_labels_modal_controller.js
@@ -16,8 +16,9 @@ angular.module('BE.seed.controller.update_item_labels_modal', []).controller('up
   'inventory_ids',
   'inventory_type',
   'Notification',
+  'spinner_utility',
   // eslint-disable-next-line func-names
-  function ($scope, $log, $uibModalInstance, label_service, inventory_ids, inventory_type, notification) {
+  function ($scope, $log, $uibModalInstance, label_service, inventory_ids, inventory_type, notification, spinner_utility) {
     $scope.inventory_ids = inventory_ids;
     $scope.inventory_type = inventory_type;
     // keep track of status of service call
@@ -92,6 +93,8 @@ angular.module('BE.seed.controller.update_item_labels_modal', []).controller('up
 
     /* User has indicated 'Done' so perform selected label operations */
     $scope.done = function () {
+      $scope.waiting = true;
+      spinner_utility.show();
       const addLabelIDs = _.chain($scope.labels).filter('is_checked_add').map('id').value()
         .sort();
       const removeLabelIDs = _.chain($scope.labels).filter('is_checked_remove').map('id').value()
@@ -110,7 +113,8 @@ angular.module('BE.seed.controller.update_item_labels_modal', []).controller('up
           (data, status) => {
             $log.error('error:', data, status);
           }
-        );
+        ).finally(() => spinner_utility.hide());
+
       } else if (inventory_type === 'taxlots') {
         label_service.update_taxlot_labels(addLabelIDs, removeLabelIDs, inventory_ids).then(
           (data) => {
@@ -124,7 +128,7 @@ angular.module('BE.seed.controller.update_item_labels_modal', []).controller('up
           (data, status) => {
             $log.error('error:', data, status);
           }
-        );
+        ).finally(() => spinner_utility.hide());
       }
     };
 

diff --git a/seed/static/seed/partials/update_item_labels_modal.html b/seed/static/seed/partials/update_item_labels_modal.html
@@ -23,7 +23,7 @@ <h4 class="modal-title" id="manageLabelsModalLabel" translate>Add/Remove Labels<
           <span style="white-space: nowrap; margin-right: 20px"
             >{$ 'Show in List' | translate $} <input type="checkbox" style="margin-left: 5px" name="show_in_list" ng-model="new_label.show_in_list"
           /></span>
-          <button type="submit" class="btn btn-primary" ng-disabled="newLabelForm.$invalid || disabled" translate>Create label</button>
+          <button type="submit" class="btn btn-primary" ng-disabled="newLabelForm.$invalid || disabled || waiting" translate>Create label</button>
           <div class="help-block">
             <span class="has-error" ng-show="newLabelForm.name.$error.sdCheckLabelExists" translate>This label name is already taken.</span>
           </div>
@@ -58,6 +58,7 @@ <h4 class="modal-title" id="manageLabelsModalLabel" translate>Add/Remove Labels<
               btn-checkbox-false="false"
               class="btn btn-sm btn-default action_link"
               ng-class="{'btn-danger':label.is_checked_remove}"
+              ng-disabled="waiting"
               ng-click="toggle_remove(label)"
               translate
             >
@@ -71,7 +72,7 @@ <h4 class="modal-title" id="manageLabelsModalLabel" translate>Add/Remove Labels<
               btn-checkbox-false="false"
               class="btn btn-sm btn-default action_link"
               ng-class="{'btn-primary':label.is_checked_add}"
-              ng-disabled="inventory_ids.length === 1 && label.is_applied.length"
+              ng-disabled="inventory_ids.length === 1 && label.is_applied.length || waiting"
               ng-click="toggle_add(label)"
               translate
             >
@@ -86,7 +87,7 @@ <h4 class="modal-title" id="manageLabelsModalLabel" translate>Add/Remove Labels<
     </div>
   </div>
   <div class="modal-footer">
-    <button type="button" class="btn btn-primary" style="min-width: 90px" ng-disabled="!modified()" ng-click="done()" translate>Done</button>
-    <button type="button" class="btn btn-default" style="min-width: 90px" ng-click="cancel()" translate>Cancel</button>
+    <button type="button" class="btn btn-primary" style="min-width: 90px" ng-disabled="!modified() || waiting" ng-click="done()" translate>Done</button>
+    <button type="button" class="btn btn-default" style="min-width: 90px" ng-disabled="waiting" ng-click="cancel()" translate>Cancel</button>
   </div>
 </div>