var modalInstance = $uibModal.open({
ariaLabelledBy: 'modal-title',
ariaDescribedBy: 'modal-body',
- templateUrl: 'app/uui/fusion/scripts/view-models/scale-service-dialog.html',
- controller: 'scaleServiceCtrl',
+ templateUrl: 'app/uui/fusion/scripts/view-models/update-service-dialog.html',
+ controller: 'updateServiceCtrl',
controllerAs: 'ctrl',
resolve: {
customer: function () {
</tr>
</thead>
<tbody id="bb">
- <tr ng-repeat="serviceInstance in ctrl.serviceInstances">
+ <tr ng-repeat="serviceInstance in ctrl.serviceInstances" ng-if="serviceInstance.serviceType==='E2E Service'">
<td>{{serviceInstance.serviceInstanceId}}</td>
<td>{{serviceInstance.serviceInstanceName}}</td>
<td>{{serviceInstance.serviceType}}</td>
<td>
<button class="btn btn-primary" ng-click="ctrl.scaleService(serviceInstance)">Scale</button>
<button class="btn btn-primary" ng-click="ctrl.deleteService(serviceInstance)">Delete</button>
+ <button class="btn btn-primary" ng-click="ctrl.upDateService(serviceInstance)">upDate</button>
</td>
</tr>
</tbody>
--- /dev/null
+<!--
+
+ Copyright 2016-2017 ZTE Corporation.
+
+ 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="modal-header" style="margin-bottom: 15px;">
+ <h4 class="modal-title" id="myModalLabel">
+ <span>Create</span>
+ </h4>
+</div>
+
+<div class="modal-body">
+ <form class="form-horizontal" role="form" id="neForm">
+
+ <uib-tabset active="active">
+ <uib-tab heading="Base">
+ <div id="basicInfoTab" style="margin-top:20px;">
+ <div class="mT15 form-group" style="margin-left:25px;">
+ <label class="col-sm-3 control-label">
+ <span>Service Name</span>
+ <span class="required">*</span>
+ </label>
+ <div class="col-sm-7">
+ <input type="text" id="svcName" name="svcName" class="form-control" placeholder="Service Name" maxlength="256" ng-model="ctrl.service.serviceName"/>
+ </div>
+ </div>
+ <div class="mT15 form-group" style="margin-left:25px;">
+ <label class="col-sm-3 control-label">
+ <span>Service Description</span>
+ <span class="required">*</span>
+ </label>
+ <div class="col-sm-7">
+ <input type="text" id="svcDesc" name="" class="form-control" placeholder="Service Description" maxlength="256" ng-model="ctrl.service.serviceDescription"/>
+ </div>
+ </div>
+ <div class="form-group" style="margin-left:25px;margin-bottom:15px;">
+ <label class="col-sm-3 control-label">
+ <span>Service Template</span>
+ <span class="required">*</span>
+ </label>
+ <div class="col-sm-7">
+ <select class="form-control" style="padding-top: 0px;padding-bottom: 0px;" id="svcTempl" name="svcTempl" ng-change="ctrl.serviceTemplateChanged(ctrl.selectedTemplate)" ng-model="ctrl.selectedTemplate" ng-options="template.name for template in ctrl.templates">
+ <option value="">--select--</option>
+ </select>
+ </div>
+ </div>
+ </div>
+ </uib-tab>
+ <uib-tab heading="Template Parameters">
+ <div id='templateParasTab' style="margin-top:20px;">
+
+ <fieldset ng-repeat="segment in ctrl.service.segments" style="margin-left:25px;">
+ <legend>{{segment.nodeTemplateName}}</legend>
+ <!-- <div class="form-group" style="margin-left:0px;margin-bottom:5px;">
+ <label class="col-sm-5 control-label">
+ <span>{{segment.location.name}}</span><span class="required">*</span>
+ </label>
+ <div class="col-sm-5">
+ <select class="form-control" style ="padding-top: 0px;padding-bottom: 0px;" ng-model="segment.location.value" ng-options="option.value for option in ctrl.locations">
+ <option value="">select</option>
+ </select>
+ </div>
+ </div> -->
+ <div ng-repeat="segment_parameter in segment.parameters" class="mT15 form-group" style="margin-left:0px;">
+ <label ng-if="segment_parameter.type === 'vf_location'" class="col-sm-5 control-label">
+ <span>{{segment_parameter.description}}</span><span ng-if="segment_parameter.isRequired" class="required">*</span>
+ </label>
+ <label ng-if="segment_parameter.type !== 'vf_location'" class="col-sm-5 control-label">
+ <span>{{segment_parameter.name}}</span><span ng-if="segment_parameter.isRequired" class="required">*</span>
+ </label>
+ <div ng-if="segment_parameter.type === 'string' || segment_parameter.type === 'boolean' || segment_parameter.type === 'integer'" class="col-sm-5">
+ <input type="text" name="{{segment_parameter.description}}" class="form-control" ng-model="segment_parameter.value" placeholder="{{segment_parameter.name}}" value="{{segment_parameter.defaultValue}}" ng-readonly="{{segment_parameter.readonly}}"/>
+ </div>
+ <div ng-if="segment_parameter.type === 'vf_location'" class="col-sm-5">
+ <select class="form-control" style ="padding-top: 1px;padding-bottom: 0px;" ng-model="segment_parameter.value" ng-options="option.name for option in ctrl.locations">
+ <option value="">--select--</option>
+ </select>
+ </div>
+ <div ng-if="segment_parameter.type === 'sdn_controller'" class="col-sm-5">
+ <select class="form-control" style ="padding-top: 0px;padding-bottom: 0px;" ng-model="segment_parameter.value" ng-options="option.value for option in ctrl.sdnControllers">
+ <option value="">--select--</option>
+ </select>
+ </div>
+ </div>
+ </fieldset>
+ <legend>Service Inputs</legend>
+ <div ng-repeat="parameter in ctrl.service.parameters" class="mT15 form-group" style="margin-left:0px;">
+ <label class="col-sm-5 control-label">
+ <span>{{parameter.name}}</span><span ng-if="parameter.isRequired" class="required">*</span>
+ </label>
+ <div ng-if="parameter.type === 'string' || parameter.type === 'boolean' || parameter.type === 'integer'" class="col-sm-5">
+ <input type="text" name="{{parameter.description}}" class="form-control" ng-model="parameter.value" placeholder="{{parameter.name}}" value="{{parameter.defaultValue}}" ng-readonly="{{parameter.readonly}}"/>
+ </div>
+ <div ng-if="parameter.type === 'vf_location'" class="col-sm-5">
+ <select class="form-control" style ="padding-top: 0px;padding-bottom: 0px;" ng-model="parameter.value" ng-options="option.name for option in ctrl.locations">
+ <option value="">--select--</option>
+ </select>
+ </div>
+ <div ng-if="parameter.type === 'sdn_controller'" class="col-sm-5">
+ <select class="form-control" style ="padding-top: 0px;padding-bottom: 0px;" ng-model="parameter.value" ng-options="option.value for option in ctrl.sdnControllers">
+ <option value="">--select--</option>
+ </select>
+ </div>
+ </div>
+
+ </div>
+ </uib-tab>
+ </uib-tabset>
+
+</form>
+</div>
+
+<div class="modal-footer">
+ <button type="button" style="width:80px;" class="btn btn-primary" ng-click="ctrl.ok()" id="startToCreateService">
+ <span id="nfv-virtualApplication-iui-text-cancelBtn">OK</span>
+ </button>
+ <button type="button" style="width:80px;" class="btn btn-warning" ng-click="ctrl.cancel()">
+ <span id="nfv-virtualApplication-iui-text-previousBtn">Cancel</span>
+ </button>
+</div>
$scope.ndaShow = false;
$scope.hdaShow = false;
$scope.sourceId = "";
+ $scope.hourshow = false;
+ $scope.dayshow = true;
$scope.today = function () {
$scope.startTime = new Date();
$scope.endTime = new Date();
};
$scope.today();
- $scope.options = {
- chart: {
- type: 'historicalBarChart',
- height: 300,
- margin : {
- top: 20,
- right: 20,
- bottom: 65,
- left: 50
- },
- x: function(d){return d[0];},
- y: function(d){return d[1];},
- showValues: true,
- valueFormat: function(d){
- return d3.format(',.1f')(d);
- },
- duration: 100,
- xAxis: {
- //axisLabel: 'X Axis',
- tickFormat: function(d) {
- return d3.time.format('%x %H:%M')(new Date(d))
- },
- rotateLabels: 30,
- showMaxMin: true
- },
- yAxis: {
- //axisLabel: 'Y Axis',
- axisLabelDistance: -10,
- tickFormat: function(d){
- return d3.format(',.1f')(d);
- }
- },
- tooltip: {
- keyFormatter: function(d) {
- return d3.time.format('%x %H:%M')(new Date(d));
- }
- },
- zoom: {
- enabled: false,
- scaleExtent: [1, 10],
- useFixedDomain: false,
- useNiceScale: false,
- horizontalOff: false,
- verticalOff: false,
- unzoomEventType: 'dblclick.zoom'
- }
- }
- };
-
-
- $scope.data = [
- {
- "key" : "Quantity" ,
- "bar": true,
- "values" : []
- }];
-
-
$scope.genDiagram = function () {
$http({
method: 'POST',
"sourceId": $scope.sourceId,
"startTime": FormatDate($scope.startTime),
"endTime": FormatDate($scope.endTime),
- "showMode" : ($scope.showModeId==undefined?"auto":$scope.showModeId)
+ "format" : ($scope.showModeId==undefined?"auto":$scope.showModeId)
},
headers: {'Content-Type': 'application/x-www-form-urlencoded'},
transformRequest: function (obj) {
return str.join("&");
}
}).then(function successCallback(resp) {
+ console.log(resp);
$scope.chartShow = true;
- if (resp.data.length > 0){
+ if (resp.data.allList){
$scope.ndaShow = false;
$scope.hdaShow = true;
- $scope.data = [
- {
- "key" : "Max" ,
- "bar": true,
- "values" : resp.data
- }];
- $scope.api.refresh();
+ drawAlarmLine(resp.data,alarmChart);
}
else{
$scope.ndaShow = true;
$scope.hdaShow = false;
- $scope.data = [
- {
- "key" : "Max" ,
- "bar": true,
- "values" : []
- }];
- $scope.api.refresh();
}
}, function errorCallback(resp) {
-
+
});
}
-
+ $scope.showModeIdChanged = function(){
+
+ if($scope.showModeId == 'hour'){
+ // console.log(typeof($scope.startTime))
+ // console.log(String($scope.startTime))
+ var str = String($scope.startTime);
+ var str2 = String($scope.endTime);
+ $scope.startTime = new Date(str.replace(/\:[0-9]{2}\:/,':00:'));
+ $scope.endTime = new Date(str2.replace(/\:[0-9]{2}\:/,':00:'));
+ $scope.hourshow = true;
+ $scope.dayshow = true;
+ }else if($scope.showModeId == 'day'){
+ $scope.hourshow = false;
+ $scope.dayshow = true;
+ }else if($scope.showModeId == 'month'){
+ $scope.hourshow = false;
+ $scope.dayshow = false;
+ }
+
+ }
$scope.startTimeChanged = function () {
+
if ($scope.startTime > $scope.endTime)
$scope.endTime = "";
};
opened: false
};
- $scope.showModeIds = ["minute","hour","day","month","year"];
-
+ $scope.showModeIds = ["hour","day","month"];
+ $scope.showModeId = 'day';
function FormatDate(strTime) {
var date = new Date(strTime);
- return date.getFullYear() + "-" + (date.getMonth() + 1) + "-" + date.getDate() + " " + date.getHours() + ":" + date.getMinutes();
+ if($scope.showModeId == 'hour'){
+ return date.getFullYear() + "-" + (date.getMonth() + 1) + "-" + date.getDate() + " " + date.getHours()
+ }
+ if($scope.showModeId == 'day'){
+ return date.getFullYear() + "-" + (date.getMonth() + 1) + "-" + date.getDate()
+ }
+ if($scope.showModeId == 'month'){
+ return date.getFullYear() + "-" + (date.getMonth() + 1)
+ }
+
+ // return date.getFullYear() + "-" + (date.getMonth() + 1) + "-" + date.getDate() + " " + date.getHours() + ":" + date.getMinutes();
}
-
+ // 获取折线图盒子
+ var alarmChart = echarts.init(document.getElementById("alarmChart"));
+
+ function drawAlarmLine(data,myChart){
+ var names = Object.keys(data);
+ var myseries = [];
+ names.forEach(function (item) {
+ if(item != 'dateList'){
+ myseries.push({
+ name: item,
+ type: 'line',
+ symbol: 'circle',
+ symbolSize: 10,
+ data: data[item]
+ })
+ }
+ })
+ var options = {
+ tooltip: {
+ trigger: 'axis',
+ formatter: (params) => {
+ var res = '<p>' + params[0].name + '</p>' + '<div>';
+ // console.log(params);
+ for (var i = 0; i < params.length; i++) {
+ res += '<span></span>' + params[i].seriesName + ' : ' + params[i].value + '</br>';
+ }
+ res += '</div>';
+ return res;
+ }
+ },
+ legend: {
+ data: names,
+ top: 10,
+ icon: 'rect',
+ itemWidth: 10,
+ itemHeight: 10
+ },
+ grid: {
+ left: '3%',
+ right: '5%',
+ bottom: '5%',
+ top: '15%',
+ containLabel: true
+ },
+ xAxis: {
+ type: 'category',
+ name: 'Time',
+ boundaryGap: false,
+ data: data.dateList,
+ axisLabel:{
+ formatter:(value)=>{
+ if($scope.showModeId == 'day'){
+ return value.slice(5,10)
+ }else if($scope.showModeId == 'hour'){
+ return value.slice(5,16)
+ }else if($scope.showModeId == 'month'){
+ return value.slice(2,7)
+ }
+ }
+ },
+ axisLine: {
+ symbol: ['none', 'arrow'],
+ symbolOffset: [0, 12]
+ },
+ axisTick: {
+ show: false
+ },
+ splitLine: {
+ show: true
+ }
+ },
+ yAxis: {
+ type: 'value',
+ name: 'Num',
+ // max: 3,
+ axisLine: {
+ symbol: ['none', 'arrow'],
+ symbolOffset: [0, 12]
+ },
+ axisTick: {
+ show: false
+ }
+ },
+ color: ['blue', 'orange', 'red', 'pink','gray','purple'],
+ series: myseries
+ }
+ myChart.setOption(options, true);
+ }
+ // drawAlarmLine(data,alarmChart)
}]);
};
$http({
method : "GET",
- url : global_url + "/alarm/1/1/"+alarmDetailId+"/null/null/null/null/null"
+ // url : global_url + "/alarm/1/1/"+alarmDetailId+"/null/null/null/null/null"
+ url : global_url + "/alarm/getAlarmsHeaderDetail/"+alarmDetailId
}).then(function successCallback(resp) {
- if (resp.data.alarms.length > 0){
- $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;
+ if (resp.data){
+ $scope.alarmCondition = resp.data.alarmsHeader.alarmCondition;
+ $scope.alarmInterfaceA = resp.data.alarmsHeader.alarmInterfaceA;
+ $scope.eventCategory = resp.data.alarmsHeader.eventCategory;
+ $scope.eventId = resp.data.alarmsHeader.eventId;
+ $scope.eventName = resp.data.alarmsHeader.eventName;
+ $scope.eventServrity = resp.data.alarmsHeader.eventServrity;
+ $scope.eventSourceType = resp.data.alarmsHeader.eventSourceType;
+ $scope.eventType = resp.data.alarmsHeader.eventType;
+ $scope.faultFieldsVersion = resp.data.alarmsHeader.faultFieldsVersion;
+ $scope.lastEpochMicroSec = resp.data.alarmsHeader.lastEpochMicroSec;
+ $scope.nfNamingCode = resp.data.alarmsHeader.nfNamingCode;
+ $scope.nfcNamingCode = resp.data.alarmsHeader.nfcNamingCode;
+ $scope.priority = resp.data.alarmsHeader.priority;
+ $scope.reportingEntityId = resp.data.alarmsHeader.reportingEntityId;
+ $scope.reportingEntityName = resp.data.alarmsHeader.reportingEntityName;
+ $scope.sequence = resp.data.alarmsHeader.sequence;
+ $scope.sourceId = resp.data.alarmsHeader.sourceId;
+ $scope.sourceName = resp.data.alarmsHeader.sourceName;
+ $scope.specificProblem = resp.data.alarmsHeader.specificProblem;
+ $scope.startEpochMicrosec = resp.data.alarmsHeader.startEpochMicrosec;
+ $scope.startTIme = resp.data.alarmsHeader.createTime;
+ $scope.alarmInformation = resp.data.list;
}else {
alert("No Data!");
}
ctrl.isLoading = true;
$scope.tableState = tableState;
var pagination = tableState.pagination;
- console.log(pagination);
+ // console.log(pagination);
var start = pagination.start / pagination.number + 1 || 0;
var number = pagination.number || 10;
app.controller('pertabCtrl', ['$scope', '$http', '$routeParams', '$window' ,
function ($scope, $http,$routeParams,$window) {
$scope.chartShow = false;
- $scope.ndaShow = false;
- $scope.hdaShow = false;
+ $scope.ndaShow = false;
+ $scope.hdaShow = false;
$scope.valuess = [];
$scope.namesPIsShow = false;
$scope.goIsShow = true;
+ $scope.hourshow = false;
+ $scope.dayshow = true;
+ $scope.timestep = '5';
$scope.today = function() {
$scope.startTime = new Date();
$scope.endTime = new Date();
$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) {
- $scope.goIsShow = false;
- },function errorCallback(resq) {
+ $scope.goIsShow = false;
+ // $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) {
+ // $scope.goIsShow = false;
+ // },function errorCallback(resq) {
- });
+ // });
}
else{
$scope.goIsShow = true;
}
};
- $scope.options = {
- chart: {
- type: 'historicalBarChart',
- height: 300,
- margin : {
- top: 20,
- right: 20,
- bottom: 65,
- left: 50
- },
- x: function(d){return d[0];},
- y: function(d){return d[1];},
- showValues: true,
- valueFormat: function(d){
- return d3.format(',.1f')(d);
- },
- duration: 100,
- xAxis: {
- //axisLabel: 'X Axis',
- tickFormat: function(d) {
- return d3.time.format('%x %H:%M')(new Date(d))
- },
- rotateLabels: 30,
- showMaxMin: true
- },
- yAxis: {
- //axisLabel: 'Y Axis',
- axisLabelDistance: -10,
- tickFormat: function(d){
- return d3.format(',.1f')(d);
- }
- },
- tooltip: {
- keyFormatter: function(d) {
- return d3.time.format('%x %H:%M')(new Date(d));
- }
- },
- zoom: {
- enabled: false,
- scaleExtent: [1, 10],
- useFixedDomain: false,
- useNiceScale: false,
- horizontalOff: false,
- verticalOff: false,
- unzoomEventType: 'dblclick.zoom'
- }
- }
- };
-
-
- $scope.data = [
- {
- "key" : "Quantity" ,
- "bar": true,
- "values" : []
- }];
-
+
$scope.genDiagram = function () {
$scope.chartShow = true;
$http({
}
}).then(function successCallback(resp) {
console.info(resp);
- if (resp.data.length > 0){
+ if (resp.data.dateList){
$scope.ndaShow = false;
$scope.hdaShow = true;
- $scope.data = [
- {
- "key" : "Count" ,
- "bar": true,
- "values" : resp.data
- }];
- $scope.api.refresh();
+
+ drawPerformanceBar(resp.data,performanceChart);
}
else{
$scope.ndaShow = true;
$scope.hdaShow = false;
- $scope.data = [
- {
- "key" : "Count" ,
- "bar": true,
- "values" : []
- }];
- $scope.api.refresh();
+
}
},function errorCallback(resp) {
});
};
+ $scope.showModeIdChanged = function(){
+ if($scope.showModeId == 'minute'){
+ $scope.hourshow = true;
+ $scope.timestep = '5';
+ }else if($scope.showModeId == 'hour'){
+ var str = String($scope.startTime);
+ var str2 = String($scope.endTime);
+ $scope.startTime = new Date(str.replace(/\:[0-9]{2}\:/,':00:'));
+ $scope.endTime = new Date(str2.replace(/\:[0-9]{2}\:/,':00:'));
+ $scope.hourshow = true;
+ $scope.timestep = '0';
+ }else if($scope.showModeId == 'day'){
+ $scope.hourshow = false;
+ }
+
+ }
$scope.open1 = function() {
$scope.popup1.opened = true;
};
$scope.modeShow = false;
- $scope.showModeIds = ["minute","hour","day","month","year"];
-
+ $scope.showModeIds = ["minute","hour","day"];
+ $scope.showModeId = 'day';
function FormatDate (strTime) {
var date = new Date(strTime);
return date.getFullYear()+"-"+(date.getMonth()+1)+"-"+date.getDate()+" "+date.getHours()+":"+date.getMinutes();
}
-
+ // 获取柱状图盒子
+ var performanceChart = echarts.init(document.getElementById("performanceChart"));
+
+ function drawPerformanceBar(data,myChart){
+ var names = Object.keys(data);
+ var myseries = [];
+ names.forEach(function (item) {
+ if(item != 'dateList'){
+ myseries.push({
+ name: item,
+ type: 'bar',
+ // symbol: 'circle',
+ // symbolSize: 10,
+ data: data[item]
+ })
+ }
+ })
+ var options = {
+ tooltip: {
+ trigger: 'axis',
+ formatter: (params) => {
+ var res = '<p>' + params[0].name + '</p>' + '<div>';
+ // console.log(params);
+ for (var i = 0; i < params.length; i++) {
+ res += '<span></span>' + params[i].seriesName + ' : ' + params[i].value + '</br>';
+ }
+ res += '</div>';
+ return res;
+ }
+ },
+ legend: {
+ data: names,
+ top: 10,
+ icon: 'rect',
+ itemWidth: 10,
+ itemHeight: 10
+ },
+ grid: {
+ left: '3%',
+ right: '5%',
+ bottom: '5%',
+ top: '15%',
+ containLabel: true
+ },
+ xAxis: {
+ type: 'category',
+ name: 'Time',
+ boundaryGap: true,
+ data: data.dateList,
+ axisLabel:{
+ formatter:(value)=>{
+ if($scope.showModeId == 'day'){
+ return value.slice(5,10)
+ }else if($scope.showModeId == 'hour'){
+ return value.slice(5,16)
+ }else if($scope.showModeId == 'minute'){
+ return value.slice(5,16)
+ }
+ }
+ },
+ axisLine: {
+ symbol: ['none', 'arrow'],
+ symbolOffset: [0, 12]
+ },
+ axisTick: {
+ show: false,
+ },
+ splitLine: {
+ show: true
+ }
+ },
+ yAxis: {
+ type: 'value',
+ name: 'Num',
+ // max: 3,
+ axisLine: {
+ symbol: ['none', 'arrow'],
+ symbolOffset: [0, 12]
+ },
+ axisTick: {
+ show: false
+ }
+ },
+ color: ['green', 'orange', 'red', 'pink','gray','purple'],
+ series: myseries
+ }
+ myChart.setOption(options, true);
+ }
+ // var data = {
+ // dateList:["2018-05-23 34:35:00",2,3,4,5,6,7,8,9,10],
+ // valueList:[5,3,1,7,3,5,8,3,5,2]
+ // }
+ // drawPerformanceBar(data,performanceChart)
}]);
var obj = $("#lm");
angular.element(obj).scope().currentTab = "app/uui/fusion/scripts/view-models/performance.html";
};
+ console.log(permanceId);
$http({
method : "GET",
- url : global_url + "/performance/1/1/"+permanceId+"/null/null/null/null"
+ // url : global_url + "/performance/1/1/"+permanceId+"/null/null/null/null"
+ url : global_url + "/performance/getPerformanceHeaderDetail/"+permanceId
}).then(function successCallback(resp) {
- if (resp.data.performances.length > 0){
- $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;
+ console.log(resp.data);
+ if (resp.data){
+ $scope.eventName = resp.data.performanceHeader.eventName;
+ $scope.eventId = resp.data.performanceHeader.eventId;
+ $scope.sourceId = resp.data.performanceHeader.sourceId;
+ $scope.sourceName = resp.data.performanceHeader.sourceName;
+ $scope.reportingEntityId = resp.data.performanceHeader.reportingEntityId;
+ $scope.reportingEntityName = resp.data.performanceHeader.reportingEntityName;
+ $scope.priority = resp.data.performanceHeader.priority;
+ $scope.createTime = resp.data.performanceHeader.createTime;
+ $scope.nfcNamingCode = resp.data.performanceHeader.nfcNamingCode;
+ $scope.nfNamingCode = resp.data.performanceHeader.nfNamingCode;
+ $scope.performanceInformation = resp.data.list;
}else {
alert("No Data");
}
.nodatainner {
padding: 10px;
}
+
+ #alarmChart {
+ width: 100%;
+ height: 260px;
+ }
+ /* .minutes {
+ display: none;
+ }
+
+ .uib-separator {
+ display: none;
+ } */
</style>
<!--/.navbar-collapse -->
<div class="templatemo-content-wrapper">
<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>
+ <div ng-show="dayshow" 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 ng-show="!dayshow" style="float:left;width:140px;padding-top:33px">
+ <input style="padding-right:0px" 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 ng-show='hourshow' style="display:block;float:left" uib-timepicker ng-model="startTime"
+ ng-change="startTimeChanged()" hour-step minute-step='0' 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>
+ <div ng-show="dayshow" 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 ng-show="!dayshow" style="float:left;width:140px;padding-top:33px;">
+ <input style="padding-right:0px" type="month" 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 ng-show='hourshow' style="display:block;float:left" uib-timepicker ng-model="endTime"
+ ng-change="endTimeChanged()" hour-step minute-step='0' show-meridian></div>
</p>
</div>
+
<div class="col-md-6" style="width:100%;padding-bottom:20px;">
<p>
<div style="float:left;padding-right:30px;">
</div>
</div>
<div style="float:left;padding-right:30px;">
- <label style="float:left;width:120px;line-height:30px;">Display Interval:</label>
- <div style="float:left;width:100px;">
- <select class="form-control" ng-change="showModeIdChanged()" ng-model="showModeId"
- ng-options="sm for sm in showModeIds">
- <option value="">-- Auto --</option>
- </select>
+ <label style="float:left;width:120px;line-height:30px;">Display Interval:</label>
+ <div style="float:left;width:100px;">
+ <select class="form-control" ng-change="showModeIdChanged()" ng-model="showModeId"
+ ng-options="sm for sm in showModeIds">
+ <!-- <option value="">- Auto -</option> -->
+ </select>
+ </div>
</div>
- </div>
<div style="float:left">
<button style="padding-top:6px;" class="btn btn-default" ng-click="genDiagram()">submit
</button>
<div class="col-md-6 col-sm-12" style="width:100%">
- <div class="panel panel-success" ng-show="chartShow">
+ <div class="panel panel-success" >
+ <!-- ng-show="chartShow" -->
<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 ng-show="ndaShow" style="text-align: center"><h2>No Data Available</h2></div>
- <nvd3 ng-show="hdaShow" options="options" data="data" api="api" ></nvd3>
+ <!-- <nvd3 ng-show="hdaShow" options="options" data="data" api="api" ></nvd3> -->
+ <div ng-show="hdaShow" id="alarmChart"></div>
</div>
</div>
</div>
<td>{{row.alarmsHeader.createTime}}</td>
<td>{{row.alarmsHeader.status}}</td>
<td>
- <button ng-click="jump(row.alarmsHeader.sourceId)" class="btn btn-primary">Detail</button>
+ <button ng-click="jump(row.alarmsHeader.id)" class="btn btn-primary">Detail</button>
</td>
</tr>
</tbody>
.nodatainner {
padding: 10px;
}
+ #performanceChart {
+ width: 100%;
+ height: 300px;
+ }
</style>
<div class="templatemo-content-wrapper">
<div class="templatemo-content">
<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">
+ <div ng-show="dayshow" 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>
+ <!-- <div ng-show="!dayshow" style="float:left;width:140px;padding-top:33px">
+ <input style="padding-right:0px" type="month" 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 ng-show='hourshow' style="display:block;float:left" uib-timepicker ng-model="startTime"
+ ng-change="startTimeChanged()" hour-step minute-step='timestep' 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"
+ <div ng-show="dayshow" 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>
+ <!-- <div ng-show="!dayshow" style="float:left;width:140px;padding-top:33px;">
+ <input style="padding-right:0px" type="month" 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 ng-show='hourshow' style="display:block;float:left" uib-timepicker ng-model="endTime"
+ ng-change="endTimeChanged()" hour-step minute-step='0' show-meridian></div>
</p>
</div>
<div class="col-md-6" style="width:100%;padding-bottom:20px;">
<label style="float:left;width:120px;line-height:30px;">Display Interval:</label>
<div style="float:left;width:100px;">
<select class="form-control" ng-change="showModeIdChanged()" ng-model="showModeId" ng-options="sm for sm in showModeIds">
- <option value="">-- auto --</option>
+ <!-- <option value="">-- auto --</option> -->
</select>
</div>
</div>
</p>
</div>
<div class="col-md-12 col-sm-12">
- <div class="panel panel-success" ng-show="chartShow">
+ <div class="panel panel-success">
+ <!-- ng-show="chartShow" -->
<div ng-show="ndaShow" style="text-align: center">
<h2>No Data Available</h2>
</div>
- <nvd3 ng-show="hdaShow" options="options" data="data" api="api"></nvd3>
+ <!-- <nvd3 ng-show="hdaShow" options="options" data="data" api="api"></nvd3> -->
+ <div id="performanceChart"></div>
+ <!-- ng-show="hdaShow" -->
</div>
</div>
<td>{{row.performanceHeader.priority}}</td>
<td>{{row.performanceHeader.createTime}}</td>
<td>
- <button ng-click="jump(row.performanceHeader.sourceId)" class="btn btn-primary">Detail</button>
+ <button ng-click="jump(row.performanceHeader.id)" class="btn btn-primary">Detail</button>
</td>
</tr>
</tbody>
Code Review / usecase-ui.git / commitdiff