Skip to content

Commit 19b02c1

Browse files
authored
Merge pull request #818 from divakarkonakalla/dev-divakar
Usage for instances in workzone.
2 parents dbf5961 + bb92a10 commit 19b02c1

File tree

7 files changed

+192
-25
lines changed

7 files changed

+192
-25
lines changed

client/cat3/main.html

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -144,6 +144,7 @@
144144
<script src="src/partials/sections/dashboard/workzone/instance/manage/templates/cpLogsCtrl.js"></script>
145145
<script src="src/partials/sections/dashboard/workzone/instance/manage/templates/cpServicesCtrl.js"></script>
146146
<script src="src/partials/sections/dashboard/workzone/instance/popups/InstanceImportByIpCtrl.js"></script>
147+
<script src="src/partials/sections/dashboard/workzone/instance/popups/instanceUsageCtrl.js"></script>
147148
<script src="src/partials/sections/dashboard/workzone/instance/popups/deleteInstanceCtrl.js"></script>
148149
<script src="src/partials/sections/dashboard/workzone/instance/popups/instanceLogsCtrl.js"></script>
149150
<script src="src/partials/sections/dashboard/workzone/instance/popups/instanceNameEditCtrl.js"></script>

client/cat3/src/partials/sections/dashboard/workzone/instance/instance.html

Lines changed: 25 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -48,14 +48,14 @@ <h3 class="box-title"><i class="fa fa-fw fa-filter"></i>Filter By</h3>
4848
<div class="box-body form-horizontal">
4949
<div class="row">
5050
<div class="col-md-3">
51-
<div class="form-group">
52-
<label for="selectProvider" class="col-sm-3 control-label">Provider:</label>
53-
<div class="col-sm-9">
54-
<select class="form-control select2 select2-hidden-accessible" id="selectProvider" ng-model="filter.providerId" ng-options="provider._id as provider.providerName for provider in providers" ng-change="fnProviderChange()">
55-
<option value=''>All</option>
56-
</select>
57-
</div>
58-
</div>
51+
<div class="form-group">
52+
<label for="selectProvider" class="col-sm-3 control-label">Provider:</label>
53+
<div class="col-sm-9">
54+
<select class="form-control select2 select2-hidden-accessible" id="selectProvider" ng-model="filter.providerId" ng-options="provider._id as provider.providerName for provider in providers" ng-change="fnProviderChange()">
55+
<option value=''>All</option>
56+
</select>
57+
</div>
58+
</div>
5959
</div>
6060
<div class="col-md-1 loader-container">
6161
<span ng-show="providerLoading">
@@ -64,13 +64,13 @@ <h3 class="box-title"><i class="fa fa-fw fa-filter"></i>Filter By</h3>
6464
</div>
6565
<div class="col-md-3">
6666
<div class="form-group">
67-
<label for="selectRegion" class="col-sm-3 control-label">Region:</label>
68-
<div class="col-sm-9">
69-
<select class="form-control select2 select2-hidden-accessible" id="selectRegion" ng-model="filter.regionId" ng-options="region.region as region.region_name +' | '+region.region for region in regions" ng-change="fnRegionChange()">
70-
<option value=''>All</option>
71-
</select>
72-
</div>
73-
</div>
67+
<label for="selectRegion" class="col-sm-3 control-label">Region:</label>
68+
<div class="col-sm-9">
69+
<select class="form-control select2 select2-hidden-accessible" id="selectRegion" ng-model="filter.regionId" ng-options="region.region as region.region_name +' | '+region.region for region in regions" ng-change="fnRegionChange()">
70+
<option value=''>All</option>
71+
</select>
72+
</div>
73+
</div>
7474
</div>
7575
<div class="col-md-1 loader-container">
7676
<span ng-show="regionLoading">
@@ -79,18 +79,18 @@ <h3 class="box-title"><i class="fa fa-fw fa-filter"></i>Filter By</h3>
7979
</div>
8080
<div class="col-md-3">
8181
<div class="form-group">
82-
<label for="selectVPC" class="col-sm-3 control-label">VPC:</label>
83-
<div class="col-sm-9">
84-
<select class="form-control select2 select2-hidden-accessible" id="selectVPC" ng-options="vpc.VpcId as vpc.VpcId +' ('+vpc.CidrBlock+')' for vpc in vpcs" ng-model="filter.vpcId">
85-
<option value=''>All</option>
86-
</select>
87-
</div>
88-
</div>
82+
<label for="selectVPC" class="col-sm-3 control-label">VPC:</label>
83+
<div class="col-sm-9">
84+
<select class="form-control select2 select2-hidden-accessible" id="selectVPC" ng-options="vpc.VpcId as vpc.VpcId +' ('+vpc.CidrBlock+')' for vpc in vpcs" ng-model="filter.vpcId">
85+
<option value=''>All</option>
86+
</select>
87+
</div>
88+
</div>
8989
</div>
9090
<div class="col-md-1">
9191
<button type="button" title="Search" class="btn btn-xs cat-btn-update" ng-click="fnSearchFilters()">
92-
<i class="fa fa-fw fa-search white"></i>
93-
</button>
92+
<i class="fa fa-fw fa-search white"></i>
93+
</button>
9494
</div>
9595
</div>
9696
<!-- /.row -->
@@ -129,6 +129,7 @@ <h3 class="box-title"><i class="fa fa-fw fa-filter"></i>Filter By</h3>
129129
</div>
130130
<div class="provider-id" title="{{getPlatformId(inst.providerType,inst.platformId)}}">
131131
{{getPlatformId(inst.providerType,inst.platformId)}}
132+
<i class="fa fa-line-chart cursor marginleft5" title="Usage" ng-show="inst.providerType" ng-click="showInstanceUsage(inst);"></i>
132133
</div>
133134
<div class="card-btns" ng-hide="hoverEdit">
134135
<div ng-show="actionSet.isChefEnabled(inst) &amp;&amp; perms.chefClientRun" title="Chef Client Run" class="btn-icons icon-chef" ng-click="operationSet.updateCookbook(inst);">

client/cat3/src/partials/sections/dashboard/workzone/instance/instance.scss

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -680,6 +680,12 @@ $imagePath: "../../../../../../images";
680680
font-size: 13px;
681681
vertical-align: top;
682682
}
683+
.marginleft5 {
684+
margin-left: 5px;
685+
}
686+
.instanceSelection {
687+
margin-left: 28%;
688+
}
683689
#tableView {
684690
width: 100%;
685691
padding: 0px 0px 42px 0px;
@@ -768,6 +774,13 @@ $imagePath: "../../../../../../images";
768774
/*Common CSS which is used for all devices ends here*/
769775
/*CSS for all Popups starts here*/
770776

777+
#instanceUsagePage {
778+
.usage-dropdown {
779+
width: auto;
780+
height: 31px;
781+
display: table-cell;
782+
}
783+
}
771784
#deleteInstancePage {
772785
.font-normal {
773786
font-weight: normal;

client/cat3/src/partials/sections/dashboard/workzone/instance/instanceCtrl.js

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -217,6 +217,7 @@
217217
so that it gets replaced with instanceIP*/
218218
helper.setHostToIp(result.data.instances);
219219
$scope.tabData = $scope.instanceList;
220+
console.log($scope.instanceList);
220221
if ($scope.totalCards > $scope.paginationParams.pageSize) {
221222
$scope.cardsAvailable = true;
222223
} else {
@@ -515,6 +516,21 @@
515516
console.log('Modal dismissed at: ' + new Date());
516517
});
517518
};
519+
$scope.showInstanceUsage = function(inst) {
520+
var modalInstance = $modal.open({
521+
animation: true,
522+
templateUrl: 'src/partials/sections/dashboard/workzone/instance/popups/instanceUsage.html',
523+
controller: 'instanceUsageCtrl',
524+
size: 'lg',
525+
backdrop: 'static',
526+
keyboard: false,
527+
resolve: {
528+
items: function() {
529+
return inst;
530+
}
531+
}
532+
});
533+
}
518534
$scope.rdpFileLink = function(instanceObj) {
519535
var fileLink = '/instances/rdp/' + instanceObj.instanceIP + '/3389';
520536
return fileLink;
Lines changed: 36 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
<div id='instanceUsagePage'>
2+
<div class="modal-header">
3+
<span class="close" ng-click="cancel()">×</span>
4+
<h4 class="modal-title">
5+
<i class="icon fa fa-line-chart"></i>&nbsp;
6+
Usage Trends - {{instanceName}}
7+
</h4>
8+
</div>
9+
10+
<div class="modal-body">
11+
<fieldset>
12+
<div class="col-lg-12 col-md-12 col-sm-12">
13+
<div class="col-lg-6 col-md-6 col-sm-12">
14+
<span>
15+
<h4>{{splitUp}}</h4>
16+
</span>
17+
</div>
18+
<div class="col-lg-6 col-md-6 col-sm-12">
19+
<span class="pull-right">
20+
<span class="box-title font-size-15">Usage Type:</span>&nbsp;
21+
<select class="form-control usage-dropdown" ng-change="splitChange()" ng-model="splitUp">
22+
<option value="CPUUtilization">CPUUtilization</option>
23+
</select>
24+
</span>
25+
</div>
26+
<nvd3 options="trendLineChart.options" data="trendLineChart.data" class="with-3d-shadow with-transitions"></nvd3>
27+
</div>
28+
</fieldset>
29+
</div>
30+
31+
<div class="modal-footer">
32+
<button type="button" class="btn cat-btn-close" ng-click="cancel()">
33+
<i class="fa fa-times black"></i> Close
34+
</button>
35+
</div>
36+
</div>
Lines changed: 100 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,100 @@
1+
/* Copyright (C) Relevance Lab Private Limited- All Rights Reserved
2+
* Unauthorized copying of this file, via any medium is strictly prohibited
3+
* Proprietary and confidential
4+
* Written by Relevance UI Team,
5+
* Oct 2016
6+
*/
7+
8+
(function(angular){
9+
"use strict";
10+
angular.module('workzone.instance')
11+
.controller('instanceUsageCtrl', ['$scope', '$rootScope', '$modalInstance', 'items', '$state','analyticsServices', 'genericServices','$timeout', function($scope, $rootScope, $modalInstance, items, $state,analyticsServices,genSevs,$timeout) {
12+
console.log(items);
13+
$scope.instanceName = items.name;
14+
var resId = items.platformId;
15+
$scope.trendLineChart={
16+
data:[]
17+
};
18+
$scope.trendsChart=function(){
19+
$scope.trendLineChart.options = {
20+
chart: {
21+
type: 'lineChart',
22+
height: 400,
23+
margin: {
24+
top: 20,
25+
right: 20,
26+
bottom:70,
27+
left: 40
28+
},
29+
x: function (d) {
30+
return d[0];
31+
},
32+
y: function (d) {
33+
return d[1];
34+
},
35+
useVoronoi: false,
36+
clipEdge: true,
37+
duration: 10,
38+
useInteractiveGuideline: true,
39+
xAxis: {
40+
axisLabel: 'Date',
41+
showMaxMin: false,
42+
tickFormat: function (d) {
43+
return d3.time.format('%d/%m %H:%M')(new Date(d))
44+
}
45+
},
46+
yAxis: {
47+
tickFormat: function (d) {
48+
return d3.format(',.2f')(d);
49+
}
50+
},
51+
zoom: {
52+
enabled: true,
53+
scaleExtent: [1, 10],
54+
useFixedDomain: false,
55+
useNiceScale: false,
56+
horizontalOff: true,
57+
verticalOff: true,
58+
unzoomEventType: 'dblclick.zoom'
59+
}
60+
}
61+
};
62+
$scope.trendLineChart.data = [];
63+
$scope.legends=[];
64+
$scope.getData();
65+
};
66+
$scope.getData=function(){
67+
$scope.trendLineChart.data = [];
68+
var $today = new Date();
69+
var $yesterday = new Date($today);
70+
$yesterday.setDate($today.getDate() - 1);
71+
var param = {
72+
url: '/analytics/trend/usage?resource='+'resId'+'&fromTimeStamp='+$yesterday+'&toTimeStamp='+ $today+'&interval=3600'
73+
};
74+
genSevs.promiseGet(param).then(function (result) {
75+
var va = [];
76+
if(result) {
77+
angular.forEach(result[$scope.splitUp].dataPoints, function (value) {
78+
va.push([Date.parse(value.fromTime), value.average]);
79+
});
80+
$scope.trendLineChart.data.push({
81+
"key":resId,
82+
"values": va
83+
});
84+
}
85+
});
86+
};
87+
$scope.trendsChart($rootScope.filterNewEnt);
88+
$scope.splitChange=function() {
89+
$scope.getData($rootScope.filterNewEnt);
90+
};
91+
$scope.init =function(){
92+
$scope.splitUp='CPUUtilization';
93+
};
94+
$scope.init();
95+
$scope.cancel = function() {
96+
$modalInstance.dismiss('cancel');
97+
};
98+
}
99+
]);
100+
})(angular);

client/cat3/src/partials/sections/dashboard/workzone/workzoneCtrl.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -85,7 +85,7 @@ function workzoneFunct($scope, $rootScope) {
8585
};
8686
};
8787
}
88-
angular.module('dashboard.workzone', ['angularTreeview', 'mgcrea.ngStrap', 'workzone.instance', 'workzone.blueprint', 'workzone.orchestration', 'workzone.container', 'workzone.cloudFormation', 'workzone.azureARM', 'workzone.application', 'apis.workzone', 'workzone.factories'])
88+
angular.module('dashboard.workzone', ['angularTreeview', 'mgcrea.ngStrap', 'workzone.instance', 'workzone.blueprint', 'workzone.orchestration', 'workzone.container', 'workzone.cloudFormation', 'workzone.azureARM', 'workzone.application', 'apis.workzone', 'workzone.factories', 'nvd3'])
8989
.controller('workzoneCtrl', ['$scope', '$rootScope', workzoneFunct])
9090
.controller('workzoneTreeCtrl', ['$rootScope', '$scope', 'workzoneServices', 'workzoneEnvironment', '$timeout', 'modulePermission', '$window', function ($rootScope, $scope, workzoneServices, workzoneEnvironment, $timeout, modulePerms, $window) {
9191
'use strict';

0 commit comments

Comments
 (0)