diff options
Diffstat (limited to 'usecaseui-monitor/src/main/webapp/app/uui/fusion/scripts/controller')
6 files changed, 465 insertions, 114 deletions
diff --git a/usecaseui-monitor/src/main/webapp/app/uui/fusion/scripts/controller/alarmController.js b/usecaseui-monitor/src/main/webapp/app/uui/fusion/scripts/controller/alarmController.js index 66cf24cf..0acf0d41 100644 --- a/usecaseui-monitor/src/main/webapp/app/uui/fusion/scripts/controller/alarmController.js +++ b/usecaseui-monitor/src/main/webapp/app/uui/fusion/scripts/controller/alarmController.js @@ -14,30 +14,25 @@ limitations under the License. */ var alarmDetailId = ""; -app.controller('alarmGridCtrl', ['$scope', '$log', '$http', '$timeout', '$interval' , '$window', - function ($scope, $log, $http, $timeout, $interval,$window) { - $scope.jump = function(value){ - alarmDetailId=value; + +app.controller('alarmGridCtrl', ['$scope', '$log', '$http', '$timeout', '$interval', '$window', + function ($scope, $log, $http, $timeout, $interval, $window) { + $scope.jump = function (value) { + alarmDetailId = value; var obj = $("#lm"); angular.element(obj).scope().currentTab = "app/uui/fusion/scripts/view-models/alarm-details.html"; - //angular.element(obj).scope().$apply(); + s }; $scope.toChart = function () { var obj = $("#lm"); angular.element(obj).scope().currentTab = "app/uui/fusion/scripts/view-models/alarm-chart.html"; }; - $scope.vfstatus = "null"; - $scope.selectOpen = function (v) { - $scope.vfstatus = typeof(v) == "undefined" ? "null" : v; - $scope.selectedOpen = v; - }; $scope.itemsByPagea = 10; - $http({ - url : global_url + "/alarm/statusCount", - method : "GET" + url: global_url + "/alarm/statusCount", + method: "GET" }).then(function successCallback(resp) { $scope.open[0].count = resp.data[1]; $scope.open[1].count = resp.data[2]; @@ -45,19 +40,28 @@ app.controller('alarmGridCtrl', ['$scope', '$log', '$http', '$timeout', '$interv }); - $scope.open = [ - {id: 1, name: 'Active', count: 0}, - {id: 2, name: 'Closed', count: 0}, - {id: undefined, name: 'All', count: 0} + // li的数据 + $scope.open = [{ + id: 1, + name: 'Active', + count: 0 + }, + { + id: 2, + name: 'Closed', + count: 0 + }, + { + id: undefined, + name: 'All', + count: 0 + } ]; - - $scope.activeOpen = function (open_id) { - return open_id == $scope.selectedOpen; + $scope.menuState = { + show: false }; - $scope.menuState = {show: false}; - $scope.toggleMenu = function () { $scope.menuState.show = !$scope.menuState.show; }; @@ -78,42 +82,62 @@ app.controller('alarmGridCtrl', ['$scope', '$log', '$http', '$timeout', '$interv opened: false }; - }]); -app.controller('pipeAlarmCtrl', ['$scope','ResourceAlarm', function ($scope,service) { + } +]); +app.controller('pipeAlarmCtrl', ['$scope', 'ResourceAlarm', '$interval', function ($scope, service, $interval) { $scope.condition1 = ""; $scope.condition2 = ""; $scope.condition3 = ""; $scope.condition4 = ""; $scope.condition5 = ""; + $scope.vfstatus = "null"; + + $scope.selectOpen = function (v, func) { + $scope.vfstatus = typeof (v) == "undefined" ? "null" : v; + $scope.selectedOpen = v; + func($scope.tableState); + }; + + $scope.activeOpen = function (open_id) { + return open_id == $scope.selectedOpen; + }; var ctrl = this; - this.displayed = []; + ctrl.displayed = []; - this.callServer = function callServer(tableState) { + ctrl.callServer = function callServer(tableState) { ctrl.isLoading = true; $scope.tableState = tableState; var pagination = tableState.pagination; + console.log(pagination); - var start = pagination.start/pagination.number+1 || 0; + var start = pagination.start / pagination.number + 1 || 0; var number = pagination.number || 10; - service.getPage(start, number,$scope.condition1===""?"":$scope.condition1, - $scope.condition2===""?"":$scope.condition2, $scope.condition3===""?"":$scope.condition3, - $scope.condition4===""?"":$scope.condition4, $scope.condition5===""?"":$scope.condition5, + service.getPage(start, number, $scope.condition1 === "" ? "" : $scope.condition1, + $scope.condition2 === "" ? "" : $scope.condition2, $scope.condition3 === "" ? "" : $scope.condition3, + $scope.condition4 === "" ? "" : $scope.condition4, $scope.condition5 === "" ? "" : $scope.condition5, $scope.vfstatus).then(function (result) { ctrl.displayed = result.data; tableState.pagination.numberOfPages = result.numberOfPages; ctrl.isLoading = false; }); + + // var timer = $interval(function () { + // ctrl.callServer($scope.tableState); + // }, 5000) + + // console.log($scope) }; -}]).factory('ResourceAlarm', ['$q', '$filter', '$timeout','$http', function ($q, $filter, $timeout,$http) { +}]).factory('ResourceAlarm', ['$q', '$filter', '$timeout', '$http', function ($q, $filter, $timeout, $http) { var randomsItems = []; var totalCount = 0; + function getPage(start, number) { - var url = global_url+'/alarm/' + start + '/' + number + ''; + var url = global_url + '/alarm/' + start + '/' + number + ''; url += arguments[2] === "" ? "/null" : "/" + arguments[2]; url += arguments[3] === "" ? "/null" : "/" + arguments[3]; url += arguments[4] === "" ? "/null" : "/" + arguments[4]; @@ -121,14 +145,13 @@ app.controller('pipeAlarmCtrl', ['$scope','ResourceAlarm', function ($scope,serv url += arguments[6] === "" ? "/null" : "/" + FormatDate(arguments[6]); url += arguments[7] === "" ? "/null" : "/" + arguments[7]; $http({ - url : url, - method : "GET" + url: url, + method: "GET" }).then(function SuccessCallback(resp) { - console.info(resp); - if (resp.data.alarms.length > 0){ + if (resp.data.alarms.length > 0) { randomsItems = resp.data.alarms; totalCount = resp.data.totalRecords; - }else{ + } else { randomsItems = []; totalCount = 0; } @@ -154,6 +177,4 @@ app.controller('pipeAlarmCtrl', ['$scope','ResourceAlarm', function ($scope,serv return { getPage: getPage }; - - }]);
\ No newline at end of file diff --git a/usecaseui-monitor/src/main/webapp/app/uui/fusion/scripts/controller/left-menuController.js b/usecaseui-monitor/src/main/webapp/app/uui/fusion/scripts/controller/left-menuController.js index 985ec877..03e90bc2 100644 --- a/usecaseui-monitor/src/main/webapp/app/uui/fusion/scripts/controller/left-menuController.js +++ b/usecaseui-monitor/src/main/webapp/app/uui/fusion/scripts/controller/left-menuController.js @@ -13,17 +13,40 @@ See the License for the specific language governing permissions and limitations under the License. */ -var currentTab = 'app/uui/fusion/scripts/view-models/alarm.html'; +var currentTab = 'app/uui/fusion/scripts/view-models/performance.html'; -app.controller('cmCtrl',['$scope',function ($scope) { - $scope.routeData = [ - {name : 'Services' , url : 'app/uui/fusion/scripts/view-models/lifecyclemanagement.html' , nclass : 'fa fa-users'}, - {name : 'Alarm' , url : 'app/uui/fusion/scripts/view-models/alarm.html' , nclass : 'fa fa-users'}, - {name : 'Performance' , url : 'app/uui/fusion/scripts/view-models/performance.html', nclass : 'fa fa-cog'} +app.controller('cmCtrl', ['$scope', function ($scope) { + $scope.routeData = [{ + name: 'Services', + url: 'app/uui/fusion/scripts/view-models/lifecyclemanagement.html', + nclass: 'fa fa-users' + }, + { + name: 'Alarm', + url: 'app/uui/fusion/scripts/view-models/alarm.html', + nclass: 'fa fa-users' + }, + { + name: 'Performance', + url: 'app/uui/fusion/scripts/view-models/performance.html', + nclass: 'fa fa-cog' + } + /*{ + name: 'Topological diagram', + url: 'app/uui/fusion/scripts/view-models/topology.html', + nclass: 'fa fa-cog' + }, + { + name: 'Device topological', + url: 'app/uui/fusion/scripts/view-models/device-topological.html', + nclass: 'fa fa-cog' + }*/ ]; $scope.currentTab = currentTab; - $scope.$watch('currentTab', function(newValue, oldValue) { - if (newValue === oldValue) { return; } // AKA first run + $scope.$watch('currentTab', function (newValue, oldValue) { + if (newValue === oldValue) { + return; + } // AKA first run // $scope.onClickTab(newValue); }); $scope.onClickTab = function (url) { @@ -32,4 +55,4 @@ app.controller('cmCtrl',['$scope',function ($scope) { $scope.isActiveTab = function (tabRoute) { return tabRoute == $scope.currentTab; } -}]); +}]);
\ No newline at end of file diff --git a/usecaseui-monitor/src/main/webapp/app/uui/fusion/scripts/controller/performance-chartController.js b/usecaseui-monitor/src/main/webapp/app/uui/fusion/scripts/controller/performance-chartController.js index 1e9c0e1b..aa138eaa 100644 --- a/usecaseui-monitor/src/main/webapp/app/uui/fusion/scripts/controller/performance-chartController.js +++ b/usecaseui-monitor/src/main/webapp/app/uui/fusion/scripts/controller/performance-chartController.js @@ -16,9 +16,9 @@ app.controller('pertabCtrl', ['$scope', '$http', '$routeParams', '$window' , function ($scope, $http,$routeParams,$window) { - $scope.chartShow = false; - $scope.ndaShow = false; - $scope.hdaShow = false; + $scope.chartShow = false; + $scope.ndaShow = false; + $scope.hdaShow = false; $scope.valuess = []; $scope.namesPIsShow = false; $scope.goIsShow = true; diff --git a/usecaseui-monitor/src/main/webapp/app/uui/fusion/scripts/controller/performanceController.js b/usecaseui-monitor/src/main/webapp/app/uui/fusion/scripts/controller/performanceController.js index 23a59389..cb897a46 100644 --- a/usecaseui-monitor/src/main/webapp/app/uui/fusion/scripts/controller/performanceController.js +++ b/usecaseui-monitor/src/main/webapp/app/uui/fusion/scripts/controller/performanceController.js @@ -14,14 +14,13 @@ limitations under the License. */ // -var permanceId=""; -app.controller('perGridCtrl', ['$scope','$http', '$window', '$interval', '$window', - function ($scope, $http , $window, $interval) { - $scope.jump = function(value){ - permanceId=value; +var permanceId = ""; +app.controller('perGridCtrl', ['$scope', '$http', '$window', '$interval', + function ($scope, $http, $window, $interval) { + $scope.jump = function (value) { + permanceId = value; var obj = $("#lm"); angular.element(obj).scope().currentTab = "app/uui/fusion/scripts/view-models/performance-details.html"; - //angular.element(obj).scope().$apply(); }; $scope.itemsByPage = 10; @@ -31,7 +30,9 @@ app.controller('perGridCtrl', ['$scope','$http', '$window', '$interval', '$windo angular.element(obj).scope().currentTab = "app/uui/fusion/scripts/view-models/performance-chart.html"; }; - $scope.menuState = {show: false} + $scope.menuState = { + show: false + } $scope.toggleMenu = function () { $scope.menuState.show = !$scope.menuState.show; } @@ -39,10 +40,13 @@ app.controller('perGridCtrl', ['$scope','$http', '$window', '$interval', '$windo $scope.checkResults = []; - $scope.menuState = {show: false} - $scope.toggleMenu = function () { - $scope.menuState.show = !$scope.menuState.show; - } + // $scope.menuState = { + // show: false + // } + // $scope.toggleMenu = function () { + // $scope.menuState.show = !$scope.menuState.show; + // } + $scope.open1 = function () { $scope.popup1.opened = true; }; @@ -59,55 +63,61 @@ app.controller('perGridCtrl', ['$scope','$http', '$window', '$interval', '$windo opened: false }; - }]); -app.controller('pipeCtrl', ['$scope','Resource', function ($scope,service) { - $scope.seek1 = ""; - $scope.seek2 = ""; - $scope.seek3 = ""; - $scope.seek4 = ""; - $scope.seek5 = ""; - - - var ctrl = this; - - this.displayed = []; - - this.callServer = function callServer(tableState) { - ctrl.isLoading = true; - $scope.tableState = tableState; - var pagination = tableState.pagination; + } +]); +app.controller('pipeCtrl', ['$scope', 'Resource', '$interval', function ($scope, service, $interval) { + $scope.seek1 = ""; + $scope.seek2 = ""; + $scope.seek3 = ""; + $scope.seek4 = ""; + $scope.seek5 = ""; + + var ctrl = this; + + ctrl.displayed = []; + + ctrl.callServer = function callServer(tableState) { + ctrl.isLoading = true; + $scope.tableState = tableState; + var pagination = tableState.pagination; + + var start = pagination.start / pagination.number + 1 || 0; + var number = pagination.number || 10; + + service.getPage(start, number, $scope.seek1 === "" ? "null" : $scope.seek1, + $scope.seek2 === "" ? "null" : $scope.seek2, $scope.seek3 === "" ? "null" : $scope.seek3, + $scope.seek4 === "" ? "null" : $scope.seek4, $scope.seek5 === "" ? "null" : $scope.seek5).then(function (result) { + ctrl.displayed = result.data; + tableState.pagination.numberOfPages = result.numberOfPages; + ctrl.isLoading = false; + }); - var start = pagination.start/pagination.number+1 || 0; - var number = pagination.number || 10; + // $interval(function () { + // ctrl.callServer($scope.tableState); + // }, 5000) - service.getPage(start, number,$scope.seek1===""?"null":$scope.seek1, - $scope.seek2===""?"null":$scope.seek2, $scope.seek3===""?"null":$scope.seek3, - $scope.seek4===""?"null":$scope.seek4, $scope.seek5===""?"null":$scope.seek5).then(function (result) { - ctrl.displayed = result.data; - tableState.pagination.numberOfPages = result.numberOfPages; - ctrl.isLoading = false; - }); - }; + }; -}]) - .factory('Resource', ['$q', '$filter', '$timeout','$http', function ($q, $filter, $timeout,$http) { + }]) + .factory('Resource', ['$q', '$filter', '$timeout', '$http', function ($q, $filter, $timeout, $http) { var randomsItems = []; var totalCount = 0; + function getPage(start, number) { - var url = global_url+'/performance/' + start + '/' + number + ''; + var url = global_url + '/performance/' + start + '/' + number + ''; url += arguments[2] === "" ? "/null" : "/" + arguments[2]; url += arguments[3] === "" ? "/null" : "/" + arguments[3]; url += arguments[4] === "" ? "/null" : "/" + arguments[4]; url += arguments[5] === "null" ? "/null" : "/" + FormatDate(arguments[5]); url += arguments[6] === "null" ? "/null" : "/" + FormatDate(arguments[6]); $http({ - url : url, - method : "GET" + url: url, + method: "GET" }).then(function SuccessCallback(resp) { - if (resp.data.performances.length > 0){ + if (resp.data.performances.length > 0) { randomsItems = resp.data.performances; totalCount = resp.data.totalRecords; - }else{ + } else { randomsItems = []; totalCount = 0; } @@ -136,24 +146,23 @@ app.controller('pipeCtrl', ['$scope','Resource', function ($scope,service) { }; - }]).directive('stRatio',function(){ - return { - link:function(scope, element, attr){ - var ratio=+(attr.stRatio); + }]).directive('stRatio', function () { + return { + link: function (scope, element, attr) { + var ratio = +(attr.stRatio); - element.css('width',ratio+'%'); + element.css('width', ratio + '%'); + } + }; + }).directive('pageSelect', function () { + return { + restrict: 'E', + template: '<input type="text" class="select-page" ng-model="inputPage" ng-change="selectPage(inputPage)">', + link: function (scope, element, attrs) { + scope.$watch('currentPage', function (c) { + scope.inputPage = c; + }); + } } - }; -}).directive('pageSelect', function() { - return { - restrict: 'E', - template: '<input type="text" class="select-page" ng-model="inputPage" ng-change="selectPage(inputPage)">', - link: function(scope, element, attrs) { - scope.$watch('currentPage', function(c) { - scope.inputPage = c; - }); - } - } -}); - + });
\ No newline at end of file diff --git a/usecaseui-monitor/src/main/webapp/app/uui/fusion/scripts/controller/topological.js b/usecaseui-monitor/src/main/webapp/app/uui/fusion/scripts/controller/topological.js new file mode 100644 index 00000000..8e4731e4 --- /dev/null +++ b/usecaseui-monitor/src/main/webapp/app/uui/fusion/scripts/controller/topological.js @@ -0,0 +1,182 @@ +/* + Copyright (C) 2017 CMCC, Inc. and others. All rights reserved. + + Licensed under the Apache License, Version 2.0 (the "License"); + you may not use this file except in compliance with the License. + You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + + Unless required by applicable law or agreed to in writing, software + distributed under the License is distributed on an "AS IS" BASIS, + WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + See the License for the specific language governing permissions and + limitations under the License. + */ + +app.controller('devicetopologicalCtrl', ['$scope', '$http', function ($scope, $http) { + $(document).ready(function () { + var canvas = document.getElementById('canvas'); + var height = canvas.clientHeight; + var width = canvas.clientWidth; + var stage = new JTopo.Stage(canvas); + var scene = new JTopo.Scene(); + // scene.background = '/app/uui/fusion/images/bg.jpg'; + + + function node(x, y, img, name, zIndex) { + var node = new JTopo.Node(name); + node.setImage('/app/uui/fusion/images/' + img, true); + node.setLocation(x, y); + node.zIndex = zIndex; + scene.add(node); + return node; + } + + + function newFoldLink(nodeA, nodeZ, text, direction) { + var link = new JTopo.FoldLink(nodeA, nodeZ, text); + link.direction = direction || 'horizontal'; + link.lineWidth = 1; // 线宽 + // link.bundleOffset = 10; // 折线拐角处的长度 + link.bundleGap = 10; // 线条之间的间隔 + line.zIndex = 8; + scene.add(link); + return link; + } + + + function line(startX, startY, endX, endY, name) { + var start = new JTopo.Node(); + start.setLocation(startX, startY); + var end = new JTopo.Node(); + end.setLocation(endX, endY); + var line = new JTopo.Link(start, end); + line.text = name; + line.zIndex = 5; + scene.add(line); + return line; + } + + var container = new JTopo.Container(); + container.borderRadius = 200; + container.setBound(0, 0, 300, 300); + container.dragble = false; + container.background = '/app/uui/fusion/images/cloud_r.png'; + + var container2 = new JTopo.Container() + container2.borderRadius = 200; + container2.setBound(0, 0, 300, 300); + container2.dragble = false; + container2.background = '/app/uui/fusion/images/cloud_r.png'; + + var routerX = width / 2 - 40; + var routerY = height / 2; + + var router1 = node(routerX - 80, routerY - 40, 'router-all.png', ''); + var router2 = node(routerX + 80, routerY - 40, 'router-all.png', ''); + scene.add(new JTopo.Link(router1, router2)); + + var gateway1 = node(routerX - 200, routerY + 80, 'gateway-all.png', '', 10); + newFoldLink(gateway1, router1); + var gateway2 = node(routerX + 200, routerY + 80, 'gateway-all.png', '', 10); + newFoldLink(gateway2, router2); + + var ctrl_line = line(routerX - 460, routerY + 40, routerX - 160, routerY + 40); + var data_line = line(routerX - 460, routerY + 20, routerX - 160, routerY + 20); + var ctrl_line_2 = line(routerX + 485, routerY + 20, routerX + 185, routerY + 20); + var data_line_2 = line(routerX + 485, routerY + 40, routerX + 185, routerY + 40); + + var c1_vnf_1 = node(routerX - 400, routerY - 70, 'vnf-all.png', '', 6); + var c1_vnf_2 = node(routerX - 350, routerY - 70, 'vnf-all.png', '', 6); + var c1_vnf_3 = node(routerX - 300, routerY - 70, 'vnf-all.png', '', 6); + + var c2_vnf_1 = node(routerX + 300, routerY - 70, 'vnf-all.png', '', 6); + var c2_vnf_2 = node(routerX + 350, routerY - 70, 'vnf-all.png', '', 6); + var c2_vnf_3 = node(routerX + 400, routerY - 70, 'vnf-all.png', '', 6); + + var ctline_c1_vnf1 = node(routerX - 390, routerY + 50, 'map_data_point_blue.png', ''); + var daline_c1_vnf1 = node(routerX - 380, routerY + 30, 'map_data_point_blue.png', ''); + newFoldLink(c1_vnf_1, ctline_c1_vnf1); + newFoldLink(c1_vnf_1, daline_c1_vnf1); + + var ctline_c1_vnf2 = node(routerX - 340, routerY + 50, 'map_data_point_blue.png', ''); + var daline_c1_vnf2 = node(routerX - 330, routerY + 30, 'map_data_point_blue.png', ''); + newFoldLink(c1_vnf_2, ctline_c1_vnf2); + newFoldLink(c1_vnf_2, daline_c1_vnf2); + + + var ctline_c1_vnf3 = node(routerX - 290, routerY + 50, 'map_data_point_blue.png', ''); + var daline_c1_vnf3 = node(routerX - 280, routerY + 30, 'map_data_point_blue.png', ''); + newFoldLink(c1_vnf_3, ctline_c1_vnf3); + newFoldLink(c1_vnf_3, daline_c1_vnf3); + + + var ctline_gateway1 = node(routerX - 180, routerY + 50, 'map_data_point_blue.png', ''); + var daline_gateway1 = node(routerX - 190, routerY + 30, 'map_data_point_blue.png', ''); + newFoldLink(gateway1, ctline_gateway1); + newFoldLink(gateway1, daline_gateway1); + + container.add(c1_vnf_1); + container.add(c1_vnf_2); + container.add(c1_vnf_3); + container.add(gateway1); + container.add(ctline_c1_vnf1); + container.add(daline_c1_vnf1); + container.add(ctline_c1_vnf2); + container.add(daline_c1_vnf2); + container.add(ctline_c1_vnf3); + container.add(daline_c1_vnf3); + container.add(ctline_gateway1); + container.add(daline_gateway1); + container.add(ctrl_line.nodeA); + container.add(ctrl_line.nodeZ); + container.add(data_line.nodeA); + container.add(data_line.nodeZ); + + scene.add(container); + + + var ctline_c2_vnf1 = node(routerX + 320, routerY + 30, 'map_data_point_blue.png', ''); + var daline_c2_vnf1 = node(routerX + 310, routerY + 50, 'map_data_point_blue.png', ''); + newFoldLink(c2_vnf_1, ctline_c2_vnf1); + newFoldLink(c2_vnf_1, daline_c2_vnf1); + + var ctline_c2_vnf2 = node(routerX + 370, routerY + 30, 'map_data_point_blue.png', ''); + var daline_c2_vnf2 = node(routerX + 360, routerY + 50, 'map_data_point_blue.png', ''); + newFoldLink(c2_vnf_2, ctline_c2_vnf2); + newFoldLink(c2_vnf_2, daline_c2_vnf2); + + + var ctline_c2_vnf3 = node(routerX + 420, routerY + 30, 'map_data_point_blue.png', ''); + var daline_c2_vnf3 = node(routerX + 410, routerY + 50, 'map_data_point_blue.png', ''); + newFoldLink(c2_vnf_3, ctline_c2_vnf3); + newFoldLink(c2_vnf_3, daline_c2_vnf3); + + + var ctline_gateway2 = node(routerX + 240, routerY + 30, 'map_data_point_blue.png', ''); + var daline_gateway2 = node(routerX + 230, routerY + 50, 'map_data_point_blue.png', ''); + newFoldLink(gateway2, ctline_gateway2); + newFoldLink(gateway2, daline_gateway2); + + container2.add(c2_vnf_1); + container2.add(c2_vnf_2); + container2.add(c2_vnf_3); + container2.add(gateway2); + container2.add(ctline_c2_vnf1); + container2.add(daline_c2_vnf1); + container2.add(ctline_c2_vnf2); + container2.add(daline_c2_vnf2); + container2.add(ctline_c2_vnf3); + container2.add(daline_c2_vnf3); + container2.add(ctline_gateway2); + container2.add(daline_gateway2); + container2.add(ctrl_line_2.nodeA); + container2.add(ctrl_line_2.nodeZ); + container2.add(data_line_2.nodeA); + container2.add(data_line_2.nodeZ); + + scene.add(container2); + stage.add(scene); + }); +}])
\ No newline at end of file diff --git a/usecaseui-monitor/src/main/webapp/app/uui/fusion/scripts/controller/topology-diagram.js b/usecaseui-monitor/src/main/webapp/app/uui/fusion/scripts/controller/topology-diagram.js new file mode 100644 index 00000000..d9d5078a --- /dev/null +++ b/usecaseui-monitor/src/main/webapp/app/uui/fusion/scripts/controller/topology-diagram.js @@ -0,0 +1,116 @@ +/* + Copyright (C) 2017 CMCC, Inc. and others. All rights reserved. + + Licensed under the Apache License, Version 2.0 (the "License"); + you may not use this file except in compliance with the License. + You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + + Unless required by applicable law or agreed to in writing, software + distributed under the License is distributed on an "AS IS" BASIS, + WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + See the License for the specific language governing permissions and + limitations under the License. + */ +app.controller('topologyCtrl', ['$scope', '$http', '$location', 'drawTree', '$timeout', function ($scope, $http, $location, drawTree, $timeout) { + + // 获取拓补图盒子 + var myChart = echarts.init(document.getElementById("tree-container")); + // 请求数据,渲染选项标签 + $http({ + method: 'GET', + url: global_url + '/topology/services' + }).then(function successCallback(response) { + $scope.serviceType = response.data; + $scope.selectedName = response.data[0]; + }, function errorCallback(error) { + + }).then(function () { + // 默认渲染第一条拓补图 + $http({ + method: 'GET', + url: global_url + '/topology/' + $scope.selectedName.ServiceName, + }).then(function successCallback(response) { + drawTree.treeChart(false, response.data, myChart); + + }, function errorCallback(error) { + + }) + }); + + // 点击切换拓补图 + $scope.selectedNameChanged = function (selectedName) { + $http({ + method: 'GET', + url: global_url + '/topology/' + selectedName.ServiceName, + }).then(function successCallback(response) { + drawTree.treeChart(true, response.data, myChart); + }, function errorCallback(error) { + + }) + }; + +}]).factory('drawTree', function () { + function treeChart(isChange, data, myChart) { + + if (isChange) { + myChart.clear(); //如果切换就清空下 + } + data.symbol = "image://./app/uui/fusion/images/E2E.png"; + for (k in data.children) { + data.children[k].symbol = "image://./app/uui/fusion/images/NS.png"; + if (data.children[k].children) { + for (i in data.children[k].children) { + if (data.children[k].children[i].isAlarm) { + data.children[k].children[i].symbol = "image://./app/uui/fusion/images/vnf-alarm.png"; + } else { + data.children[k].children[i].symbol = "image://./app/uui/fusion/images/vnf-1.png"; + } + } + } + } + + var option = { + tooltip: { + trigger: 'item', + triggerOn: 'mousemove' + }, + series: [{ + type: 'tree', + top: '20%', + left: '7%', + bottom: '20%', + right: '10%', + symbolSize: 50, + orient: 'vertical', + label: { + normal: { + position: 'bottom', + fontSize: 16, + color: '#000' + } + }, + leaves: { + label: { + normal: { + position: 'right', + verticalAlign: 'middle', + align: 'left' + } + } + }, + lineStyle: { + width: 3, + curveness: 0, + }, + data: [data], + expandAndCollapse: true + }] + } + myChart.setOption(option, true); + } + return { + treeChart: treeChart + } +})
\ No newline at end of file |