tyler.durden/icingaweb2
1
0
Fork 0
mirror of https://github.com/Icinga/icingaweb2.git synced 2025-07-20 12:24:29 +02:00
Code Issues Packages Projects Releases Wiki Activity

tatical/index: Use an ul for the legends and render real links

Browse Source 
refs #2529
refs #3804
This commit is contained in:
Johannes Meyer 2019-07-04 14:49:53 +02:00
parent c28155408f
commit 1aca142e1a
2 changed files with 116 additions and 98 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

184
modules/monitoring/application/views/scripts/tactical/index.phtml
View File

@ -1,4 +1,4 @@
<?php if (!$this->compact): ?> <?php if (! $this->compact): ?>
<div class="controls"> <div class="controls">
<?= $this->tabs ?> <?= $this->tabs ?>
<?= $this->filterEditor ?> <?= $this->filterEditor ?>
@ -15,116 +15,128 @@
<div class="donut"> <div class="donut">
<?= $hostStatusSummaryChart ?> <?= $hostStatusSummaryChart ?>
</div> </div>
<table class="donut-table"> <ul class="donut-legend">
<tbody> <?php if ($statusSummary->hosts_up): ?>
<?php if ($statusSummary->hosts_up): ?> <li>
<tr href="<?= $this->filteredUrl('monitoring/list/hosts', array('host_state' => 0, 'sort' => 'host_last_check', 'dir' => 'asc')) ?>"> <a href="<?= $this->filteredUrl('monitoring/list/hosts', array('host_state' => 0, 'sort' => 'host_last_check', 'dir' => 'asc')) ?>">
<th class="state state-ok badge"><?= $statusSummary->hosts_up ?></th> <span class="state state-ok badge"><?= $statusSummary->hosts_up ?></span><?= $this->translate('Up') ?>
<td><?= $this->translate('Up') ?></td> </a>
</tr> </li>
<?php endif;
if ($statusSummary->hosts_down_handled):?>
<tr href="<?= $this->filteredUrl('monitoring/list/hosts', array('host_state' => 1, 'host_handled' => 1, 'sort' => 'host_last_check', 'dir' => 'asc')) ?>">
<th class="state state-critical handled badge"><?= $statusSummary->hosts_down_handled ?></th>
<td><?= $this->translate('Down') ?> (<?= $this->translate('Handled') ?>)</td>
</tr>
<?php endif;
if ($statusSummary->hosts_down_unhandled):?>
<tr href="<?= $this->filteredUrl('monitoring/list/hosts', array('host_state' => 1, 'host_handled' => 0, 'sort' => 'host_last_check', 'dir' => 'asc')) ?>">
<th class="state state-critical badge"><?= $statusSummary->hosts_down_unhandled ?></th>
<td><?= $this->translate('Down') ?></td>
</tr>
<?php endif;
if ($statusSummary->hosts_unreachable_handled):?>
<tr href="<?= $this->filteredUrl('monitoring/list/hosts', array('host_state' => 2, 'host_handled' => 1, 'sort' => 'host_last_check', 'dir' => 'asc')) ?>">
<th class="state state-unreachable handled badge"><?= $statusSummary->hosts_unreachable_handled ?></th>
<td><?= $this->translate('Unreachable') ?> (<?= $this->translate('Handled') ?>)</td>
</tr>
<?php endif;
if ($statusSummary->hosts_unreachable_unhandled):?>
<tr href="<?= $this->filteredUrl('monitoring/list/hosts', array('host_state' => 2, 'host_handled' => 0, 'sort' => 'host_last_check', 'dir' => 'asc')) ?>">
<th class="state state-unreachable badge"><?= $statusSummary->hosts_unreachable_unhandled ?></th>
<td><?= $this->translate('Unreachable') ?></td>
</tr>
<?php endif;
if ($statusSummary->hosts_pending):?>
<tr href="<?= $this->filteredUrl('monitoring/list/hosts', array('host_state' => 99, 'sort' => 'host_last_check', 'dir' => 'asc')) ?>">
<th class="state state-pending badge"><?= $statusSummary->hosts_pending ?></th>
<td><?= $this->translate('Pending') ?></td>
</tr>
<?php endif;
if ($statusSummary->hosts_not_checked):?>
<tr href="<?= $this->filteredUrl('monitoring/list/hosts', array('host_active_checks_enabled' => 0, 'host_passive_checks_enabled' => 0, 'sort' => 'host_last_check', 'dir' => 'asc')) ?>">
<th class="state slice-state-not-checked badge"><?= $statusSummary->hosts_not_checked ?></th>
<td><?= $this->translate('Not Checked') ?></td>
</tr>
<?php endif ?> <?php endif ?>
</tbody> <?php if ($statusSummary->hosts_down_handled): ?>
</table> <li>
<a href="<?= $this->filteredUrl('monitoring/list/hosts', array('host_state' => 1, 'host_handled' => 1, 'sort' => 'host_last_check', 'dir' => 'asc')) ?>">
<span class="state state-critical handled badge"><?= $statusSummary->hosts_down_handled ?></span><?= $this->translate('Down') ?> (<?= $this->translate('Handled') ?>)
</a>
</li>
<?php endif ?>
<?php if ($statusSummary->hosts_down_unhandled): ?>
<li>
<a href="<?= $this->filteredUrl('monitoring/list/hosts', array('host_state' => 1, 'host_handled' => 0, 'sort' => 'host_last_check', 'dir' => 'asc')) ?>">
<span class="state state-critical badge"><?= $statusSummary->hosts_down_unhandled ?></span><?= $this->translate('Down') ?>
</a>
</li>
<?php endif ?>
<?php if ($statusSummary->hosts_unreachable_handled): ?>
<li>
<a href="<?= $this->filteredUrl('monitoring/list/hosts', array('host_state' => 2, 'host_handled' => 1, 'sort' => 'host_last_check', 'dir' => 'asc')) ?>">
<span class="state state-unreachable handled badge"><?= $statusSummary->hosts_unreachable_handled ?></span><?= $this->translate('Unreachable') ?> (<?= $this->translate('Handled') ?>)
</a>
</li>
<?php endif ?>
<?php if ($statusSummary->hosts_unreachable_unhandled): ?>
<li>
<a href="<?= $this->filteredUrl('monitoring/list/hosts', array('host_state' => 2, 'host_handled' => 0, 'sort' => 'host_last_check', 'dir' => 'asc')) ?>">
<span class="state state-unreachable badge"><?= $statusSummary->hosts_unreachable_unhandled ?></span><?= $this->translate('Unreachable') ?>
</a>
</li>
<?php endif ?>
<?php if ($statusSummary->hosts_pending): ?>
<li>
<a href="<?= $this->filteredUrl('monitoring/list/hosts', array('host_state' => 99, 'sort' => 'host_last_check', 'dir' => 'asc')) ?>">
<span class="state state-pending badge"><?= $statusSummary->hosts_pending ?></span><?= $this->translate('Pending') ?>
</a>
</li>
<?php endif ?>
<?php if ($statusSummary->hosts_not_checked): ?>
<li>
<a href="<?= $this->filteredUrl('monitoring/list/hosts', array('host_active_checks_enabled' => 0, 'host_passive_checks_enabled' => 0, 'sort' => 'host_last_check', 'dir' => 'asc')) ?>">
<span class="state slice-state-not-checked badge"><?= $statusSummary->hosts_not_checked ?></span><?= $this->translate('Not Checked') ?>
</a>
</li>
<?php endif ?>
</ul>
</div> </div>
<div class="donut-container"> <div class="donut-container">
<h2><?= $this->translate('Service Summary') ?></h2> <h2><?= $this->translate('Service Summary') ?></h2>
<div class="donut"> <div class="donut">
<?= $serviceStatusSummaryChart ?> <?= $serviceStatusSummaryChart ?>
</div> </div>
<table class="donut-table"> <ul class="donut-legend">
<tbody>
<?php if ($statusSummary->services_ok):?> <?php if ($statusSummary->services_ok):?>
<tr href="<?= $this->filteredUrl('monitoring/list/services', array('service_state' => 0, 'sort' => 'service_last_check', 'dir' => 'asc')) ?>"> <li>
<th class="state state-ok badge"><?= $statusSummary->services_ok ?></th> <a href="<?= $this->filteredUrl('monitoring/list/services', array('service_state' => 0, 'sort' => 'service_last_check', 'dir' => 'asc')) ?>">
<td><?= $this->translate('Ok') ?></td> <span class="state state-ok badge"><?= $statusSummary->services_ok ?></span><?= $this->translate('Ok') ?>
</tr> </a>
</li>
<?php endif; <?php endif;
if ($statusSummary->services_warning_handled):?> if ($statusSummary->services_warning_handled):?>
<tr href="<?= $this->filteredUrl('monitoring/list/services', array('service_state' => 1, 'service_handled' => 1, 'sort' => 'service_last_check', 'dir' => 'asc')) ?>"> <li>
<th class="state state-warning handled badge"><?= $statusSummary->services_warning_handled ?></th> <a href="<?= $this->filteredUrl('monitoring/list/services', array('service_state' => 1, 'service_handled' => 1, 'sort' => 'service_last_check', 'dir' => 'asc')) ?>">
<td><?= $this->translate('Warning') ?> (<?= $this->translate('Handled') ?>)</td> <span class="state state-warning handled badge"><?= $statusSummary->services_warning_handled ?></span><?= $this->translate('Warning') ?> (<?= $this->translate('Handled') ?>)
</tr> </a>
</li>
<?php endif; <?php endif;
if ($statusSummary->services_warning_unhandled):?> if ($statusSummary->services_warning_unhandled):?>
<tr href="<?= $this->filteredUrl('monitoring/list/services', array('service_state' => 1, 'service_handled' => 0, 'sort' => 'service_last_check', 'dir' => 'asc')) ?>"> <li>
<th class="state state-warning badge"><?= $statusSummary->services_warning_unhandled ?></th> <a href="<?= $this->filteredUrl('monitoring/list/services', array('service_state' => 1, 'service_handled' => 0, 'sort' => 'service_last_check', 'dir' => 'asc')) ?>">
<td><?= $this->translate('Warning') ?></td> <span class="state state-warning badge"><?= $statusSummary->services_warning_unhandled ?></span><?= $this->translate('Warning') ?>
</tr> </a>
</li>
<?php endif; <?php endif;
if ($statusSummary->services_critical_handled):?> if ($statusSummary->services_critical_handled):?>
<tr href="<?= $this->filteredUrl('monitoring/list/services', array('service_state' => 2, 'service_handled' => 1, 'sort' => 'service_last_check', 'dir' => 'asc')) ?>"> <li>
<th class="state state-critical handled badge"><?= $statusSummary->services_critical_handled ?></th> <a href="<?= $this->filteredUrl('monitoring/list/services', array('service_state' => 2, 'service_handled' => 1, 'sort' => 'service_last_check', 'dir' => 'asc')) ?>">
<td><?= $this->translate('Critical') ?> (<?= $this->translate('Handled') ?>)</td> <span class="state state-critical handled badge"><?= $statusSummary->services_critical_handled ?></span><?= $this->translate('Critical') ?> (<?= $this->translate('Handled') ?>)
</tr> </a>
</li>
<?php endif; <?php endif;
if ($statusSummary->services_critical_unhandled):?> if ($statusSummary->services_critical_unhandled):?>
<tr href="<?= $this->filteredUrl('monitoring/list/services', array('service_state' => 2, 'service_handled' => 0, 'sort' => 'service_last_check', 'dir' => 'asc')) ?>"> <li>
<th class="state state-critical badge"><?= $statusSummary->services_critical_unhandled ?></th> <a href="<?= $this->filteredUrl('monitoring/list/services', array('service_state' => 2, 'service_handled' => 0, 'sort' => 'service_last_check', 'dir' => 'asc')) ?>">
<td><?= $this->translate('Critical') ?></td> <span class="state state-critical badge"><?= $statusSummary->services_critical_unhandled ?></span><?= $this->translate('Critical') ?>
</tr> </a>
</li>
<?php endif; <?php endif;
if ($statusSummary->services_unknown_handled):?> if ($statusSummary->services_unknown_handled):?>
<tr href="<?= $this->filteredUrl('monitoring/list/services', array('service_state' => 3, 'service_handled' => 1, 'sort' => 'service_last_check', 'dir' => 'asc')) ?>"> <li>
<th class="state state-unknown handled badge"><?= $statusSummary->services_unknown_handled ?></th> <a href="<?= $this->filteredUrl('monitoring/list/services', array('service_state' => 3, 'service_handled' => 1, 'sort' => 'service_last_check', 'dir' => 'asc')) ?>">
<td><?= $this->translate('Unknown') ?> (<?= $this->translate('Handled') ?>)</td> <span class="state state-unknown handled badge"><?= $statusSummary->services_unknown_handled ?></span><?= $this->translate('Unknown') ?> (<?= $this->translate('Handled') ?>)
</tr> </a>
</li>
<?php endif; <?php endif;
if ($statusSummary->services_unknown_unhandled):?> if ($statusSummary->services_unknown_unhandled):?>
<tr href="<?= $this->filteredUrl('monitoring/list/services', array('service_state' => 3, 'service_handled' => 0, 'sort' => 'service_last_check', 'dir' => 'asc')) ?>"> <li>
<th class="state state-unknown badge"><?= $statusSummary->services_unknown_unhandled ?></th> <a href="<?= $this->filteredUrl('monitoring/list/services', array('service_state' => 3, 'service_handled' => 0, 'sort' => 'service_last_check', 'dir' => 'asc')) ?>">
<td><?= $this->translate('Unknown') ?></td> <span class="state state-unknown badge"><?= $statusSummary->services_unknown_unhandled ?></span><?= $this->translate('Unknown') ?>
</tr> </a>
</li>
<?php endif; <?php endif;
if ($statusSummary->services_pending):?> if ($statusSummary->services_pending):?>
<tr href="<?= $this->filteredUrl('monitoring/list/services', array('service_state' => 99, 'sort' => 'service_last_check', 'dir' => 'asc')) ?>"> <li>
<th class="state state-pending badge"><?= $statusSummary->services_pending ?></th> <a href="<?= $this->filteredUrl('monitoring/list/services', array('service_state' => 99, 'sort' => 'service_last_check', 'dir' => 'asc')) ?>">
<td><?= $this->translate('Pending') ?></td> <span class="state state-pending badge"><?= $statusSummary->services_pending ?></span><?= $this->translate('Pending') ?>
</tr> </a>
</li>
<?php endif; <?php endif;
if ($statusSummary->services_not_checked):?> if ($statusSummary->services_not_checked):?>
<tr href="<?= $this->filteredUrl('monitoring/list/services', array('service_active_checks_enabled' => 0, 'service_passive_checks_enabled' => 0, 'sort' => 'service_last_check', 'dir' => 'asc')) ?>"> <li>
<th class="state slice-state-not-checked badge"><?= $statusSummary->services_not_checked ?></th> <a href="<?= $this->filteredUrl('monitoring/list/services', array('service_active_checks_enabled' => 0, 'service_passive_checks_enabled' => 0, 'sort' => 'service_last_check', 'dir' => 'asc')) ?>">
<td><?= $this->translate('Not Checked') ?></td> <span class="state slice-state-not-checked badge"><?= $statusSummary->services_not_checked ?></span><?= $this->translate('Not Checked') ?>
</tr> </a>
</li>
<?php endif?> <?php endif?>
</tbody> </ul>
</table>
</div> </div>
</div> </div>
</div> </div>

30
public/css/icinga/widgets.less
View File

@ -491,22 +491,28 @@ ul.tree li a.error:hover {
} }
.donut-container { .donut-container {
display: inline-block;
width: 36em; width: 36em;
height: 36em; float: left;
position: relative;
} }
.donut-table { .donut-legend {
max-width: 45%; width: 50%;
display: inline-block; padding: 0;
position: absolute; margin: 0 0 0 auto;
top: 23em; list-style-type: none;
left: 17.5em;
& > tbody > tr:hover { li {
text-decoration: underline; vertical-align: middle;
cursor: pointer;
&:not(:last-child) {
margin-bottom: .5em;
}
.badge {
font-weight: bold;
margin-right: .5em;
vertical-align: initial;
}
} }
} }