Refactor hostgroup overview style
This commit is contained in:
Johannes Meyer
Thomas Gelf
parent
b61a732eaa
commit
bd7ce10efc
|
|
@ -377,21 +377,16 @@ class Monitoring_ListController extends MonitoringController
|
|||
'hostgroup',
|
||||
'hosts_up',
|
||||
'hosts_unreachable',
|
||||
'hosts_unreachable_handled',
|
||||
'hosts_unreachable_unhandled',
|
||||
'hosts_down',
|
||||
'hosts_down_handled',
|
||||
'hosts_down_unhandled',
|
||||
'hosts_pending',
|
||||
'services_ok',
|
||||
'services_unknown',
|
||||
'services_unknown_handled',
|
||||
'services_unknown_unhandled',
|
||||
'services_critical',
|
||||
'services_critical_handled',
|
||||
'services_critical_unhandled',
|
||||
'services_warning',
|
||||
'services_warning_handled',
|
||||
'services_warning_unhandled',
|
||||
'services_pending'
|
||||
)
|
||||
|
|
|
|||
|
|
@ -1,39 +1,38 @@
|
|||
<?php if (! $this->compact): ?>
|
||||
<?php if (!$this->compact): ?>
|
||||
<div class="controls">
|
||||
<?= $this->tabs ?>
|
||||
<?= $this->tabs ?>
|
||||
</div>
|
||||
<?php endif ?>
|
||||
<div class="content">
|
||||
<div class="summary" data-base-target="col2">
|
||||
<div class="boxview" data-base-target="col2">
|
||||
<?php foreach($hostgroups as $h): ?>
|
||||
<span class="state">
|
||||
|
||||
<table><tr><td>
|
||||
<strong><a href="<?= $this->href(
|
||||
'monitoring/list/services',
|
||||
array('hostgroup' => $h->hostgroup))
|
||||
?>"><?= $h->hostgroup; ?></a></strong>
|
||||
|
||||
<?php if ($h->hosts_up): ?>
|
||||
<!-- Hosts UP -->
|
||||
<span class="state up">
|
||||
|
||||
|
||||
<a href="<?= $this->href(
|
||||
'monitoring/list/hosts',
|
||||
array('host_state' => 0, 'hostgroup' => $h->hostgroup)
|
||||
) ?>" title="Hosts Up"><?= $h->hosts_up ?> Hosts UP</a>
|
||||
</span>
|
||||
<!-- End of hosts UP -->
|
||||
<?php endif ?>
|
||||
|
||||
<div class="box hostgroup">
|
||||
<a href="<?= $this->href('monitoring/list/services', array('hostgroup' => $h->hostgroup)); ?>">
|
||||
<h2><?= $h->hostgroup; ?></h2>
|
||||
</a>
|
||||
<div class="box contents">
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Hosts</th>
|
||||
<th>Services</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>
|
||||
<?php if ($h->hosts_down): ?>
|
||||
<!-- Hosts DOWN -->
|
||||
<span class="state down">
|
||||
<div class="box entry state_down <?= $h->hosts_down_unhandled ? '' : 'handled'; ?>">
|
||||
<a href="<?= $this->href(
|
||||
'monitoring/list/hosts',
|
||||
array('host_state' => 1, 'hostgroup' => $h->hostgroup)
|
||||
) ?>" title="Hosts Up"><?= $h->hosts_down ?> Hosts DOWN: </a>
|
||||
array(
|
||||
'host_state' => 1,
|
||||
'hostgroup' => $h->hostgroup
|
||||
)
|
||||
); ?>" title="Hosts DOWN">
|
||||
<?= $h->hosts_down ?> DOWN
|
||||
</a>
|
||||
<?php if ($h->hosts_down_unhandled): ?>
|
||||
<a href="<?= $this->href(
|
||||
'monitoring/list/hosts',
|
||||
|
|
@ -42,61 +41,85 @@
|
|||
'host_unhandled' => 1,
|
||||
'hostgroup' => $h->hostgroup
|
||||
)
|
||||
) ?>" title="Hosts Down Unhandled"><?= $h->hosts_down_unhandled ?> Unhandled</a>
|
||||
); ?>" title="Hosts DOWN Unhandled">
|
||||
<?= $h->hosts_down_unhandled ?> Unhandled
|
||||
</a>
|
||||
<?php endif ?>
|
||||
</span>
|
||||
<?php if ($h->hosts_down_handled): ?>
|
||||
<span class="state down handled">
|
||||
</div>
|
||||
<!-- End of Hosts DOWN -->
|
||||
<?php endif ?>
|
||||
<?php if ($h->hosts_unreachable): ?>
|
||||
<!-- Hosts UNREACHABLE -->
|
||||
<div class="box entry state_unreachable <?= $h->hosts_unreachable_unhandled ? '' : 'handled'; ?>">
|
||||
<a href="<?= $this->href(
|
||||
'monitoring/list/hosts',
|
||||
array(
|
||||
'host_state' => 1,
|
||||
'host_handled' => 1,
|
||||
'host_state' => 2,
|
||||
'hostgroup' => $h->hostgroup
|
||||
)
|
||||
) ?>" title="Hosts Down Handled"><?= $h->hosts_down_handled ?></a>
|
||||
</span>
|
||||
<?php endif ?>
|
||||
<!-- End of hosts DOWN -->
|
||||
<?php endif ?>
|
||||
|
||||
<?php if ($h->hosts_pending): ?>
|
||||
<!-- Hosts PENDING -->
|
||||
<span class="state pending">
|
||||
); ?>" title="Hosts UNREACHABLE">
|
||||
<?= $h->hosts_unreachable ?> UNREACHABLE
|
||||
</a>
|
||||
<?php if ($h->hosts_unreachable_unhandled): ?>
|
||||
<a href="<?= $this->href(
|
||||
'monitoring/list/hosts',
|
||||
array('host_state' => 99)
|
||||
) ?>" title="Hosts Pending"><?= $h->hosts_pending ?> pending</a>
|
||||
</span>
|
||||
<!-- End of hosts PENDING -->
|
||||
<?php endif ?>
|
||||
|
||||
</td><td>
|
||||
Services
|
||||
<?php if ($h->services_ok): ?>
|
||||
<!-- Services OK -->
|
||||
<span class="state ok">
|
||||
<a href="<?= $this->href(
|
||||
'monitoring/list/services',
|
||||
array(
|
||||
'service_state' => 0,
|
||||
'hostgroup' => $h->hostgroup)
|
||||
) ?>" title="Services Ok"><?= $h->services_ok ?> OK</a>
|
||||
</span>
|
||||
<!-- End of services OK -->
|
||||
'host_state' => 2,
|
||||
'host_unhandled' => 1,
|
||||
'hostgroup' => $h->hostgroup
|
||||
)
|
||||
); ?>" title="Hosts UNREACHABLE Unhandled">
|
||||
<?= $h->hosts_unreachable_unhandled ?> Unhandled
|
||||
</a>
|
||||
<?php endif ?>
|
||||
|
||||
</div>
|
||||
<!-- End of Hosts UNREACHABLE -->
|
||||
<?php endif ?>
|
||||
<?php if ($h->hosts_up): ?>
|
||||
<!-- Hosts UP -->
|
||||
<div class="box entry state_up">
|
||||
<a href="<?= $this->href(
|
||||
'monitoring/list/hosts',
|
||||
array(
|
||||
'host_state' => 0,
|
||||
'hostgroup' => $h->hostgroup
|
||||
)
|
||||
); ?>" title="Hosts UP">
|
||||
<?= $h->hosts_up ?> UP
|
||||
</a>
|
||||
</div>
|
||||
<!-- End of Hosts UP -->
|
||||
<?php endif ?>
|
||||
<?php if ($h->hosts_pending): ?>
|
||||
<!-- Hosts PENDING -->
|
||||
<div class="box entry state_pending">
|
||||
<a href="<?= $this->href(
|
||||
'monitoring/list/hosts',
|
||||
array(
|
||||
'host_state' => 99,
|
||||
'hostgroup' => $h->hostgroup
|
||||
)
|
||||
); ?>" title="Hosts PENDING">
|
||||
<?= $h->hosts_pending ?> PENDING
|
||||
</a>
|
||||
</div>
|
||||
<!-- End of Hosts PENDING -->
|
||||
<?php endif ?>
|
||||
</td>
|
||||
<td>
|
||||
<?php if ($h->services_critical): ?>
|
||||
<!-- Services CRITICAL -->
|
||||
<span class="state critical">
|
||||
<div class="box entry state_critical <?= $h->services_critical_unhandled ? '' : 'handled'; ?>">
|
||||
<a href="<?= $this->href(
|
||||
'monitoring/list/services',
|
||||
array(
|
||||
'service_state' => 2,
|
||||
'hostgroup' => $h->hostgroup,
|
||||
'sort' => 'service_severity'
|
||||
)) ?>" title="Services Critical"><?= $h->services_critical ?> CRITICAL: </a>
|
||||
|
||||
)
|
||||
); ?>" title="Services CRITICAL">
|
||||
<?= $h->services_critical ?> CRITICAL
|
||||
</a>
|
||||
<?php if ($h->services_critical_unhandled): ?>
|
||||
<a href="<?= $this->href(
|
||||
'monitoring/list/services',
|
||||
|
|
@ -106,78 +129,103 @@
|
|||
'hostgroup' => $h->hostgroup,
|
||||
'sort' => 'service_severity'
|
||||
)
|
||||
) ?>" title="Services Critical Unhandled"><?= $h->services_critical_unhandled ?> Unhandled</a>
|
||||
<?php endif ?>
|
||||
<?php if ($h->services_critical_handled): ?>
|
||||
<span class="state critical handled">
|
||||
<a href="<?= $this->href('monitoring/list/services', array('service_state' => 2, 'service_handled' => 1, 'hostgroup' => $h->hostgroup)); ?>" title="Services Critical Handled">
|
||||
<?= $h->services_critical_handled ?> Handled
|
||||
); ?>" title="Services CRITICAL Unhandled">
|
||||
<?= $h->services_critical_unhandled ?> Unhandled
|
||||
</a>
|
||||
</span>
|
||||
<?php endif ?>
|
||||
</span>
|
||||
<!-- End of services CRITICAL -->
|
||||
</div>
|
||||
<!-- End of Services CRITICAL -->
|
||||
<?php endif ?>
|
||||
|
||||
<?php if ($h->services_warning): ?>
|
||||
<!-- Services WARNING -->
|
||||
<span class="state warning">
|
||||
<a href="<?= $this->href('monitoring/list/services', array('service_state' => 1, 'hostgroup' => $h->hostgroup)); ?>" title="Services Warning">
|
||||
<?= $h->services_warning ?> WARNING: </a>
|
||||
|
||||
<?php if ($h->services_warning_unhandled): ?>
|
||||
<a href="<?= $this->href('monitoring/list/services', array('service_state' => 1, 'service_unhandled' => 1, 'hostgroup' => $h->hostgroup)); ?>" title="Services Warning Unhandled">
|
||||
<?= $h->services_warning_unhandled ?> Unhandled</a>
|
||||
<?php endif ?>
|
||||
<?php if ($h->services_warning_handled): ?>
|
||||
<span class="state warning handled">
|
||||
<a href="<?= $this->href('monitoring/list/services', array('service_state' => 1, 'service_handled' => 1, 'hostgroup' => $h->hostgroup)); ?>" title="Services Warning Handled">
|
||||
<?= $h->services_warning_handled ?> Handled
|
||||
</a>
|
||||
</span>
|
||||
<?php endif ?>
|
||||
</span>
|
||||
<!-- End of WARNING services -->
|
||||
<?php endif ?>
|
||||
|
||||
|
||||
<?php if ($h->services_unknown): ?>
|
||||
<!-- Services UNKNOWN -->
|
||||
<span class="state unknown">
|
||||
<div class="box entry state_warning <?= $h->services_warning_unhandled ? '' : 'handled'; ?>">
|
||||
<a href="<?= $this->href(
|
||||
'monitoring/list/services',
|
||||
array('service_state' => 3, 'hostgroup' => $h->hostgroup)
|
||||
) ?>" title="Services Unknown"><?= $h->services_unknown ?> UNKNOWN: </a>
|
||||
<?php if ($h->services_unknown_unhandled): ?>
|
||||
<a href="<?= $this->href('monitoring/list/services', array('service_state' => 3, 'service_unhandled' => 1, 'hostgroup' => $h->hostgroup)); ?>" title="Services Unknown Unhandled">
|
||||
<?= $h->services_unknown_unhandled ?> Unhandled</a>
|
||||
array(
|
||||
'service_state' => 1,
|
||||
'hostgroup' => $h->hostgroup
|
||||
)
|
||||
); ?>" title="Services WARNING">
|
||||
<?= $h->services_warning ?> WARNING
|
||||
</a>
|
||||
<?php if ($h->services_warning_unhandled): ?>
|
||||
<a href="<?= $this->href(
|
||||
'monitoring/list/services',
|
||||
array(
|
||||
'service_state' => 1,
|
||||
'service_unhandled' => 1,
|
||||
'hostgroup' => $h->hostgroup
|
||||
)
|
||||
); ?>" title="Services WARNING Unhandled">
|
||||
<?= $h->services_warning_unhandled ?> Unhandled
|
||||
</a>
|
||||
<?php endif ?>
|
||||
<?php if ($h->services_unknown_handled): ?>
|
||||
<span class="state unknown handled">
|
||||
</div>
|
||||
<!-- End of Services WARNING -->
|
||||
<?php endif ?>
|
||||
<?php if ($h->services_unknown): ?>
|
||||
<!-- Services UNKNOWN -->
|
||||
<div class="box entry state_unknown">
|
||||
<a href="<?= $this->href(
|
||||
'monitoring/list/services',
|
||||
array(
|
||||
'service_state' => 3,
|
||||
'service_handled' => 1,
|
||||
'hostgroup' => $h->hostgroup
|
||||
)
|
||||
) ?>" title="Services Unknown Handled"><?= $h->services_unknown_handled ?> Handled</a>
|
||||
</span>
|
||||
<?php endif ?>
|
||||
</span>
|
||||
<!-- End of UNKNOWN services -->
|
||||
<?php endif ?>
|
||||
|
||||
<?php if ($h->services_pending): ?>
|
||||
<span class="state pending">
|
||||
); ?>" title="Services UNKNOWN">
|
||||
<?= $h->services_unknown ?> UNKNOWN
|
||||
</a>
|
||||
<?php if ($h->services_unknown_unhandled): ?>
|
||||
<a href="<?= $this->href(
|
||||
'monitoring/list/services',
|
||||
array('service_state' => 99, 'hostgroup' => $h->hostgroup)
|
||||
) ?>" title="Services Pending"><?= $h->services_pending ?></a>
|
||||
</span>
|
||||
array(
|
||||
'service_state' => 3,
|
||||
'service_unhandled' => 1,
|
||||
'hostgroup' => $h->hostgroup
|
||||
)
|
||||
); ?>" title="Services UNKNOWN Unhandled">
|
||||
<?= $h->services_unknown_unhandled ?> Unhandled
|
||||
</a>
|
||||
<?php endif ?>
|
||||
</td></tr></table>
|
||||
</span><!-- end of services -->
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
</div>
|
||||
<!-- End of Services UNKNOWN -->
|
||||
<?php endif ?>
|
||||
<?php if ($h->services_ok): ?>
|
||||
<!-- Services OK -->
|
||||
<div class="box entry state_ok">
|
||||
<a href="<?= $this->href(
|
||||
'monitoring/list/services',
|
||||
array(
|
||||
'service_state' => 0,
|
||||
'hostgroup' => $h->hostgroup
|
||||
)
|
||||
); ?>" title="Services OK">
|
||||
<?= $h->services_ok ?> OK
|
||||
</a>
|
||||
</div>
|
||||
<!-- End of Services OK -->
|
||||
<?php endif ?>
|
||||
<?php if ($h->services_pending): ?>
|
||||
<!-- Services PENDING -->
|
||||
<div class="box entry state_pending">
|
||||
<a href="<?= $this->href(
|
||||
'monitoring/list/services',
|
||||
array(
|
||||
'service_state' => 99,
|
||||
'hostgroup' => $h->hostgroup
|
||||
)
|
||||
); ?>" title="Services PENDING">
|
||||
<?= $h->services_pending ?> PENDING
|
||||
</a>
|
||||
</div>
|
||||
<!-- End of Services PENDING -->
|
||||
<?php endif ?>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
<?php endforeach ?>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -271,150 +271,131 @@ a.critical {
|
|||
}
|
||||
*/
|
||||
|
||||
/* Generic box element */
|
||||
|
||||
/* Generic span.state */
|
||||
span.state {
|
||||
color: white;
|
||||
border-radius: 0.5em;
|
||||
-moz-border-radius: 0.5em;
|
||||
padding: 0.3em 0.5em 0.3em 0.5em;
|
||||
margin: 0.2em 0.5em 0.2em 0.5em;
|
||||
}
|
||||
|
||||
/* span.state title element */
|
||||
span.state caption {
|
||||
font-size: 125%;
|
||||
}
|
||||
|
||||
/* span.state Subtitle element */
|
||||
span.state.subtitle {
|
||||
color: black;
|
||||
}
|
||||
|
||||
span.state.ok, span.state.up {
|
||||
background-color: @colorOk;
|
||||
}
|
||||
|
||||
span.state.pending {
|
||||
background-color: @colorPending;
|
||||
}
|
||||
|
||||
span.state.warning {
|
||||
background-color: @colorWarning;
|
||||
}
|
||||
|
||||
span.state.warning.handled {
|
||||
background-color: @colorWarningHandled;
|
||||
}
|
||||
|
||||
span.state.critical, span.state.down {
|
||||
background-color: @colorCritical;
|
||||
}
|
||||
|
||||
span.state.critical.handled, span.state.down.handled {
|
||||
background-color: @colorCriticalHandled;
|
||||
}
|
||||
|
||||
span.state.unknown, span.state.unreachable {
|
||||
background-color: @colorUnknown;
|
||||
}
|
||||
|
||||
span.state.unknown.handled, span.state.unreachable.handled {
|
||||
background-color: @colorUnknownHandled;
|
||||
}
|
||||
|
||||
span.state.invalid {
|
||||
background-color: @colorInvalid;
|
||||
}
|
||||
|
||||
span.state.check_active {
|
||||
background-color: @colorActiveCheck;
|
||||
}
|
||||
|
||||
span.state.check_passive {
|
||||
background-color: @colorPassiveCheck;
|
||||
}
|
||||
|
||||
span.state.check_disabled {
|
||||
background-color: @colorDisabledCheck;
|
||||
}
|
||||
|
||||
span.state.enabled {
|
||||
background-color: @colorEnabled;
|
||||
}
|
||||
|
||||
span.state.disabled {
|
||||
background-color: @colorDisabled;
|
||||
}
|
||||
|
||||
span.state.flapping {
|
||||
background-color: @colorFlapping;
|
||||
}
|
||||
|
||||
.summary a {
|
||||
color: white;
|
||||
.boxview a {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.summary {
|
||||
font-size: 0.85em;
|
||||
vertical-align: top;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.summary td {
|
||||
vertical-align: top;
|
||||
}
|
||||
.summary > span.state {
|
||||
border: 1px solid #555;
|
||||
color: black;
|
||||
}
|
||||
|
||||
.summary strong a {
|
||||
color: black;
|
||||
}
|
||||
|
||||
.summary span.state.handled a {
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.summary span.state.disabled > a {
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.summary span.state.check_disabled > a {
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.summary span.state {
|
||||
width: 26em;
|
||||
vertical-align: top;
|
||||
.boxview > div.box {
|
||||
width: 28em;
|
||||
text-align: center;
|
||||
vertical-align: top;
|
||||
display: inline-block;
|
||||
padding: 0.5em;
|
||||
margin: 0.5em;
|
||||
|
||||
background: #555;
|
||||
border-radius: 0.5em;
|
||||
-moz-border-radius: 0.5em;
|
||||
}
|
||||
|
||||
.summary span.state span.state {
|
||||
width: 12em;
|
||||
/* Box caption */
|
||||
.boxview div.box h2 {
|
||||
margin: 0.5em 0 1em;
|
||||
|
||||
color: white;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
/* Box body of contents */
|
||||
.boxview div.box.contents {
|
||||
background: #eee;
|
||||
border-radius: 0.5em;
|
||||
-moz-border-radius: 0.5em;
|
||||
}
|
||||
|
||||
.boxview div.box.contents table {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.boxview div.box.contents td {
|
||||
width: 13em;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
/* Box separator */
|
||||
.boxview div.box-separator:first-child {
|
||||
border-top-width: 0;
|
||||
|
||||
border-top-left-radius: 0.5em;
|
||||
border-top-right-radius: 0.5em;
|
||||
-moz-border-top-left-radius: 0.5em;
|
||||
-moz-border-top-right-radius: 0.5em;
|
||||
}
|
||||
|
||||
.boxview div.box-separator {
|
||||
border-style: solid;
|
||||
border-color: #555;
|
||||
border-top-width: 1px;
|
||||
border-bottom-width: 1px;
|
||||
border-left-width: 0;
|
||||
border-right-width: 0;
|
||||
background-color: #bbb;
|
||||
}
|
||||
|
||||
/* Box entry */
|
||||
.boxview div.box.entry {
|
||||
min-height: 3em;
|
||||
margin: 0.25em;
|
||||
font-size: 0.9em;
|
||||
}
|
||||
|
||||
.summary span.state span.state span.state {
|
||||
width: 12em;
|
||||
}
|
||||
|
||||
span.state a {
|
||||
white-space: nowrap;
|
||||
color: black;
|
||||
}
|
||||
|
||||
span.state.handled {
|
||||
color: #333;
|
||||
/* Any line of a box entry */
|
||||
.boxview div.box.entry a {
|
||||
display: block;
|
||||
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
span.state a.active {
|
||||
text-decoration: underline;
|
||||
.boxview div.box.entry a:hover {
|
||||
color: #666;
|
||||
}
|
||||
|
||||
/* End of generic span.state */
|
||||
/* First line of a box entry */
|
||||
.boxview div.box.entry a:first-child {
|
||||
font-size: 1.1em;
|
||||
}
|
||||
|
||||
/* End of generic box element */
|
||||
|
||||
|
||||
/* Monitoring box element styles */
|
||||
|
||||
div.box.entry.state_up, div.box.entry.state_ok {
|
||||
border-left: 0.8em solid @colorOk;
|
||||
}
|
||||
|
||||
div.box.entry.state_pending {
|
||||
border-left: 0.8em solid @colorPending;
|
||||
}
|
||||
|
||||
div.box.entry.state_down, div.box.entry.state_critical {
|
||||
border-left: 0.8em solid @colorCritical;
|
||||
background-color: @colorCritical;
|
||||
color: white;
|
||||
}
|
||||
|
||||
div.box.entry.state_warning {
|
||||
border-left: 0.8em solid @colorWarning;
|
||||
background-color: @colorWarning;
|
||||
color: white;
|
||||
}
|
||||
|
||||
div.box.entry.state_unreachable, div.box.entry.state_unknown {
|
||||
border-left: 0.8em solid @colorUnknown;
|
||||
background-color: @colorUnknown;
|
||||
color: white;
|
||||
}
|
||||
|
||||
div.box.entry.handled {
|
||||
background-color: transparent;
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
/* End of monitoring box element styles */
|
||||
|
||||
|
||||
.controls {
|
||||
|
|
|
|||
Loading…
Reference in New Issue