From 5a28d9717bdd13d864cad36cca5bd2e7f31bf767 Mon Sep 17 00:00:00 2001
From: Tanshu <tanshu@gmail.com>
Date: Wed, 28 Nov 2012 21:36:17 +0530
Subject: [PATCH] Changed the autocomplete from jQuery to Bootstrap.typeahead
 Added DeepLabel factory to get values from inside nested json objects. Split
 SalaryDeductionController into its own file.

---
 .../static/partial/employee-attendance.html   |   2 +-
 .../brewman/static/partial/issue-modal.html   |   2 +-
 brewman/brewman/static/partial/issue.html     |   2 +-
 .../brewman/static/partial/journal-modal.html |   2 +-
 brewman/brewman/static/partial/journal.html   |   2 +-
 brewman/brewman/static/partial/ledger.html    |   2 +-
 .../brewman/static/partial/payment-modal.html |   2 +-
 brewman/brewman/static/partial/payment.html   |   2 +-
 .../static/partial/product-ledger.html        |   2 +-
 .../static/partial/purchase-return-modal.html |   2 +-
 .../static/partial/purchase-return.html       |   4 +-
 brewman/brewman/static/partial/purchase.html  |   4 +-
 .../brewman/static/partial/receipt-modal.html |   2 +-
 brewman/brewman/static/partial/receipt.html   |   2 +-
 .../static/partial/salary-deduction.html      |   2 +-
 .../static/scripts/angular_directive.js       |  40 +++--
 .../brewman/static/scripts/angular_service.js |  21 ++-
 .../static/scripts/employee-functions.js      | 157 -----------------
 .../static/scripts/salary-deduction.js        | 158 ++++++++++++++++++
 brewman/brewman/templates/angular_base.mako   |   1 +
 brewman/brewman/views/account.py              |   2 +-
 brewman/brewman/views/employee.py             |   6 +-
 brewman/brewman/views/product.py              |   3 +-
 brewman/brewman/views/services/batch.py       |   8 +-
 24 files changed, 226 insertions(+), 204 deletions(-)
 create mode 100644 brewman/brewman/static/scripts/salary-deduction.js

diff --git a/brewman/brewman/static/partial/employee-attendance.html b/brewman/brewman/static/partial/employee-attendance.html
index e6c69a56..c9b5bd10 100644
--- a/brewman/brewman/static/partial/employee-attendance.html
+++ b/brewman/brewman/static/partial/employee-attendance.html
@@ -12,7 +12,7 @@
         <label for="txtEmployee" class="control-label">Employee</label>
 
         <div class="controls">
-            <input type="text" ng-autocomplete id="txtEmployee" resource="Employee" model="info.Employee"
+            <input type="text" ng-autocomplete id="txtEmployee" resource="Employee" label="Name" model="info.Employee"
                    value="{{info.Employee.Name}}"/>
             <button class="btn btn-info" ng-click="show()">Show</button>
         </div>
diff --git a/brewman/brewman/static/partial/issue-modal.html b/brewman/brewman/static/partial/issue-modal.html
index 93bc810a..a3bd5526 100644
--- a/brewman/brewman/static/partial/issue-modal.html
+++ b/brewman/brewman/static/partial/issue-modal.html
@@ -6,7 +6,7 @@
     <div class="modal-body">
         <div class=" control-group">
             <label for="editBatch">Product</label>
-            <input type="text" ng-autocomplete id="editBatch" resource="Batch" model="edit.Batch" value="{{edit.Batch.Product.Name}}"/>
+            <input type="text" ng-autocomplete id="editBatch" resource="Batch" label="Name" model="edit.Batch" value="{{edit.Batch.Product.Name}}"/>
             <label for="editQuantity">Quantity</label>
             <input type="text" id="editQuantity" autocomplete="off" class="non-search-box inline"
                    placeholder="Quantity" ng-model="edit.Quantity"/>
diff --git a/brewman/brewman/static/partial/issue.html b/brewman/brewman/static/partial/issue.html
index f9b3906d..6e3b2a12 100644
--- a/brewman/brewman/static/partial/issue.html
+++ b/brewman/brewman/static/partial/issue.html
@@ -62,7 +62,7 @@
         <label for="txtBatch" class="control-label">Product</label>
 
         <div class="controls">
-            <input type="text" ng-autocomplete id="txtBatch" resource="Batch" model="batch" value="{{batch.Name}}"/>
+            <input type="text" ng-autocomplete id="txtBatch" resource="Batch" label="Name" model="batch" value="{{batch.Name}}"/>
             <input type="text" id="txtQuantity" class="span2" autocomplete="off" placeholder="Quantity"
                    ng-model="quantity"/>
             <button class="btn btn-info" ng-click="addInventory()">Add <i class="icon-plus-sign icon-white"></i>
diff --git a/brewman/brewman/static/partial/journal-modal.html b/brewman/brewman/static/partial/journal-modal.html
index 06953c65..72105359 100644
--- a/brewman/brewman/static/partial/journal-modal.html
+++ b/brewman/brewman/static/partial/journal-modal.html
@@ -6,7 +6,7 @@
     <div class="modal-body">
         <div class=" control-group">
             <label for="editAccount">Account</label>
-            <input type="text" ng-autocomplete id="editAccount" resource="Account" model="edit.Ledger"
+            <input type="text" ng-autocomplete id="editAccount" resource="Account" label="Name" model="edit.Ledger"
                    value="{{edit.Ledger.Name}}"/>
             <label for="editAmount">Amount</label>
 
diff --git a/brewman/brewman/static/partial/journal.html b/brewman/brewman/static/partial/journal.html
index 39b612f3..e4f39c74 100644
--- a/brewman/brewman/static/partial/journal.html
+++ b/brewman/brewman/static/partial/journal.html
@@ -15,7 +15,7 @@
                 <option value="1">Dr</option>
                 <option value="-1">Cr</option>
             </select>
-            <input type="text" ng-autocomplete id="txtLedger" resource="Account" model="ledger" value="{{ledger.Name}}"/>
+            <input type="text" ng-autocomplete id="txtLedger" resource="Account" label="Name" model="ledger" value="{{ledger.Name}}"/>
             <div class="input-prepend">
                 <span class="add-on">₹</span><input type="text" id="txtAmount" class="span2" autocomplete="off"
                                                     placeholder="Amount" ng-model="amount"/>
diff --git a/brewman/brewman/static/partial/ledger.html b/brewman/brewman/static/partial/ledger.html
index 5a6d3cb9..6ba6843e 100644
--- a/brewman/brewman/static/partial/ledger.html
+++ b/brewman/brewman/static/partial/ledger.html
@@ -12,7 +12,7 @@
         <label for="txtLedger" class="control-label">Ledger</label>
 
         <div class="controls">
-            <input type="text" ng-autocomplete id="txtLedger" resource="Account" model="info.Ledger" value="{{info.Ledger.Name}}"/>
+            <input type="text" ng-autocomplete id="txtLedger" resource="Account" label="Name" model="info.Ledger" value="{{info.Ledger.Name}}"/>
             <button class="btn btn-info" ng-click="show()">Show <i class="icon-eye-open icon-white"></i></button>
         </div>
     </div>
diff --git a/brewman/brewman/static/partial/payment-modal.html b/brewman/brewman/static/partial/payment-modal.html
index c46251dc..0f58b771 100644
--- a/brewman/brewman/static/partial/payment-modal.html
+++ b/brewman/brewman/static/partial/payment-modal.html
@@ -6,7 +6,7 @@
     <div class="modal-body">
         <div class=" control-group">
             <label for="editAccount">Account</label>
-            <input type="text" ng-autocomplete id="editAccount" resource="Account" model="edit.Ledger" value="{{edit.Ledger.Name}}"/>
+            <input type="text" ng-autocomplete id="editAccount" resource="Account" label="Name" model="edit.Ledger" value="{{edit.Ledger.Name}}"/>
             <label for="editAmount">Amount</label>
 
             <div class="input-prepend input-append">
diff --git a/brewman/brewman/static/partial/payment.html b/brewman/brewman/static/partial/payment.html
index 7a31ce4f..1b812223 100644
--- a/brewman/brewman/static/partial/payment.html
+++ b/brewman/brewman/static/partial/payment.html
@@ -23,7 +23,7 @@
         <label for="txtLedger" class="control-label">Account</label>
 
         <div class="controls">
-            <input type="text" ng-autocomplete id="txtLedger" resource="Account" model="ledger" value="{{ledger.Name}}"/>
+            <input type="text" ng-autocomplete id="txtLedger" resource="Account" label="Name" model="ledger" value="{{ledger.Name}}"/>
             <div class=" input-prepend">
                 <span class="add-on">₹</span>
                 <input type="text" id="txtAmount" class="span2" autocomplete="off"
diff --git a/brewman/brewman/static/partial/product-ledger.html b/brewman/brewman/static/partial/product-ledger.html
index 6992e462..bc24d2c2 100644
--- a/brewman/brewman/static/partial/product-ledger.html
+++ b/brewman/brewman/static/partial/product-ledger.html
@@ -12,7 +12,7 @@
         <label for="txtProduct" class="control-label">Ledger</label>
 
         <div class="controls">
-            <input type="text" ng-autocomplete id="txtProduct" resource="Product" model="info.Product"
+            <input type="text" ng-autocomplete id="txtProduct" resource="Product" label="Name" model="info.Product"
                    value="{{info.Product.Name}}"/>
             <button class="btn btn-info" ng-click="show()">Show <i class="icon-eye-open icon-white"></i></button>
         </div>
diff --git a/brewman/brewman/static/partial/purchase-return-modal.html b/brewman/brewman/static/partial/purchase-return-modal.html
index 80cd7714..24129e2c 100644
--- a/brewman/brewman/static/partial/purchase-return-modal.html
+++ b/brewman/brewman/static/partial/purchase-return-modal.html
@@ -6,7 +6,7 @@
     <div class="modal-body">
         <div class=" control-group">
             <label for="editBatch">Product</label>
-            <input type="text" ng-autocomplete id="editBatch" resource="Batch" model="edit.Batch" value="{{edit.Batch.Product.Name}}"/>
+            <input type="text" ng-autocomplete id="editBatch" resource="Batch" label="Name" model="edit.Batch" value="{{edit.Batch.Product.Name}}"/>
             <label for="editQuantity">Quantity</label>
             <input type="text" id="editQuantity" autocomplete="off" class="non-search-box inline"
                    placeholder="Quantity" ng-model="edit.Quantity"/>
diff --git a/brewman/brewman/static/partial/purchase-return.html b/brewman/brewman/static/partial/purchase-return.html
index eb511387..e15b577c 100644
--- a/brewman/brewman/static/partial/purchase-return.html
+++ b/brewman/brewman/static/partial/purchase-return.html
@@ -12,7 +12,7 @@
         <label for="txtLedger" class="control-label">Ledger</label>
 
         <div class="controls">
-            <input type="text" id="txtLedger" ng-autocomplete resource="Account" model="journal.Ledger" value="{{journal.Ledger.Name}}"/>
+            <input type="text" id="txtLedger" ng-autocomplete resource="Account" label="Name" model="journal.Ledger" value="{{journal.Ledger.Name}}"/>
 
             <div class="input-prepend">
                 <span class="add-on">₹</span><input type="text" id="txtLedgerAmount" class="span2"
@@ -25,7 +25,7 @@
         <label for="txtBatch" class="control-label">Product</label>
 
         <div class="controls">
-            <input type="text" ng-autocomplete id="txtBatch" resource="Batch" model="batch"/>
+            <input type="text" ng-autocomplete id="txtBatch" resource="Batch" label="Name" model="batch"/>
             <input type="text" id="txtQuantity" class="span2" autocomplete="off"
                    placeholder="Quantity" ng-model="quantity"/>
             <button class="btn btn-info" ng-click="addInventory()">Add <i class="icon-plus-sign icon-white"></i>
diff --git a/brewman/brewman/static/partial/purchase.html b/brewman/brewman/static/partial/purchase.html
index a2c00a37..696a3170 100644
--- a/brewman/brewman/static/partial/purchase.html
+++ b/brewman/brewman/static/partial/purchase.html
@@ -12,7 +12,7 @@
         <label for="txtLedger" class="control-label">Account</label>
 
         <div class="controls">
-            <input type="text" id="txtLedger" ng-autocomplete resource="Account" model="journal.Ledger" value="{{journal.Ledger.Name}}"/>
+            <input type="text" id="txtLedger" ng-autocomplete resource="Account" label="Name" model="journal.Ledger" value="{{journal.Ledger.Name}}"/>
 
             <div class="input-prepend">
                 <span class="add-on">₹</span><input type="text" id="txtLedgerAmount" class="span2"
@@ -25,7 +25,7 @@
         <label for="txtProduct" class="control-label">Product</label>
 
         <div class="controls">
-            <input type="text" ng-autocomplete id="txtProduct" class="search-box" resource="Product" model="product"/>
+            <input type="text" ng-autocomplete id="txtProduct" class="search-box" resource="Product" label="Name" model="product"/>
             <input type="text" id="txtQuantity" autocomplete="off" class="non-search-box inline"
                    placeholder="Quantity" ng-model="quantity"/>
             <input type="text" id="txtPrice" autocomplete="off" class="non-search-box inline"
diff --git a/brewman/brewman/static/partial/receipt-modal.html b/brewman/brewman/static/partial/receipt-modal.html
index fe757d59..d1c0da50 100644
--- a/brewman/brewman/static/partial/receipt-modal.html
+++ b/brewman/brewman/static/partial/receipt-modal.html
@@ -6,7 +6,7 @@
     <div class="modal-body">
         <div class=" control-group">
             <label for="editAccount">Account</label>
-            <input type="text" ng-autocomplete id="editAccount" resource="Account" model="edit.Ledger" value="{{edit.Ledger.Name}}"/>
+            <input type="text" ng-autocomplete id="editAccount" resource="Account" label="Name" model="edit.Ledger" value="{{edit.Ledger.Name}}"/>
             <label for="editAmount">Amount</label>
 
             <div class="input-prepend input-append">
diff --git a/brewman/brewman/static/partial/receipt.html b/brewman/brewman/static/partial/receipt.html
index 939fb793..005b57cb 100644
--- a/brewman/brewman/static/partial/receipt.html
+++ b/brewman/brewman/static/partial/receipt.html
@@ -24,7 +24,7 @@
         <label for="txtLedger" class="control-label">Account</label>
 
         <div class="controls">
-            <input type="text" ng-autocomplete id="txtLedger" resource="Account" model="ledger" value="{{ledger.Name}}"/>
+            <input type="text" ng-autocomplete id="txtLedger" resource="Account" label="Name" model="ledger" value="{{ledger.Name}}"/>
             <div class=" input-prepend">
                 <span class="add-on">₹</span>
                 <input type="text" id="txtAmount" class="span2" autocomplete="off"
diff --git a/brewman/brewman/static/partial/salary-deduction.html b/brewman/brewman/static/partial/salary-deduction.html
index 19d98f2f..2609dd53 100644
--- a/brewman/brewman/static/partial/salary-deduction.html
+++ b/brewman/brewman/static/partial/salary-deduction.html
@@ -11,7 +11,7 @@
         <label for="txtEmployee" class="control-label">Employee</label>
 
         <div class="controls">
-            <input type="text" ng-autocomplete id="txtEmployee" resource="Employee" model="employee"
+            <input type="text" ng-autocomplete id="txtEmployee" resource="Employee" label="Name" model="employee"
                    value="{{info.Employee.Name}}"/>
             <input type="text" class="span2" autocomplete="off" placeholder="Gross Salary" ng-model="grossSalary"/>
             <input type="text" class="span2" autocomplete="off" placeholder="Days Worked" ng-model="daysWorked"/>
diff --git a/brewman/brewman/static/scripts/angular_directive.js b/brewman/brewman/static/scripts/angular_directive.js
index 5553d3ca..73317321 100644
--- a/brewman/brewman/static/scripts/angular_directive.js
+++ b/brewman/brewman/static/scripts/angular_directive.js
@@ -1,32 +1,40 @@
 'use strict';
 
 var overlord_directive = angular.module('overlord.directive', []);
-overlord_directive.directive('ngAutocomplete', ['$q', '$parse', function ($q, $parse) {
+overlord_directive.directive('ngAutocomplete', ['$q', '$parse', 'DeepLabel', function ($q, $parse, DeepLabel) {
     return {
         restrict:'A',
         link:function (scope, element, attrs, ngModel) {
-            element.autocomplete({
-                source:function (request, response) {
-                    var Entity = angular.injector(['overlord.service']).get(attrs.resource),
-                        deferred = $q.defer();
+            var labels = [],
+                mapped = {},
+                deepLabel = DeepLabel;
 
-                    deferred.promise.then(function (result) {
-                        response(result);
-                    });
 
-                    Entity.autocomplete({term:request.term, count:20}, function (result) {
-                        scope.$apply(function () {
-                            deferred.resolve(result);
-                        });
+            element.typeahead({
+                source:function (query, process) {
+                    var Entity = angular.injector(['overlord.service']).get(attrs.resource);
+                    Entity.autocomplete({term:query, count:20}, function (result) {
+                        labels = [];
+                        mapped = {};
+                        $.each(result, function (i, item) {
+                            var label = deepLabel(item, attrs.label);
+                            mapped[label] = item
+                            labels.push(label)
+                        })
+                        process(labels)
                     });
                 },
                 minLength:1,
-                autoFocus:true,
-                select:function (event, ui) {
+                items:20,
+                matcher:function (item) {
+                  return true;
+                },
+                updater:function (item) {
                     var model = $parse(attrs.model);
                     var modelSetter = model.assign;
-                    modelSetter(scope, ui.item.model);
+                    modelSetter(scope, mapped[item]);
                     scope.$apply();
+                    return item;
                 }
             });
         }
@@ -161,7 +169,7 @@ overlord_directive.directive('journal-edit', function () {
     };
 });
 
-overlord_directive.directive('ngEditRepeat', ['modal','$parse', function (modal, $parse) {
+overlord_directive.directive('ngEditRepeat', ['modal', '$parse', function (modal, $parse) {
     return {
         restrict:'E',
         template:'' +
diff --git a/brewman/brewman/static/scripts/angular_service.js b/brewman/brewman/static/scripts/angular_service.js
index dc92b3fa..d9acc051 100644
--- a/brewman/brewman/static/scripts/angular_service.js
+++ b/brewman/brewman/static/scripts/angular_service.js
@@ -79,8 +79,8 @@ overlord_service.factory('Product', ['$resource', function ($resource) {
 
 overlord_service.factory('Batch', ['$resource', function ($resource) {
     return $resource('/Batch', {}, {
-            autocomplete:{method:'GET', params:{term:''}, isArray:true}
-        });
+        autocomplete:{method:'GET', params:{term:''}, isArray:true}
+    });
 }]);
 
 overlord_service.factory('ProductGroup', ['$resource', function ($resource) {
@@ -146,3 +146,20 @@ overlord_service.factory('AttendanceTypes', ['$resource', function ($resource) {
 overlord_service.factory('EmployeeAttendance', ['$resource', function ($resource) {
     return $resource('/EmployeeAttendance/:id', {id:'@Employee.LedgerID'});
 }]);
+
+overlord_service.factory('DeepLabel', function () {
+    return function getLabel(o, s) {
+        s = s.replace(/\[(\w+)\]/g, '.$1'); // convert indexes to properties
+        s = s.replace(/^\./, '');           // strip a leading dot
+        var a = s.split('.');
+        while (a.length) {
+            var n = a.shift();
+            if (n in o) {
+                o = o[n];
+            } else {
+                return;
+            }
+        }
+        return o;
+    };
+});
diff --git a/brewman/brewman/static/scripts/employee-functions.js b/brewman/brewman/static/scripts/employee-functions.js
index d333d1e0..b9f7b294 100644
--- a/brewman/brewman/static/scripts/employee-functions.js
+++ b/brewman/brewman/static/scripts/employee-functions.js
@@ -22,160 +22,3 @@ var EmployeeFunctionsCtrl = ['$scope', '$http', function ($scope, $http) {
 
 }]
 
-var SalaryDeductionCtrl = ['$scope', '$location', 'voucher', function ($scope, $location, voucher) {
-    $scope.voucher = voucher;
-    $scope.name = '';
-
-    function getOldItem(ledgerID, items) {
-        for (var i = 0, l = items.length; i < l; i++) {
-            if (items[i].Journal.Ledger.LedgerID === ledgerID) {
-                return journals[i];
-            }
-        }
-
-    }
-
-    function daysInMonthFunction(date) {
-        var months = {
-            Jan:1,
-            Feb:2,
-            Mar:3,
-            Apr:4,
-            May:5,
-            Jun:6,
-            Jul:7,
-            Aug:8,
-            Sep:9,
-            Oct:10,
-            Nov:11,
-            Dev:12
-        }
-        if (!date.match(/^\d{2}-[\w]{3}-[\d]{4}$/g)) {
-            return;
-        }
-        var parts = date.split("-");
-        return new Date(parseInt(parts[2]), months[parts[1]], 0).getDate();
-    }
-
-    function getEsi(grossSalary, daysWorked, daysInMonth) {
-        var limit = 15000,
-            employee_rate = .0175,
-            employer_rate = .0475;
-        var employee = (grossSalary > limit) ? 0 : Math.ceil(employee_rate * grossSalary * daysWorked / daysInMonth)
-        var employer = (grossSalary > limit) ? 0 : Math.ceil(employer_rate * grossSalary * daysWorked / daysInMonth)
-        return {ee:employee, er:employer, both:employee + employer};
-    }
-
-    function getPf(grossSalary, daysWorked, daysInMonth) {
-        var limit = 6500,
-            employee_rate = .12,
-            employer_rate = .12 + .011 + .005 + .0001;
-        var employee = (grossSalary > limit) ? 0 : Math.ceil(employee_rate * grossSalary * daysWorked / daysInMonth)
-        var employer = (grossSalary > limit) ? 0 : Math.ceil(employer_rate * grossSalary * daysWorked / daysInMonth)
-        return {ee:employee, er:employer, both:employee + employer};
-    }
-
-    $scope.add = function () {
-        var oldJournal = getOldItem($scope.employee.LedgerID, this.voucher.SalaryDeductions),
-            grossSalary = parseInt($scope.grossSalary),
-            daysWorked = parseInt($scope.daysWorked),
-            daysInMonth = daysInMonthFunction($scope.voucher.Date),
-            esi = getEsi(grossSalary, daysWorked, daysInMonth),
-            pf = getPf(grossSalary, daysWorked, daysInMonth);
-
-        if (typeof oldJournal !== 'undefined') {
-            $scope.toasts.push({Type:'Error', Message:'Employee has already been added!'});
-        } else {
-            this.voucher.SalaryDeductions.push(
-                {
-                    Journal:{Ledger:$scope.employee},
-                    GrossSalary:grossSalary,
-                    DaysWorked:daysWorked,
-                    EsiEmployee:esi.ee,
-                    PfEmployee:pf.ee,
-                    EsiEmployer:esi.er,
-                    PfEmployer:pf.er
-                }
-            )
-            ;
-        }
-        delete $scope.employee;
-        delete $scope.grossSalary;
-        delete $scope.daysWorked;
-        $('#txtEmployee').val('');
-        $('#txtEmployee').focus();
-    };
-
-    $scope.remove = function (deduction) {
-        var index = this.voucher.SalaryDeductions.indexOf(deduction);
-        this.voucher.SalaryDeductions.splice(index, 1);
-    };
-
-    $scope.preventAlteration = function (voucher) {
-        if (typeof $scope.perms === 'undefined') {
-            return false;
-        } else if (typeof voucher.VoucherID === 'undefined') {
-            return !$scope.perms['Salary Deduction'];
-        } else if (voucher.Posted && !$scope.perms['Edit Posted Vouchers']) {
-            return true;
-        } else if (voucher.User.UserID != $scope.auth.UserID && !$scope.perms["Edit Other User's Vouchers"]) {
-            return true;
-        } else {
-            return false;
-        }
-    };
-
-    $scope.get = function (voucherid) {
-        $scope.voucher = Voucher.get({VoucherID:voucherid}, function (u, putResponseHeaders) {
-            $scope.toasts.push({Type:'Success', Message:''});
-        }, function (data, status) {
-            $scope.toasts.push({Type:'Error', Message:data.data});
-        });
-    };
-
-    $scope.save = function () {
-        $scope.voucher.$save({type:'Salary Deduction'}, function (u, putResponseHeaders) {
-            $scope.toasts.push({Type:'Success', Message:''});
-            $location.path('/SalaryDeduction/' + u.VoucherID);
-        }, function (data, status) {
-            $scope.toasts.push({Type:'Error', Message:data.data});
-        });
-    };
-
-    $scope.delete = function () {
-        $scope.voucher.$delete(function (u, putResponseHeaders) {
-            $scope.toasts.push({Type:'Success', Message:''});
-            $location.path('/SalaryDeduction').replace();
-        }, function (data, status) {
-            $scope.toasts.push({Type:'Error', Message:data.data});
-        });
-    };
-
-    $scope.post = function () {
-        $scope.voucher.$post(function (u, putResponseHeaders) {
-            $scope.toasts.push({Type:'Success', Message:''});
-        }, function (data, status) {
-            $scope.toasts.push({Type:'Error', Message:data.data});
-        });
-    };
-}]
-
-
-SalaryDeductionCtrl.resolve = {
-    voucher:['$q', '$route', 'Voucher', function ($q, $route, Voucher) {
-        var deferred = $q.defer();
-
-        var id = $route.current.params.id;
-
-        var successCb = function (result) {
-            deferred.resolve(result);
-        };
-
-        if (typeof id === 'undefined') {
-            Voucher.get({type:'Salary Deduction'}, successCb);
-        } else {
-            Voucher.get({id:id}, successCb);
-        }
-        return deferred.promise;
-    }]
-};
\ No newline at end of file
diff --git a/brewman/brewman/static/scripts/salary-deduction.js b/brewman/brewman/static/scripts/salary-deduction.js
new file mode 100644
index 00000000..99f057d9
--- /dev/null
+++ b/brewman/brewman/static/scripts/salary-deduction.js
@@ -0,0 +1,158 @@
+'use strict';
+
+var SalaryDeductionCtrl = ['$scope', '$location', 'voucher', function ($scope, $location, voucher) {
+    $scope.voucher = voucher;
+    $scope.name = '';
+
+    function getOldItem(ledgerID, items) {
+        for (var i = 0, l = items.length; i < l; i++) {
+            if (items[i].Journal.Ledger.LedgerID === ledgerID) {
+                return items[i];
+            }
+        }
+    }
+
+    function daysInMonthFunction(date) {
+        var months = {
+            Jan:1,
+            Feb:2,
+            Mar:3,
+            Apr:4,
+            May:5,
+            Jun:6,
+            Jul:7,
+            Aug:8,
+            Sep:9,
+            Oct:10,
+            Nov:11,
+            Dev:12
+        }
+        if (!date.match(/^\d{2}-[\w]{3}-[\d]{4}$/g)) {
+            return;
+        }
+        var parts = date.split("-");
+        return new Date(parseInt(parts[2]), months[parts[1]], 0).getDate();
+    }
+
+    function getEsi(grossSalary, daysWorked, daysInMonth) {
+        var limit = 15000,
+            employee_rate = .0175,
+            employer_rate = .0475;
+        var employee = (grossSalary > limit) ? 0 : Math.ceil(employee_rate * grossSalary * daysWorked / daysInMonth)
+        var employer = (grossSalary > limit) ? 0 : Math.ceil(employer_rate * grossSalary * daysWorked / daysInMonth)
+        return {ee:employee, er:employer, both:employee + employer};
+    }
+
+    function getPf(grossSalary, daysWorked, daysInMonth) {
+        var limit = 6500,
+            employee_rate = .12,
+            employer_rate = .12 + .011 + .005 + .0001;
+        var employee = (grossSalary > limit) ? 0 : Math.ceil(employee_rate * grossSalary * daysWorked / daysInMonth)
+        var employer = (grossSalary > limit) ? 0 : Math.ceil(employer_rate * grossSalary * daysWorked / daysInMonth)
+        return {ee:employee, er:employer, both:employee + employer};
+    }
+
+    $scope.add = function () {
+        var oldJournal = getOldItem($scope.employee.LedgerID, this.voucher.SalaryDeductions),
+            grossSalary = parseInt($scope.grossSalary),
+            daysWorked = parseInt($scope.daysWorked),
+            daysInMonth = daysInMonthFunction($scope.voucher.Date),
+            esi = getEsi(grossSalary, daysWorked, daysInMonth),
+            pf = getPf(grossSalary, daysWorked, daysInMonth);
+
+        if (typeof oldJournal !== 'undefined') {
+            $scope.toasts.push({Type:'Error', Message:'Employee has already been added!'});
+        } else {
+            this.voucher.SalaryDeductions.push(
+                {
+                    Journal:{Ledger:$scope.employee},
+                    GrossSalary:grossSalary,
+                    DaysWorked:daysWorked,
+                    EsiEmployee:esi.ee,
+                    PfEmployee:pf.ee,
+                    EsiEmployer:esi.er,
+                    PfEmployer:pf.er
+                }
+            )
+            ;
+        }
+        delete $scope.employee;
+        delete $scope.grossSalary;
+        delete $scope.daysWorked;
+        $('#txtEmployee').val('');
+        $('#txtEmployee').focus();
+    };
+
+    $scope.remove = function (deduction) {
+        var index = this.voucher.SalaryDeductions.indexOf(deduction);
+        this.voucher.SalaryDeductions.splice(index, 1);
+    };
+
+    $scope.preventAlteration = function (voucher) {
+        if (typeof $scope.perms === 'undefined') {
+            return false;
+        } else if (typeof voucher.VoucherID === 'undefined') {
+            return !$scope.perms['Salary Deduction'];
+        } else if (voucher.Posted && !$scope.perms['Edit Posted Vouchers']) {
+            return true;
+        } else if (voucher.User.UserID != $scope.auth.UserID && !$scope.perms["Edit Other User's Vouchers"]) {
+            return true;
+        } else {
+            return false;
+        }
+    };
+
+    $scope.get = function (voucherid) {
+        $scope.voucher = Voucher.get({VoucherID:voucherid}, function (u, putResponseHeaders) {
+            $scope.toasts.push({Type:'Success', Message:''});
+        }, function (data, status) {
+            $scope.toasts.push({Type:'Error', Message:data.data});
+        });
+    };
+
+    $scope.save = function () {
+        $scope.voucher.$save({type:'Salary Deduction'}, function (u, putResponseHeaders) {
+            $scope.toasts.push({Type:'Success', Message:''});
+            $location.path('/SalaryDeduction/' + u.VoucherID);
+        }, function (data, status) {
+            $scope.toasts.push({Type:'Error', Message:data.data});
+        });
+    };
+
+    $scope.delete = function () {
+        $scope.voucher.$delete(function (u, putResponseHeaders) {
+            $scope.toasts.push({Type:'Success', Message:''});
+            $location.path('/SalaryDeduction').replace();
+        }, function (data, status) {
+            $scope.toasts.push({Type:'Error', Message:data.data});
+        });
+    };
+
+    $scope.post = function () {
+        $scope.voucher.$post(function (u, putResponseHeaders) {
+            $scope.toasts.push({Type:'Success', Message:''});
+        }, function (data, status) {
+            $scope.toasts.push({Type:'Error', Message:data.data});
+        });
+    };
+}]
+
+
+SalaryDeductionCtrl.resolve = {
+    voucher:['$q', '$route', 'Voucher', function ($q, $route, Voucher) {
+        var deferred = $q.defer();
+
+        var id = $route.current.params.id;
+
+        var successCb = function (result) {
+            deferred.resolve(result);
+        };
+
+        if (typeof id === 'undefined') {
+            Voucher.get({type:'Salary Deduction'}, successCb);
+        } else {
+            Voucher.get({id:id}, successCb);
+        }
+        return deferred.promise;
+    }]
+};
diff --git a/brewman/brewman/templates/angular_base.mako b/brewman/brewman/templates/angular_base.mako
index 7f60096d..c1d81301 100644
--- a/brewman/brewman/templates/angular_base.mako
+++ b/brewman/brewman/templates/angular_base.mako
@@ -40,6 +40,7 @@
     <script src="/script/purchase.js"> </script>
     <script src="/script/purchase-return.js"> </script>
     <script src="/script/issue.js"> </script>
+    <script src="/script/salary-deduction.js"> </script>
 
     <script src="/script/employee-attendance.js"> </script>
     <script src="/script/employee-functions.js"> </script>
diff --git a/brewman/brewman/views/account.py b/brewman/brewman/views/account.py
index cd4c9dc6..3da78dc2 100644
--- a/brewman/brewman/views/account.py
+++ b/brewman/brewman/views/account.py
@@ -102,7 +102,7 @@ def show_term(request):
 def ledger_list(type=None, filter=None, count=None):
     list = []
     for index, item in enumerate(LedgerBase.list(type, filter)):
-        list.append({'label': item.name, 'model': {'LedgerID': item.id, 'Name': item.name}})
+        list.append({'LedgerID': item.id, 'Name': item.name})
         if count is not None and index == count - 1:
             break
     return list
diff --git a/brewman/brewman/views/employee.py b/brewman/brewman/views/employee.py
index a986146a..63a999cd 100644
--- a/brewman/brewman/views/employee.py
+++ b/brewman/brewman/views/employee.py
@@ -105,10 +105,8 @@ def show_term(request):
 
     list = []
     for index, item in enumerate(LedgerBase.list(10, filter)):
-        list.append({'label': item.name,
-                     'model': {'LedgerID': item.id, 'Name': item.name, 'Designation': item.designation,
-                               'CostCenter': {'CostCenterID': item.costcenter.id,
-                                              'Name': item.costcenter.name}}})
+        list.append({'LedgerID': item.id, 'Name': item.name, 'Designation': item.designation,
+                     'CostCenter': {'CostCenterID': item.costcenter.id, 'Name': item.costcenter.name}})
         if count is not None and index == count - 1:
             break
     return list
diff --git a/brewman/brewman/views/product.py b/brewman/brewman/views/product.py
index d68ee90e..36e27c2e 100644
--- a/brewman/brewman/views/product.py
+++ b/brewman/brewman/views/product.py
@@ -102,8 +102,7 @@ def show_term(request):
     count = None if count is None or count == '' else int(count)
     list = []
     for index, item in enumerate(Product.list(filter)):
-        list.append({'label': item.full_name,
-                     'model': {'ProductID': item.id, 'Name': item.full_name, 'Price': item.price}})
+        list.append({'ProductID': item.id, 'Name': item.full_name, 'Price': item.price})
         if count is not None and index == count - 1:
             break
     return list
diff --git a/brewman/brewman/views/services/batch.py b/brewman/brewman/views/services/batch.py
index 21016a2f..5e233c4b 100644
--- a/brewman/brewman/views/services/batch.py
+++ b/brewman/brewman/views/services/batch.py
@@ -13,11 +13,9 @@ def batch_term(request):
         text = "{0} ({1}) {2:.2f}@{3:.2f} from {4}".format(item.product.name, item.product.units,
             item.quantity_remaining,
             item.rate, item.name)
-        list.append({'label': text,
-                     'model': {
-                     'Product': {'ProductID': item.product.id, 'Name': item.product.name, 'Units': item.product.units},
-                     'BatchID': item.id, 'Name': text, 'QuantityRemaining': item.quantity_remaining,
-                     'Rate': item.rate, 'Tax': item.tax, 'Discount': item.discount}})
+        list.append({'BatchID': item.id, 'Name': text, 'QuantityRemaining': item.quantity_remaining,
+                     'Rate': item.rate, 'Tax': item.tax, 'Discount': item.discount,
+                     'Product': {'ProductID': item.product.id, 'Name': item.product.name, 'Units': item.product.units}})
         if count is not None and index == count - 1:
             break
     return list