#22 - move pending payments functionality to a new page

alfio-event · Dec 27, 2014 · 2263eca · 2263eca
1 parent a38b9c1
commit 2263eca
Show file tree

Hide file tree

Showing 7 changed files with 107 additions and 28 deletions.
diff --git a/src/main/webapp/WEB-INF/templates/admin/index.ms b/src/main/webapp/WEB-INF/templates/admin/index.ms
@@ -42,7 +42,6 @@
                     <ul class="nav navbar-nav">
                         <li class="active"><a href="#">Dashboard</a></li>
                         <li><a data-ui-sref="configuration">Configuration</a></li>
-                        <li><a href="#">About</a></li>
                     </ul>
                 </div>
             </div>

diff --git a/src/main/webapp/resources/angular-templates/admin/partials/event/detail.html b/src/main/webapp/resources/angular-templates/admin/partials/event/detail.html
@@ -18,30 +18,10 @@
 
     <div class="page-header" data-ng-if="pendingReservations.length > 0">
         <h3>Payments to be confirmed</h3>
-        <h5>Here the reservations for which a payment has not yet confirmed</h5>
-    </div>
-
-    <div class="wMarginTop wMarginBottom table-responsive" data-ng-if="pendingReservations.length > 0">
-        <table class="table">
-            <thead>
-                <th>ID</th>
-                <th>Expiration Date</th>
-                <th>Amount</th>
-                <th>Customer's name</th>
-                <th>Customer's email</th>
-                <th></th>
-            </thead>
-            <tbody>
-                <tr data-ng-repeat="reservation in pendingReservations">
-                    <td data-ng-class-even="'active'">{{reservation.left.id}}</td>
-                    <td data-ng-class-even="'active'">{{reservation.left.validity | formatDate}}</td>
-                    <td data-ng-class-even="'active'">{{reservation.right.totalPrice}}</td>
-                    <td data-ng-class-even="'active'">{{reservation.left.fullName}}</td>
-                    <td data-ng-class-even="'active'">{{reservation.left.email}}</td>
-                    <td data-ng-class-even="'active'"><button class="btn btn-success" data-ng-disabled="loading" data-ng-click="registerPayment(event.shortName, reservation.left.id)"><i class="fa fa-check"></i></button> <button data-ng-disabled="loading" data-ng-click="deletePayment(event.shortName, reservation.left.id)" class="btn btn-danger"><i class="fa fa-trash-o"></i></button></td>
-                </tr>
-            </tbody>
-        </table>
+        <h5>There are reservations for which a payment has not yet confirmed.</h5>
+        <a class="btn btn-warning" data-ui-sref="pending-reservations({eventName: event.shortName})">
+            <i class="fa fa-dollar"></i> Pending payments <pending-reservations-badge data-event-name="{{event.shortName}}"></pending-reservations-badge>
+        </a>
     </div>
 
     <div class="page-header">

diff --git a/src/main/webapp/resources/angular-templates/admin/partials/main/events.html b/src/main/webapp/resources/angular-templates/admin/partials/main/events.html
@@ -21,9 +21,12 @@
         </td>
         <td data-ng-class-even="'active'">{{event.description}}</td>
         <td data-ng-class-even="'active'">{{event.formattedBegin | formatDate}} / {{event.formattedEnd | formatDate}}</td>
-        <td data-ng-class-even="'active'">
-            <a class="icon" data-ui-sref="events.detail({eventName: event.shortName})">
-                <i class="fa fa-bar-chart" data-tooltip="go to detail"></i>
+        <td data-ng-class-even="'active'" class="text-right">
+            <a class="btn btn-primary" data-ui-sref="events.detail({eventName: event.shortName})">
+                <i class="fa fa-bar-chart"></i> Detail
+            </a>
+            <a data-ng-if="supportsOfflinePayments(event)" class="btn btn-warning" data-ui-sref="pending-reservations({eventName: event.shortName})">
+                <i class="fa fa-dollar"></i> Pending payments <pending-reservations-badge data-event-name="{{event.shortName}}"></pending-reservations-badge>
             </a>
         </td>
     </tr>

diff --git a/src/main/webapp/resources/angular-templates/admin/partials/pending-reservations/badge.html b/src/main/webapp/resources/angular-templates/admin/partials/pending-reservations/badge.html
@@ -0,0 +1 @@
+<span class="badge" data-ng-if="pendingReservations">{{pendingReservations}}</span>
diff --git a/src/main/webapp/resources/angular-templates/admin/partials/pending-reservations/index.html b/src/main/webapp/resources/angular-templates/admin/partials/pending-reservations/index.html
@@ -0,0 +1,29 @@
+<div class="container">
+    <div class="page-header">
+        <h1>Pending Reservations for {{eventName}}</h1>
+        <small class="text-muted">You can update them either one at a time or bulky</small>
+    </div>
+
+    <div class="wMarginTop wMarginBottom table-responsive" data-ng-if="pendingReservations.length > 0">
+        <table class="table">
+            <thead>
+            <th>ID</th>
+            <th>Expiration Date</th>
+            <th>Amount</th>
+            <th>Customer's name</th>
+            <th>Customer's email</th>
+            <th></th>
+            </thead>
+            <tbody>
+            <tr data-ng-repeat="reservation in pendingReservations">
+                <td data-ng-class-even="'active'">{{reservation.left.id}}</td>
+                <td data-ng-class-even="'active'">{{reservation.left.validity | formatDate}}</td>
+                <td data-ng-class-even="'active'">{{reservation.right.totalPrice}}</td>
+                <td data-ng-class-even="'active'">{{reservation.left.fullName}}</td>
+                <td data-ng-class-even="'active'">{{reservation.left.email}}</td>
+                <td data-ng-class-even="'active'"><button class="btn btn-success" data-ng-disabled="loading" data-ng-click="registerPayment(eventName, reservation.left.id)"><i class="fa fa-check"></i></button> <button data-ng-disabled="loading" data-ng-click="deletePayment(event.shortName, reservation.left.id)" class="btn btn-danger"><i class="fa fa-trash-o"></i></button></td>
+            </tr>
+            </tbody>
+        </table>
+    </div>
+</div>
diff --git a/src/main/webapp/resources/js/admin/directive/admin-directive.js b/src/main/webapp/resources/js/admin/directive/admin-directive.js
@@ -57,6 +57,10 @@
                 EventService.getAllEvents().success(function(data) {
                     $scope.events = data;
                 });
+
+                $scope.supportsOfflinePayments = function(event) {
+                    return _.contains(event.allowedPaymentProxies, 'OFFLINE');
+                };
             },
             link: angular.noop
         };
@@ -275,5 +279,35 @@
         };
     });
 
+    directives.directive('pendingReservationsBadge', function($rootScope, $interval, EventService) {
+        return {
+            restrict: 'E',
+            scope: false,
+            templateUrl: '/resources/angular-templates/admin/partials/pending-reservations/badge.html',
+            link: function(scope, element, attrs) {
+                var eventName = attrs.eventName;
+                scope.pendingReservations = 0;
+                if(angular.isDefined(eventName)) {
+                    var getPendingPayments = function() {
+                        EventService.getPendingPayments(eventName).success(function(data) {
+                            scope.pendingReservations = data.length;
+                            $rootScope.$broadcast('PendingReservationsFound', data);
+                        });
+                    };
+                    getPendingPayments();
+                    var promise = $interval(getPendingPayments, 10000);
+
+                    element.on('$destroy', function() {
+                        $interval.cancel(promise);
+                    });
+                } else {
+                    $rootScope.$on('PendingReservationsFound', function(data) {
+                        scope.pendingReservations = data.length;
+                    });
+                }
+            }
+        }
+    });
+
 
 })();
diff --git a/src/main/webapp/resources/js/admin/ng-app/admin-application.js b/src/main/webapp/resources/js/admin/ng-app/admin-application.js
@@ -55,6 +55,11 @@
                 templateUrl: BASE_STATIC_URL + '/configuration/index.html',
                 controller: 'ConfigurationController'
             })
+            .state('pending-reservations', {
+                url: '/pending-reservations/:eventName/',
+                templateUrl: BASE_STATIC_URL + '/pending-reservations/index.html',
+                controller: 'PendingReservationsController'
+            });
     });
 
     var validationResultHandler = function(form, deferred) {
@@ -491,6 +496,34 @@
         };
     });
 
+    admin.controller('PendingReservationsController', function($scope, EventService, $stateParams) {
+        var getPendingPayments = function() {
+            EventService.getPendingPayments($stateParams.eventName).success(function(data) {
+                $scope.pendingReservations = data;
+            });
+        };
+
+        $scope.eventName = $stateParams.eventName;
+
+        getPendingPayments();
+        $scope.registerPayment = function(eventName, id) {
+            $scope.loading = true;
+            EventService.registerPayment(eventName, id).success(function() {
+                getPendingPayments();
+            }).error(function() {
+                $scope.loading = false;
+            });
+        };
+        $scope.deletePayment = function(eventName, id) {
+            $scope.loading = true;
+            EventService.cancelPayment(eventName, id).success(function() {
+                getPendingPayments();
+            }).error(function() {
+                $scope.loading = false;
+            });
+        };
+    });
+
     admin.run(function($rootScope, PriceCalculator) {
         var calculateNetPrice = function(event) {
             if(isNaN(event.regularPrice) || isNaN(event.vat)) {
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1 @@
		<span class="badge" data-ng-if="pendingReservations">{{pendingReservations}}</span>