}
-/*input框
+/*input
----------------------------------------------*/
.list {
list-style: none;
})
.otherwise({redirectTo: '/common'})
});
-var global_url = "http://10.73.160.112:8082/api/usecaseui/server/v1";
+var global_url = "/api/usecaseui/server/v1";
See the License for the specific language governing permissions and
limitations under the License.
*/
-diskBarChart = [
+Chart = [
{ "type":"bar", "key": "disk", "yAxis": "1", "values": [
{ "x":'15min' , "y":4}, { "x":'30min' , "y":4}, { "x":'45min' , "y":12},
{ "x":'60min' , "y":3.27}
.logScale(false)
.axisLabel('')
.tickFormat(d3.format(',.1f'));
- d3.select('#CPUchart svg')
- .datum(cpuBarChart)
+ d3.select('#chart svg')
+ .datum(Chart)
.transition().duration(1000)
.call(chart1);
- nv.utils.windowResize(chart1.update);
return chart1;
});
-nv.addGraph(function() {
+/*nv.addGraph(function() {
chart2 = nv.models.multiBarChart()
.showLegend(false)
.reduceXTicks(false)
.call(chart4);
nv.utils.windowResize(chart4.update);
return chart4;
-});
+});*/
function changeValue(s){
chart1.xAxis.tickValues(s);
}
function redraw(c,s1) {
- diskBarChart[0].values = s1[0];
- memoryBarChart[0].values = s1[1];
- cpuBarChart[0].values = s1[2];
- networkBarChart[0].values = s1[3];
-
- d3.select('#CPUchart'+c+' svg')
- .datum(cpuBarChart)
+ Chart[0].values = s1;
+ d3.select('#chart'+c+' svg')
+ .datum(Chart)
.transition().duration(500)
.call(chart1);
- d3.select('#Memorychart'+c+' svg')
- .datum(memoryBarChart)
- .transition().duration(500)
- .call(chart2);
- d3.select('#Diskchart'+c+' svg')
- .datum(diskBarChart)
- .transition().duration(1000)
- .call(chart3);
- d3.select('#Networkchart'+c+' svg')
- .datum(networkBarChart)
- .transition().duration(1000)
- .call(chart4);
}
--- /dev/null
+/*
+ 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('alarmchartCtrl', ['$scope', '$http', '$routeParams', '$window',
+ function ($scope, $http, $routeParams, $window) {
+ $scope.valuess = [];
+ $scope.today = function () {
+ $scope.startTime = new Date();
+ $scope.endTime = new Date();
+ $http({
+ method: "GET",
+ url: global_url + "/alarm/sourceId",
+ headers: {
+ 'Access-Control-Allow-Origin': "*",
+ "Content-Type": "application/json",
+ "Authorization": "Basic " + btoa("usecase" + ':' + "usecase")
+ }
+ }).then(function successCallback(resp) {
+ console.info(resp);
+ $scope.sourceIds = resp.data;
+ }, function errorCallback(resp) {
+
+ });
+ };
+ $scope.today();
+
+ $scope.genDiagram = function () {
+ $http({
+ method: 'POST',
+ url: global_url + "/alarm/diagram",
+ data: {
+ "sourceId": $scope.sourceId,
+ "startTime": FormatDate($scope.startTime),
+ "endTime": FormatDate($scope.endTime)
+ },
+ headers: {'Content-Type': 'application/x-www-form-urlencoded'},
+ transformRequest: function (obj) {
+ var str = [];
+ for (var p in obj) {
+ str.push(encodeURIComponent(p) + "=" + encodeURIComponent(obj[p]));
+ }
+ return str.join("&");
+ }
+ }).then(function successCallback(resp) {
+ //console.info(resp);
+ if (resp.data.length > 0)
+ for (var i = 0; i < resp.data.length; i++) {
+ $scope.valuess[i] = {};
+ $scope.valuess[i].x = resp.data[i].Time;
+ $scope.valuess[i].y = resp.data[i].Count;
+ }
+ for (var d = 0; d < 5; d++) {
+ window.setTimeout(function () {
+ redraw("_alarm", $scope.valuess);
+ }, 1500);
+ };
+
+ }, function errorCallback(resp) {
+
+ });
+ }
+
+
+ $scope.startTimeChanged = function () {
+ if ($scope.startTime > $scope.endTime)
+ $scope.endTime = "";
+ console.info($scope.startTime);
+ };
+ $scope.endTimeChanged = function () {
+ if ($scope.endTime < $scope.startTime)
+ $scope.startTime = "";
+ console.info($scope.endTime);
+ };
+
+ $scope.open1 = function () {
+ $scope.popup1.opened = true;
+ };
+
+ $scope.open2 = function () {
+ $scope.popup2.opened = true;
+ };
+
+ $scope.popup1 = {
+ opened: false
+ };
+
+ $scope.popup2 = {
+ opened: false
+ };
+
+ function FormatDate(strTime) {
+ var date = new Date(strTime);
+ return date.getFullYear() + "-" + (date.getMonth() + 1) + "-" + date.getDate() + " " + date.getHours() + ":" + date.getMinutes();
+ }
+
+ }]);
--- /dev/null
+/*
+ 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("alarmDetailsController",function ($scope,$http,$window) {
+ $scope.back = function () {
+ var obj = $("#lm");
+ angular.element(obj).scope().currentTab = "app/uui/fusion/scripts/view-models/alarm.html";
+ };
+ $http({
+ method : "GET",
+ url : global_url + "/alarm/1/1/null/"+alarmDetailId+"/null/null/null/null"
+ }).then(function successCallback(resp) {
+ $scope.alarmCondition = resp.data.alarms[0].alarmsHeader.alarmCondition;
+ $scope.alarmInterfaceA = resp.data.alarms[0].alarmsHeader.alarmInterfaceA;
+ $scope.eventCategory = resp.data.alarms[0].alarmsHeader.eventCategory;
+ $scope.eventId = resp.data.alarms[0].alarmsHeader.eventId;
+ $scope.eventName = resp.data.alarms[0].alarmsHeader.eventName;
+ $scope.eventServrity = resp.data.alarms[0].alarmsHeader.eventServrity;
+ $scope.eventSourceType = resp.data.alarms[0].alarmsHeader.eventSourceType;
+ $scope.eventType = resp.data.alarms[0].alarmsHeader.eventType;
+ $scope.faultFieldsVersion = resp.data.alarms[0].alarmsHeader.faultFieldsVersion;
+ $scope.lastEpochMicroSec = resp.data.alarms[0].alarmsHeader.lastEpochMicroSec;
+ $scope.nfNamingCode = resp.data.alarms[0].alarmsHeader.nfNamingCode;
+ $scope.nfcNamingCode = resp.data.alarms[0].alarmsHeader.nfcNamingCode;
+ $scope.priority = resp.data.alarms[0].alarmsHeader.priority;
+ $scope.reportingEntityId = resp.data.alarms[0].alarmsHeader.reportingEntityId;
+ $scope.reportingEntityName = resp.data.alarms[0].alarmsHeader.reportingEntityName;
+ $scope.sequence = resp.data.alarms[0].alarmsHeader.sequence;
+ $scope.sourceId = resp.data.alarms[0].alarmsHeader.sourceId;
+ $scope.sourceName = resp.data.alarms[0].alarmsHeader.sourceName;
+ $scope.specificProblem = resp.data.alarms[0].alarmsHeader.specificProblem;
+ $scope.startEpochMicrosec = resp.data.alarms[0].alarmsHeader.startEpochMicrosec;
+ $scope.startTIme = resp.data.alarms[0].alarmsHeader.createTime;
+ $scope.alarmInformation = resp.data.alarms[0].alarmsInformation;
+ },function errorCallback(resq) {
+
+ });
+});
\ No newline at end of file
See the License for the specific language governing permissions and
limitations under the License.
*/
+var alarmDetailId = "";
app.controller('alarmGridCtrl', ['$scope', '$log', '$http', '$timeout', '$interval' , '$window' ,'uiGridConstants', 'uiGridGroupingConstants',
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();
+ };
+ $scope.toChart = function () {
+ var obj = $("#lm");
+ angular.element(obj).scope().currentTab = "app/uui/fusion/scripts/view-models/alarm-chart.html";
+ };
$scope.selectedRows = new Array();
$scope.condition1 = "";
$scope.condition2 = "";
$scope.condition3 = "";
$scope.condition4 = "";
$scope.condition5 = "";
- $scope.alarmStatus = "null";
$scope.vfstatus = "null";
$scope.toggled = function (open) {
$log.log('Dropdown is now: ', open);
url += arguments[2] === "" ? "/null" : "/" + arguments[2];
url += arguments[3] === "" ? "/null" : "/" + arguments[3];
url += arguments[4] === "" ? "/null" : "/" + arguments[4];
- url += arguments[5] === "" ? "/null" : "/" + arguments[5];
- url += arguments[6] === "" ? "/null" : "/" + arguments[6];
+ url += arguments[5] === "" ? "/null" : "/" + FormatDate(arguments[5]);
+ url += arguments[6] === "" ? "/null" : "/" + FormatDate(arguments[6]);
url += arguments[7] === "" ? "/null" : "/" + arguments[7];
- url += arguments[8] === "" ? "/null" : "/" + arguments[8];
$http.get(url, {
headers: {
'Access-Control-Allow-Origin': "*",
};
$scope.gridOptions = {
columnDefs: [
- {field: "alarmsHeader.eventId", displayName: 'Id', enableCellEdit: false},
{
field: 'alarmsHeader.eventName',
displayName: 'eventName',
- width: '8%',
- enableColumnMenu: false,
+ cellTemplate: '<a ng-click="grid.appScope.jump(row.entity.alarmsHeader.eventName)"; style="cursor:pointer" href="">{{row.entity.alarmsHeader.eventName}}</a>',
+ width : 500,
enableHiding: false,
suppressRemoveSort: true,
enableCellEdit: false
},
- {field: "alarmsHeader.vfStatus", displayName: 'IsOpen', enableCellEdit: false},
- {field: "alarmsHeader.status", displayName: 'Status', cellFilter: 'mapGender', enableCellEdit: false},
- {field: "alarmsInformation[0].name", displayName: 'Name', enableCellEdit: false},
- {field: "alarmsInformation[0].value", displayName: 'Value', enableCellEdit: false},
- {field: "alarmsHeader.createTime", displayName: 'CreateTime', enableCellEdit: false},
+ {field: "alarmsHeader.eventId", displayName: 'eventId', enableCellEdit: false},
+ {field: "alarmsHeader.sourceId", displayName: 'Source Id', enableCellEdit: false},
+ {field: "alarmsHeader.sourceName", displayName: 'Source Name', enableCellEdit: false},
+ {field: "alarmsHeader.reportingEntityId", displayName: 'Reporting Entity Id', enableCellEdit: false},
+ {field: "alarmsHeader.reportingEntityName", displayName: 'Reporting Entity Name', enableCellEdit: false},
+ {field: "alarmsHeader.Priority", displayName: 'Priority', enableCellEdit: false},
+ {field: "alarmsHeader.createTime", displayName: 'Start Time', enableCellEdit: false},
+ {field: "alarmsHeader.status", displayName: 'Status', cellFilter: 'mapGender',enableCellEdit: false},
+ {field: "option",displayName: 'option', enableCellEdit: false ,cellTemplate: '<button ng-click="grid.appScope.jump(row.entity.alarmsHeader.eventName)" class="btn btn-primary" >Details</button>'},
],
enableSorting: true,
useExternalSorting: false,
getPage(1, $scope.gridOptions.paginationPageSize, $scope.condition1===""?"":$scope.condition1,
$scope.condition2===""?"":$scope.condition2, $scope.condition3===""?"":$scope.condition3,
$scope.condition4===""?"":$scope.condition4, $scope.condition5===""?"":$scope.condition5,
- $scope.alarmStatus, $scope.vfstatus);
+ $scope.vfstatus);
$interval(function () {
getPage(1, $scope.gridOptions.paginationPageSize, $scope.condition1===""?"":$scope.condition1,
$scope.condition2===""?"":$scope.condition2, $scope.condition3===""?"":$scope.condition3,
$scope.condition4===""?"":$scope.condition4, $scope.condition5===""?"":$scope.condition5,
- $scope.alarmStatus, $scope.vfstatus);
+ $scope.vfstatus);
},10000)
$scope.generateCsv = function () {
{id: 5, name: 'NORMAL', count: 7},
{id: undefined, name: 'All', count: 7}
];
- $scope.selectStatus = function (v) {
- $scope.alarmStatus = typeof(v) == "undefined" ? "" : v;
- getPage(1, $scope.gridOptions.paginationPageSize, $scope.condition1===""?"":$scope.condition1,
- $scope.condition2===""?"":$scope.condition2, $scope.condition3===""?"":$scope.condition3,
- $scope.condition4===""?"":$scope.condition4, $scope.condition5===""?"":$scope.condition5,
- $scope.alarmStatus, $scope.vfstatus);
- $scope.selectedStatus = v;
- };
- $scope.activeStatus = function (status_id) {
- return status_id == $scope.selectedStatus;
- };
$scope.open = [
- {id: 1, name: 'open', count: 10},
- {id: 2, name: 'close', count: 8},
+ {id: 1, name: 'Active', count: 10},
+ {id: 2, name: 'Closed', count: 8},
{id: undefined, name: 'All', count: 7}
];
getPage(1, $scope.gridOptions.paginationPageSize, $scope.condition1===""?"":$scope.condition1,
$scope.condition2===""?"":$scope.condition2, $scope.condition3===""?"":$scope.condition3,
$scope.condition4===""?"":$scope.condition4, $scope.condition5===""?"":$scope.condition5,
- $scope.alarmStatus, $scope.vfstatus);
+ $scope.vfstatus);
$scope.selectedOpen = v;
};
$scope.activeOpen = function (open_id) {
getPage(1, $scope.gridOptions.paginationPageSize, $scope.condition1===""?"":$scope.condition1,
$scope.condition2===""?"":$scope.condition2, $scope.condition3===""?"":$scope.condition3,
$scope.condition4===""?"":$scope.condition4, $scope.condition5===""?"":$scope.condition5,
- $scope.alarmStatus, $scope.vfstatus);
+ $scope.vfstatus);
+ };
+ $scope.open1 = function () {
+ $scope.popup1.opened = true;
};
+
+ $scope.open2 = function () {
+ $scope.popup2.opened = true;
+ };
+
+ $scope.popup1 = {
+ opened: false
+ };
+
+ $scope.popup2 = {
+ opened: false
+ };
+ function FormatDate(strTime) {
+ var date = new Date(strTime);
+ return date.getFullYear() + "-" + (date.getMonth() + 1) + "-" + date.getDate() + " " + date.getHours() + ":" + date.getMinutes();
+ }
}]).filter('mapGender', function () {
var genderHash = {
- 1: 'CRITICAL',
- 2: 'MAJOR',
- 3: 'MINOR',
- 4: 'WARNING',
- 5: 'NORMAL'
+ 1: 'Active',
+ 2: 'Closed'
};
return function (input) {
if (!input) {
--- /dev/null
+/*
+ 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('pertabCtrl', ['$scope', '$http', '$routeParams', '$window' ,
+ function ($scope, $http, $routeParams, $window) {
+ $scope.sourceIds = ["112","119","101"];
+ $scope.namePs = [];
+ $scope.valuess = [];
+ $scope.namesPIsShow = false;
+ $scope.namesCIsShow = false;
+ $scope.goIsShow = false;
+ $scope.today = function() {
+ $scope.startTime = new Date();
+ $scope.endTime = new Date();
+ $http({
+ method : "GET",
+ url : global_url+"/performance/resourceIds",
+ headers: {
+ 'Access-Control-Allow-Origin': "*",
+ "Content-Type": "application/json",
+ "Authorization": "Basic " + btoa("usecase" + ':' + "usecase")
+ }
+ }).then(function successCallback(resp) {
+ $scope.sourceIds = resp.data;
+ },function errorCallback(reps) {
+
+ });
+ };
+ $scope.today();
+
+
+ $scope.startTimeChanged = function () {
+ if ($scope.startTime > $scope.endTime)
+ $scope.endTime = "";
+ };
+ $scope.endTimeChanged = function () {
+ if ($scope.endTime < $scope.startTime)
+ $scope.startTime = "";
+ };
+
+ $scope.sourceIdChanged = function () {
+ if ($scope.sourceId != null){
+ $scope.namesPIsShow = true;
+ $http({
+ method : "POST",
+ url : global_url + "/performance/names",
+ data : { "sourceId":$scope.sourceId },
+ headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
+ transformRequest: function(obj) {
+ var str = [];
+ for (var p in obj) {
+ str.push(encodeURIComponent(p) + "=" + encodeURIComponent(obj[p]));
+ }
+ return str.join("&");
+ }
+
+ }).then(function successCallback(resp) {
+ $scope.namePs = resp.data;
+ },function errorCallback(resq) {
+
+ });
+ }
+ else{
+ $scope.goIsShow = false;
+ $scope.namesPIsShow = false;
+ $scope.namesCIsShow = false;
+ }
+
+ };
+
+ $scope.namePChanged = function () {
+ if ($scope.nameP != null){
+ $http({
+ method : "POST",
+ url : global_url + "/performance/names",
+ data : { "sourceId":$scope.nameP },
+ headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
+ transformRequest: function(obj) {
+ var str = [];
+ for (var p in obj) {
+ str.push(encodeURIComponent(p) + "=" + encodeURIComponent(obj[p]));
+ }
+ return str.join("&");
+ }
+ }).then(function successCallback(resp) {
+ if (resp.data.length <= 0){
+ $scope.namesCIsShow = false;
+ $scope.goIsShow = true;
+ }else{
+ $scope.namesCIsShow = true;
+ $scope.goIsShow = false;
+ $scope.nameCs = resp.data;
+ }
+ },function errorCallback(resq) {
+
+ });
+ }
+ else{
+ $scope.goIsShow = false;
+ $scope.namesCIsShow = false;
+ }
+ };
+
+ $scope.nameCChanged = function () {
+ if ($scope.nameC != null){
+ $scope.goIsShow = true;
+ }
+ };
+
+ $scope.genDiagram = function () {
+ $http({
+ method : 'POST',
+ url : global_url + "/performance/diagram",
+ data : { "sourceId":$scope.sourceId,"startTime":FormatDate($scope.startTime),"endTime":FormatDate($scope.endTime),"nameParent":$scope.nameP,"nameChild":$scope.nameC!=null?$scope.nameC:"" },
+ headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
+ transformRequest: function(obj) {
+ var str = [];
+ for (var p in obj) {
+ str.push(encodeURIComponent(p) + "=" + encodeURIComponent(obj[p]));
+ }
+ return str.join("&");
+ }
+ }).then(function successCallback(resp) {
+ console.info(resp.data);
+ if (resp.data.length > 0)
+ for (var i = 0 ; i<resp.data.length ; i++){
+ $scope.valuess[i] = {};
+ $scope.valuess[i].x = i+1;
+ $scope.valuess[i].y = resp.data[i];
+ $scope.valuess[i].x.length = i;
+ }
+ for (var d = 0; d < 5; d++) {
+ window.setTimeout(function () {
+ redraw("_performance", $scope.valuess);
+ }, 1500);
+ };
+ },function errorCallback(resp) {
+
+ });
+ }
+
+ $scope.open1 = function() {
+ $scope.popup1.opened = true;
+ };
+
+ $scope.open2 = function() {
+ $scope.popup2.opened = true;
+ };
+
+ $scope.popup1 = {
+ opened: false
+ };
+
+ $scope.popup2 = {
+ opened: false
+ };
+
+ function FormatDate (strTime) {
+ var date = new Date(strTime);
+ return date.getFullYear()+"-"+(date.getMonth()+1)+"-"+date.getDate()+" "+date.getHours()+":"+date.getMinutes();
+ }
+}]);
See the License for the specific language governing permissions and
limitations under the License.
*/
-app.controller('pertabCtrl', ['$scope', '$http', '$routeParams', '$window' ,
- function ($scope, $http, $routeParams, $window) {
- $scope.tabes = [
- {title: 'one hour'},
- {title: 'one day'},
- {title: 'one month'},
- {title: 'one year'}
- ];
- $scope.valuess = [];
- $scope.csvData = [];
- $scope.barChart = function (unit) {
- $http.get(global_url + '/performance/diagram/' + unit + '/' + permanceId, {
- headers: {
- 'Access-Control-Allow-Origin': "*",
- "Content-Type": "application/json"
- }
- })
- .success(function (data) {
- var v = 0;
- var i = 0;
- if (unit === "hour") {
- for(var h=0;h<4;h++){
- $scope.valuess[h] = [
- {"x": '15min', "y": 4}, {"x": '30min', "y": 4}, {"x": '45min', "y": 12},
- {"x": '60min', "y": 3.27}
- ];
- };
- angular.forEach(data, function (obj) {
- for (var j = 0; j < obj.length; j++, i++) {
- if (i >= 4) {
- v++;
- i = 0;
- }
- $scope.valuess[v][i].y = obj[j];
- }
- });
- for (var d = 0; d < 5; d++) {
- window.setTimeout(function () {
- redraw("", $scope.valuess);
- }, 1500);
- };
- }
- if (unit === "day") {
- for(var d=0;d<4;d++){
- $scope.valuess[d] = [
- { "x":'1h' , "y":4}, { "x":'2h' , "y":4}, { "x":'3h' , "y":12},
- { "x":'4h' , "y":3.27}, { "x":'5h' , "y":34}, { "x":'6h' , "y":34}, { "x":'7h' , "y":34},
- { "x":'8h' , "y":34}, { "x":'9h' , "y":34}, { "x":'10h' , "y":34}, { "x":'11h' , "y":34},
- { "x":'12h' , "y":56}, { "x":'13h' , "y":34}, { "x":'14h' , "y":34}, { "x":'15h' , "y":34},
- { "x":'16h' , "y":12}, { "x":'17h' , "y":34}, { "x":'18h' , "y":50}, { "x":'19h' , "y":34},
- { "x":'20h' , "y":34}, { "x":'21h' , "y":54}, { "x":'22h' , "y":34}, { "x":'23h' , "y":34},
- { "x":'24h' , "y":36}
- ];
- };
- angular.forEach(data, function (obj) {
- for (var j = 0; j < obj.length; j++, i++) {
- if (i >= 24) {
- v++;
- i = 0;
- }
- $scope.valuess[v][i].y = obj[j];
- }
- })
- for (var d = 0; d < 5; d++) {
- window.setTimeout(function () {
- redraw("1", $scope.valuess);
- }, 1500);
- };
- }
- if (unit === "month") {
- for(var m=0;m<4;m++){
- $scope.valuess[m] = [
- { "x":'1d' , "y":4}, { "x":'2d' , "y":4}, { "x":'3d' , "y":12},
- { "x":'4d' , "y":3.27}, { "x":'5d' , "y":34},{ "x":'6d' , "y":4}, { "x":'7d' , "y":4}, { "x":'8d' , "y":12},
- { "x":'9d' , "y":3.27}, { "x":'10d' , "y":34}, { "x":'11d' , "y":34}, { "x":'12d' , "y":34}, { "x":'13d' , "y":4}, { "x":'14d' , "y":4}, { "x":'15' , "y":12},
- { "x":'16d' , "y":3.27}, { "x":'17d' , "y":34},{ "x":'18d' , "y":4}, { "x":'19d' , "y":4}, { "x":'20d' , "y":12},
- { "x":'21d' , "y":3.27}, { "x":'22d' , "y":34}, { "x":'23d' , "y":34}, { "x":'24d' , "y":34}, { "x":'25d' , "y":4}, { "x":'26d' , "y":12},
- { "x":'27d' , "y":3.27}, { "x":'28d' , "y":34}, { "x":'29d' , "y":34}, { "x":'30d' , "y":34}, { "x":'31d' , "y":34}
- ];
- };
- angular.forEach(data, function (obj) {
- for (var j = 0; j < obj.length; j++, i++) {
- if (i >= 31) {
- v++;
- i = 0;
- }
- $scope.valuess[v][i].y = obj[j];
- }
- });
- for (var d = 0; d < 5; d++) {
- window.setTimeout(function () {
- redraw("2", $scope.valuess);
- }, 1500);
- };
- }
- if (unit === "year") {
- for(var y=0;y<12;y++){
- $scope.valuess[y] = [
- {"x": 'Jan', "y": 4}, {"x": 'Feb', "y": 4}, {"x": 'Mar', "y": 12},
- {"x": 'Apr', "y": 3.27}, {"x": 'May', "y": 4}, {"x": 'June', "y": 4}, {"x": 'July', "y": 12},
- {"x": 'Aug', "y": 3.27}, {"x": 'Sept', "y": 4}, {"x": 'Oct', "y": 4}, {"x": 'Nov', "y": 12},
- {"x": 'Jan', "y": 3.27}
- ];
- };
- angular.forEach(data, function (obj) {
- for (var j = 0; j < obj.length; j++, i++) {
- if (i >= 12) {
- v++;
- i = 0;
- }
- $scope.valuess[v][i].y = obj[j];
- }
- });
- for (var d = 0; d < 5; d++) {
- window.setTimeout(function () {
- redraw("3", $scope.valuess);
- }, 1500);
- };
- }
- });
+app.controller("performanceDetailsController",function ($scope,$http,$window) {
+ $scope.back = function () {
+ var obj = $("#lm");
+ angular.element(obj).scope().currentTab = "app/uui/fusion/scripts/view-models/performance.html";
};
- $scope.oneHour = function () {
- changerotate(0);
- $scope.barChart('hour');
+ $http({
+ method : "GET",
+ url : global_url + "/performance/1/1/"+permanceId+"/null/null/null/null"
+ }).then(function successCallback(resp) {
+ $scope.eventName = resp.data.performances[0].performanceHeader.eventName;
+ $scope.eventId = resp.data.performances[0].performanceHeader.eventId;
+ $scope.sourceId = resp.data.performances[0].performanceHeader.sourceId;
+ $scope.sourceName = resp.data.performances[0].performanceHeader.sourceName;
+ $scope.reportingEntityId = resp.data.performances[0].performanceHeader.reportingEntityId;
+ $scope.reportingEntityName = resp.data.performances[0].performanceHeader.reportingEntityName;
+ $scope.priority = resp.data.performances[0].performanceHeader.priority;
+ $scope.createTime = resp.data.performances[0].performanceHeader.createTime;
+ $scope.nfcNamingCode = resp.data.performances[0].performanceHeader.nfcNamingCode;
+ $scope.nfNamingCode = resp.data.performances[0].performanceHeader.nfNamingCode;
+ $scope.performanceInformation = resp.data.performances[0].performanceInformation;
+ },function errorCallback(resq) {
- };
- $scope.oneHour();
- $scope.oneDay = function () {
- changerotate(90);
- $scope.barChart('day');
- };
- $scope.oneMonth = function () {
- changerotate(80);
- $scope.barChart('month');
-
- };
- $scope.oneYear = function () {
- changerotate(0);
- $scope.barChart('year');
- };
- $scope.generateCsv = function (name) {
- if (name == "cpu"){
- for (var i = 0;i < $scope.valuess[2].length;i++){
- $scope.csvData[i] = {};
- $scope.csvData[i]["eventId"] = permanceId;
- $scope.csvData[i]["name"] = name;
- $scope.csvData[i]["dateUnit"] = $scope.valuess[2][i].x;
- $scope.csvData[i]["value"] = $scope.valuess[2][i].y;
- }
- }
- if (name == "disk"){
- for (var i = 0;i < $scope.valuess[0].length;i++){
- $scope.csvData[i] = {};
- $scope.csvData[i]["eventId"] = permanceId;
- $scope.csvData[i]["name"] = name;
- $scope.csvData[i]["dateUnit"] = $scope.valuess[0][i].x;
- $scope.csvData[i]["value"] = $scope.valuess[0][i].y;
- }
- }
- if (name == "memory"){
- for (var i = 0;i < $scope.valuess[1].length;i++){
- $scope.csvData[i] = {};
- $scope.csvData[i]["eventId"] = permanceId;
- $scope.csvData[i]["name"] = name;
- $scope.csvData[i]["dateUnit"] = $scope.valuess[1][i].x;
- $scope.csvData[i]["value"] = $scope.valuess[1][i].y;
- }
- }
- if (name == "network"){
- for (var i = 0;i < $scope.valuess[3].length;i++){
- $scope.csvData[i] = {};
- $scope.csvData[i]["eventId"] = permanceId;
- $scope.csvData[i]["name"] = name;
- $scope.csvData[i]["dateUnit"] = $scope.valuess[3][i].x;
- $scope.csvData[i]["value"] = $scope.valuess[3][i].y;
- }
- }
- if($scope.csvData != null ){
- $window.location = global_url+"/performance/genDiaCsv/"+JSON.stringify($scope.csvData);
- }
- }
-}]);
+ });
+});
\ No newline at end of file
app.controller('perGridCtrl', ['$scope','$http', '$window', '$interval', 'uiGridConstants', 'uiGridGroupingConstants', '$window' ,
function ($scope, $http , $window, $interval ) {
$scope.jump = function(value){
- console.info(value);
permanceId=value;
var obj = $("#lm");
angular.element(obj).scope().currentTab = "app/uui/fusion/scripts/view-models/performance-details.html";
$scope.seek2===""?"null":$scope.seek2, $scope.seek3===""?"null":$scope.seek3,
$scope.seek4===""?"null":$scope.seek4, $scope.seek5===""?"null":$scope.seek5);
};
+ $scope.toChart = function () {
+ var obj = $("#lm");
+ angular.element(obj).scope().currentTab = "app/uui/fusion/scripts/view-models/performance-chart.html";
+ };
$scope.gridOptions = {
columnDefs: [{
field: 'performanceHeader.eventName',
- displayName: 'name',
+ displayName: 'Event Name',
width: '10%',
enableColumnMenu: false,
enableHiding: false,
}, {
field: "performanceHeader.eventId",
enableCellEdit: false,
- displayName: 'Id',
- cellTemplate: '<a ng-click="grid.appScope.jump(row.entity.performanceHeader.eventId)"; style="cursor:pointer" href="">{{row.entity.performanceHeader.eventId}}</a>',
+ displayName: 'Event Id',
+ cellTemplate: '<a ng-click="grid.appScope.jump(row.entity.performanceHeader.sourceId)"; style="cursor:pointer" href="">{{row.entity.performanceHeader.sourceId}}</a>',
},
- {field: "performanceHeader.eventName", displayName: 'State',enableCellEdit: false},
- {field: "performanceHeader.eventName", displayName: 'Cpu',enableCellEdit: false},
- {field: "performanceHeader.eventName", displayName: 'Memory',enableCellEdit: false},
- {field: "performanceHeader.eventName", displayName: 'Disk',enableCellEdit: false},
- {field: "performanceHeader.eventName", displayName: 'Network',enableCellEdit: false}
+ {field: "performanceHeader.sourceId", displayName: 'Source Id',enableCellEdit: false},
+ {field: "performanceHeader.sourceName", displayName: 'Source Name',enableCellEdit: false},
+ {field: "performanceHeader.reportingEntityId", displayName: 'Reporting Entity Id',enableCellEdit: false},
+ {field: "performanceHeader.reportingEntityName", displayName: 'Reporting Entity Name',enableCellEdit: false},
+ {field: "performanceHeader.priority", displayName: 'Priority',enableCellEdit: false},
+ {field: "performanceHeader.createTime", displayName: 'Start Time',enableCellEdit: false},
+ {field: "option",displayName: 'option', enableCellEdit: false ,
+ cellTemplate: '<button ng-click="grid.appScope.jump(row.entity.performanceHeader.sourceId)" class="btn btn-primary" >Details</button>'}
],
enableSorting: true,
useExternalSorting: false,
var getPage = function (curPage, pageSize) {
var firstRow = (curPage - 1) * pageSize;
var url = global_url+'/performance/' + curPage + '/' + pageSize + '';
- url += arguments[2] === "" ? "/null" : "/" + arguments[2];
+ url += arguments[2] === "" ? "/null" : "/" + arguments[2];
url += arguments[3] === "" ? "/null" : "/" + arguments[3];
url += arguments[4] === "" ? "/null" : "/" + arguments[4];
- url += arguments[5] === "" ? "/null" : "/" + arguments[5];
- url += arguments[6] === "" ? "/null" : "/" + arguments[6];
+ url += arguments[5] === "null" ? "/null" : "/" + FormatDate(arguments[5]);
+ url += arguments[6] === "null" ? "/null" : "/" + FormatDate(arguments[6]);
$http.get(url, {
headers: {
'Access-Control-Allow-Origin': "*",
$scope.toggleMenu = function () {
$scope.menuState.show = !$scope.menuState.show;
}
+ $scope.open1 = function () {
+ $scope.popup1.opened = true;
+ };
+
+ $scope.open2 = function () {
+ $scope.popup2.opened = true;
+ };
+
+ $scope.popup1 = {
+ opened: false
+ };
+
+ $scope.popup2 = {
+ opened: false
+ };
+ function FormatDate(strTime) {
+ var date = new Date(strTime);
+ return date.getFullYear() + "-" + (date.getMonth() + 1) + "-" + date.getDate() + " " + date.getHours() + ":" + date.getMinutes();
+ };
}]);
\ No newline at end of file
--- /dev/null
+<!--
+ 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.
+-->
+<style>
+ body {
+ overflow-y:scroll;
+ }
+ text {
+ font: 12px sans-serif;
+ }
+ svg {
+ display: block;
+ }
+ #chart svg {
+ height: 200px;
+ width: 400px;
+ min-width: 100px;
+ min-height: 100px;
+ }
+ tr.z-row-over > td.z-row-inner, tr.z-row-over > .z-cell { background-color: rgb(255, 255, 255); }
+ .nodatadiv {
+ display: table-cell;
+ width: 600px;
+ height:300px;
+ text-align:center;
+ vertical-align: middle;
+ }
+ .nodatainner {
+ padding: 10px;
+ }
+ </style>
+ <!--/.navbar-collapse -->
+ <div class="templatemo-content-wrapper">
+ <div class="templatemo-content">
+ <h1>alarm Chart</h1>
+ <div class="row" style="min-height: 500px" ng-controller="alarmchartCtrl">
+ <div class="col-md-12 col-sm-12">
+ <div class="row">
+ <div class="col-md-6">
+ <p class="input-group" style="float:left">
+ <label style="float:left;width:80px;line-height:100px">startTime:</label>
+ <div style="float:left;width:100px;padding-top:33px">
+ <input type="text" class="form-control" readonly ng-change="startTimeChanged()" uib-datepicker-popup ng-click="open1()" ng-model="startTime" is-open="popup1.opened" datepicker-options ng-required="true" close-text="Close" />
+ </div>
+ <div style="display:block;float:left" uib-timepicker ng-model="startTime" ng-change="startTimeChanged()" hour-step minute-step show-meridian></div>
+ </p>
+ </div>
+
+ <div class="col-md-6" style="float:left">
+ <p class="input-group" style="float:left">
+ <label style="float:left;width:80px;line-height:100px">endTime:</label>
+ <div style="float:left;width:100px;padding-top:33px;">
+ <input type="text" class="form-control" readonly ng-change="endTimeChanged()" ng-click="open2()" uib-datepicker-popup ng-model="endTime" is-open="popup2.opened" datepicker-options ng-required="true" close-text="Close" />
+ </div>
+ <div style="display:block;float:left" uib-timepicker ng-model="endTime" ng-change="endTimeChanged()" hour-step minute-step show-meridian></div>
+ </p>
+ </div>
+ <div class="col-md-6" style="width:100%;padding-bottom:20px;">
+ <p>
+ <div style="float:left;padding-right:30px;">
+ <label style="float:left;width:80px;line-height:30px;">sourceId:</label>
+ <div style="float:left;width:130px;">
+ <select class="form-control" ng-change="sourceIdChanged()" ng-model="sourceId" ng-options="s for s in sourceIds" >
+ <option value="">--- chose ---</option>
+ </select>
+ </div>
+ </div>
+ <div style="float:left">
+ <button style="padding-top:6px;" class="btn btn-default" ng-click="genDiagram()">submit</button>
+ </div>
+ </p>
+ </div>
+
+ <div class="col-md-6 col-sm-12" style="width:100%">
+ <div class="panel panel-success">
+ <div class="panel-heading">Chart
+ <button ng-click="generateCsv('cpu');" class="btn btn-primary" style="float: right;margin-top:-7px;display: none ">CSV</button>
+ </div>
+ <div align="center"><H3></H3></div><div id="chart_alarm"> <svg></svg> </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <br />
+ <br />
+ <br />
+ <br />
+ </div>
+ </div>
+ </div>
\ No newline at end of file
--- /dev/null
+<!--
+ 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.
+-->
+<div class="templatemo-content" ng-controller="alarmDetailsController">
+ <h1>VNF Alarm Details</h1>
+
+
+
+ <button style="position:relative;left:75%;" ng-click="back()" class="btn btn-primary">back</button>
+
+ <div>
+ <span>Header Information</span>
+ <table width="80%" border="1" cellspacing="50%" cellpadding="10">
+ <tr>
+ <th style="background-color:lightblue;">Event Name</th>
+ <td>{{eventName}}</td>
+ <th style="background-color:lightblue;">Event Id</th>
+ <td>{{eventId}}</td>
+ </tr>
+ <tr>
+ <th style="background-color:lightblue;">Source Id</th>
+ <td>{{sourceId}}</td>
+ <th style="background-color:lightblue;">Source Name</th>
+ <td>{{sourceName}}</td>
+ </tr>
+ <tr>
+ <th style="background-color:lightblue;">Reporting Entity Id</th>
+ <td>{{reportingEntityId}}</td>
+ <th style="background-color:lightblue;">Reporting Entity Name</th>
+ <td>{{reportingEntityName}}</td>
+ </tr>
+ <tr>
+ <th style="background-color:lightblue;">Priority</th>
+ <td>{{priority}}</td>
+ <th style="background-color:lightblue;">Start Time</th>
+ <td>{{startTIme}}</td>
+ </tr>
+ <tr>
+ <th style="background-color:lightblue;">NFC Naming Code</th>
+ <td>{{nfcNamingCode}}</td>
+ <th style="background-color:lightblue;">NF Naming Code</th>
+ <td>{{nfNamingCode}}</td>
+ </tr>
+ </table>
+ </div>
+ <div style="padding-top:10px;">
+ <span>
+ Detail Information
+ </span>
+ <table width="80%" border="1" cellspacing="50%" cellpadding="10">
+ <tr>
+ <th style="background-color:lightblue;">Event Servrity</th>
+ <td>{{eventServrity}}</td>
+ <th style="background-color:lightblue;">Event Source Type</th>
+ <td>{{eventSourceType}}</td>
+ </tr>
+ <tr>
+ <th style="background-color:lightblue;">Event Category</th>
+ <td>{{eventCategory}}</td>
+ <th style="background-color:lightblue;">Alarm InterfaceA</th>
+ <td>{{alarmInterfaceA}}</td>
+ </tr>
+ <tr>
+ <th style="background-color:lightblue;">Alarm Condition</th>
+ <td>{{alarmCondition}}</td>
+ <th style="background-color:lightblue;">Specific Problem</th>
+ <td>{{specificProblem}}</td>
+ </tr>
+ </table>
+ </div>
+ <div style="padding-top:10px;">
+ <span>
+ Additional Information
+ </span>
+ <table width="80%" border="1" cellspacing="50%" cellpadding="10">
+ <tr>
+ <th style="background-color:lightblue;">Item Name</th>
+ <th style="background-color:lightblue;">Item Value</th>
+ </tr>
+ <tbody ng-repeat="info in alarmInformation">
+ <td>{{info.name}}</td>
+ <td>{{info.value}}</td>
+ </tbody>
+ </table>
+ </div>
+
+</div>
\ No newline at end of file
limitations under the License.
-->
<div class="templatemo-content" ng-controller="alarmGridCtrl">
- <h1>Alarm</h1>
+ <h1>VNF Alarm</h1>
<div class="row margin-bottom-20">
</div>
<div class="row margin-bottom-10">
- <div class="col-md-8">
- <ul class="nav nav-pills">
- <li style="background-color: #ddd"
- ng-repeat="s in status"
- ng-click="selectStatus(s.id)"
- ng-class="{active:activeStatus(s.id)}">
- <a href="">
- {{s.name}}
- <span class="badge">{{s.count}}</span>
- </a>
- </li>
- <input type="hidden" ng-model="selectedStatus"/>
- </ul>
- </div>
+
<div class="col-md-4">
<ul class="nav nav-pills">
<li style="background-color: #ddd" ng-repeat="O in open"
</div>
</div>
<ul class="list">
- <li>cpu <input ng-model="condition1" type="text"/></li>
- <li>state <input ng-model="condition2" type="text"/></li>
- <li>memory <input ng-model="condition3" type="text"/></li>
+ <li>Source Id <input ng-model="condition1" type="text"/></li>
+ <li>Source Name <input ng-model="condition2" type="text"/></li>
+ <li>Priority <input ng-model="condition3" type="text"/></li>
<button ng-click="alarmSearch()">search</button>
</ul>
<ul class="list" ng-show='menuState.show'>
- <li>disk <input ng-model="condition4" type="text"/></li>
- <li>Network <input ng-model="condition5" type="text"/></li>
+ <li>Start Time
+ <input type="text" class="form-control" readonly ng-click="open1()" uib-datepicker-popup ng-model="condition4" is-open="popup1.opened" datepicker-options ng-required="true" close-text="Close" />
+ <div style="display:block;float:left" uib-timepicker ng-model="condition4" hour-step minute-step show-meridian></div>
+ </li>
+ <li>
+ End Time <input type="text" class="form-control" ng-click="open2()" readonly uib-datepicker-popup ng-model="condition5" is-open="popup2.opened" datepicker-options ng-required="true" close-text="Close" />
+ <div style="display:block;float:left" uib-timepicker ng-model="condition5" hour-step minute-step show-meridian></div>
+ </li>
</ul>
<div class="row">
<div class="col-md-5" style="border-top:1px dotted #ddd">
</div>
<div class="col-md-1">
- <button ng-click="generateCsv()" class="btn btn-primary">CSV</button>
+ <!--<button ng-click="generateCsv()" class="btn btn-primary">CSV</button>-->
+ <button ng-click="toChart()" class="btn btn-primary">Chart</button>
</div>
</div>
<div>
--- /dev/null
+<!--
+ 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.
+-->
+<style>
+ body {
+ overflow-y:scroll;
+ }
+ text {
+ font: 12px sans-serif;
+ }
+ svg {
+ display: block;
+ }
+ #chart svg {
+ height: 200px;
+ width: 400px;
+ min-width: 100px;
+ min-height: 100px;
+ }
+ tr.z-row-over > td.z-row-inner, tr.z-row-over > .z-cell { background-color: rgb(255, 255, 255); }
+ .nodatadiv {
+ display: table-cell;
+ width: 600px;
+ height:300px;
+ text-align:center;
+ vertical-align: middle;
+ }
+ .nodatainner {
+ padding: 10px;
+ }
+ </style>
+ <!--/.navbar-collapse -->
+ <div class="templatemo-content-wrapper">
+ <div class="templatemo-content">
+ <h1>Performance Chart</h1>
+ <div class="row" style="min-height: 500px" ng-controller="pertabCtrl">
+ <div class="col-md-12 col-sm-12">
+ <div class="row">
+ <div class="col-md-6">
+ <p class="input-group" style="float:left">
+ <label style="float:left;width:80px;line-height:100px">startTime:</label>
+ <div style="float:left;width:100px;padding-top:33px">
+ <input type="text" class="form-control" readonly ng-change="startTimeChanged()" uib-datepicker-popup ng-click="open1()" ng-model="startTime" is-open="popup1.opened" datepicker-options ng-required="true" close-text="Close" />
+ </div>
+ <div style="display:block;float:left" uib-timepicker ng-model="startTime" ng-change="startTimeChanged()" hour-step minute-step show-meridian></div>
+ </p>
+ </div>
+
+ <div class="col-md-6" style="float:left">
+ <p class="input-group" style="float:left">
+ <label style="float:left;width:80px;line-height:100px">endTime:</label>
+ <div style="float:left;width:100px;padding-top:33px;">
+ <input type="text" class="form-control" readonly ng-change="endTimeChanged()" ng-click="open2()" uib-datepicker-popup ng-model="endTime" is-open="popup2.opened" datepicker-options ng-required="true" close-text="Close" />
+ </div>
+ <div style="display:block;float:left" uib-timepicker ng-model="endTime" ng-change="endTimeChanged()" hour-step minute-step show-meridian></div>
+ </p>
+ </div>
+ <div class="col-md-6" style="width:100%;padding-bottom:20px;">
+ <p>
+ <div style="float:left;padding-right:30px;">
+ <label style="float:left;width:80px;line-height:30px;">sourceId:</label>
+ <div style="float:left;width:130px;">
+ <select class="form-control" ng-change="sourceIdChanged()" ng-model="sourceId" ng-options="s for s in sourceIds" >
+ <option value="">--- chose ---</option>
+ </select>
+ </div>
+ </div>
+ <div style="float:left;padding-right:30px" ng-show="namesPIsShow">
+ <label style="float:left;width:50px;line-height:30px;">name:</label>
+ <div style="float:left;width:130px;">
+ <select class="form-control" ng-change="namePChanged()" ng-model="nameP" ng-options="np for np in namePs" >
+ <option value="">--- chose ---</option>
+ </select>
+ </div>
+ </div>
+ <div style="float:left;padding-right:30px" ng-show="namesCIsShow" style="float:left">
+ <label style="float:left;width:50px;line-height:30px;">name:</label>
+ <div style="float:left;width:130px;">
+ <select class="form-control" ng-model="nameC" ng-change="nameCChanged()" ng-options="nc for nc in nameCs" >
+ <option value="">--- chose ---</option>
+ </select>
+ </div>
+ </div>
+ <div ng-show="goIsShow" style="float:left">
+ <button style="padding-top:6px;" class="btn btn-default" ng-click="genDiagram()">Go</button>
+ </div>
+ </p>
+ </div>
+
+ <div class="col-md-12 col-sm-12" >
+ <div class="panel panel-success">
+ <div class="panel-heading">Chart
+ <button ng-click="generateCsv('cpu');" class="btn btn-primary" style="float: right;margin-top:-7px;display: none ">CSV</button>
+ </div>
+ <div id="chart_performance"> <svg></svg> </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <br />
+ <br />
+ <br />
+ <br />
+ </div>
+ </div>
+ </div>
\ No newline at end of file
See the License for the specific language governing permissions and
limitations under the License.
-->
-<style>
- body {
- overflow-y:scroll;
- }
- text {
- font: 12px sans-serif;
- }
- svg {
- display: block;
- }
- #CPUchart,#Memorychart,#Diskchart,#Networkchart svg {
- height: 200px;
- width: 400px;
- min-width: 100px;
- min-height: 100px;
- }
- tr.z-row-over > td.z-row-inner, tr.z-row-over > .z-cell { background-color: rgb(255, 255, 255); }
- .nodatadiv {
- display: table-cell;
- width: 600px;
- height:300px;
- text-align:center;
- vertical-align: middle;
- }
- .nodatainner {
- padding: 10px;
- }
- </style>
- <!--/.navbar-collapse -->
- <div class="templatemo-content-wrapper">
- <div class="templatemo-content">
- <h1>Performance Details</h1>
- <div class="row" style="min-height: 500px" ng-controller="pertabCtrl">
- <div class="col-md-12 col-sm-12">
- <uib-tabset active="active" >
- <uib-tab heading="one hour" ng-click="oneHour()" >
- <div class="templatemo-charts">
- <div class="row" style="margin-top: 10px">
- <div class="col-md-6 col-sm-12">
- <div class="panel panel-success">
- <div class="panel-heading">CPU
- <button ng-click="generateCsv('cpu');" class="btn btn-primary" style="float: right;margin-top:-7px; ">CSV</button>
- </div>
- <div align="center"><H3></H3></div><div id="CPUchart"> <svg></svg> </div>
- </div>
- </div>
- <div class="col-md-6 col-sm-12">
- <div class="panel panel-success">
- <div class="panel-heading">Memory
- <button ng-click="generateCsv('memory');" class="btn btn-primary" style="float: right;margin-top:-7px; ">CSV</button></div>
- <div align="center"><H3></H3></div><div id="Memorychart"> <svg></svg> </div>
- </div>
- </div>
- </div>
- <div class="row">
- <div class="col-md-6 col-sm-12">
- <div class="panel panel-success">
- <div class="panel-heading">Disk
- <button ng-click="generateCsv('disk');" class="btn btn-primary" style="float: right;margin-top:-7px; ">CSV</button></div>
- <div align="center"><H3></H3></div><div id="Diskchart"> <svg></svg> </div>
- </div>
- </div>
- <div class="col-md-6 col-sm-12">
- <div class="panel panel-success">
- <div class="panel-heading">Network
- <button ng-click="generateCsv('network');" class="btn btn-primary" style="float: right;margin-top:-7px; ">CSV</button></div>
- <div align="center"><H3></H3></div><div id="Networkchart"> <svg></svg> </div>
- </div>
- </div>
- </div>
- </div>
- </uib-tab>
- <uib-tab heading="one day" ng-click="oneDay()">
- <div class="templatemo-charts">
- <div class="row" style="margin-top: 10px">
- <div class="col-md-6 col-sm-12">
- <div class="panel panel-success">
- <div class="panel-heading">CPU
- <button ng-click="generateCsv('cpu');" class="btn btn-primary" style="float: right;margin-top:-7px; ">CSV</button></div>
- <div align="center"><H3></H3></div><div id="CPUchart1"> <svg></svg> </div>
- </div>
- </div>
- <div class="col-md-6 col-sm-12">
- <div class="panel panel-success">
- <div class="panel-heading">Memory
- <button ng-click="generateCsv('memory');" class="btn btn-primary" style="float: right;margin-top:-7px; ">CSV</button></div>
- <div align="center"><H3></H3></div><div id="Memorychart1"> <svg></svg> </div>
- </div>
- </div>
- </div>
- <div class="row">
- <div class="col-md-6 col-sm-12">
- <div class="panel panel-success">
- <div class="panel-heading">Disk
- <button ng-click="generateCsv('disk');" class="btn btn-primary" style="float: right;margin-top:-7px; ">CSV</button></div>
- <div align="center"><H3></H3></div><div id="Diskchart1"> <svg></svg> </div>
- </div>
- </div>
- <div class="col-md-6 col-sm-12">
- <div class="panel panel-success">
- <div class="panel-heading">Network
- <button ng-click="generateCsv('network');" class="btn btn-primary" style="float: right;margin-top:-7px; ">CSV</button></div>
- <div align="center"><H3></H3></div><div id="Networkchart1"> <svg></svg> </div>
- </div>
- </div>
- </div>
- </div>
- </uib-tab>
- <uib-tab heading="one month" ng-click="oneMonth()">
- <div class="templatemo-charts">
- <div class="row" style="margin-top: 10px">
- <div class="col-md-6 col-sm-12">
- <div class="panel panel-success">
- <div class="panel-heading">CPU
- <button ng-click="generateCsv('cpu');" class="btn btn-primary" style="float: right;margin-top:-7px; ">CSV</button></div>
- <div align="center"><H3></H3></div><div id="CPUchart2"> <svg></svg> </div>
- </div>
- </div>
- <div class="col-md-6 col-sm-12">
- <div class="panel panel-success">
- <div class="panel-heading">Memory
- <button ng-click="generateCsv('memory');" class="btn btn-primary" style="float: right;margin-top:-7px; ">CSV</button></div>
- <div align="center"><H3></H3></div><div id="Memorychart2"> <svg></svg> </div>
- </div>
- </div>
- </div>
- <div class="row">
- <div class="col-md-6 col-sm-12">
- <div class="panel panel-success">
- <div class="panel-heading">Disk
- <button ng-click="generateCsv('disk');" class="btn btn-primary" style="float: right;margin-top:-7px; ">CSV</button></div>
- <div align="center"><H3></H3></div><div id="Diskchart2"> <svg></svg> </div>
- </div>
- </div>
- <div class="col-md-6 col-sm-12">
- <div class="panel panel-success">
- <div class="panel-heading">Network
- <button ng-click="generateCsv('network');" class="btn btn-primary" style="float: right;margin-top:-7px; ">CSV</button></div>
- <div align="center"><H3></H3></div><div id="Networkchart2"> <svg></svg> </div>
- </div>
- </div>
- </div>
- </div>
- </uib-tab>
- <uib-tab heading="one year" ng-click="oneYear()">
- <div class="templatemo-charts">
- <div class="row" style="margin-top: 10px">
- <div class="col-md-6 col-sm-12">
- <div class="panel panel-success">
- <div class="panel-heading">CPU
- <button ng-click="generateCsv('cpu');" class="btn btn-primary" style="float: right;margin-top:-7px; ">CSV</button></div>
- <div align="center"><H3></H3></div><div id="CPUchart3"> <svg></svg> </div>
- </div>
- </div>
- <div class="col-md-6 col-sm-12">
- <div class="panel panel-success">
- <div class="panel-heading">Memory
- <button ng-click="generateCsv('memory');" class="btn btn-primary" style="float: right;margin-top:-7px; ">CSV</button></div>
- <div align="center"><H3></H3></div><div id="Memorychart3"> <svg></svg> </div>
- </div>
- </div>
- </div>
- <div class="row">
- <div class="col-md-6 col-sm-12">
- <div class="panel panel-success">
- <div class="panel-heading">Disk
- <button ng-click="generateCsv('disk');" class="btn btn-primary" style="float: right;margin-top:-7px; ">CSV</button></div>
- <div align="center"><H3></H3></div><div id="Diskchart3"> <svg></svg> </div>
- </div>
- </div>
- <div class="col-md-6 col-sm-12">
- <div class="panel panel-success">
- <div class="panel-heading">Network
- <button ng-click="generateCsv('network');" class="btn btn-primary" style="float: right;margin-top:-7px; ">CSV</button></div>
- <div align="center"><H3></H3></div><div id="Networkchart3"> <svg></svg> </div>
- </div>
- </div>
- </div>
- </div>
- </uib-tab>
- </uib-tabset>
- </div>
- <br />
- <br />
- <br />
- <br />
- </div>
- </div>
- </div>
\ No newline at end of file
+<div class="templatemo-content" ng-controller="performanceDetailsController">
+ <h1>VNF Performance Data Details</h1>
+
+
+
+ <button style="position:relative;left:75%;" ng-click="back()" class="btn btn-primary">back</button>
+
+ <div>
+ <span>Header Information</span>
+ <table width="80%" border="1" cellspacing="50%" cellpadding="10">
+ <tr>
+ <th style="background-color:lightblue;">Event Name</th>
+ <td>{{eventName}}</td>
+ <th style="background-color:lightblue;">Event Id</th>
+ <td>{{eventId}}</td>
+ </tr>
+ <tr>
+ <th style="background-color:lightblue;">Source Id</th>
+ <td>{{sourceId}}</td>
+ <th style="background-color:lightblue;">Source Name</th>
+ <td>{{sourceName}}</td>
+ </tr>
+ <tr>
+ <th style="background-color:lightblue;">Reporting Entity Id</th>
+ <td>{{reportingEntityId}}</td>
+ <th style="background-color:lightblue;">Reporting Entity Name</th>
+ <td>{{reportingEntityName}}</td>
+ </tr>
+ <tr>
+ <th style="background-color:lightblue;">Priority</th>
+ <td>{{priority}}</td>
+ <th style="background-color:lightblue;">Start Time</th>
+ <td>{{createTime}}</td>
+ </tr>
+ <tr>
+ <th style="background-color:lightblue;">NFC Naming Code</th>
+ <td>{{nfcNamingCode}}</td>
+ <th style="background-color:lightblue;">NF Naming Code</th>
+ <td>{{nfNamingCode}}</td>
+ </tr>
+ </table>
+ </div>
+ <div style="padding-top:10px;">
+ <span>
+ Additional Information
+ </span>
+ <table width="80%" border="1" cellspacing="50%" cellpadding="10">
+ <tr>
+ <th style="background-color:lightblue;">Item Name</th>
+ <th style="background-color:lightblue;">Item Value</th>
+ </tr>
+ <tbody ng-repeat="info in performanceInformation">
+ <td>{{info.name}}</td>
+ <td>{{info.value}}</td>
+ </tbody>
+ </table>
+ </div>
+
+</div>
\ No newline at end of file
<h1>Performance</h1>
<div>
<ul class="list">
- <li>cpu <input type="text" ng-model="seek1"/></li>
- <li>state <input type="text" ng-model="seek2"/></li>
- <li>memory <input type="text" ng-model="seek3"/></li>
+ <li>Source Id <input type="text" ng-model="seek1"/></li>
+ <li>Source Name <input type="text" ng-model="seek2"/></li>
+ <li>Priority <input type="text" ng-model="seek3"/></li>
<button ng-click="getSearch()">search</button>
</ul>
<ul class="list" ng-show='menuState.show'>
- <li>disk <input type="text" ng-model="seek4"/></li>
- <li>Network <input type="text" ng-model="seek5"/></li>
+ <li>Start Time <input type="text" class="form-control" readonly ng-click="open1()" uib-datepicker-popup ng-model="seek4" is-open="popup1.opened" datepicker-options ng-required="true" close-text="Close" />
+ <div style="display:block;float:left" uib-timepicker ng-model="seek4" hour-step minute-step show-meridian></div></li>
+ <li>End Time <input type="text" class="form-control" readonly ng-click="open2()" uib-datepicker-popup ng-model="seek5" is-open="popup2.opened" datepicker-options ng-required="true" close-text="Close" />
+ <div style="display:block;float:left" uib-timepicker ng-model="seek5" hour-step minute-step show-meridian></div></li>
</ul>
<div class="row">
<div class="col-md-5" style="border-top:1px dotted #ddd">
</div>
</div>
<div class="col-md-1">
- <button ng-click="generateCsv()" class="btn btn-primary">CSV</button>
+ <!-- <button ng-click="generateCsv()" class="btn btn-primary">CSV</button>-->
+ <button ng-click="toChart()" class="btn btn-primary">Chart</button>
</div>
</div>
<div ui-grid="gridOptions" style="width: 100%;margin-top:10px; text-align: center;" ui-grid-edit
Code Review / usecase-ui.git / commitdiff