diff options
author | 2016-02-07 22:07:30 +0100 | |
---|---|---|
committer | 2016-02-08 15:31:43 +0000 | |
commit | 4297ef6abf96b5fd1d6e0f1078a1ee9a76dc3f32 (patch) | |
tree | b570b0ae4916278994276eee37ffaf1f2f3bce0c /vbd/gui/module/src/main/resources/vpp/controllers | |
parent | f5e3e98d5c14252db91b8642028728553b43baca (diff) |
Inventory rework 2
- added detail page
- lot of design changes
- lot of css overrides
Change-Id: Ia1735272297c0913f971728acc6775cce93d4646
Signed-off-by: Daniel Malachovsky <daniel.malachovsky@pantheon.sk>
Diffstat (limited to 'vbd/gui/module/src/main/resources/vpp/controllers')
-rw-r--r-- | vbd/gui/module/src/main/resources/vpp/controllers/inventory.controller.js | 141 | ||||
-rw-r--r-- | vbd/gui/module/src/main/resources/vpp/controllers/vpp.controller.js | 5 |
2 files changed, 106 insertions, 40 deletions
diff --git a/vbd/gui/module/src/main/resources/vpp/controllers/inventory.controller.js b/vbd/gui/module/src/main/resources/vpp/controllers/inventory.controller.js index c579796e2..c8ca1e575 100644 --- a/vbd/gui/module/src/main/resources/vpp/controllers/inventory.controller.js +++ b/vbd/gui/module/src/main/resources/vpp/controllers/inventory.controller.js @@ -19,6 +19,7 @@ define(['app/vpp/vpp.module'], function(vpp) { function(data) { $scope.vppList = data; $scope.displayVppList = [].concat($scope.vppList); + dataService.vpps = $scope.vppList; $scope.$broadcast('RELOAD_VPP_TABLE'); }, @@ -34,10 +35,10 @@ define(['app/vpp/vpp.module'], function(vpp) { $scope.displayVppList = []; //setting reference for vpp access in BDM - dataService.vpps = $scope.vppList; + //dataService.vpps = $scope.vppList; }; - $scope.viewTopology = function(vpp) { + /*$scope.viewTopology = function(vpp) { $mdDialog.show({ controller: function() { var vm = this; @@ -129,7 +130,7 @@ define(['app/vpp/vpp.module'], function(vpp) { parent: angular.element(document.body), clickOutsideToClose:true }) - }; + };*/ $scope.addVppShowForm = function() { $mdDialog.show({ @@ -236,52 +237,112 @@ define(['app/vpp/vpp.module'], function(vpp) { $scope.getVppList(); }]); - vpp.register.controller('InventoryTableDefinitonController', ['$scope', function($scope) { + vpp.register.controller('InventoryDetailController', ['$scope', '$rootScope','$filter', 'toastService', 'dataService', + function($scope, $rootScope, filter, toastService, dataService) { + $scope.displayInterfaceList = [].concat($scope.selectedVpp.interfaces); + $scope.vppList = dataService.vpps; - var actionCellTemplate = - '<md-button ng-click="grid.appScope.viewTopology(row.entity)"><span style="color:black !important;">View Topology</span></md-button>' + - '<md-button ng-click="grid.appScope.editVppShowForm(row.entity)" ng-hide="row.entity.status === \'connected\'"><span style="color:black !important;">Edit</span></md-button>' + - '<md-button ng-click="grid.appScope.deleteVpp(row.entity)"><span style="color:black !important;">Delete</span></md-button>'; + $scope.viewTopology = function(vpp) { - $scope.gridOptions = { + var vm = this; + + $scope.topo = new nx.graphic.Topology({ + height: 400, + width: 800, + scalable: true, + theme:'blue', + enableGradualScaling:true, + nodeConfig: { + color: '#ffffff', + label: 'model.label', + scale: 'model.scale', + iconType: function(vertex) { + var type = vertex.get().type; + if (type === 'bd') { + return 'bd' + } else if (type === 'vpp') { + return 'switch' + } else { + return 'interf'; + } + } + }, + linkConfig: { + label: 'model.label', + linkType: 'parallel', + color: function(link) { + if (link.getData().type === 'tunnel') { + return '#ffffff'; + } else { + return '#ffffff'; + } + }, + width: function(link) { + if (link.getData().type === 'tunnel') { + return 5; + } + } + }, + showIcon: true, + dataProcessor: 'force', + autoLayout: true, + enableSmartNode: false, + tooltipManagerConfig: { + nodeTooltipContentClass: 'TooltipNode', + linkTooltipContentClass: 'TooltipLink' + } + }); + $scope.app = new nx.ui.Application; - expandableRowTemplate: $scope.view_path + 'inventory-table-interfaces-subgrid.tpl.html', - //subGridVariable will be available in subGrid scope - expandableRowScope: { - subGridVariable: 'subGridScopeVariable' - } + vm.vpp = vpp; + vm.vpp.type = 'vpp'; + vm.vpp.label = vm.vpp.name; - } + var nodes = [].concat(vm.vpp); + var links = []; - $scope.gridOptions.columnDefs = [ - { name: 'name' }, - { name: 'ipAddress'}, - { name: 'port'}, - { name: 'status'}, - { name:' ',cellTemplate: actionCellTemplate} - ]; + _.forEach(vm.vpp.interfaces, function(interf, index){ + interf.label = interf.name; + interf.scale = 0.5; + nodes.push(interf); + links.push({source: 0, target: index + 1}); + }); + $scope.topo.data({ + nodes: nodes, + links: links + }); - //$scope.gridOptions.data = $scope.vppList; + $scope.app.container(document.getElementById('next-vpp-topo')); + $scope.topo.attach($scope.app); - $scope.gridOptions.onRegisterApi = function(gridApi){ - $scope.gridApi = gridApi; - }; + $scope.$watch('selectedVpp', function() { + vm.vpp = vpp; + vm.vpp.type = 'vpp'; + vm.vpp.label = vm.vpp.name; - $scope.$on('RELOAD_VPP_TABLE', function(event) { - $scope.gridOptions.data = $scope.vppList.map(function(item) { - item.subGridOptions = { - columnDefs: [ - { name:"name" }, - { name:"phys-address"}, - { name:"oper-status"} - ], - data: item.interfaces - }; + var nodes = [].concat(vm.vpp); + var links = []; + + _.forEach(vm.vpp.interfaces, function(interf, index){ + interf.label = interf.name; + interf.scale = 0.5; + nodes.push(interf); + links.push({source: 0, target: index + 1}); + }); - return item; - }); - }); + $scope.topo.data({ + nodes: nodes, + links: links + }); + }); + }; + + $scope.viewTopology($scope.selectedVpp); - }]); + /*$scope.$on('RELOAD_SELECTED_VPP', function(event) { + $scope.viewTopology($scope.selectedVpp); + });*/ + + }]); });
\ No newline at end of file diff --git a/vbd/gui/module/src/main/resources/vpp/controllers/vpp.controller.js b/vbd/gui/module/src/main/resources/vpp/controllers/vpp.controller.js index 6b2dde830..2d968f757 100644 --- a/vbd/gui/module/src/main/resources/vpp/controllers/vpp.controller.js +++ b/vbd/gui/module/src/main/resources/vpp/controllers/vpp.controller.js @@ -34,11 +34,16 @@ define(modules, function(vpp) { $scope.view_path = 'src/app/vpp/views/'; $scope.mainView = "inventory"; + $scope.selectedVpp = null; $scope.setMainView = function(viewName) { $scope.mainView = viewName; }; + $scope.selectVpp = function(vpp) { + $scope.selectedVpp = vpp; + $scope.$broadcast('RELOAD_SELECTED_VPP'); + }; }]); |