Author: ymartel Date: 2014-08-08 10:10:43 +0200 (Fri, 08 Aug 2014) New Revision: 429 Url: http://forge.chorem.org/projects/chorem/repository/revisions/429 Log: Manage edition of Employee & Period start/end date in ExpenseAccount View Modified: trunk/chorem-webmotion/src/main/webapp/WEB-INF/jsp/financial/expenseAccountView.jsp trunk/chorem-webmotion/src/main/webapp/js/financial/expenseAccount.js Modified: trunk/chorem-webmotion/src/main/webapp/WEB-INF/jsp/financial/expenseAccountView.jsp =================================================================== --- trunk/chorem-webmotion/src/main/webapp/WEB-INF/jsp/financial/expenseAccountView.jsp 2014-08-07 12:04:36 UTC (rev 428) +++ trunk/chorem-webmotion/src/main/webapp/WEB-INF/jsp/financial/expenseAccountView.jsp 2014-08-08 08:10:43 UTC (rev 429) @@ -39,27 +39,33 @@ <div ng-app='expenseAccountPage' ng-controller="expenseAccountView"> <div > <dl> - <dd ng-if="expenseAccount && expenseAccount.employeeId"><a href="<c:url value="/wikitty/view/{{expenseAccount.employeeId}}"/>">{{expenseAccount.employeeName}}</a></dd> - <dd ng-if="!expenseAccount || !expenseAccount.employeeId"> + <dd ng-show="editEmployee"> <input type="text" ng-model="expenseAccount.employeeName" id="text-expenseAccount-employee" auto-complete data-source="Employee" data-model="expenseAccount" data-base-field="employee" /> <input type="hidden" ng-model="expenseAccount.employeeId" id="hidden-expenseAccount-employee"/> </dd> - <dd ng-if="editPeriod == false">Period from {{expenseAccount.startDate |date : "dd/MM/yyyy"}} to {{expenseAccount.endDate |date : "dd/MM/yyyy"}}</dd> - <dd ng-if="editPeriod == true"> - <label for="expenseAccountStartDate">Start Date :</label> + <dd ng-show="!editEmployee"> + <a href="<c:url value="/wikitty/view/{{expenseAccount.employeeId}}"/>">{{expenseAccount.employeeName}}</a> + <span class="glyphicon glyphicon-pencil" ng-click="editEmployee = !editEmployee; hasChanged = true"></span> + </dd> + <dd ng-show="!editPeriod"> + <span>Period from {{expenseAccount.startDate |date : "dd/MM/yyyy"}} to {{expenseAccount.endDate |date : "dd/MM/yyyy"}}</span> + <span class="glyphicon glyphicon-pencil" ng-click="editPeriod = !editPeriod; hasChanged = true"></span> + </dd> + + <dd ng-show="editPeriod"> + <span>From </span> <input id="expenseAccountBeginDate" class="form-control" type="text" datepicker-popup="dd/MM/yyyy" ng-model="expenseAccount.startDate" is-open="startDateOpened" - ng-click="startDateOpened = true" /> - </dd> - <dd ng-if="editPeriod == true"> - <label for="expenseAccountEndDate">EndDate :</label> + ng-click="startDateOpened = true"/> + <span>To :</span> <input id="expenseAccountEndDate" class="form-control" type="text" datepicker-popup="dd/MM/yyyy" ng-model="expenseAccount.endDate" is-open="endDateOpened" ng-click="endDateOpened = true" /> + </dd> </dd> </dl> @@ -92,8 +98,9 @@ <tr ng-if="showNewLine == true" ng-include src="'expenseAccountEntryEdit.html'"></tr> </table> </div> - <a class="btn btn-success" ng-click="newLine()"><i class="icon-list icon-white"></i> New entry</a> - <div ng-if="hasChanged == true"> + <a class="btn btn-success" ng-click="newLine()" ng-show="!showNewLine"><i class="icon-list icon-white"></i> New entry</a> + <a class="btn btn-danger" ng-click="newLine()" ng-show="showNewLine"><i class="icon-list icon-white"></i> Cancel</a> + <div ng-show="hasChanged"> <a class="btn btn-success" ng-click="saveExpenseAccount()"><i class="icon-od icon-white"></i>Save</a> </div> Modified: trunk/chorem-webmotion/src/main/webapp/js/financial/expenseAccount.js =================================================================== --- trunk/chorem-webmotion/src/main/webapp/js/financial/expenseAccount.js 2014-08-07 12:04:36 UTC (rev 428) +++ trunk/chorem-webmotion/src/main/webapp/js/financial/expenseAccount.js 2014-08-08 08:10:43 UTC (rev 429) @@ -4,30 +4,28 @@ $scope.showNewLine = false; $scope.expenseAccount = expenseAccountInit.expenseAccount; - $scope.editPeriod = expenseAccountInit && expenseAccountInit.id ? false : true; + $scope.editPeriod = $scope.expenseAccount && $scope.expenseAccount.startDate && $scope.expenseAccount.endDate ? false : true; + $scope.editEmployee = $scope.expenseAccount && $scope.expenseAccount.employeeId ? false : true; - console.log("expenseAccount is"); - console.log(expenseAccountInit); - $scope.baseURL = expenseAccountInit.baseURL; $scope.newLine = function() { - if ($scope.showNewLine === true) { - $scope.showNewLine = false; - delete $scope.newExpenseAccountEntry; - } else { - $scope.showNewLine = true; - $scope.newExpenseAccountEntry = { - justificationNumber: '', - emittedDate : '', - project: '', - description: '', - category: '', - amount: '', - VAT: '', - total: '' + if ($scope.showNewLine === true) { + $scope.showNewLine = false; + delete $scope.newExpenseAccountEntry; + } else { + $scope.showNewLine = true; + $scope.newExpenseAccountEntry = { + justificationNumber: '', + emittedDate : '', + project: '', + description: '', + category: '', + amount: '', + VAT: '', + total: '' }; - } + } } $scope.ac_options = { @@ -36,37 +34,39 @@ $scope.addLine = function() { - if(!$scope.expenseAccount.expenseAccountEntries) { - $scope.expenseAccount.expenseAccountEntries = []; - } - $scope.newExpenseAccountEntry.total = $scope.newExpenseAccountEntry.amount + $scope.newExpenseAccountEntry.VAT; + if(!$scope.expenseAccount.expenseAccountEntries) { + $scope.expenseAccount.expenseAccountEntries = []; + } + $scope.newExpenseAccountEntry.total = $scope.newExpenseAccountEntry.amount + $scope.newExpenseAccountEntry.VAT; - if (angular.isDate($scope.newExpenseAccountEntry.emittedDate)) { - $scope.newExpenseAccountEntry.emittedDate = $scope.newExpenseAccountEntry.emittedDate.getTime(); - } + if (angular.isDate($scope.newExpenseAccountEntry.emittedDate)) { + $scope.newExpenseAccountEntry.emittedDate = $scope.newExpenseAccountEntry.emittedDate.getTime(); + } - $scope.expenseAccount.expenseAccountEntries.push($scope.newExpenseAccountEntry); + $scope.expenseAccount.expenseAccountEntries.push($scope.newExpenseAccountEntry); - $scope.hasChanged = true; - $scope.showNewLine = false; - delete $scope.newExpenseAccountEntry; + $scope.hasChanged = true; + $scope.showNewLine = false; + delete $scope.newExpenseAccountEntry; }; $scope.saveExpenseAccount = function() { - console.log($scope.expenseAccount) + console.log($scope.expenseAccount) - url = $scope.baseURL + "financial/expenseAccounts/" + $scope.expenseAccount.id; - if (angular.isDate($scope.expenseAccount.startDate)) { - $scope.expenseAccount.startDate = $scope.expenseAccount.startDate.getTime(); - } - if (angular.isDate($scope.expenseAccount.endDate)) { - $scope.expenseAccount.endDate = $scope.expenseAccount.endDate.getTime(); - } + url = $scope.baseURL + "financial/expenseAccounts/" + $scope.expenseAccount.id; + if (angular.isDate($scope.expenseAccount.startDate)) { + $scope.expenseAccount.startDate = $scope.expenseAccount.startDate.getTime(); + } + if (angular.isDate($scope.expenseAccount.endDate)) { + $scope.expenseAccount.endDate = $scope.expenseAccount.endDate.getTime(); + } - $resource('url', { expenseAccountId : $scope.expenseAccount.id, expenseAccountBean : $scope.expenseAccount }, {'update' : {method:'PUT'}}).update(function(result) { - console.log("saved!"); - }); + $resource('url', { expenseAccountId : $scope.expenseAccount.id, expenseAccountBean : $scope.expenseAccount }, {'update' : {method:'PUT'}}).update(function(result) { + $scope.hasChanged = false; + $scope.editPeriod = $scope.expenseAccount && $scope.expenseAccount.startDate && $scope.expenseAccount.endDate ? false : true; + $scope.editEmployee = $scope.expenseAccount && $scope.expenseAccount.employeeId ? false : true; + }); }; });