Switched to using Jquery Bootgrid for tables

This commit is contained in:
laf
2015-03-27 16:28:09 +00:00
parent 115bed5812
commit 6207bae03a
12 changed files with 224 additions and 130 deletions

View File

@ -5,4 +5,4 @@ imports:
# FIXME: find a way to keep excluded_paths list sorted # FIXME: find a way to keep excluded_paths list sorted
filter: filter:
excluded_paths: [ html/includes/geshi/*, html/includes/jpgraph/*, html/js/*, includes/phpmailer/*, html/css/*, html/includes/Slim/*, includes/console_color.php, includes/console_table.php, html/lib/* ] excluded_paths: [ html/includes/geshi/*, html/includes/jpgraph/*, html/js/*, includes/phpmailer/*, html/css/*, html/includes/Slim/*, includes/console_color.php, includes/console_table.php, html/lib/*, lib/* ]

View File

@ -18,6 +18,10 @@ LibreNMS ships with the following software components:
http://www.javascripttoolbox.com/lib/mktree/ http://www.javascripttoolbox.com/lib/mktree/
MIT and GPL License MIT and GPL License
- Jquery Bootgrid
http://www.jquery-bootgrid.com/
MIT License
Other components (needs details filled in): Other components (needs details filled in):
- JpGraph (html/includes/jpgraph): QPL 1.0 license - JpGraph (html/includes/jpgraph): QPL 1.0 license

49
html/ajax_table.php Normal file
View File

@ -0,0 +1,49 @@
<?php
/*
* LibreNMS
*
* Copyright (c) 2014 Neil Lathwood <https://github.com/laf/ http://www.lathwood.co.uk/fa>
*
* This program is free software: you can redistribute it and/or modify it
* under the terms of the GNU General Public License as published by the
* Free Software Foundation, either version 3 of the License, or (at your
* option) any later version. Please see LICENSE.txt at the top level of
* the source code distribution for details.
*/
if (isset($_REQUEST['debug']))
{
ini_set('display_errors', 1);
ini_set('display_startup_errors', 0);
ini_set('log_errors', 0);
ini_set('allow_url_fopen', 0);
ini_set('error_reporting', E_ALL);
}
include_once("../includes/defaults.inc.php");
include_once("../config.php");
include_once("../includes/definitions.inc.php");
include_once("includes/functions.inc.php");
include_once("../includes/functions.php");
include_once("includes/authenticate.inc.php");
$current = $_POST['current'];
settype($current,"integer");
$rowCount = $_POST['rowCount'];
settype($rowCount,"integer");
if (isset($_POST['sort']) && is_array($_POST['sort'])) {
foreach ($_POST['sort'] as $k=>$v) {
$sort .= " $k $v";
}
}
$searchPhrase = mres($_POST['searchPhrase']);
$id = mres($_POST['id']);
if (isset($id)) {
if (file_exists("includes/table/$id.inc.php")) {
require_once "includes/table/$id.inc.php";
}
}
?>

1
html/css/jquery.bootgrid.min.css vendored Symbolic link
View File

@ -0,0 +1 @@
../../lib/jquery-bootgrid/dist/jquery.bootgrid.min.css

View File

@ -0,0 +1,66 @@
<?php
$where = "1";
if (is_numeric($_POST['device']))
{
$where .= ' AND E.host = ?';
$param[] = $_POST['device'];
}
if ($_POST['string'])
{
$where .= " AND E.message LIKE ?";
$param[] = "%".$_POST['string']."%";
}
if ($_SESSION['userlevel'] >= '5') {
$sql = " FROM `eventlog` AS E LEFT JOIN `devices` AS `D` ON `E`.`host`=`D`.`device_id` WHERE $where";
} else {
$sql = " FROM `eventlog` AS E, devices_perms AS P WHERE $where AND E.host = P.device_id AND P.user_id = ?";
$param[] = $_SESSION['user_id'];
}
$count_sql = "SELECT COUNT(datetime) $sql";
$total = dbFetchCell($count_sql,$param);
if (isset($searchPhrase) && !empty($searchPhrase)) {
$sql .= " AND (`D`.`hostname` LIKE '%$searchPhrase%' OR `E`.`datetime` LIKE '%$searchPhrase%' OR `E`.`message` LIKE '%$searchPhrase%' OR `E`.`type` LIKE '%$searchPhrase%')";
}
if (!isset($sort) || empty($sort)) {
$sort = 'datetime DESC';
}
$sql .= " ORDER BY $sort";
if (isset($current)) {
$limit_low = ($current * $rowCount) - ($rowCount);
$limit_high = $rowCount;
}
if ($rowCount != -1) {
$sql .= " LIMIT $limit_low,$limit_high";
}
$sql = "SELECT `E`.*,DATE_FORMAT(datetime, '%D %b %Y %T') as humandate $sql";
foreach (dbFetchRows($sql,$param) as $eventlog) {
$dev = device_by_id_cache($eventlog['host']);
if ($eventlog['type'] == "interface") {
$this_if = ifLabel(getifbyid($eventlog['reference']));
$type = "<b>".generate_port_link($this_if, makeshortif(strtolower($this_if['label'])))."</b>";
} else {
$type = "System";
}
$response[] = array('datetime'=>$eventlog['humandate'],
'hostname'=>generate_device_link($dev, shorthost($dev['hostname'])),
'type'=>$type,
'message'=>htmlspecialchars($eventlog['message']));
}
$output = array('current'=>$current,'rowCount'=>$rowCount,'rows'=>$response,'total'=>$total);
echo _json_encode($output);
?>

View File

@ -0,0 +1,42 @@
<?php
$count_sql = "SELECT count(D.device_id) FROM `devices` AS `D`";
$sql = "SELECT D.device_id,D.hostname AS `hostname`, D.last_polled AS `last_polled`, D.last_polled_timetaken AS `last_polled_timetaken` FROM `devices` AS D";
if (is_admin() === FALSE) {
$sql .= ", devices_perms AS P WHERE D.device_id = P.device_id AND P.user_id = '" . $_SESSION['user_id'] . "' AND D.ignore = '0'";
} else {
$sql .= " WHERE 1";
}
if (isset($searchPhrase) && !empty($searchPhrase)) {
$sql .= " AND (hostname LIKE '%$searchPhrase%' OR last_polled LIKE '%$searchPhrase%' OR last_polled_timetaken LIKE '%$searchPhrase%')";
}
if (!isset($sort) || empty($sort)) {
$sort = 'last_polled_timetaken DESC';
}
$sql .= " AND D.status ='1' AND D.ignore='0' AND D.disabled='0' ORDER BY $sort";
$total = dbFetchCell($count_sql);
if (isset($current)) {
$limit_low = ($current * $rowCount) - ($rowCount);
$limit_high = $rowCount;
}
if ($rowCount != -1) {
$sql .= " LIMIT $limit_low,$limit_high";
}
foreach (dbFetchRows($sql) as $device) {
$response[] = array('hostname' => "<a class='list-device' href='" .generate_device_url($device, array('tab' => 'graphs', 'group' => 'poller')). "'>" .$device['hostname']. "</a>",
'last_polled' => $device['last_polled'],
'last_polled_timetaken' => $device['last_polled_timetaken']);
}
$output = array('current'=>$current,'rowCount'=>$rowCount,'rows'=>$response,'total'=>$total);
echo _json_encode($output);
?>

View File

@ -164,6 +164,7 @@ if (empty($config['favicon'])) {
<link href="css/toastr.min.css" rel="stylesheet" type="text/css" /> <link href="css/toastr.min.css" rel="stylesheet" type="text/css" />
<link href="css/typeahead.js-bootstrap.css" rel="stylesheet" type="text/css" /> <link href="css/typeahead.js-bootstrap.css" rel="stylesheet" type="text/css" />
<link href="css/jquery-ui.min.css" rel="stylesheet" type="text/css" /> <link href="css/jquery-ui.min.css" rel="stylesheet" type="text/css" />
<link href="css/jquery.bootgrid.min.css" rel="stylesheet" type="text/css" />
<link href="css/tagmanager.css" rel="stylesheet" type="text/css" /> <link href="css/tagmanager.css" rel="stylesheet" type="text/css" />
<link href="css/mktree.css" rel="stylesheet" type="text/css" /> <link href="css/mktree.css" rel="stylesheet" type="text/css" />
<link href="<?php echo($config['stylesheet']); ?>" rel="stylesheet" type="text/css" /> <link href="<?php echo($config['stylesheet']); ?>" rel="stylesheet" type="text/css" />
@ -179,6 +180,7 @@ if (empty($config['favicon'])) {
<script src="js/jquery-ui.min.js"></script> <script src="js/jquery-ui.min.js"></script>
<script src="js/tagmanager.js"></script> <script src="js/tagmanager.js"></script>
<script src="js/mktree.js"></script> <script src="js/mktree.js"></script>
<script src="js/jquery.bootgrid.min.js"></script>
<script type="text/javascript"> <script type="text/javascript">
<!-- Begin <!-- Begin

1
html/js/jquery.bootgrid.min.js vendored Symbolic link
View File

@ -0,0 +1 @@
../../lib/jquery-bootgrid/dist/jquery.bootgrid.min.js

View File

@ -1,5 +1,7 @@
<?php <?php
$no_refresh = TRUE;
$param = array(); $param = array();
if ($vars['action'] == "expunge" && $_SESSION['userlevel'] >= '10') if ($vars['action'] == "expunge" && $_SESSION['userlevel'] >= '10')
@ -8,42 +10,13 @@ if ($vars['action'] == "expunge" && $_SESSION['userlevel'] >= '10')
print_message("Event log truncated"); print_message("Event log truncated");
} }
if (isset($_POST['results_amount']) && $_POST['results_amount'] > 0) {
$numresults = $_POST['results_amount'];
} else {
$numresults = 250;
}
if (isset($_POST['page_number']) && $_POST['page_number'] > 0) {
$page_number = $_POST['page_number'];
} else {
$page_number = 1;
}
$start = ($page_number - 1) * $numresults;
$pagetitle[] = "Eventlog"; $pagetitle[] = "Eventlog";
print_optionbar_start(); print_optionbar_start();
$where = "1";
if (is_numeric($_POST['device']))
{
$where .= ' AND E.host = ?';
$param[] = $_POST['device'];
}
if ($_POST['string'])
{
$where .= " AND E.message LIKE ?";
$param[] = "%".$_POST['string']."%";
}
?> ?>
<form method="post" action="" class="form-inline" role="form" id="result_form"> <form method="post" action="" class="form-inline" role="form" id="result_form">
<div class="form-group">
<input type="text" name="string" id="string" value="<?php echo($_POST['string']); ?>" placeholder="Search" class="form-control input-sm" />
</div>
<div class="form-group"> <div class="form-group">
<label> <label>
<strong>Device</strong> <strong>Device</strong>
@ -62,75 +35,39 @@ if ($_POST['string'])
?> ?>
</select> </select>
</div> </div>
<button type="submit" class="btn btn-default input-sm">Search</button> <button type="submit" class="btn btn-default input-sm">Filter</button>
</form>
<?php <?php
print_optionbar_end(); print_optionbar_end();
if ($_SESSION['userlevel'] >= '5')
{
$query = " FROM `eventlog` AS E WHERE $where ORDER BY `datetime` DESC";
} else {
$query = " FROM `eventlog` AS E, devices_perms AS P WHERE $where AND E.host = P.device_id AND P.user_id = ? ORDER BY `datetime` DESC";
$param[] = $_SESSION['user_id'];
}
$count_query = "SELECT COUNT(datetime) $query";
$count = dbFetchCell($count_query,$param);
$full_query = "SELECT *,DATE_FORMAT(datetime, '%D %b %Y %T') as humandate $query LIMIT $start,$numresults";
echo('<div class="panel panel-default panel-condensed">
<div class="panel-heading">
<div class="row">
<div class="col-md-2">
<strong>Eventlog entries</strong>
</div>
<div class="col-md-8" align="center">'. generate_pagination($count,$numresults,$page_number) .'</div>
<div class="col-md-2">
<select name="results" id="results" class="form-control input-sm" onChange="updateResults(this);">');
$result_options = array('10','50','100','250','500','1000','5000');
foreach($result_options as $option) {
echo "<option value='$option'";
if ($numresults == $option) {
echo " selected";
}
echo ">$option</option>";
}
echo('
</select>
</div>
</div>
</div>
</div>
<table class="table table-hover table-condensed table-striped">');
foreach (dbFetchRows($full_query, $param) as $entry)
{
include("includes/print-event.inc.php");
}
if ($count % $numresults > 0) {
echo(' <tr>
<td colspan="6" align="center">'. generate_pagination($count,$numresults,$page_number) .'</td>
</tr>');
}
echo('</table>
<input type="hidden" name="page_number" id="page_number" value="'.$page_number.'">
<input type="hidden" name="results_amount" id="results_amount" value="'.$numresults.'">
</form>');
?> ?>
<script type="text/javascript"> <table id="eventlog" class="table table-hover table-condensed table-striped">
function updateResults(results) { <thead>
$('#results_amount').val(results.value); <tr>
$('#page_number').val(1); <th data-column-id="datetime" data-order="desc">Datetime</th>
$('#result_form').submit(); <th data-column-id="hostname">Hostname</th>
} <th data-column-id="type">Type</th>
<th data-column-id="message">Message</th>
function changePage(page,e) { </tr>
e.preventDefault(); </thead>
$('#page_number').val(page); </table>
$('#result_form').submit();
} <script>
var grid = $("#eventlog").bootgrid({
ajax: true,
post: function ()
{
return {
id: "eventlog",
string: '<?php echo $_POST['string']; ?>',
device: '<?php echo $_POST['device']; ?>'
};
},
url: "/ajax_table.php"
});
</script> </script>

View File

@ -1,36 +1,27 @@
<?php <?php
$no_refresh = TRUE;
if ($_SESSION['userlevel'] >= '10') {
$sql = "SELECT D.device_id,D.hostname, D.last_polled, D.last_polled_timetaken FROM devices AS D WHERE D.status ='1' AND D.ignore='0' AND D.disabled='0' ORDER BY hostname";
$result = mysql_query($sql);
}
else {
$sql = "SELECT D.device_id,D.hostname, D.last_polled, D.last_polled_timetaken FROM devices AS D, devices_perms AS P WHERE D.status ='1' AND D.ignore='0' AND D.disabled='0' AND D.device_id = P.device_id AND P.user_id = '" . $_SESSION['user_id'] . "' AND D.ignore = '0' ORDER BY hostname";
$result = mysql_query($sql);
}
echo "
<table class='table table-bordered table-condensed table-hover'>
<thead>
<tr>
<th>Hostname</th>
<th>Last Polled</th>
<th>Polling Duration(Seconds)</th>
</tr>
</thead>
<tbody>";
foreach(dbFetchRows($sql) as $device) {
if ($device['last_polled_timetaken'] < 180 ) {
$tr_class = NULL;
}
elseif ($device['last_polled_timetaken'] < 300 ) {
$tr_class = ' class="warning"';
}
elseif ($device['last_polled_timetaken'] >= 300 ) {
$tr_class = ' class="danger"';
}
echo "<tr" .$tr_class. "><td><a class='list-device' href='" .generate_device_url($device, array('tab' => 'graphs', 'group' => 'poller')). "'>" .$device['hostname']. "</a><td>" .$device['last_polled']. "<td>" .$device['last_polled_timetaken']. "</tr>";
}
echo "</tbody></table>";
?> ?>
<table id="poll-log" class="table table-condensed table-hover table-striped">
<thead>
<tr>
<th data-column-id="hostname">Hostname</th>
<th data-column-id="last_polled">Last Polled</th>
<th data-column-id="last_polled_timetaken" data-order="desc">Polling Duration (Seconds)</th>
</tr>
</thead>
</table>
<script>
var grid = $("#poll-log").bootgrid({
ajax: true,
post: function ()
{
return {
id: "poll-log"
};
},
url: "/ajax_table.php"
});
</script>

View File

@ -485,6 +485,7 @@
item = $(tpl.paginationItem.resolve(values)) item = $(tpl.paginationItem.resolve(values))
.on("click" + namespace, getCssSelector(css.paginationButton), function (e) .on("click" + namespace, getCssSelector(css.paginationButton), function (e)
{ {
e.preventDefault();
e.stopPropagation(); e.stopPropagation();
var $this = $(this), var $this = $(this),
@ -1745,4 +1746,4 @@
// ============ // ============
$("[data-toggle=\"bootgrid\"]").bootgrid(); $("[data-toggle=\"bootgrid\"]").bootgrid();
})(jQuery, window); })(jQuery, window);

File diff suppressed because one or more lines are too long