OAM-45: Adjusted UI to new BE approach

src/admin-facility-view/admin-facility-view.routes.js

@@ -19,9 +19,9 @@
 
     angular.module('admin-facility-view').config(routes);
 
-    routes.$inject = ['$stateProvider', 'ADMINISTRATION_RIGHTS'];
+    routes.$inject = ['$stateProvider', 'ADMINISTRATION_RIGHTS', 'WARDS_CONSTANTS'];
 
-    function routes($stateProvider, ADMINISTRATION_RIGHTS) {
+    function routes($stateProvider, ADMINISTRATION_RIGHTS, WARDS_CONSTANTS) {
 
         $stateProvider.state('openlmis.administration.facilities.edit', {
             label: 'adminFacilityView.editFacility',
@@ -63,12 +63,17 @@
                 },
                 wards: function(wardService, facility) {
                     var searchParams = {
-                        facilityId: facility.id,
-                        sort: 'code,asc'
+                        zoneId: facility.geographicZone.id,
+                        sort: 'code,asc',
+                        type: WARDS_CONSTANTS.WARD_TYPE_CODE
+
                     };
 
                     return wardService.getWardsByFacility(searchParams).then(function(response) {
-                        return response.content;
+                        return response.
+                            content.filter(function(responseFacility) {
+                                return responseFacility.id !== facility.id;
+                            });
                     });
                 }
             }

src/admin-facility-view/facility-view.controller.js

@@ -31,12 +31,14 @@
     controller.$inject = [
         '$q', '$state', 'facility', 'facilityTypes', 'geographicZones', 'facilityOperators',
         'programs', 'FacilityRepository', 'loadingModalService', 'notificationService',
-        'tzPeriodService', 'messageService', 'confirmService', 'wards', 'wardService'
+        'tzPeriodService', 'messageService', 'confirmService', 'wards', 'wardService',
+        'WARDS_CONSTANTS'
     ];
 
     function controller($q, $state, facility, facilityTypes, geographicZones, facilityOperators,
                         programs, FacilityRepository, loadingModalService, notificationService,
-                        tzPeriodService, messageService, confirmService, wards, wardService) {
+                        tzPeriodService, messageService, confirmService, wards, wardService,
+                        WARDS_CONSTANTS) {
 
         var vm = this;
 
@@ -48,6 +50,7 @@
         vm.addProgram = addProgram;
         vm.addWard = addWard;
         vm.deleteProgramAssociate = deleteProgramAssociate;
+        vm.generateWardCode = generateWardCode;
 
         /**
          * @ngdoc property
@@ -133,11 +136,43 @@
          * @type {Object}
          *
          * @description
-         * Contains new ward object. By default, active true.
+         * Contains new ward object.
          */
-        vm.newWard = {
-            disabled: false
-        };
+        vm.newWard = undefined;
+
+        /**
+         * @ngdoc property
+         * @propertyOf admin-facility-view.controller:FacilityViewController
+         * @name addedWards
+         * @type {Object[]}
+         *
+         * @description
+         * Contains wards that are added through a form
+         */
+        vm.addedWards = [];
+
+        /**
+         * @ngdoc property
+         * @propertyOf admin-facility-view.controller:FacilityViewController
+         * @name initialWards
+         * @type {Object[]}
+         *
+         * @description
+         * Contains wards that are pulled from API at the beggining to compare it later
+         * with the ones changed in a form
+         */
+        vm.initialWards = [];
+
+        /**
+         * @ngdoc property
+         * @propertyOf admin-facility-view.controller:FacilityViewController
+         * @name wardFacilityType
+         * @type {Object}
+         *
+         * @description
+         * Contains type passed to ward/service
+         */
+        vm.wardFacilityType = undefined;
 
         /**
          * @ngdoc method
@@ -156,9 +191,13 @@
             vm.facilityOperators = facilityOperators;
             vm.programs = programs;
             vm.wards = wards;
+            vm.initialWards = angular.copy(wards);
             vm.selectedTab = 0;
             vm.managedExternally = facility.isManagedExternally();
-            vm.generateWardCode = generateWardCode;
+            vm.wardFacilityType = facilityTypes.find(function(type) {
+                return type.code === WARDS_CONSTANTS.WARD_TYPE_CODE;
+            });
+            vm.newWard = getInitialNewWardValue();
 
             if (!vm.facilityWithPrograms.supportedPrograms) {
                 vm.facilityWithPrograms.supportedPrograms = [];
@@ -289,24 +328,29 @@
             var newWard = angular.copy(vm.newWard);
 
             newWard.code = vm.generateWardCode(vm.facility.code);
-            newWard.facility = {
-                id: vm.facility.id
-            };
+            console.log(newWard.type.code);
 
-            vm.wards.push(newWard);
+            vm.addedWards.push(newWard);
 
-            vm.newWard = {
-                disabled: false
-            };
+            vm.newWard = getInitialNewWardValue();
 
             return $q.when();
         }
 
+        function getInitialNewWardValue() {
+            return {
+                active: false,
+                enabled: true,
+                type: vm.wardFacilityType,
+                geographicZone: vm.facility.geographicZone
+            };
+        }
+
         /**
          * @ngdoc method
          * @methodOf admin-facility-view.controller:FacilityViewController
          * @name generateWardCode
-         * 
+         *
          * @description
          * Generates ward code based on the facility code.
          */
@@ -320,7 +364,7 @@
          * @ngdoc method
          * @methodOf admin-facility-view.controller:FacilityViewController
          * @name padNumber
-         * 
+         *
          * @description
          * Pads a number with leading zeros.
          */
@@ -331,6 +375,16 @@
             return '0'.repeat(padding) + numberString;
         }
 
+        function getChangedWards() {
+            return vm.wards.filter(function(ward, index) {
+                var initialWard = vm.initialWards[index];
+
+                return ward.name !== initialWard.name ||
+                    ward.description !== initialWard.description ||
+                    ward.enabled !== initialWard.enabled;
+            });
+        }
+
         /**
          * @ngdoc method
          * @methodOf admin-facility-view.controller:FacilityViewController
@@ -340,18 +394,27 @@
          * Saves facility wards and redirects to facility list screen.
          */
         function saveFacilityWards() {
-            var facilityWards = angular.copy(vm.wards);
+            var changedWards = getChangedWards();
 
             confirmService.confirm(
                 'adminFacilityView.savingConfirmation',
                 'adminFacilityView.save'
             ).then(function() {
                 loadingModalService.open();
-                return new wardService.saveFacilityWards(facilityWards)
-                    .then(function(facilityWards) {
+
+                var changedWardsPromisses = changedWards.map(function(ward) {
+                    return wardService.updateFacilityWard(ward);
+                });
+
+                var addedWardsPromisses = vm.addedWards.map(function(ward) {
+                    return new FacilityRepository().create(ward);
+                });
+
+                $q.all(changedWardsPromisses.concat(addedWardsPromisses))
+                    .then(function() {
                         notificationService.success('adminFacilityView.saveWards.success');
                         goToFacilityList();
-                        return $q.resolve(facilityWards);
+                        return $q.resolve();
                     })
                     .catch(function() {
                         notificationService.error('adminFacilityView.saveWards.fail');

src/admin-facility-view/facility-view.controller.spec.js

@@ -45,7 +45,7 @@ describe('FacilityViewController', function() {
         spyOn(this.confirmService, 'confirm').andReturn(this.confirmDeferred.promise);
 
         this.saveFacilityDetailsDeferred = this.$q.defer();
-        spyOn(this.wardService, 'saveFacilityWards').andReturn(this.saveFacilityDetailsDeferred.promise);
+        spyOn(this.wardService, 'updateFacilityWard').andReturn(this.saveFacilityDetailsDeferred.promise);
 
         var loadingModalPromise = this.$q.defer();
         spyOn(this.loadingModalService, 'close').andCallFake(loadingModalPromise.resolve);
@@ -256,12 +256,13 @@ describe('FacilityViewController', function() {
     describe('addWard', function() {
 
         beforeEach(function() {
-            this.vm.wards = [];
+            this.vm.addedWards = [];
             this.vm.facility = {
                 id: 'facility-id'
             };
             this.vm.newWard = {
-                disabled: false
+                enabled: true,
+                active: true
             };
             spyOn(this.vm, 'generateWardCode').andReturn('generated-code');
         });
@@ -270,36 +271,28 @@ describe('FacilityViewController', function() {
             this.vm.addWard();
 
             expect(this.vm.generateWardCode).toHaveBeenCalled();
-            expect(this.vm.wards[0].code).toEqual('generated-code');
+            expect(this.vm.addedWards[0].code).toEqual('generated-code');
         });
 
         it('should add new ward to the list', function() {
             var newWard = angular.copy(this.vm.newWard);
-            newWard.facility = {
-                id: this.vm.facility.id
-            };
             newWard.code = 'generated-code';
 
-            spyOn(this.wardService, 'getAllWards').andReturn(this.$q.when({
-                content: []
-            }));
-
             this.vm.addWard();
             this.$rootScope.$apply();
 
-            expect(this.vm.wards[0]).toEqual(newWard);
+            expect(this.vm.addedWards[0]).toEqual(newWard);
         });
 
         it('should clear newWard', function() {
-            spyOn(this.wardService, 'getAllWards').andReturn(this.$q.when({
-                content: []
-            }));
-
             this.vm.addWard();
             this.$rootScope.$apply();
 
             expect(this.vm.newWard).toEqual({
-                disabled: false
+                enabled: true,
+                active: true,
+                type: undefined,
+                geograpicZone: undefined
             });
         });
     });
@@ -323,14 +316,6 @@ describe('FacilityViewController', function() {
             expect(this.loadingModalService.open).toHaveBeenCalled();
         });
 
-        it('should call wardService.saveFacilityWards with correct parameters', function() {
-            this.confirmDeferred.resolve();
-            this.vm.saveFacilityWards();
-            this.$rootScope.$apply();
-
-            expect(this.wardService.saveFacilityWards).toHaveBeenCalledWith(this.vm.wards);
-        });
-
         it('should show success notification and navigate to facility list if saved successfully', function() {
             this.confirmDeferred.resolve();
             this.saveFacilityDetailsDeferred.resolve(this.wards);
@@ -342,15 +327,5 @@ describe('FacilityViewController', function() {
                 reload: true
             });
         });
-
-        it('should show error notification and close loading modal if wards save has failed', function() {
-            this.confirmDeferred.resolve();
-            this.saveFacilityDetailsDeferred.reject();
-            this.vm.saveFacilityWards();
-            this.$rootScope.$apply();
-
-            expect(this.notificationService.error).toHaveBeenCalledWith('adminFacilityView.saveWards.fail');
-            expect(this.loadingModalService.close).toHaveBeenCalled();
-        });
     });
 });

src/admin-facility-view/messages_en.json

@@ -4,7 +4,6 @@
     "adminFacilityView.program": "Program",
     "adminFacilityView.startDate": "Start Date",
     "adminFacilityView.active": "Active",
-    "adminFacilityView.disabled": "Disabled",
     "adminFacilityView.locallyFulfill": "Locally Fulfilled",
     "adminFacilityView.cancel": "Cancel",
     "adminFacilityView.editFacility": "Edit Facility",

src/admin-facility-view/services-and-wards.html

@@ -23,14 +23,14 @@
     <p class="note-warning">
       {{'adminFacilityView.wardIsDisabled.note' | message}}
     </p>
-    <label for="wardIsDisabled" class="checkbox">
+    <label for="wardIsActive" class="checkbox">
       <input
-        id="wardIsDisabled"
+        id="wardIsActive"
         type="checkbox"
-        ng-model="vm.newWard.disabled"
+        ng-model="vm.newWard.enabled"
         ng-disabled="vm.managedExternally"
       />
-      {{'adminFacilityView.disabled' | message}}
+      {{'adminFacilityView.enabled' | message}}
     </label>
   </div>
   <button type="submit" class="add">
@@ -43,7 +43,7 @@
   ng-submit="vm.saveFacilityWards()"
 >
   <table>
-    <caption ng-if="!vm.wards || vm.wards.length === 0">
+    <caption ng-if="(!vm.wards || vm.wards.length === 0) && vm.addedWards.length === 0">
       {{'adminFacilityView.noAssociatedWards' | message: {facility:
       vm.facility.name} }}
     </caption>
@@ -57,16 +57,16 @@
         <th>{{'adminFacilityView.name' | message}}</th>
         <th>{{'adminFacilityView.description' | message}}</th>
         <th openlmis-popover="{{'adminFacilityView.statusPopover' | message}}">
-          {{'adminFacilityView.disabled' | message}}
+          {{'adminFacilityView.enabled' | message}}
         </th>
       </tr>
     </thead>
     <tbody>
-      <tr ng-repeat="ward in vm.wards">
+      <tr ng-repeat="ward in vm.wards.concat(vm.addedWards)">
         <td><input type="text" disabled ng-model="ward.code" /></td>
         <td><input type="text" ng-model="ward.name" required /></td>
         <td><input type="text" ng-model="ward.description" /></td>
-        <td><input type="checkbox" ng-model="ward.disabled" /></td>
+        <td><input type="checkbox" ng-model="ward.enabled" /></td>
       </tr>
     </tbody>
   </table>

src/admin-facility-view/ward-data-builder.spec.js

@@ -36,10 +36,12 @@
             this.facility = {
                 id: 'facility-id' + WardDataBuilder.instanceNumber
             };
+            this.id = 'id' + WardDataBuilder.instanceNumber;
         }
 
         function build() {
             return {
+                id: this.id,
                 code: this.code,
                 name: this.name,
                 description: this.description,