feat(billing services): delete modal + deep link

This commit adds the ability to deep link deletes via ui-router's state.
Delete now operates like update, using `/billing_services/:id/delete` to
open a generic delete modal to perform the delete request.

This commit completes the functionality of the billing_services module.
However, it needs polishing.  A review issue will be made to mention the
following things specfically:
 1. Bad Delete Modal UI - this should be improved as we use it in
 multiple places.
 2. The "create" button is in a terribly chosen place - should this be a
 dropdown?
 3. (Server) error handling needs to be decided on and adopted by the
 whole team uniformly.
 4. Better alert system (scroll to and highlight) for ui-grid on create
 and update.

 This commit officially closes #206.

client/src/js/app.js

@@ -6,7 +6,10 @@ var bhima = angular.module('bhima', [
 ]);
 
 
-function bhimaConfig($stateProvider, $urlRouterProvider) {
+function bhimaConfig($stateProvider, $urlRouterProvider, $urlMatcherFactoryProvider) {
+  // allow trailing slashes in routes
+  $urlMatcherFactoryProvider.strictMode(false);
+
   /* misc routes */
 
   $stateProvider
@@ -195,31 +198,73 @@ function bhimaConfig($stateProvider, $urlRouterProvider) {
     templateUrl: 'partials/locations/country/country.html'
   })
 
-  /* billing service */
-
+  /**
+   * Billing Services Routes
+   *
+   * The billing services route endpoints.
+   *
+   * @todo - discuss if the "delete" route should be included as a separate
+   * view/state.  It doesn't really need to be deep-linked.
+   */
   .state('billingServices', {
-    abstract : true,
-    url : '/admin/billing_services',
+    url : '/admin/billing_services/{id:int}',
+    params : {
+      // this is required to match the route when a billing service id is present
+      // or omitted.  See: http://stackoverflow.com/questions/30720672/
+      id : { squash : true, value : null },
+      created : false,  // default for transitioning from child states
+      updated : false,  // default for transitioning from child states
+    },
     templateUrl : 'partials/billing_services/index.html',
     controller : 'BillingServicesController as BillingServicesCtrl',
   })
-  .state('billingServices.list', {
-    url : '', // display by default in the parent state
-    templateUrl : '/partials/billing_services/list/list.html',
-    controller : 'BillingServicesListController as BillingServicesListCtrl'
-  })
-
-  // both create and update use the same form template
-  .state('billingServices.create', {
-    url : '/create',
-    templateUrl : '/partials/billing_services/form.html',
-    controller : 'BillingServicesCreateController as BillingServicesFormCtrl',
-  })
-  .state('billingServices.update', {
-    url : '/:id',
-    templateUrl : '/partials/billing_services/form.html',
-    controller : 'BillingServicesUpdateController as BillingServicesFormCtrl'
-  })
+    .state('billingServices.create', {
+      onEnter : ['$state', '$uibModal', function ($state, Modal) {
+        Modal.open({
+          templateUrl : 'partials/billing_services/modal.html',
+          controller : 'BillingServicesCreateController as BillingServicesFormCtrl',
+        }).result.then(function (id) {
+          // go to the parent state (with refresh)
+          $state.go('^', { id : id, created : true }, { reload : true });
+        })
+        .catch(function () {
+          $state.go('^', { id : $state.params.id }, { notify: false });
+        });
+      }]
+    })
+    .state('billingServices.update', {
+      url: '/update',
+      onEnter : ['$state', '$uibModal', function ($state, Modal) {
+        Modal.open({
+          templateUrl : 'partials/billing_services/modal.html',
+          controller : 'BillingServicesUpdateController as BillingServicesFormCtrl',
+        }).result.then(function (id) {
+          // go to the parent state (with refresh)
+          $state.go('^', { id : id, updated: true }, { reload : true });
+        })
+        .catch(function () {
+          $state.go('^', { id : $state.params.id }, { notify: false });
+        });
+      }]
+    })
+    .state('billingServices.delete', {
+      url: '/delete',
+      onEnter : ['$state', '$uibModal', function ($state, Modal) {
+        Modal.open({
+          animation : false,
+          keyboard : true,
+          size : 'md',
+          controller : 'BillingServicesDeleteController as ConfirmModalCtrl',
+          templateUrl : '/partials/templates/modals/confirm.modal.html'
+        }).result.then(function () {
+          // go to the parent state (with refresh)
+          $state.go('^', { id: null }, { reload : true });
+        })
+        .catch(function () {
+          $state.go('^', { id : $state.params.id }, { notify: false });
+        });
+      }]
+    })
 
   /* budget routes */
 
@@ -903,7 +948,7 @@ function httpConfig($httpProvider) {
 }
 
 // configuration
-bhima.config(['$stateProvider', '$urlRouterProvider', bhimaConfig]);
+bhima.config(['$stateProvider', '$urlRouterProvider', '$urlMatcherFactoryProvider', bhimaConfig]);
 bhima.config(['$translateProvider', translateConfig]);
 bhima.config(['tmhDynamicLocaleProvider', localeConfig]);
 bhima.config(['$httpProvider', authConfig]);

client/src/partials/billing_services/create/create.js → client/src/partials/billing_services/create.js

@@ -2,7 +2,7 @@ angular.module('bhima.controllers')
 .controller('BillingServicesCreateController', BillingServicesCreateController);
 
 BillingServicesCreateController.$inject = [
-  'BillingServicesService', 'AccountService'
+  'BillingServicesService', 'AccountService', '$uibModalInstance'
 ];
 
 /**
@@ -11,7 +11,7 @@ BillingServicesCreateController.$inject = [
  * This controller allows the user to create a new billing service using a form.
  * Note that this uses the same HTML form as the update controller
  */
-function BillingServicesCreateController(BillingServices, Accounts) {
+function BillingServicesCreateController(BillingServices, Accounts, ModalInstance) {
   var vm = this;
 
   // the form title is defined in the JS to allow us to reuse templates
@@ -22,6 +22,7 @@ function BillingServicesCreateController(BillingServices, Accounts) {
 
   // bind the submit method to POST data to the server
   vm.submit = submit;
+  vm.dismiss = ModalInstance.dismiss;
 
   // fired on application startup
   function startup() {
@@ -43,7 +44,6 @@ function BillingServicesCreateController(BillingServices, Accounts) {
 
     // remove any previously attached messages
     delete vm.error;
-    delete vm.created;
 
     // exit immediately if the form is not valid
     if (form.$invalid) {
@@ -52,14 +52,8 @@ function BillingServicesCreateController(BillingServices, Accounts) {
 
     // submit data to the server
     return BillingServices.create(vm.model)
-    .then(function () {
-
-      // automatically reset the view
-      vm.created = true;
-      vm.model = {};
-
-      // make sure the validation rules for the form are reset
-      form.$setPristine();
+    .then(function (data) {
+      ModalInstance.close(data.id);
     })
     .catch(function (response) {
       vm.error = response.data;

client/src/partials/billing_services/delete.js

@@ -0,0 +1,40 @@
+angular.module('bhima.controllers')
+.controller('BillingServicesDeleteController', BillingServicesDeleteController);
+
+BillingServicesDeleteController.$inject = ['$state', '$uibModalInstance', 'BillingServicesService' ];
+
+/**
+ * Billing Services Delete Controller
+ *
+ * This is a super simple controller to ensure that errors are properly handled
+ * and translated on the billing services modal.  It leverages the shared
+ * ConfirmModal template.
+ *
+ * This controller is instantiated in a modal.
+ */
+function BillingServicesDeleteController($state, Instance, BillingServices) {
+  var vm = this;
+
+  // bind methods to the view
+  vm.dismiss = Instance.dismiss;
+  vm.submit = submit;
+
+  // submit a delete request to the server
+  function submit() {
+    // clear the error, if it exists
+    delete vm.error;
+
+    // attempt to delete the billing service
+    return BillingServices.delete($state.params.id)
+    .then(function () {
+
+      // if successful, close the modal instance
+      Instance.close();
+    })
+    .catch(function (response) {
+
+      // bind the error to the view
+      vm.error = response.data;
+    });
+  }
+}