This repository has been archived by the owner on Nov 9, 2017. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 33
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #212 from ammendonca/HAWKULAR-220
HAWKULAR-220: App Server Detail - Deployments Metrics Tab
- Loading branch information
Showing
7 changed files
with
238 additions
and
97 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
165 changes: 128 additions & 37 deletions
165
...src/main/scripts/plugins/metrics/plugins/metrics/html/app-details/detail-deployments.html
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,45 +1,136 @@ | ||
|
|
||
| <section id="hk-deployments" class="hk-tab-content" ng-if="vm.activeTab === 'deployments'"> | ||
|
|
||
| <h3 class="pull-left">Deployments</h3> | ||
| <span class="hk-update pull-right" tooltip-trigger tooltip-placement="bottom" tooltip="Last update"><i class="fa fa-clock-o"></i>{{vm.endTimeStamp | date:'mediumTime'}}</span> | ||
| <div class="panel panel-default hk-summary"> | ||
| <div class="row"> | ||
| <div class="col-sm-3 hk-summary-item"> | ||
| <span class="hk-data">-Xmx</span> | ||
| <span class="hk-item">Max. Heap</span> | ||
| </div> | ||
| <div class="col-sm-3 hk-summary-item"> | ||
| <span class="hk-data">20 GB</span> | ||
| <span class="hk-item">Avg. Heap Usage</span> | ||
| </div> | ||
| <div class="col-sm-3 hk-summary-item"> | ||
| <span class="hk-data">22:00</span> | ||
| <span class="hk-item">Last Garbage Collection</span> | ||
| </div> | ||
| <div class="col-sm-3 hk-summary-item"> | ||
| <span class="hk-data">3</span> | ||
| <span class="hk-item">Alerts</span> | ||
| </div> | ||
| </div> | ||
| <h3 class="pull-left">Deployment Status</h3> | ||
| <span class="hk-update pull-right" tooltip-trigger tooltip-placement="bottom" tooltip="Last update"><i class="fa fa-clock-o"></i>{{vm.endTimeStamp | date:'mediumTime'}}</span> | ||
| <div class="panel panel-default hk-summary"> | ||
| <div class="row"> | ||
| <div class="col-sm-3 hk-summary-item"> | ||
| <span class="hk-data">{{vm.alertList.length}} <i class="fa fa-flag" ng-show="false"></i></span> | ||
| <span class="hk-item">Deployment Alerts</span> | ||
| </div> | ||
| <div class="col-sm-3 hk-summary-item"> | ||
| <span class="hk-data">{{vm.failedDeployments || 0}} Failed</span> | ||
| <span class="hk-item">Deployments</span> | ||
| </div> | ||
| <div class="col-sm-3 hk-summary-item"> | ||
| <span class="hk-data">{{vm.resourceList.length || 0}} Enabled</span> | ||
| <span class="hk-item">Deployments</span> | ||
| </div> | ||
| <div class="col-sm-3 hk-summary-item"> | ||
| <span class="hk-data">{{vm.disabledDeployments || 0}} Disabled</span> | ||
| <span class="hk-item">Deployments</span> | ||
| </div> | ||
| </div> | ||
| </div> | ||
|
|
||
| <!-- Alerts --> | ||
| <div class="hk-info-top clearfix"> | ||
| <h3 class="pull-left" data-toggle="tooltip" data-placement="top" title="" data-original-title="Expand/collapse"> | ||
| <button class="btn btn-link hk-trigger" ng-click="showAllAlerts = !showAllAlerts"><i class="fa" ng-show="vm.alertList.length > 0" ng-class="showAllAlerts ? 'fa-minus-square-o' : 'fa-plus-square-o'"></i> Deployment Alerts <span ng-show="vm.alertList.length > 0">({{showAllAlerts ? vm.alertList.length : vm.math.min(vm.alertList.length, 3)}} of {{vm.alertList.length}})</span></button> | ||
| </h3> | ||
| <span class="hk-settings pull-right"><a href="#" ng-controller="MetricsAlertController as mac" ng-click="mac.openSetup()"><i class="fa fa-cog"></i>Alert Settings</a></span> | ||
| </div> | ||
| <div class="clearfix"> | ||
| <!-- No Alerts --> | ||
| <div class="panel panel-default alert alert-info" ng-show="vm.alertList.length === 0"> | ||
| <div class="hk-alert-icon"><i class="fa fa-flag gray"></i></div> | ||
| <div>No alerts have been fired in this category and time range.</div> | ||
| </div> | ||
| <!-- Alerts exist --> | ||
| <div class="panel panel-default alert alert-danger" ng-repeat="alert in vm.alertList | limitTo: (showAllAlerts ? 100000 : 3) track by $index"> | ||
| <div class="hk-alert-icon"><i class="fa fa-flag"></i></div> | ||
| <div class="hk-date">{{alert.evalSets[0][0].evalTimestamp | date:'medium' }}</div> | ||
| <div class="hk-event"><strong>Alert Summary</strong>: alert details.</div> | ||
| </div> | ||
| </div> | ||
|
|
||
| <!-- Deployments Table --> | ||
| <div class="hk-info-top clearfix"> | ||
| <h3>Deployments</h3> | ||
| <div class="actions-table"> | ||
| <button class="btn btn-default add" type="button" disabled>Add Deployment</button> | ||
| <div class="dropdown"> | ||
| <button class="btn btn-default" type="button" id="dropdownMenu1" dropdown-toggle> | ||
| Actions | ||
| <span class="caret"></span> | ||
| </button> | ||
| <ul class="dropdown-menu disabled" role="menu" aria-labelledby="dropdownMenu1"> | ||
| <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Enable</a></li> | ||
| <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Disable</a></li> | ||
| <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Redeploy</a></li> | ||
| <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Undeploy</a></li> | ||
| <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Delete</a></li> | ||
| </ul> | ||
| </div> | ||
| </div> | ||
| </div> | ||
|
|
||
| <div class="hk-info-top clearfix"> | ||
| <h3 class="pull-left" tooltip-trigger tooltip-placement="top" tooltip="Expand/collapse"><button class="btn btn-link hk-trigger"><i class="fa fa-plus-square-o"></i> Alerts <span>(1)</span></button></h3> | ||
| <span class="hk-settings pull-right"><a href="#" ng-controller="MetricsAlertController as mac" ng-click="mac.openSetup()"><i class="fa fa-cog"></i>Alert Settings</a></span> | ||
| <div id="DataTables_Table_0_wrapper" class="dataTables_wrapper no-footer"> | ||
| <div class="dataTables_header"> | ||
| <div id="DataTables_Table_0_filter" class="dataTables_filter"> | ||
| <label><input type="search" ng-model="vm.search" aria-controls="DataTables_Table_0"></label> | ||
| </div> | ||
| <div class="dataTables_info" id="DataTables_Table_0_info" role="status" aria-live="polite">Showing <b>1</b> to <b>{{vm.resourceList.length}}</b> of <b>{{vm.resourceList.length}}</b> Items</div> | ||
| </div> | ||
| <div class="table-responsive"> | ||
| <table class="datatable table table-striped table-bordered table-checkbox dataTable no-footer" id="DataTables_Table_0" aria-describedby="DataTables_Table_0_info" role="grid"> | ||
| <thead> | ||
| <tr role="row"> | ||
| <th class="sorting" tabindex="0" aria-controls="DataTables_Table_0" rowspan="1" colspan="1" aria-sort="ascending" aria-label=": activate to sort column descending"><input type="checkbox"></th> | ||
| <th class="sorting" tabindex="0" aria-controls="DataTables_Table_0" rowspan="1" colspan="1" aria-label="Current State: activate to sort column ascending">Current State</th> | ||
| <th class="sorting" tabindex="0" aria-controls="DataTables_Table_0" rowspan="1" colspan="1" aria-label="Deployments 10: activate to sort column ascending">Deployments <span class="label label-default label-alert pull-right" tooltip-trigger tooltip-placement="top" tooltip="Total alerts" ng-show="vm.alertList.length">{{vm.alertList.length}}</span></th> | ||
| <th class="sorting" tabindex="0" aria-controls="DataTables_Table_0" rowspan="1" colspan="1" aria-label="Enabled/Disabled: activate to sort column ascending">Enabled/Disabled</th> | ||
| <th class="sorting" tabindex="0" aria-controls="DataTables_Table_0" rowspan="1" colspan="1" aria-label="Computer Health: activate to sort column ascending">Computed Health</th> | ||
| <th class="sorting" tabindex="0" aria-controls="DataTables_Table_0" rowspan="1" colspan="1" aria-label="Actions: activate to sort column ascending">Actions</th> | ||
| </tr> | ||
| </thead> | ||
| <tbody> | ||
| <tr class="odd"><td valign="top" colspan="6" class="dataTables_empty" ng-show="vm.search && (vm.resourceList | filter:vm.search).length === 0"><p>Suggestions</p><ul><li>Check the syntax of the search term.</li><li>Check that the correct menu option is chosen (token ID vs. user ID).</li><li>Use wildcards (* to match zero or more characters or ? to match a single character).</li><li>Clear the search field, then click Search to return to the 20 most recent records.</li></ul></td></tr> | ||
| <tr role="row" ng-repeat="res in vm.resourceList | filter:vm.search" class="odd"> | ||
| <td class="sorting_1"><input type="checkbox"></td> | ||
| <td class="state" ng-show="res.state === 'up'"><i class="fa fa-check-circle-o"></i> OK</td> | ||
| <td class="state" ng-show="res.state === 'unknown'"><i class="fa fa-square"></i> Stopped</td> | ||
| <td class="state" ng-show="false"><i class="fa fa-times-circle-o"></i> Failed</td> | ||
| <td><strong>{{res.properties.name | limitTo14 : res.properties.name.length-13 : 12}}</strong> <span ng-show="false">({{res.properties.name | limitTo14 : res.properties.name.length-13 : 12}})</span> <span class="label label-danger label-alert pull-right" tooltip-trigger tooltip-placement="top" tooltip="Deployment alerts">{{res.alerts}}</span></td> | ||
| <td ng-show="true">Enabled</td> | ||
| <td ng-show="false">Disabled</td> | ||
| <td class="success" ng-show="true">Good</td> | ||
| <td class="warning" ng-show="false">Fair</td> | ||
| <td class="danger" ng-show="false">Poor</td> | ||
| <td class="actions"> | ||
| <div class="dropdown"> | ||
| <button class="btn btn-default" type="button" id="dropdownMenu2" dropdown-toggle> | ||
| Actions | ||
| <span class="caret"></span> | ||
| </button> | ||
| <ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu2"> | ||
| <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Enable</a></li> | ||
| <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Disable</a></li> | ||
| <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Redeploy</a></li> | ||
| <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Undeploy</a></li> | ||
| <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Delete</a></li> | ||
| </ul> | ||
| </div> | ||
| </td> | ||
| </tr> | ||
| </tbody> | ||
| </table> | ||
| </div> | ||
| <div class="alerts-activity clearfix"> | ||
| <div class="panel panel-default alert alert-danger"> | ||
| <div class="hk-alert-icon"> | ||
| <i class="fa fa-flag"></i> | ||
| </div> | ||
| <div class="hk-date"> | ||
| 12 Feb, 5:35 PM | ||
| </div> | ||
| <div class="hk-event"> | ||
| Server <strong>down</strong> for 4 minutes (until 5:39 PM). | ||
| </div> | ||
| <div class="dataTables_footer"> | ||
| <div class="dataTables_paginate paging_bootstrap_input" id="DataTables_Table_0_paginate"> | ||
| <ul class="pagination"> | ||
| <li class="first disabled"><span class="i fa fa-angle-double-left"></span></li> | ||
| <li class="prev disabled"><span class="i fa fa-angle-left"></span></li> | ||
| </ul> | ||
| <div class="pagination-input"> | ||
| <input type="text" class="paginate_input" value="1"><span class="paginate_of">of <b>1</b></span> | ||
| </div> | ||
| <ul class="pagination"> | ||
| <li class="next disabled"><span class="i fa fa-angle-right"></span></li> | ||
| <li class="last disabled"><span class="i fa fa-angle-double-right"></span></li> | ||
| </ul> | ||
| </div> | ||
| </div> | ||
| </div> | ||
|
|
||
| </section> | ||
| </section><!-- .deployments --> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.