Author: ymartel Date: 2014-04-10 16:01:22 +0200 (Thu, 10 Apr 2014) New Revision: 411 Url: http://forge.chorem.org/projects/chorem/repository/revisions/411 Log: review way to manage pagination on expenseAccount (make it neutral to be reused) review draft of expenseAccount view page Added: trunk/chorem-webmotion/src/main/webapp/js/paginationTable.js Removed: trunk/chorem-webmotion/src/main/webapp/js/expensePagination.js Modified: trunk/chorem-webmotion/src/main/resources/mapping trunk/chorem-webmotion/src/main/webapp/WEB-INF/jsp/financial/expenseAccountView.jsp trunk/chorem-webmotion/src/main/webapp/WEB-INF/jsp/financial/expenseAccounts.jsp trunk/chorem-webmotion/src/main/webapp/WEB-INF/jsp/projects/projects.jsp trunk/chorem-webmotion/src/main/webapp/js/projectPagination.js Modified: trunk/chorem-webmotion/src/main/resources/mapping =================================================================== --- trunk/chorem-webmotion/src/main/resources/mapping 2014-04-09 14:29:44 UTC (rev 410) +++ trunk/chorem-webmotion/src/main/resources/mapping 2014-04-10 14:01:22 UTC (rev 411) @@ -13,8 +13,6 @@ * /sales/funnel/json/* DecoratorFilter.decorate wmDecoratorNo=true * /sales/funnel/partial/* DecoratorFilter.decorate wmDecoratorNo=true * /crm/export DecoratorFilter.decorate wmDecoratorNo=true -* /project/json/* DecoratorFilter.decorate wmDecoratorNo=true -* /financial/json/* DecoratorFilter.decorate wmDecoratorNo=true * /project/editProject.html DecoratorFilter.decorate wmDecoratorNo=true * /hr/employeeEdit/json/* DecoratorFilter.decorate wmDecoratorNo=true * /ascii/* DecoratorFilter.decorate wmDecoratorNo=true @@ -95,13 +93,14 @@ * /crm/quotation/edit/{id} action:crm.QuotationAction.edit * /crm/export action:crm.ExportAction.exportContactBase -GET /project/json/projects?page={page}&count={count} action:project.ProjectsAction.findAllProjects page=1,count=10 +GET /rest/project/projects?page={page}&count={count} action:project.ProjectsAction.findAllProjects page=1,count=10 GET /project/projects view:projects/projects.jsp -GET /project/editProject view:projects/editProject.html +GET /project/editProject.html view:projects/editProject.html PUT /projects/{projectId}/ action:project.ProjectsAction.updateProject #### Expense Accounts #### -GET /financial/json/expenseAccounts?year={year}&month={month}&page={page}&count={count} action:financial.ExpenseAccountAction.findAllExpenseAccounts page=1,count=20 +GET /rest/financial/expenseAccounts?page={page}&count={count} action:financial.ExpenseAccountAction.findAllExpenseAccounts page=1,count=20 +GET /rest/financial/expenseAccounts/{expenseAccountId} action:financial.ExpenseAccountAction.findExpenseAccount GET /financial/expenseAccounts view:financial/expenseAccounts.jsp GET /financial/expenseAccounts/{expenseAccountId} action:financial.ExpenseAccountAction.findExpenseAccount PUT /financial/expenseAccounts/{expenseAccountId} action:financial.ExpenseAccountAction.saveExpenseAccount 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-04-09 14:29:44 UTC (rev 410) +++ trunk/chorem-webmotion/src/main/webapp/WEB-INF/jsp/financial/expenseAccountView.jsp 2014-04-10 14:01:22 UTC (rev 411) @@ -29,40 +29,42 @@ <link data-require="bootstrap-css@*" data-semver="3.0.0" rel="stylesheet" href="<c:url value='http://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css'/>" /> </head> -<div > - <dl> - <dd><a href="<c:url value="/wikitty/view/${expenseAccount.employeeId}"/>">${expenseAccount.employeeName}</a></dd> - <dd>Period : ${expenseAccount.month} / ${expenseAccount.year}</dd> - </dl> -</div> +<div ng-app> + <div > + <dl> + <dd><a href="<c:url value="/wikitty/view/${expenseAccount.employeeId}"/>">${expenseAccount.employeeName}</a></dd> + <dd>Period : {{expenseAccount.month}} / ${expenseAccount.year}</dd> + </dl> + </div> -<div ng-app> - <table> - <tr> - <th>Justif. Nb</th> - <th>Emitted Date</th> - <th>Project</th> - <th>Description</th> - <th>Category</th> - <th>Amount</th> - <th>VAT</th> - <th>total</th> - <th>Payment Date</th> - </tr> - <c:forEach var="expenseEntry" items="${expenseAccount.expenseAccountEntries}"> - <tr> - <td>${expenseEntry.justificationNumber}</td> - <td>{{${expenseEntry.emittedDate}| date:'shortDate'}}</td> - <td><a href="<c:url value="/wikitty/view/${expenseEntry.projectId}"/>">${expenseEntry.projectName}</a></td> - <td>${expenseEntry.description}</td> - <td>${expenseEntry.categoryName}</td> - <td>{{${expenseEntry.amount}|number:2}}</td> - <td>{{${expenseEntry.VAT}|number:2}}</td> - <td>{{${expenseEntry.total}|number:2}}</td> - <td><span ng-if = "${expenseEntry.paymentDate} != 0"> {{${expenseEntry.paymentDate}|date:'shortDate'}}</span></td> - </tr> - </c:forEach> - </table> + <div> + <table> + <tr> + <th>Justif. Nb</th> + <th>Emitted Date</th> + <th>Project</th> + <th>Description</th> + <th>Category</th> + <th>Amount</th> + <th>VAT</th> + <th>total</th> + <th>Payment Date</th> + </tr> + <c:forEach var="expenseEntry" items="${expenseAccount.expenseAccountEntries}"> + <tr> + <td>${expenseEntry.justificationNumber}</td> + <td>{{${expenseEntry.emittedDate}| date:'shortDate'}}</td> + <td><a href="<c:url value="/wikitty/view/${expenseEntry.projectId}"/>">${expenseEntry.projectName}</a></td> + <td>${expenseEntry.description}</td> + <td>${expenseEntry.categoryName}</td> + <td>{{${expenseEntry.amount}|number:2}}</td> + <td>{{${expenseEntry.VAT}|number:2}}</td> + <td>{{${expenseEntry.total}|number:2}}</td> + <td><span ng-if = "${expenseEntry.paymentDate} != 0"> {{${expenseEntry.paymentDate}|date:'shortDate'}}</span></td> + </tr> + </c:forEach> + </table> + </div> </div> <div> Modified: trunk/chorem-webmotion/src/main/webapp/WEB-INF/jsp/financial/expenseAccounts.jsp =================================================================== --- trunk/chorem-webmotion/src/main/webapp/WEB-INF/jsp/financial/expenseAccounts.jsp 2014-04-09 14:29:44 UTC (rev 410) +++ trunk/chorem-webmotion/src/main/webapp/WEB-INF/jsp/financial/expenseAccounts.jsp 2014-04-10 14:01:22 UTC (rev 411) @@ -29,14 +29,20 @@ <script data-require="ng-table@*" data-semver="0.3.0" src="<c:url value='http://bazalt-cms.com/assets/ng-table/0.3.0/ng-table.js'/>"></script> <link data-require="ng-table@*" data-semver="0.3.0" rel="stylesheet" href="<c:url value='http://bazalt-cms.com/assets/ng-table/0.3.0/ng-table.css'/>" /> <link data-require="bootstrap-css@*" data-semver="3.0.0" rel="stylesheet" href="<c:url value='http://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css'/>" /> - <script type="text/javascript" src="<c:url value='/js/expensePagination.js'/>"></script> + <script type="text/javascript" src="<c:url value='/js/paginationTable.js'/>"></script> + <script> + angular.module('Pagination').value('paginationInit', { + url : "<c:url value="/rest/financial/expenseAccounts"/>", + params: {page: 1, count: 10} + }); + </script> </head> -<div ng-app="expenseAccountList" ng-controller="PageCtrl"> +<div ng-app="Pagination" ng-controller="PageCtrl"> <div loading-container="tableParams.settings().$loading"> <table ng-table="tableParams" show-filter="false" class="table"> - <tbody ng-repeat="expenseAccount in expenseAccounts"> + <tbody ng-repeat="expenseAccount in elements"> <tr id="tr{{expenseAccount.id}}" ng-class-odd="'odd'" ng-class-even="'even'"> <td data-title="'Employee'"> <a href="<c:url value="/wikitty/view/{{expenseAccount.employeeId}}"/>">{{expenseAccount.employeeName}}</a> Modified: trunk/chorem-webmotion/src/main/webapp/WEB-INF/jsp/projects/projects.jsp =================================================================== --- trunk/chorem-webmotion/src/main/webapp/WEB-INF/jsp/projects/projects.jsp 2014-04-09 14:29:44 UTC (rev 410) +++ trunk/chorem-webmotion/src/main/webapp/WEB-INF/jsp/projects/projects.jsp 2014-04-10 14:01:22 UTC (rev 411) @@ -31,9 +31,15 @@ <link data-require="ng-table@*" data-semver="0.3.0" rel="stylesheet" href="<c:url value='http://bazalt-cms.com/assets/ng-table/0.3.0/ng-table.css'/>" /> <link data-require="bootstrap-css@*" data-semver="3.0.0" rel="stylesheet" href="<c:url value='http://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css'/>" /> <script type="text/javascript" src="<c:url value='/js/projectPagination.js'/>"></script> + <script> + angular.module('Pagination').value('paginationInit', { + url : "<c:url value="/rest/project/projects"/>", + params : {page: 1, count: 10, sorting: {name: 'asc'}} + }); + </script> </head> -<div ng-app="projectList" ng-controller="PageCtrl"> +<div ng-app="Pagination" ng-controller="PageCtrl"> <div loading-container="tableParams.settings().$loading"> <table ng-table="tableParams" show-filter="true" class="table"> Deleted: trunk/chorem-webmotion/src/main/webapp/js/expensePagination.js =================================================================== --- trunk/chorem-webmotion/src/main/webapp/js/expensePagination.js 2014-04-09 14:29:44 UTC (rev 410) +++ trunk/chorem-webmotion/src/main/webapp/js/expensePagination.js 2014-04-10 14:01:22 UTC (rev 411) @@ -1,70 +0,0 @@ -/* - * #%L - * Chorem :: webmotion - * $Id$ - * $HeadURL$ - * %% - * Copyright (C) 2011 - 2014 CodeLutin - * %% - * This program is free software: you can redistribute it and/or modify - * it under the terms of the GNU Affero General Public License as published by - * the Free Software Foundation, either version 3 of the License, or - * (at your option) any later version. - * - * This program is distributed in the hope that it will be useful, - * but WITHOUT ANY WARRANTY; without even the implied warranty of - * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the - * GNU General Public License for more details. - * - * You should have received a copy of the GNU Affero General Public License - * along with this program. If not, see <http://www.gnu.org/licenses/>. - * #L% - */ -var app = angular.module('expenseAccountList', ['ngTable', 'ngResource']); - -app.controller('PageCtrl', - function($scope, $timeout, $resource, ngTableParams) { - - var Api = $resource('json/expenseAccounts'); - - $scope.tableParams = new ngTableParams({ - page: 1, // show first page - count: 20, - year: 2014, - month: 03 - }, { - total: 0, // length of data - getData: function($defer, params) { - - // ajax request to api - url = params.url(); - Api.get(url, function(data) { - $timeout(function() { - // update table params - params.total(data.total); - console.log(data); - // set new data - $scope.expenseAccounts = data.elements; - $defer.resolve(data); - }, 500); - }); - } - }); - -}); - -angular.module('expenseAccountList') -.directive('loadingContainer', function () { - return { - restrict: 'A', - scope: false, - link: function(scope, element, attrs) { - var loadingLayer = angular.element('<div class="loading"></div>'); - element.append(loadingLayer); - element.addClass('loading-container'); - scope.$watch(attrs.loadingContainer, function(value) { - loadingLayer.toggleClass('ng-hide', !value); - }); - } - }; -}); \ No newline at end of file Copied: trunk/chorem-webmotion/src/main/webapp/js/paginationTable.js (from rev 410, trunk/chorem-webmotion/src/main/webapp/js/expensePagination.js) =================================================================== --- trunk/chorem-webmotion/src/main/webapp/js/paginationTable.js (rev 0) +++ trunk/chorem-webmotion/src/main/webapp/js/paginationTable.js 2014-04-10 14:01:22 UTC (rev 411) @@ -0,0 +1,64 @@ +/* + * #%L + * Chorem :: webmotion + * $Id$ + * $HeadURL$ + * %% + * Copyright (C) 2011 - 2014 CodeLutin + * %% + * This program is free software: you can redistribute it and/or modify + * it under the terms of the GNU Affero General Public License as published by + * the Free Software Foundation, either version 3 of the License, or + * (at your option) any later version. + * + * This program is distributed in the hope that it will be useful, + * but WITHOUT ANY WARRANTY; without even the implied warranty of + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the + * GNU General Public License for more details. + * + * You should have received a copy of the GNU Affero General Public License + * along with this program. If not, see <http://www.gnu.org/licenses/>. + * #L% + */ +var app = angular.module('Pagination', ['ngTable', 'ngResource']); + +app.controller('PageCtrl', + function($scope, $timeout, $resource, ngTableParams, paginationInit) { + + var Api = $resource(paginationInit.url); + + $scope.tableParams = new ngTableParams( + paginationInit.params, { + total: 0, // length of data + getData: function($defer, params) { + + // ajax request to api + url = params.url(); + Api.get(url, function(data) { + $timeout(function() { + // update table params + params.total(data.total); + // set new data + $scope.elements = data.elements; + $defer.resolve(data); + }, 500); + }); + } + }); + +}); + +angular.module('Pagination').directive('loadingContainer', function () { + return { + restrict: 'A', + scope: false, + link: function(scope, element, attrs) { + var loadingLayer = angular.element('<div class="loading"></div>'); + element.append(loadingLayer); + element.addClass('loading-container'); + scope.$watch(attrs.loadingContainer, function(value) { + loadingLayer.toggleClass('ng-hide', !value); + }); + } + }; +}); \ No newline at end of file Modified: trunk/chorem-webmotion/src/main/webapp/js/projectPagination.js =================================================================== --- trunk/chorem-webmotion/src/main/webapp/js/projectPagination.js 2014-04-09 14:29:44 UTC (rev 410) +++ trunk/chorem-webmotion/src/main/webapp/js/projectPagination.js 2014-04-10 14:01:22 UTC (rev 411) @@ -20,27 +20,21 @@ * along with this program. If not, see <http://www.gnu.org/licenses/>. * #L% */ -var app = angular.module('projectList', ['ngTable', 'ngResource']); +var app = angular.module('Pagination', ['ngTable', 'ngResource']); app.controller('PageCtrl', - function($scope, $timeout, $resource, ngTableParams) { + function($scope, $timeout, $resource, ngTableParams, paginationInit) { - var Api = $resource('json/projects'); + var Api = $resource(paginationInit.url); - $scope.tableParams = new ngTableParams({ - page: 1, // show first page - count: 10, - sorting: { - name: 'asc' // initial sorting - } - }, { + $scope.tableParams = new ngTableParams( + paginationInit.params, { total: 0, // length of data getData: function($defer, params) { var sorting = params.sorting(); var orderBy = Object.keys(sorting)[0]; var ordering = orderBy + "." + sorting[orderBy]; - console.log(ordering); // ajax request to api url = params.url(); @@ -77,8 +71,7 @@ }); -angular.module('projectList') -.directive('loadingContainer', function () { +angular.module('Pagination').directive('loadingContainer', function () { return { restrict: 'A', scope: false,