diff --git a/package.json b/package.json index 6b1ba70..2bbec67 100644 --- a/package.json +++ b/package.json @@ -46,11 +46,12 @@ "@nsalaun/ng-logger": "^2.0.1", "@types/angular": "^1.6.25", "@types/node": "^8.0.10", + "@uirouter/angularjs": "^1.0.5", + "@uirouter/core": "^5.0.5", "angular": "^1.6", "angular-http-auth": "^1.5", "angular-messages": "^1.6", "angular-resource": "^1.6", - "angular-route": "^1.6.5", "angular-strap": "^2.3.12", "angular-ui-notification": "^0.3", "base64util": "^1.0.2", diff --git a/src/app.config.ts b/src/app.config.ts index 39b4d3d..d99b853 100644 --- a/src/app.config.ts +++ b/src/app.config.ts @@ -4,27 +4,40 @@ var operationsTmpl = require('./operations/operations.html'); var accountsTmpl = require('./accounts/accounts.html'); var schedulerTmpl = require('./scheduler/scheduler.html'); -export default function AppConfig($routeProvider) { +export default function AppConfig($uiRouterProvider) { + $uiRouterProvider.trace.enable(1); + // Defining template and controller in function of route. - $routeProvider - .when('/account/:accountId/operations', { - templateUrl: operationsTmpl, - controller: 'OperationController', - controllerAs: 'operationsCtrl' - }) - .when('/account/:accountId/scheduler', { - templateUrl: schedulerTmpl, - controller: 'SchedulerController', - controllerAs: 'schedulerCtrl' - }) - .when('/accounts', { - templateUrl: accountsTmpl, - controller: 'AccountController', - controllerAs: 'accountsCtrl' - }) - .otherwise({ - redirectTo: '/accounts' - }); + const $stateRegistry = $uiRouterProvider.stateRegistry; + + $stateRegistry.register({ + name: 'operations', + url: '/account/:accountId/operations', + templateUrl: operationsTmpl, + controller: 'OperationController', + controllerAs: 'operationsCtrl' + }); + + $stateRegistry.register({ + name: 'scheduler', + url: '/account/:accountId/scheduler', + templateUrl: schedulerTmpl, + controller: 'SchedulerController', + controllerAs: 'schedulerCtrl' + }); + + $stateRegistry.register({ + name: 'accounts', + url: '/accounts', + templateUrl: accountsTmpl, + controller: 'AccountController', + controllerAs: 'accountsCtrl' + }); + + const $urlService = $uiRouterProvider.urlService; + $urlService.rules.otherwise({ + state: 'accounts' + }); }; export const ApiBaseURL = "http://localhost:8080/api"; diff --git a/src/app.ts b/src/app.ts index 9902c3b..111395f 100644 --- a/src/app.ts +++ b/src/app.ts @@ -20,7 +20,7 @@ var angular = require('angular'); -var ngRoute = require('angular-route'); +import uiRouter from '@uirouter/angularjs'; import accountModule from '@accountant/accounts'; import loginModule from '@accountant/login'; @@ -32,7 +32,7 @@ import AppConfig from './app.config.ts'; require('bootstrap-webpack!./bootstrap.config.ts'); angular.module('accountant', [ - ngRoute, + uiRouter, accountModule, loginModule, operationModule, diff --git a/src/index.ejs b/src/index.ejs index 71e1d8d..f375f46 100644 --- a/src/index.ejs +++ b/src/index.ejs @@ -39,7 +39,7 @@
-
+
diff --git a/src/operations/balance-chart.component.ts b/src/operations/balance-chart.component.ts index 10cea1c..4c79f5e 100644 --- a/src/operations/balance-chart.component.ts +++ b/src/operations/balance-chart.component.ts @@ -35,12 +35,12 @@ module.exports = angular.module('balanceChartModule', [ account: '<', onUpdate: '&' }, - controller: function($routeParams, Balances, $element) { + controller: function($stateParams, Balances, $element) { var vm = this; vm.loadData = function() { Balances.query({ - id: $routeParams.accountId + id: $stateParams.accountId }, function(results) { var headers = [['date', 'balances', 'expenses', 'revenues']]; diff --git a/src/operations/category-chart.component.ts b/src/operations/category-chart.component.ts index 05e6413..7fc1e64 100644 --- a/src/operations/category-chart.component.ts +++ b/src/operations/category-chart.component.ts @@ -35,12 +35,12 @@ module.exports = angular.module('categoryChartModule', [ minDate: '<', maxDate: '<' }, - controller: function($routeParams, $element, Categories, Incomes) { + controller: function($stateParams, $element, Categories, Incomes) { var vm = this; vm.loadData = function() { Categories.query({ - id: $routeParams.accountId, + id: $stateParams.accountId, begin: vm.minDate ? moment(vm.minDate).format('YYYY-MM-DD') : null, end: vm.maxDate ? moment(vm.maxDate).format('YYYY-MM-DD') : null }, function(results) { diff --git a/src/operations/operation.controller.ts b/src/operations/operation.controller.ts index b8b7546..ea8dd7e 100644 --- a/src/operations/operation.controller.ts +++ b/src/operations/operation.controller.ts @@ -1,7 +1,7 @@ var operationFormTmpl = require('./operation.form.tmpl.html'), operationDeleteTmpl = require('./operation.delete.tmpl.html'); -module.exports = function($routeParams, $modal, Notification, Operation, +module.exports = function($stateParams, $modal, Notification, Operation, AccountService) { var vm = this; @@ -12,7 +12,7 @@ module.exports = function($routeParams, $modal, Notification, Operation, vm.add = function() { var operation = new Operation({ // eslint-disable-next-line camelcase - account_id: $routeParams.accountId + account_id: $stateParams.accountId }); return vm.modify(operation); @@ -27,7 +27,7 @@ module.exports = function($routeParams, $modal, Notification, Operation, return Operation.query({ // eslint-disable-next-line camelcase - account_id: $routeParams.accountId, + account_id: $stateParams.accountId, begin: minDate ? moment(minDate).format('YYYY-MM-DD') : null, end: maxDate ? moment(maxDate).format('YYYY-MM-DD') : null }); @@ -145,7 +145,7 @@ module.exports = function($routeParams, $modal, Notification, Operation, vm.operations = vm.load(minDate, maxDate); }; - AccountService.get($routeParams.accountId).subscribe(account => { + AccountService.get($stateParams.accountId).subscribe(account => { vm.account = account }); }; diff --git a/src/scheduler/schedule.controller.ts b/src/scheduler/schedule.controller.ts index 7a3663f..bb064dc 100644 --- a/src/scheduler/schedule.controller.ts +++ b/src/scheduler/schedule.controller.ts @@ -1,7 +1,7 @@ var scheduleFormTmpl = require('./schedule.form.tmpl.html'), scheduleDeleteTmpl = require('./schedule.delete.tmpl.html'); -module.exports= function($rootScope, $routeParams, Notification, ScheduledOperation, $log, $modal) { +module.exports= function($rootScope, $stateParams, Notification, ScheduledOperation, $log, $modal) { var vm = this; // Operation store. @@ -13,7 +13,7 @@ module.exports= function($rootScope, $routeParams, Notification, ScheduledOperat vm.add = function() { var operation = new ScheduledOperation({ // eslint-disable-next-line camelcase - account_id: $routeParams.accountId + account_id: $stateParams.accountId }); return vm.modify(operation); @@ -25,7 +25,7 @@ module.exports= function($rootScope, $routeParams, Notification, ScheduledOperat vm.load = function() { return ScheduledOperation.query({ // eslint-disable-next-line camelcase - account_id: $routeParams.accountId + account_id: $stateParams.accountId }); };