Adding saving account actions

app/global-translations/locale-en.json

@@ -375,11 +375,13 @@
 
   "#Savings Related":".........",
   "label.saving.application":"New Saving Application",
+  "label.edit.saving.application":"Edit Saving Application",
   "label.activatedOn":"Activated On:",
   "label.fieldofficer":"Field Officer:",
   "label.accountBalance":"Account Balance",
   "button.deposit":"Deposit",
   "button.withdraw":"Withdraw",
+  "button.activate":"Activate",
   "button.calculateInterest":"Calculate Interest",
   "button.postInterest":"Post Interest",
   "button.applyAnnualFees":"Apply AnnualFees",
@@ -404,5 +406,30 @@
   "label.field.officer":"Field Officer:",
   "label.submittedon":"Submitted on:",
   "label.currency.in.multiplesof":"Currency in multiplesof",
-  "label.withdrawal.fee.for.transfers":"Apply Withdrawal fee for transfers"
+  "label.withdrawal.fee.for.transfers":"Apply Withdrawal fee for transfers",
+  "label.approve.saving.account":"Approve Saving Application",
+  "label.saving.account.approvedOnDate":"Approved On:",
+  "label.reject.saving.account":"Reject Saving Application",
+  "label.saving.account.rejectedOnDate":"Rejected On:",
+  "label.withdraw.saving.account":"Withdraw Saving Application",
+  "label.saving.account.withdrawnOnDate":"Withdraw On:",
+  "label.undoapprove.saving.account":"Undo Approve Saving Application",
+  "label.activate.saving.account":"Activate Saving Application",
+  "label.saving.account.activatedOnDate":"Activated On:",
+  "label.saving.account.apply.annualFee":"Apply Annual Fees",
+  "label.saving.account.annualFeeTransactionDate":"Transaction Date:",
+  "label.close.saving.account":"Close Saving Application",
+  "label.saving.account.closedOnDate":"Closed On:",
+  "label.note":"Note:",
+  "label.deposit.money.to.saving.account":"Deposit Funds",
+  "label.saving.account.transactionDate":"Transaction Date:",
+  "label.withdraw.money.from.saving.account":"withdraw Funds",
+  "label.saving.account.transactionAmount":"Amount:",
+  "label.saving.account.paymentTypeId":"Payment Type:",
+  "label.saving.account.show.payment.details":"Payment Details",
+  "label.saving.account.accountNumber":"Account Number:",
+  "label.saving.account.checkNumber":"Check Number:",
+  "label.saving.account.routingCode":"Routing Code:",
+  "label.saving.account.receiptNumber":"Receipt Number:",
+  "label.saving.account.bankNumber":"Bank Number:"
 }

app/scripts/controllers/savings/CreateSavingAccountController.js

@@ -35,16 +35,15 @@
             if (data.withdrawalFeeType) scope.formData.withdrawalFeeType = data.withdrawalFeeType.id;
 
           });
-        }
+        };
 
         scope.submit = function() {
           this.formData.locale = 'en';
           this.formData.dateFormat = 'dd MMMM yyyy';
           this.formData.monthDayFormat= "dd MMM";
           this.formData.clientId = scope.clientId;
-          console.log(this.formData);
           resourceFactory.savingsResource.save(this.formData,function(data){
-            location.path('/viewclient/' + scope.clientId);
+            location.path('/viewsavingaccount/' + data.savingsId);
           });
         };
     }

app/scripts/controllers/savings/EditSavingAccountController.js

@@ -0,0 +1,73 @@
+(function(module) {
+  mifosX.controllers = _.extend(module, {
+    EditSavingAccountController: function(scope, resourceFactory, location, routeParams) {
+        scope.products = [];
+        scope.fieldOfficers = [];
+        scope.formData = {};
+        scope.isCollapsed = false;
+        scope.accountId = routeParams.id;
+
+        resourceFactory.savingsResource.get({accountId:scope.accountId, template:true}, function(data) {
+          scope.data = data;
+          scope.formData.clientId = data.clientId;
+          scope.clientName = data.clientName;
+          scope.formData.productId = data.savingsProductId;
+          scope.products = data.productOptions;
+          scope.formData.fieldOfficerId = data.fieldOfficerId;
+          scope.fieldOfficers = data.fieldOfficerOptions;
+          scope.formData.nominalAnnualInterestRate = data.nominalAnnualInterestRate;
+          scope.formData.minRequiredOpeningBalance = data.minRequiredOpeningBalance;
+          scope.formData.lockinPeriodFrequency = data.lockinPeriodFrequency;
+          /* FIX-ME: uncomment annualFeeAmount when datepicker avialable, because it depends on the date field 'annualFeeOnMonthDay'*/
+          //scope.formData.annualFeeAmount = data.annualFeeAmount;
+          scope.formData.withdrawalFeeAmount = data.withdrawalFeeAmount;
+          scope.formData.withdrawalFeeForTransfers = data.withdrawalFeeForTransfers;
+
+          if (data.interestCompoundingPeriodType) scope.formData.interestCompoundingPeriodType = data.interestCompoundingPeriodType.id;
+          if (data.interestPostingPeriodType) scope.formData.interestPostingPeriodType = data.interestPostingPeriodType.id;
+          if (data.interestCalculationType) scope.formData.interestCalculationType = data.interestCalculationType.id;
+          if (data.interestCalculationDaysInYearType) scope.formData.interestCalculationDaysInYearType = data.interestCalculationDaysInYearType.id;
+          if (data.lockinPeriodFrequencyType) scope.formData.lockinPeriodFrequencyType = data.lockinPeriodFrequencyType.id;
+          if (data.withdrawalFeeType) scope.formData.withdrawalFeeType = data.withdrawalFeeType.id;
+          
+        });
+        
+         scope.changeProduct =function() {
+          resourceFactory.savingsTemplateResource.get({clientId:scope.formData.clientId, productId : scope.formData.productId}, function(data) {
+
+            scope.isCollapsed = false;
+            scope.data = data;
+
+            scope.fieldOfficers = data.fieldOfficerOptions;
+            scope.formData.nominalAnnualInterestRate = data.nominalAnnualInterestRate;
+            scope.formData.minRequiredOpeningBalance = data.minRequiredOpeningBalance;
+            scope.formData.lockinPeriodFrequency = data.lockinPeriodFrequency;
+            /* FIX-ME: uncomment annualFeeAmount when datepicker avialable, because it depends on the date field 'annualFeeOnMonthDay'*/
+            //scope.formData.annualFeeAmount = data.annualFeeAmount;
+            scope.formData.withdrawalFeeAmount = data.withdrawalFeeAmount;
+            scope.formData.withdrawalFeeForTransfers = data.withdrawalFeeForTransfers;
+
+            if (data.interestCompoundingPeriodType) scope.formData.interestCompoundingPeriodType = data.interestCompoundingPeriodType.id;
+            if (data.interestPostingPeriodType) scope.formData.interestPostingPeriodType = data.interestPostingPeriodType.id;
+            if (data.interestCalculationType) scope.formData.interestCalculationType = data.interestCalculationType.id;
+            if (data.interestCalculationDaysInYearType) scope.formData.interestCalculationDaysInYearType = data.interestCalculationDaysInYearType.id;
+            if (data.lockinPeriodFrequencyType) scope.formData.lockinPeriodFrequencyType = data.lockinPeriodFrequencyType.id;
+            if (data.withdrawalFeeType) scope.formData.withdrawalFeeType = data.withdrawalFeeType.id;
+
+          });
+        }
+
+        scope.submit = function() {
+          this.formData.locale = 'en';
+          this.formData.dateFormat = 'dd MMMM yyyy';
+          this.formData.monthDayFormat= "dd MMM";
+          resourceFactory.savingsResource.update({'accountId': scope.accountId}, this.formData, function(data){
+            location.path('/viewsavingaccount/' + data.savingsId);
+          });
+        };
+    }
+  });
+  mifosX.ng.application.controller('EditSavingAccountController', ['$scope', 'ResourceFactory', '$location', '$routeParams', mifosX.controllers.EditSavingAccountController]).run(function($log) {
+    $log.info("EditSavingAccountController initialized");
+  });
+}(mifosX.controllers || {}));

app/scripts/controllers/savings/SavingAccountActionsController.js

@@ -0,0 +1,111 @@
+(function(module) {
+  mifosX.controllers = _.extend(module, {
+    SavingAccountActionsController: function(scope, resourceFactory, location, routeParams) {
+
+        scope.action = routeParams.action || "";
+        scope.accountId = routeParams.id;
+        scope.formData = {};
+
+        // Transaction UI Related
+        scope.isTransaction = false;
+        scope.showPaymentDetails =false;
+        scope.paymentTypes = [];
+
+        switch (scope.action) {
+          case "approve":
+            scope.title = 'label.approve.saving.account';
+            scope.labelName = 'label.saving.account.approvedOnDate';
+            scope.modelName = 'approvedOnDate';
+            scope.showDateField = true;
+            scope.showNoteField = true;
+          break;
+          case "reject":
+            scope.title = 'label.reject.saving.account';
+            scope.labelName = 'label.saving.account.rejectedOnDate';
+            scope.modelName = 'rejectedOnDate';
+            scope.showDateField = true;
+            scope.showNoteField = true;
+          break;
+          case "withdrawnbyclient":
+            scope.title = 'label.withdraw.saving.account';
+            scope.labelName = 'label.saving.account.withdrawnOnDate';
+            scope.modelName = 'withdrawnOnDate';
+            scope.showDateField = true;
+            scope.showNoteField = true;
+          break;
+          case "undoapproval":
+            scope.title = 'label.undoapprove.saving.account';
+            scope.showDateField = false;
+            scope.showNoteField = true;
+          break;
+          case "activate":
+            scope.title = 'label.activate.saving.account';
+            scope.labelName = 'label.saving.account.activatedOnDate';
+            scope.modelName = 'activatedOnDate';
+            scope.showDateField = true;
+            scope.showNoteField = false;
+          break;
+          case "deposit":
+            resourceFactory.savingsTrxnsTemplateResource.get({savingsId:scope.accountId, command:'deposit'}, function(data){
+              scope.paymentTypes=data.paymentTypeOptions;
+            });
+            scope.title = 'label.deposit.money.to.saving.account';
+            scope.labelName = 'label.saving.account.transactionDate';
+            scope.modelName = 'transactionDate';
+            scope.showDateField = true;
+            scope.showNoteField = false;
+            scope.isTransaction = true;
+            scope.showPaymentDetails = false;
+          break;
+          case "withdrawal":
+            resourceFactory.savingsTrxnsTemplateResource.get({savingsId:scope.accountId, command:'withdrawal'}, function(data){
+              scope.paymentTypes=data.paymentTypeOptions;
+            });
+            scope.title = 'label.withdraw.money.from.saving.account';
+            scope.labelName = 'label.saving.account.transactionDate';
+            scope.modelName = 'transactionDate';
+            scope.showDateField = true;
+            scope.showNoteField = false;
+            scope.isTransaction = true;
+            scope.showPaymentDetails = false;
+          break;
+          case "applyAnnualFees":
+            scope.title = 'label.saving.account.apply.annualFee';
+            scope.labelName = 'label.saving.account.annualFeeTransactionDate';
+            scope.modelName = 'annualFeeTransactionDate';
+            scope.showDateField = true;
+            scope.showNoteField = false;
+          break;
+          case "close":
+            scope.title = 'label.close.saving.account';
+            scope.labelName = 'label.saving.account.closedOnDate';
+            scope.modelName = 'closedOnDate';
+            scope.showDateField = true;
+            scope.showNoteField = true;
+          break;
+        }
+
+        scope.submit = function() {
+          var params = {command:scope.action};
+          if (scope.action != "undoapproval") {
+            this.formData.locale = 'en';
+            this.formData.dateFormat = 'dd MMMM yyyy';
+          }
+          if (scope.action == "deposit" || scope.action == "withdrawal") {
+            params.savingsId = scope.accountId;
+            resourceFactory.savingsTrxnsResource.save(params, this.formData, function(data){
+              location.path('/viewsavingaccount/' + data.savingsId);
+            });
+          } else {
+            params.accountId=scope.accountId;
+            resourceFactory.savingsResource.save(params, this.formData, function(data){
+              location.path('/viewsavingaccount/' + data.savingsId);
+            });
+          }
+        };
+    }
+  });
+  mifosX.ng.application.controller('SavingAccountActionsController', ['$scope', 'ResourceFactory', '$location', '$routeParams', mifosX.controllers.SavingAccountActionsController]).run(function($log) {
+    $log.info("SavingAccountActionsController initialized");
+  });
+}(mifosX.controllers || {}));

app/scripts/controllers/savings/ViewSavingDetailsController.js

@@ -1,12 +1,65 @@
 (function(module) {
   mifosX.controllers = _.extend(module, {
-    ViewSavingDetailsController: function(scope, routeParams, resourceFactory) {
+    ViewSavingDetailsController: function(scope, routeParams, resourceFactory, location) {
       scope.$broadcast('SavingAccountDataLoadingStartEvent');
 
       scope.isDebit = function (savingsTransactionType) {
         return savingsTransactionType.withdrawal == true || savingsTransactionType.feeDeduction == true;
       };
 
+      scope.clickEvent = function(eventName, accountId) {
+        eventName = eventName || "";
+        switch (eventName) {
+          case "modifyapplication":
+            location.path('/editsavingaccount/' + accountId);
+          break;
+          case "approve":
+            location.path('/savingaccount/' + accountId + '/approve');
+          break;
+          case "reject":
+            location.path('/savingaccount/' + accountId + '/reject');
+          break;
+          case "withdrawnbyclient":
+            location.path('/savingaccount/' + accountId + '/withdrawnbyclient');
+          break;
+          case "delete":
+            resourceFactory.savingsResource.delete({accountId:accountId}, {}, function(data){
+              location.path('/viewclient/' + data.clientId);
+            });
+          break;
+          case "undoapproval":
+            location.path('/savingaccount/' + accountId + '/undoapproval');
+          break;
+          case "activate":
+            location.path('/savingaccount/' + accountId + '/activate');
+          break;
+          case "deposit":
+            location.path('/savingaccount/' + accountId + '/deposit');
+          break;
+          case "withdraw":
+            location.path('/savingaccount/' + accountId + '/withdrawal');
+          break;
+          case "calculateInterest":
+            resourceFactory.savingsResource.save({accountId:accountId,command:'calculateInterest'}, {}, function(data){
+              location.path('/viewsavingaccount/' + data.savingsId);
+            });
+          break;
+          case "postInterest":
+            resourceFactory.savingsResource.save({accountId:accountId,command:'postInterest'}, {}, function(data){
+              location.path('/viewsavingaccount/' + data.savingsId);
+            });
+          break;
+          case "applyAnnualFees":
+            location.path('/savingaccount/' + accountId + '/applyAnnualFees');
+          break;
+          case "transferFunds":
+          break;
+          case "close":
+            location.path('/savingaccount/' + accountId + '/close');
+          break;
+        }
+      };
+
       resourceFactory.savingsResource.get({accountId: routeParams.id, associations: 'all'}, function(data) {
           scope.savingaccountdetails = data;
           scope.$broadcast('SavingAccountDataLoadingCompleteEvent');
@@ -78,7 +131,7 @@
 
     }
   });
-  mifosX.ng.application.controller('ViewSavingDetailsController', ['$scope', '$routeParams', 'ResourceFactory', mifosX.controllers.ViewSavingDetailsController]).run(function($log) {
+  mifosX.ng.application.controller('ViewSavingDetailsController', ['$scope', '$routeParams', 'ResourceFactory', '$location', mifosX.controllers.ViewSavingDetailsController]).run(function($log) {
     $log.info("ViewSavingDetailsController initialized");
   });
 }(mifosX.controllers || {}));

app/scripts/mifosXComponents.js

@@ -73,7 +73,9 @@ define(['underscore', 'mifosX'], function() {
       'savings/ViewSavingDetailsController',
       'private/SuperuserController',
       'groups/GroupController',
-      'groups/ViewGroupController'
+      'groups/ViewGroupController',
+      'savings/EditSavingAccountController',
+      'savings/SavingAccountActionsController'
     ],
     filters: [
       'StatusLookup'

app/scripts/routes.js

@@ -193,7 +193,7 @@
       .when('/new_saving_application/:clientId', {
         templateUrl: 'views/savings/new_saving_account_application.html'
       })
-      .when('/viewsavings/:id', {
+      .when('/viewsavingaccount/:id', {
         templateUrl: 'views/savings/view_saving_account_details.html'
       })
       .when('/group', {
@@ -201,6 +201,12 @@
       })
       .when('/creategroup', {
         templateUrl: 'views/groups/creategroup.html'
+      })
+      .when('/editsavingaccount/:id', {
+        templateUrl: 'views/savings/edit_saving_account_application.html'
+      })
+      .when('/savingaccount/:id/:action', {
+        templateUrl: 'views/savings/saving_account_actions.html'
       });
     $locationProvider.html5Mode(false);
   };

app/scripts/services/ResourceFactoryProvider.js

@@ -137,9 +137,15 @@
               get: {method: 'GET', params: {}}
           }),
           savingsResource: defineResource(apiVer + "/savingsaccounts/:accountId", {accountId:'@accountId'}, {
-              get: {method: 'GET', params: {accountId:'@accountId'}}
+              get: {method: 'GET', params: {accountId:'@accountId'}},
+              update: {method: 'PUT'}
+          }),
+          savingsTrxnsTemplateResource: defineResource(apiVer + "/savingsaccounts/:savingsId/transactions/template", {savingsId:'@savingsId'}, {
+              get: {method: 'GET', params: {savingsId:'@savingsId'}}
+          }),
+          savingsTrxnsResource: defineResource(apiVer + "/savingsaccounts/:savingsId/transactions/:transactionId", {savingsId:'@savingsId', transactionId:'@transactionId'}, {
+              get: {method: 'GET', params: {savingsId:'@savingsId', transactionId:'@transactionId'}}
           })
-
         };
       }];
     }

app/views/clients/viewclient.html

@@ -134,8 +134,8 @@
                           <th></th>
                         </tr>
                         <tr ng-repeat="savingaccount in clientAccounts.savingsAccounts">
-                          <td><a href="#/viewsavings/{{savingaccount.id}}">{{savingaccount.productName}}</a></td>
-                          <td><a href="#/viewsavings/{{savingaccount.id}}">{{savingaccount.accountNo}}</a></td>
+                          <td><a href="#/viewsavingaccount/{{savingaccount.id}}">{{savingaccount.productName}}</a></td>
+                          <td><a href="#/viewsavingaccount/{{savingaccount.id}}">{{savingaccount.accountNo}}</a></td>
                           <td>{{savingaccount.accountBalance}}</td>         
                           <td>{{savingaccount.status.value}}</td>
                           <td>

app/views/clients/viewclientloanaccountdetails.html

@@ -3,7 +3,7 @@
     <div class="pull-right">
       <div class="btn-group" >
           <span ng-repeat="button in buttons.singlebuttons">
-              <a  ng-show="button.name" ngclick="" class="btn btn-primary" ><i class="{{button.icon}} icon-white" ></i>{{button.name | translate}}</a>
+              <a  ng-show="button.name" ng-click="" class="btn btn-primary" ><i class="{{button.icon}} icon-white" ></i>{{button.name | translate}}</a>
           </span>
           <span ng-show="buttons.options" class="btn-group">
               <a class="btn btn-primary dropdown-toggle">
@@ -12,7 +12,7 @@
               </a>
               <ul class="dropdown dropdown-menu">
                 <li class="{{button.icon}}" ng-repeat="button in buttons.options">
-                    <a ngclick="" >{{button.name | translate}}</a>
+                    <a ng-click="" >{{button.name | translate}}</a>
                 </li>
               </ul>
           </span>  

app/views/savings/edit_saving_account_application.html

@@ -0,0 +1,127 @@
+<form class="well" ng-controller="EditSavingAccountController" ng-submit="submit()">
+  <fieldset>
+    <legend>{{ 'label.edit.saving.application' | translate }}</legend>
+    <table width="80%">
+      <tr class="control-group">
+        <td width="50%">
+          <label class="control-label">{{ 'label.applicant' | translate }}&nbsp;</label>
+          <input type="text" value="{{clientName}}" readonly>
+        </td>
+        <td width="50%">
+          <label class="control-label">{{ 'label.product' | translate }}&nbsp;</label>
+          <select ng-model="formData.productId" ng-options="product.id as product.name for product in products" ng-change="changeProduct()" value="{{product.id}}"></select>
+        </td>
+      </tr>
+    </table>
+    <div collapse="isCollapsed">
+      <table width="80%">
+        <tr class="control-group">
+          <td width="50%">
+            <label class="control-label">{{ 'label.field.officer' | translate }}&nbsp;</label>
+            <select ng-model="formData.fieldOfficerId" ng-options="fieldOfficer.id as fieldOfficer.displayName for fieldOfficer in fieldOfficers" value="{{fieldOfficer.id}}"></select>
+          </td>
+          <td width="50%">
+            <label class="control-label">{{ 'label.submittedon' | translate }}&nbsp;</label>
+            <input type="text" ng-model="formData.submittedOnDate">
+          </td>
+        </tr>
+        <tr class="span2"></tr>
+      </table>
+      <table width="100%">
+        <tr class="control-group">
+          <td width="10%" align="center">
+            <label class="control-label"><h4>{{ 'label.heading.tems' | translate }}</h4></label>
+          </td>
+          <td class="blockquoteresult" width="90%">
+            <table width="100%">
+              <tr>
+                <td width="50%">
+                  <label class="control-label">{{ 'label.currency' | translate }}&nbsp;<b>{{data.currency.name}}({{data.currency.displaySymbol}})</b></label>
+                </td>
+                <td width="50%">
+                  <label class="control-label">{{ 'label.decimalplaces' | translate }}&nbsp;<b>{{data.currency.decimalPlaces}}</b></label>
+                </td>
+              </tr>
+              <tr>
+                <td width="50%">
+                  <label class="control-label">{{ 'label.nominalannualinterestrate' | translate }}&nbsp;</label>
+                  <input type="text" class="input-small" ng-model="formData.nominalAnnualInterestRate">
+                </td>
+                <td width="50%">
+                  <label class="control-label">{{ 'label.currencyinmultiplesof' | translate }}&nbsp;</label>
+                  <input type="text" class="input-small" value="{{data.currency.inMultiplesOf}}" readonly>
+                </td>
+              </tr>
+              <tr>
+                <td width="50%">
+                  <label class="control-label">{{ 'label.interestcompoundingperiod' | translate }}&nbsp;</label>
+                  <select ng-model="formData.interestCompoundingPeriodType" ng-options="type.id as type.value for type in data.interestCompoundingPeriodTypeOptions" value="{{type.id}}">
+                  </select>
+                </td>
+                <td width="50%">
+                  <label class="control-label">{{ 'label.interestpostingperiod' | translate }}&nbsp;</label>
+                  <select ng-model="formData.interestPostingPeriodType" ng-options="type.id as type.value for type in data.interestPostingPeriodTypeOptions" value="{{type.id}}">
+                  </select>
+                </td>
+              </tr>
+              <tr>
+                <td width="50%">
+                  <label class="control-label">{{ 'label.interest.calculated.using' | translate }}&nbsp;</label>
+                  <select ng-model="formData.interestCalculationType" ng-options="type.id as type.value for type in data.interestCalculationTypeOptions" value="{{type.id}}">
+                  </select>
+                </td>
+                <td width="50%">
+                  <label class="control-label">{{ 'label.daysinyears' | translate }}&nbsp;</label>
+                  <select ng-model="formData.interestCalculationDaysInYearType" ng-options="type.id as type.value for type in data.interestCalculationDaysInYearTypeOptions" value="{{type.id}}">
+                  </select>
+                </td>
+              </tr>
+            </table>
+          </td>
+        </tr>
+        <tr class="span2"></tr>
+        <tr class="control-group">
+          <td width="10%" align="center">
+            <label class="control-label"><h4>{{ 'label.heading.settings' | translate }}</h4></label>
+          </td>
+          <td class="blockquoteresult" width="90%">
+            <table width="100%">
+              <tr>
+                <td width="50%">
+                  <label class="control-label">{{ 'label.minimumopeningbalance' | translate }}&nbsp;</label>
+                  <input type="text" class="input-small" ng-model="formData.minRequiredOpeningBalance">
+                </td>
+                <td width="50%">
+                  <label class="control-label">{{ 'label.lockinPeriodFrequency' | translate }}&nbsp;</label>
+                  <input type="text" class="input-small" ng-model="formData.lockinPeriodFrequency">&nbsp;
+                  <select ng-model="formData.lockinPeriodFrequencyType" class="input-small" ng-options="type.id as type.value for type in data.lockinPeriodFrequencyTypeOptions" value="{{type.id}}">
+                  </select>
+                </td>
+              </tr>
+              <tr>
+                <td width="50%">
+                  <label class="control-label">{{ 'label.annual.fee' | translate }}&nbsp;</label>
+                  <input type="text" class="input-small" ng-model="formData.annualFeeAmount">&nbsp;
+                  {{ 'label.on' | translate }}
+                  <input type="text" class="input-small" ng-model="formData.annualFeeOnMonthDay">
+                </td>
+                <td width="50%">
+                  <label class="control-label">{{ 'label.withdrawal.fee' | translate }}&nbsp;</label>
+                  <input type="text" class="input-small" ng-model="formData.withdrawalFeeAmount">&nbsp;
+                  <select ng-model="formData.withdrawalFeeType" class="input-small" ng-options="type.id as type.value for type in data.withdrawalFeeTypeOptions" value="{{type.id}}">
+                  </select><br>
+                  <input type="checkbox" ng-model="formData.withdrawalFeeForTransfers"> &nbsp;<span class="control-label">{{ 'label.withdrawal.fee.for.transfers' | translate }}&nbsp;</span>
+                </td>
+              </tr>
+            </table>
+          </td>
+        </tr>
+      </table>
+    </div>
+    <div class="form-actions" align="center">
+      <button type="reset" class="btn">Cancel</button>
+      <button type="submit" class="btn btn-primary" ng-show="!isCollapsed">Save</button>
+    </div>
+   
+  </fieldset>
+</form>

app/views/savings/saving_account_actions.html

@@ -0,0 +1,81 @@
+<form class="form-horizontal well" ng-controller="SavingAccountActionsController" ng-submit="submit()">
+  <fieldset>
+    <legend>{{ title | translate}}</legend>
+
+    <div class="control-group" ng-show="showDateField">
+      <label class="control-label" for="modelName">{{labelName | translate}}</label>
+      <div class="controls">
+        <input type="text" ng-model="formData[modelName]">
+      </div>
+    </div>
+
+    <div ng-show="isTransaction">
+      <div class="control-group">
+        <label class="control-label" for="transactionAmount">{{ 'label.saving.account.transactionAmount' | translate}}</label>
+        <div class="controls">
+          <input type="text" ng-model="formData.transactionAmount">
+        </div>
+      </div>
+      <div class="control-group">
+        <label class="control-label" for="paymentTypeId">{{ 'label.saving.account.paymentTypeId' | translate}}</label>
+        <div class="controls">
+          <select ng-model="formData.paymentTypeId" ng-options="paymentType.id as paymentType.name for paymentType in paymentTypes" value="{{paymentType.id}}"></select>
+        </div>
+      </div>
+      <div class="control-group">
+        <label class="control-label">{{ 'label.saving.account.show.payment.details' | translate}}</label>
+        <div class="controls">
+          <a class="btn btn-primary" ng-click="showPaymentDetails=!showPaymentDetails">
+            <i ng-show="showPaymentDetails" class="icon-minus icon-white"></i>
+            <i ng-show="!showPaymentDetails" class="icon-plus icon-white"></i>
+          </a>
+        </div>
+      </div>
+      <div collapse="!showPaymentDetails">
+        <div class="control-group">
+          <label class="control-label" for="accountNumber">{{ 'label.saving.account.accountNumber' | translate}}</label>
+          <div class="controls">
+            <input type="text" ng-model="formData.accountNumber">
+          </div>
+        </div>
+        <div class="control-group">
+          <label class="control-label" for="checkNumber">{{ 'label.saving.account.checkNumber' | translate}}</label>
+          <div class="controls">
+            <input type="text" ng-model="formData.checkNumber">
+          </div>
+        </div>
+        <div class="control-group">
+          <label class="control-label" for="routingCode">{{ 'label.saving.account.routingCode' | translate}}</label>
+          <div class="controls">
+            <input type="text" ng-model="formData.routingCode">
+          </div>
+        </div>
+        <div class="control-group">
+          <label class="control-label" for="receiptNumber">{{ 'label.saving.account.receiptNumber' | translate}}</label>
+          <div class="controls">
+            <input type="text" ng-model="formData.receiptNumber">
+          </div>
+        </div>
+        <div class="control-group">
+          <label class="control-label" for="bankNumber">{{ 'label.saving.account.bankNumber' | translate}}</label>
+          <div class="controls">
+            <input type="text" ng-model="formData.bankNumber">
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <div class="control-group" ng-show="showNoteField">
+      <label class="control-label" for="note">{{ 'label.note' | translate}}</label>
+      <div class="controls">
+        <textarea rows="2" ng-model="formData.note"></textarea>
+      </div>
+    </div>
+
+    <div class="form-actions">
+      <button type="reset" class="btn">Cancel</button>
+      <button type="submit" class="btn btn-primary">Save</button>
+    </div>
+
+  </fieldset>
+</form>

app/views/savings/view_saving_account_details.html

@@ -3,7 +3,7 @@
     <div class="pull-right">
       <div class="btn-group" >
           <span ng-repeat="button in buttons.singlebuttons">
-              <a  ng-show="button.name" ngclick="" class="btn btn-primary" ><i class="{{button.icon}} icon-white" ></i>{{button.name | translate}}</a>
+              <a  ng-show="button.name" ng-click="clickEvent(button.name.replace('button.',''), savingaccountdetails.id)" class="btn btn-primary" ><i class="{{button.icon}} icon-white" ></i>{{button.name | translate}}</a>
           </span>
           <span ng-show="buttons.options" class="btn-group">
               <a class="btn btn-primary dropdown-toggle">
@@ -12,7 +12,7 @@
               </a>
               <ul class="dropdown dropdown-menu">
                 <li class="{{button.icon}}" ng-repeat="button in buttons.options">
-                    <a ngclick="" >{{button.name | translate}}</a>
+                    <a ng-click="clickEvent(button.name.replace('button.',''), savingaccountdetails.id)" >{{button.name | translate}}</a>
                 </li>
               </ul>
           </span>