Working on agents overview and design bugs

This commit is contained in:
jesmg 2016-08-30 12:44:19 +00:00
parent 11854ce848
commit ebed1040ba
4 changed files with 59 additions and 101 deletions

View File

@ -151,20 +151,14 @@ md-list-item.active._md-button-wrap.ng-scope._md.md-clickable{
list-style: none;
}
body._md-toast-animating { overflow: scroll !important; }
body._md-toast-animating { overflow-y: scroll !important; }
body {
position: relative !important;
width: initial !important;
top: initial !important;
._md-bottom {
position: fixed;
}
pre {
white-space: pre-wrap;
word-wrap: break-word;
height: 120px;
}
.md-input-focused .no-float-label {
visibility: hidden;
}

View File

@ -3,12 +3,14 @@
<md-content layout="row" layout-align="space-between start">
<md-content layout="row" layout-align="start start">
<md-button class="md-raised md-primary" ng-disabled="_agent.id == '000'" ng-click="restart(_agent)"><i class="fa fa-repeat" aria-hidden="true"></i> Restart</md-button>
<md-button class="md-raised md-primary" ng-href="{{getDiscoverByAgent(_agent)}}" target="_blank"><i class="fa fa-external-link" aria-hidden="true"></i> Discover alerts</md-button>
<md-button class="md-primary" md-colors="::{background: 'primary-100', color: 'background-900'}" ng-disabled="_agent.id == '000'"
ng-click="restart(_agent)"><i class="fa fa-repeat" aria-hidden="true"></i> Restart</md-button>
</md-content>
<md-content layout="row" layout-align="end start">
<div class="statusBox md-whiteframe-3dp" layout="row" layout-align="space-between center">Time window: Last 7 days</div>
<div class="statusBox md-whiteframe-3dp" ng-class="_agent.status == 'Active' ? null : (_agent.status == 'Never connected' ? 'extraLarge' : 'large')" layout="row" layout-align="space-between center"><span>{{_agent.status}}</span><span ng-class="getAgentStatusClass(_agent.status)" class="round status"></span></div>
<md-button class="md-primary" md-colors="::{background: 'primary-100', color: 'background-900'}" ng-href="{{getDiscoverByAgent(_agent)}}"
target="_blank"><i class="fa fa-external-link" aria-hidden="true"></i> Discover alerts</md-button>
<div class="statusBox" md-colors="::{background: 'primary-100'}" ng-class="_agent.status == 'Active' ? null : (_agent.status == 'Never connected' ? 'extraLarge' : 'large')"
layout="row" layout-align="space-between center"><span>{{_agent.status}}</span><span ng-class="getAgentStatusClass(_agent.status)" class="round status"></span></div>
</md-content>
</md-content>
@ -47,11 +49,11 @@
<md-card flex="60">
<md-card-title>
<md-card-title-text>
<span class="md-headline">Alerts by hour of day</span>
<span class="md-headline">Alert level evolution</span>
</md-card-title-text>
</md-card-title>
<md-card-content>
<kbn-vis vis-height="200px;" vis-type="line" vis-index-pattern="ossec-*" vis-a="(filters:!(),linked:!f,query:(query_string:(analyze_wildcard:!t,query:'*')),uiState:(vis:(legendOpen:!f)),vis:(aggs:!((enabled:!t,id:'1',params:(),schema:metric,type:count),(enabled:!t,id:'2',params:(extended_bounds:(max:23,min:0),field:hour_of_day,interval:1,min_doc_count:!t),schema:segment,type:histogram),(enabled:!t,id:'3',params:(),schema:radius,type:count)),listeners:(),params:(addLegend:!t,addTimeMarker:!f,addTooltip:!t,defaultYExtents:!f,drawLinesBetweenPoints:!f,interpolate:linear,radiusRatio:'23',scale:linear,setYExtents:!f,shareYAxis:!t,showCircles:!t,smoothLines:!f,times:!(),yAxis:()),title:'Alerts by hour of day',type:line))"
<kbn-vis vis-height="200px;" vis-type="line" vis-index-pattern="ossec-*" vis-a="(filters:!(),linked:!f,query:(query_string:(analyze_wildcard:!t,query:'*')),uiState:(vis:(legendOpen:!f)),vis:(aggs:!((enabled:!t,id:'1',params:(),schema:metric,type:count),(enabled:!t,id:'2',params:(customInterval:'1h',extended_bounds:(),field:'@timestamp',interval:h,min_doc_count:1),schema:segment,type:date_histogram),(enabled:!t,id:'3',params:(field:rule.AlertLevel,order:desc,orderBy:'1',size:10),schema:group,type:terms)),listeners:(),params:(addLegend:!t,addTimeMarker:!f,addTooltip:!t,defaultYExtents:!f,drawLinesBetweenPoints:!t,interpolate:linear,radiusRatio:9,scale:linear,setYExtents:!f,shareYAxis:!t,showCircles:!t,smoothLines:!f,times:!(),yAxis:()),title:'Alert level evolution',type:line))"
vis-g="(refreshInterval:(display:Off,pause:!f,value:0),time:(from:now-7d,mode:quick,to:now))" vis-filter="{{_agent.name ? 'AgentName:'+_agent.name : '*'}}">
</kbn-vis>
</md-card-content>
@ -98,32 +100,6 @@
</md-content>
<md-card>
<md-card-title>
<md-card-title-text>
<span class="md-headline">Alert level evolution</span>
</md-card-title-text>
</md-card-title>
<md-card-content>
<kbn-vis vis-height="200px;" vis-type="line" vis-index-pattern="ossec-*" vis-a="(filters:!(),linked:!f,query:(query_string:(analyze_wildcard:!t,query:'*')),uiState:(vis:(legendOpen:!f)),vis:(aggs:!((enabled:!t,id:'1',params:(),schema:metric,type:count),(enabled:!t,id:'2',params:(customInterval:'1h',extended_bounds:(),field:'@timestamp',interval:h,min_doc_count:1),schema:segment,type:date_histogram),(enabled:!t,id:'3',params:(field:rule.AlertLevel,order:desc,orderBy:'1',size:10),schema:group,type:terms)),listeners:(),params:(addLegend:!t,addTimeMarker:!f,addTooltip:!t,defaultYExtents:!f,drawLinesBetweenPoints:!t,interpolate:linear,radiusRatio:9,scale:linear,setYExtents:!f,shareYAxis:!t,showCircles:!t,smoothLines:!f,times:!(),yAxis:()),title:'Alert level evolution',type:line))"
vis-g="(refreshInterval:(display:Off,pause:!f,value:0),time:(from:now-7d,mode:quick,to:now))" vis-filter="{{_agent.name ? 'AgentName:'+_agent.name : '*'}}">
</kbn-vis>
</md-card-content>
</md-card>
<md-card>
<md-card-title>
<md-card-title-text>
<span class="md-headline">Last alerts summary</span>
</md-card-title-text>
</md-card-title>
<md-card-content>
<kbn-vis vis-height="530px;" vis-type="table" vis-index-pattern="ossec-*" vis-a="(filters:!(),linked:!f,query:(query_string:(analyze_wildcard:!t,query:'*')),uiState:(vis:(params:(sort:(columnIndex:0,direction:desc)))),vis:(aggs:!((enabled:!t,id:'1',params:(),schema:metric,type:count),(enabled:!t,id:'5',params:(customInterval:'1h',extended_bounds:(),field:'@timestamp',interval:auto,min_doc_count:1),schema:bucket,type:date_histogram),(enabled:!t,id:'6',params:(field:rule.description,order:desc,orderBy:'1',size:0),schema:bucket,type:terms),(enabled:!t,id:'7',params:(field:rule.AlertLevel,order:desc,orderBy:'1',size:0),schema:bucket,type:terms)),listeners:(),params:(perPage:10,showMeticsAtAllLevels:!f,showPartialRows:!f,showTotal:!f,sort:(columnIndex:!n,direction:!n),totalFunc:sum),title:'Last alerts',type:table))"
vis-g="(refreshInterval:(display:Off,pause:!f,value:0),time:(from:now-7d,mode:quick,to:now))" vis-filter="{{_agent.name ? 'AgentName:'+_agent.name : '*'}}">
</kbn-vis>
</md-card-content>
</md-card>
</div>
</md-content>

View File

@ -1,57 +1,43 @@
<md-content ng-if="!_agent" class="md-padding" layout="column" layout-align="center">
<md-card>
<md-card-title>
<md-card-title-text>
<span class="md-headline">Alerts by top 10 agents</span>
</md-card-title-text>
</md-card-title>
<md-card-content>
<kbn-vis vis-height="400px;" vis-type="area" vis-index-pattern="ossec-*" vis-a="(filters:!(),linked:!f,query:(query_string:(analyze_wildcard:!t,query:'*')),uiState:(vis:(legendOpen:!f)),vis:(aggs:!((enabled:!t,id:'1',params:(),schema:metric,type:count),(enabled:!t,id:'2',params:(customInterval:'1h',extended_bounds:(),field:'@timestamp',interval:h,min_doc_count:1),schema:segment,type:date_histogram),(enabled:!t,id:'3',params:(field:AgentName,order:desc,orderBy:'1',size:10),schema:group,type:terms)),listeners:(),params:(addLegend:!t,addTimeMarker:!f,addTooltip:!t,defaultYExtents:!f,interpolate:linear,mode:overlap,scale:linear,setYExtents:!f,shareYAxis:!t,smoothLines:!t,times:!(),yAxis:()),title:'Alerts by top 10 agents',type:area))"
vis-g="(refreshInterval:(display:Off,pause:!f,value:0),time:(from:now-7d,mode:quick,to:now))" vis-searchable="true">
</kbn-vis>
</md-card-content>
</md-card>
<md-card>
<md-card-title>
<md-card-title-text>
<span class="md-headline">Alerts by top 10 agents</span>
</md-card-title-text>
</md-card-title>
<md-card-content>
<kbn-vis vis-height="400px;" vis-type="area" vis-index-pattern="ossec-*" vis-a="(filters:!(),linked:!f,query:(query_string:(analyze_wildcard:!t,query:'*')),uiState:(vis:(legendOpen:!f)),vis:(aggs:!((enabled:!t,id:'1',params:(),schema:metric,type:count),(enabled:!t,id:'2',params:(customInterval:'1h',extended_bounds:(),field:'@timestamp',interval:h,min_doc_count:1),schema:segment,type:date_histogram),(enabled:!t,id:'3',params:(field:AgentName,order:desc,orderBy:'1',size:10),schema:group,type:terms)),listeners:(),params:(addLegend:!t,addTimeMarker:!f,addTooltip:!t,defaultYExtents:!f,interpolate:linear,mode:overlap,scale:linear,setYExtents:!f,shareYAxis:!t,smoothLines:!t,times:!(),yAxis:()),title:'Alerts by top 10 agents',type:area))"
vis-g="(refreshInterval:(display:Off,pause:!f,value:0),time:(from:now-7d,mode:quick,to:now))" vis-searchable="true">
</kbn-vis>
</md-card-content>
</md-card>
<md-content layout="row">
<md-card flex="50">
<md-card-title>
<md-card-title-text>
<span class="md-headline">Top 10 groups by agent</span>
</md-card-title-text>
</md-card-title>
<md-card-content>
<kbn-vis vis-height="400px;" vis-type="histogram" vis-index-pattern="ossec-*" vis-a="(filters:!(),linked:!f,query:(query_string:(analyze_wildcard:!t,query:'*')),uiState:(vis:(legendOpen:!f)),vis:(aggs:!((enabled:!t,id:'1',params:(),schema:metric,type:count),(enabled:!t,id:'2',params:(field:AgentName,order:desc,orderBy:'1',size:10),schema:segment,type:terms),(enabled:!t,id:'3',params:(field:rule.groups,order:desc,orderBy:'1',size:10),schema:group,type:terms)),listeners:(),params:(addLegend:!t,addTimeMarker:!f,addTooltip:!t,defaultYExtents:!f,mode:stacked,scale:linear,setYExtents:!f,shareYAxis:!t,times:!(),yAxis:()),title:'Top 10 groups by agent',type:histogram))"
vis-g="(refreshInterval:(display:Off,pause:!f,value:0),time:(from:now-7d,mode:quick,to:now))">
</kbn-vis>
</md-card-content>
</md-card>
<md-content layout="row">
<md-card flex="50">
<md-card-title>
<md-card-title-text>
<span class="md-headline">Top 10 groups by agent</span>
</md-card-title-text>
</md-card-title>
<md-card-content>
<kbn-vis vis-height="400px;" vis-type="histogram" vis-index-pattern="ossec-*" vis-a="(filters:!(),linked:!f,query:(query_string:(analyze_wildcard:!t,query:'*')),uiState:(vis:(legendOpen:!f)),vis:(aggs:!((enabled:!t,id:'1',params:(),schema:metric,type:count),(enabled:!t,id:'2',params:(field:AgentName,order:desc,orderBy:'1',size:10),schema:segment,type:terms),(enabled:!t,id:'3',params:(field:rule.groups,order:desc,orderBy:'1',size:10),schema:group,type:terms)),listeners:(),params:(addLegend:!t,addTimeMarker:!f,addTooltip:!t,defaultYExtents:!f,mode:stacked,scale:linear,setYExtents:!f,shareYAxis:!t,times:!(),yAxis:()),title:'Top 10 groups by agent',type:histogram))"
vis-g="(refreshInterval:(display:Off,pause:!f,value:0),time:(from:now-7d,mode:quick,to:now))">
</kbn-vis>
</md-card-content>
</md-card>
<md-card flex="50">
<md-card-title>
<md-card-title-text>
<span class="md-headline">Top 10 level by agent</span>
</md-card-title-text>
</md-card-title>
<md-card-content>
<kbn-vis vis-height="400px;" vis-type="histogram" vis-index-pattern="ossec-*" vis-a="(filters:!(),linked:!f,query:(query_string:(analyze_wildcard:!t,query:'*')),uiState:(vis:(legendOpen:!f)),vis:(aggs:!((enabled:!t,id:'1',params:(),schema:metric,type:count),(enabled:!t,id:'2',params:(field:AgentName,order:desc,orderBy:'1',size:10),schema:segment,type:terms),(enabled:!t,id:'3',params:(field:rule.AlertLevel,order:desc,orderBy:'1',size:10),schema:group,type:terms)),listeners:(),params:(addLegend:!t,addTimeMarker:!f,addTooltip:!t,defaultYExtents:!f,mode:stacked,scale:linear,setYExtents:!f,shareYAxis:!t,times:!(),yAxis:()),title:'Top 10 level by agent',type:histogram))"
vis-g="(refreshInterval:(display:Off,pause:!f,value:0),time:(from:now-7d,mode:quick,to:now))">
</kbn-vis>
</md-card-content>
</md-card>
</md-content>
<md-card>
<md-card-title>
<md-card-title-text>
<span class="md-headline">Alert level evolution of top 5 agents</span>
</md-card-title-text>
</md-card-title>
<md-card-content>
<kbn-vis vis-height="1000px;" vis-type="line" vis-index-pattern="ossec-*" vis-a="(filters:!(),linked:!f,query:(query_string:(analyze_wildcard:!t,query:'*')),uiState:(vis:(legendOpen:!f)),vis:(aggs:!((enabled:!t,id:'1',params:(),schema:metric,type:count),(enabled:!t,id:'2',params:(customInterval:'1h',extended_bounds:(),field:'@timestamp',interval:h,min_doc_count:1),schema:segment,type:date_histogram),(enabled:!t,id:'3',params:(field:rule.AlertLevel,order:desc,orderBy:'1',size:15),schema:group,type:terms),(enabled:!t,id:'4',params:(field:AgentName,order:desc,orderBy:'1',row:!t,size:5),schema:split,type:terms)),listeners:(),params:(addLegend:!t,addTimeMarker:!f,addTooltip:!t,defaultYExtents:!f,drawLinesBetweenPoints:!t,interpolate:linear,radiusRatio:9,scale:linear,setYExtents:!f,shareYAxis:!t,showCircles:!t,smoothLines:!f,times:!(),yAxis:()),title:'Alert level evolution of top 5 agents',type:line))"
vis-g="(refreshInterval:(display:Off,pause:!f,value:0),time:(from:now-7d,mode:quick,to:now))">
</kbn-vis>
</md-card-content>
</md-card>
<md-card flex="50">
<md-card-title>
<md-card-title-text>
<span class="md-headline">Top 10 level by agent</span>
</md-card-title-text>
</md-card-title>
<md-card-content>
<kbn-vis vis-height="400px;" vis-type="histogram" vis-index-pattern="ossec-*" vis-a="(filters:!(),linked:!f,query:(query_string:(analyze_wildcard:!t,query:'*')),uiState:(vis:(legendOpen:!f)),vis:(aggs:!((enabled:!t,id:'1',params:(),schema:metric,type:count),(enabled:!t,id:'2',params:(field:AgentName,order:desc,orderBy:'1',size:10),schema:segment,type:terms),(enabled:!t,id:'3',params:(field:rule.AlertLevel,order:desc,orderBy:'1',size:10),schema:group,type:terms)),listeners:(),params:(addLegend:!t,addTimeMarker:!f,addTooltip:!t,defaultYExtents:!f,mode:stacked,scale:linear,setYExtents:!f,shareYAxis:!t,times:!(),yAxis:()),title:'Top 10 level by agent',type:histogram))"
vis-g="(refreshInterval:(display:Off,pause:!f,value:0),time:(from:now-7d,mode:quick,to:now))">
</kbn-vis>
</md-card-content>
</md-card>
</md-content>
</md-content>

View File

@ -16,13 +16,10 @@
<div flex layout="row" ng-if="!load">
<md-content flex id="content" layout-padding>
<md-toolbar style="height: 64px;">
<div class="md-toolbar-tools" layout="row" layout-align="space-between center">
<h2 ng-show="_agent">{{_agent.id}} - {{_agent.name}} <span ng-show="_agent.id == '000'">(Manager)</span></h2>
<h2 ng-show="!_agent">Select an agent to start visualizing data</h2>
<span layout="row" flex="40">
<md-autocomplete flex md-no-cache="true" md-selected-item="_agent" md-selected-item-change="submenuNavItem == '' ? submenuNavItem = 'overview' : null" md-search-text="search"
md-items="item in agentsSearch(search)" md-item-text="item.name" md-min-length="1" md-no-asterisk="true" md-menu-class="autocomplete-custom-agents-bar"
<!--sdf-->
<span layout="row" style="padding-left: 0px;" layout-align="space-between start" flex="40">
<md-autocomplete class="md-whiteframe-3dp" style="width: 500px;" md-no-cache="true" md-selected-item="_agent" md-selected-item-change="submenuNavItem == '' ? submenuNavItem = 'overview' : null" md-search-text="search"
md-items="item in agentsSearch(search)" md-item-text="item.name" md-min-length="0" md-no-asterisk="true" md-menu-class="autocomplete-custom-agents-bar"
placeholder="Search agent hostname, ID or IP address">
<md-item-template>
<span class="item-title">
@ -36,10 +33,15 @@
No agents matching "{{search}}" were found.
</md-not-found>
</md-autocomplete>
</span>
<!--sdf-->
<md-toolbar style="height: 50px;">
<div class="md-toolbar-tools" layout="row" layout-align="space-between center">
<h2 ng-show="_agent">{{_agent.id}} - {{_agent.name}} <span ng-show="_agent.id == '000'">(Manager)</span></h2>
<h2 ng-show="!_agent">Select an agent to start visualizing data</h2>
<md-button class="md-hue-2 md-fab md-primary md-mini" aria-label="Add agent">
<i class="fa fa-plus" aria-hidden="true"></i>
</md-button>
</span>
</div>
</md-toolbar>
<md-content ng-show="_agent" class="md-padding">