Reestructured the overview oscap tab

This commit is contained in:
Jesús 2017-11-21 13:33:29 +01:00
parent ba552d2396
commit 2970c9e155

View File

@ -34,14 +34,14 @@
<!-- No results message -->
<md-content flex layout="row" layout-align="start start" ng-show="!results && !loading" ng-if="tabView == 'panels' && hideRing(14)">
<md-card flex layout="column">
<md-card-content style="text-align: center;">
<md-card-content class="overview-oscap-no-results">
No results for selected time interval
</md-card-content>
</md-card>
</md-content>
<!-- View: Discover -->
<md-content style="background-color: white" flex layout="column" layout-align="start space-around" ng-if="tabView == 'discover'">
<md-content class="overview-oscap-discover" flex layout="column" layout-align="start space-around" ng-if="tabView == 'discover'">
<kbn-disfull table-height="1000px;" dis-a="(columns:!(_source),filters:!(),index:'wazuh-alerts-*',interval:auto,query:(query_string:(analyze_wildcard:!t,query:'*')),sort:!('@timestamp',desc))"
dis-filter="rule.groups:oscap"
infinite-scroll="true">
@ -50,57 +50,57 @@
<!-- View: Panels -->
<div ng-show="hideRing(14) && results && !loading" ng-if="tabView == 'panels'" class="wazuh-column">
<div layout="row" layout-align="center stretch" style="height: 100px;">
<md-card flex="20" layout="column" class="wazuh-column">
<md-card-content style="text-align: center;" class="wazuh-column">
<div layout="row" layout-align="center stretch" class="overview-oscap-top-row-div">
<md-card flex="20">
<md-card-content class="wazuh-column overview-oscap-top-row">
<div class="ng-binding">Last score</div>
<kbn-vis class="kbn-vis-value" vis-id="'Wazuh-App-Overview-OSCAP-Last-score'" id="Wazuh-App-Overview-OSCAP-Last-score"></kbn-vis>
</md-card-content>
</md-card>
<md-card flex="40" layout="column" class="wazuh-column">
<md-card-content style="text-align: center;" class="wazuh-column">
<md-card flex="40">
<md-card-content class="wazuh-column overview-oscap-top-row">
<div class="ng-binding">Last agent scanned</div>
<kbn-vis class="kbn-vis-value" vis-id="'Wazuh-App-Overview-OSCAP-Last-agent-scanned'" id="Wazuh-App-Overview-OSCAP-Last-agent-scanned"></kbn-vis>
</md-card-content>
</md-card>
<md-card flex="40" layout="column" class="wazuh-column">
<md-card-content style="text-align: center;" class="wazuh-column">
<md-card flex="40">
<md-card-content class="wazuh-column overview-oscap-top-row">
<div class="ng-binding">Last scan profile</div>
<kbn-vis class="kbn-vis-value" vis-id="'Wazuh-App-Overview-OSCAP-Last-scan-profile'" id="Wazuh-App-Overview-OSCAP-Last-scan-profile"></kbn-vis>
</md-card-content>
</md-card>
</div>
<md-content layout="row" layout-align="center stretch" style="height: 215px;" class="wazuh-row">
<md-card flex="25" class="wazuh-column">
<div layout="row" layout-align="center stretch" class="overview-oscap-pie-row">
<md-card flex="25">
<md-card-content class="wazuh-column">
<span class="md-headline">Agents</span>
<kbn-vis vis-id="'Wazuh-App-Overview-OSCAP-Agents'" id="Wazuh-App-Overview-OSCAP-Agents"></kbn-vis>
</md-card-content>
</md-card>
<md-card flex="25" class="wazuh-column">
<md-card flex="25">
<md-card-content class="wazuh-column">
<span class="md-headline">Profiles</span>
<kbn-vis vis-id="'Wazuh-App-Overview-OSCAP-Profiles'" id="Wazuh-App-Overview-OSCAP-Profiles"></kbn-vis>
</md-card-content>
</md-card>
<md-card flex="25" class="wazuh-column">
<md-card flex="25">
<md-card-content class="wazuh-column">
<span class="md-headline">Content</span>
<kbn-vis vis-id="'Wazuh-App-Overview-OSCAP-Content'" id="Wazuh-App-Overview-OSCAP-Content"></kbn-vis>
</md-card-content>
</md-card>
<md-card flex="25" class="wazuh-column">
<md-card flex="25">
<md-card-content class="wazuh-column">
<span class="md-headline">Severity</span>
<kbn-vis vis-id="'Wazuh-App-Overview-OSCAP-Severity'" id="Wazuh-App-Overview-OSCAP-Severity"></kbn-vis>
</md-card-content>
</md-card>
</md-content>
</div>
<div layout="row" layout-align="start stretch" style="height: 240px;">
<md-card flex class="wazuh-column">
<div layout="row" layout-align="start stretch" class="overview-oscap-top-5-row">
<md-card flex>
<md-card-content class="wazuh-column">
<span class="md-headline">Top 5 Agents - Severity high</span>
<kbn-vis vis-id="'Wazuh-App-Overview-OSCAP-Top-5-agents-Severity-high'" id="Wazuh-App-Overview-OSCAP-Top-5-agents-Severity-high"></kbn-vis>
@ -108,53 +108,45 @@
</md-card>
</div>
<div layout="row" layout-align="center stretch" style="height: 320px;">
<md-card flex="50" class="wazuh-column">
<md-card-title>
<md-card-title-text>
<span class="md-headline">Top 10 - Alerts</span>
</md-card-title-text>
</md-card-title>
<div layout="row" layout-align="center stretch" class="overview-oscap-top-10-row">
<md-card flex="50">
<md-card-content class="wazuh-column">
<span class="md-headline">Top 10 - Alerts</span>
<kbn-vis vis-id="'Wazuh-App-Overview-OSCAP-Top-10-alerts'" id="Wazuh-App-Overview-OSCAP-Top-10-alerts"></kbn-vis>
</md-card-content>
</md-card>
<md-card flex="50" class="wazuh-column">
<md-card-title>
<md-card-title-text>
<span class="md-headline">Top 10 - High risk alerts</span>
</md-card-title-text>
</md-card-title>
<md-card flex="50">
<md-card-content class="wazuh-column">
<span class="md-headline">Top 10 - High risk alerts</span>
<kbn-vis vis-id="'Wazuh-App-Overview-OSCAP-Top-10-high-risk-alerts'" id="Wazuh-App-Overview-OSCAP-Top-10-high-risk-alerts"></kbn-vis>
</md-card-content>
</md-card>
</div>
<div layout="row" layout-align="center stretch" style="height: 100px;">
<md-card flex="20" layout="column" class="wazuh-column">
<md-card-content style="text-align: center;" class="wazuh-column">
<div layout="row" layout-align="center stretch" class="overview-oscap-score-row">
<md-card flex="20">
<md-card-content class="wazuh-column overview-oscap-score-item">
<div class="ng-binding">Highest score</div>
<kbn-vis class="kbn-vis-value" vis-id="'Wazuh-App-Overview-OSCAP-Highest-score'" id="Wazuh-App-Overview-OSCAP-Highest-score"></kbn-vis>
</md-card-content>
</md-card>
<md-card flex="20" layout="column" class="wazuh-column">
<md-card-content style="text-align: center;" class=" wazuh-column">
<md-card flex="20">
<md-card-content class="wazuh-column overview-oscap-score-item">
<div class="ng-binding">Lowest score</div>
<kbn-vis class="kbn-vis-value" vis-id="'Wazuh-App-Overview-OSCAP-Lowest-score'" id="Wazuh-App-Overview-OSCAP-Lowest-score"></kbn-vis>
</md-card-content>
</md-card>
<md-card flex="60" layout="column" class="wazuh-column">
<md-card-content style="text-align: center;" class="wazuh-column">
<md-card flex="60">
<md-card-content class="wazuh-column overview-oscap-score-item">
<div class="ng-binding">Latest alert</div>
<kbn-vis class="kbn-vis-value" vis-id="'Wazuh-App-Overview-OSCAP-Latest-alert'" id="Wazuh-App-Overview-OSCAP-Latest-alert"></kbn-vis>
</md-card-content>
</md-card>
</div>
<div layout="row" layout-align="center stretch" style="height: 530px;">
<md-card flex class="wazuh-column">
<div layout="row" layout-align="center stretch" class="overview-oscap-last-alerts">
<md-card flex>
<md-card-content class="wazuh-column">
<span class="md-headline">Last alerts</span>
<kbn-vis vis-id="'Wazuh-App-Overview-OSCAP-Last-alerts'" id="Wazuh-App-Overview-OSCAP-Last-alerts"></kbn-vis>
@ -163,3 +155,36 @@
</div>
</div>
</md-content>
<style>
.overview-oscap-no-results {
text-align: center;
}
.overview-oscap-discover {
background-color: white;
}
.overview-oscap-top-row-div {
height: 100px;
}
.overview-oscap-top-row {
text-align: center;
}
.overview-oscap-pie-row {
height: 215px;
}
.overview-oscap-top-5-row {
height: 240px;
}
.overview-oscap-top-10-row {
height: 320px;
}
.overview-oscap-last-alerts {
height: 530px;
}
.overview-oscap-score-row {
height: 100px;
}
.overview-oscap-score-item {
text-align: center;
}
</style>