Add commodity and quantity to input forms

This commit is contained in:
2016-08-11 09:27:38 -04:00
parent 0b0cb7c73a
commit f4e3ac1cce
11 changed files with 200 additions and 29 deletions
@@ -11,14 +11,22 @@
}
}
controller.$inject = ['$scope', 'inventorySvc'];
function controller($scope, inventorySvc) {
controller.$inject = ['$scope', 'inventorySvc', 'inventoryTypeSvc'];
function controller($scope, inventorySvc, inventoryTypeSvc) {
var vm = this;
vm.add = add;
vm.saving = false;
vm.inventory = {};
vm.inventoryTypes = inventoryTypeSvc.inventoryTypes;
vm.errorMessage = null;
vm.quantity = quantity;
function quantity() {
vm.inventory.quantity =
$scope.palletCount * $scope.casesPerPallet + $scope.caseCount;
return vm.inventory.quantity;
}
function add() {
vm.saving = true;
@@ -34,5 +42,10 @@
vm.saving = false;
});
}
$scope.$watch('commodity', function (newValue, oldValue) {
if (newValue)
vm.inventory.inventoryTypeId = newValue.id;
});
}
})();
@@ -19,7 +19,6 @@
vm.inventory = $scope.inventory;
vm.edit = edit;
vm.inventory = $scope.inventory;
function edit() {
$uibModal.open({
@@ -11,7 +11,7 @@
add: add,
update: update,
inventories: inventories,
getInventory: getInventory
getInventory: getInventory,
};
return svc;
@@ -42,6 +42,56 @@
if (inventories[i].Id == id) return inventories[i];
}
return null;
}
}
})();
(function () {
window.app.factory('inventoryTypeSvc', inventoryTypeSvc);
inventoryTypeSvc.$inject = ['$http'];
function inventoryTypeSvc($http) {
var inventoryTypes = [];
loadInventoryTypes();
var svc = {
add: add,
update: update,
inventoryTypes: inventoryTypes,
getInventoryType: getInventoryType
};
return svc;
function loadInventoryTypes() {
$http.post('/InventoryType/All')
.success(function (data) {
inventoryTypes.addRange(data);
});
}
function add(inventoryType) {
return $http.post('/InventoryType/Add', inventoryType)
.success(function (inventoryType) {
inventoryTypes.unshift(inventoryType);
});
}
function update(existingInventory, updatedInventory) {
return $http.post('/InventoryType/Update', updatedInventory)
.success(function (inventory) {
angular.extend(existingInventory, inventory);
});
}
function getInventoryType(id) {
for (var i = 0; i < inventoryTypes.length; i++) {
if (inventoryTypes[i].Id == id) return inventoryTypes[i];
}
return null;
}
}
@@ -17,20 +17,81 @@
<div class="alert alert-info" ng-hide="vm.errorMessage != null">
Enter details for the inventory arrival below.
</div>
<div class="alert alert-danger" ng-show="vm.errorMessage != null">
{{vm.errorMessage}}
</div>
<div class="alert alert-danger" ng-show="vm.errorMessage != null">
{{vm.errorMessage}}
</div>
@inventory.FormGroupFor(m => m.ExpirationDate)
@inventory.FormGroupFor(m => m.AddedDate)
@inventory.FormGroupFor(m => m.Memo)
<script type="text/ng-template" id="commodityTypeahead.html">
<a>
<span ng-bind-html="match.label.name | uibTypeaheadHighlight:query"></span>
</a>
</script>
</div>
<div class="form-group has-feedback" ng-class="vm.getValidationClass()" form-group-validation="Commodity">
<label for="Commodity" class="control-label">Commodity</label>
<input name="Commodity" type="text"
ng-model="commodity"
required
uib-typeahead="inventoryType as inventoryType.name for inventoryType in vm.inventoryTypes | filter:{name:$viewValue} | limitTo:8"
typeahead-editable='false'
class="form-control">
<i class="fa fa-search form-control-feedback"></i>
<div class="panel panel-default" ng-show="commodity.id">
<div class="panel-heading">Selected Commodity</div>
<div class="panel-body">
<dl class="dl-horizontal">
<dt>Commodity ID</dt>
<dd>{{commodity.id}}</dd>
<dt>Name</dt>
<dd>{{commodity.name}}</dd>
<dt>Units per Case</dt>
<dd>{{commodity.unitsPerCase}} / {{commodity.containerType}}</dd>
</dl>
</div>
</div>
</div>
<div class="modal-footer">
<button class="btn btn-success">Add</button>
<button type="button" class="btn" ng-click="$dismiss()">Cancel</button>
</div>
@inventory.FormGroupFor(m => m.ExpirationDate)
<div class="form-group has-feedback panel panel-default">
<div class="panel-heading"><label>Quantity</label></div>
<div class="panel-body container-fluid">
<div class="row">
<div class="col-sm-5">Pallets</div>
<div class="col-sm-3">
<input type="number" class="form-control" ng-model="palletCount" />
</div>
</div>
<div class="row">
<div class="col-sm-4 col-sm-offset-1">Cases per Pallet</div>
<div class="col-sm-3">
<input type="number" class="form-control" ng-model="casesPerPallet" />
</div>
</div>
<hr />
<div class="row">
<div class="col-sm-5">Individual Cases</div>
<div class="col-sm-3">
<input type="number" class="form-control" ng-model="caseCount" />
</div>
</div>
<hr />
<div class="row">
<div class="col-sm-5">Total Units</div>
<div class="col-sm-3">{{vm.quantity()}}</div>
</div>
</div>
</div>
@inventory.FormGroupFor(m => m.AddedDate)
@inventory.FormGroupFor(m => m.Memo)
</div>
<div class="modal-footer">
<button class="btn btn-success">Add</button>
<button type="button" class="btn" ng-click="$dismiss()">Cancel</button>
</div>
</fieldset>
</form>