Skip to content
This repository has been archived by the owner on Mar 19, 2021. It is now read-only.

Commit

Permalink
Dashboard: Replace datatable with bootstrap-table-extension
Browse files Browse the repository at this point in the history
  • Loading branch information
@fbergkemper
fbergkemper committed May 30, 2017
1 parent 1b8f69b commit 19cea23
Show file tree
Hide file tree
Showing 2 changed files with 84 additions and 54 deletions.
109 changes: 58 additions & 51 deletions module/Dashboard/view/dashboard/dashboard/index.phtml
View file
Expand Up @@ -45,10 +45,11 @@ $this->headTitle($title);
</div>

<?php
echo $this->headScript()->prependFile($this->basePath() . '/js/datatables.plugins.js');
echo $this->headScript()->prependFile($this->basePath() . '/js/datatables.functions.js');
echo $this->headScript()->prependFile($this->basePath() . '/js/datatables.min.js');
echo $this->headLink()->prependStylesheet($this->basePath() . '/css/datatables.min.css');
echo $this->headLink()->prependStylesheet($this->basePath() . '/css/bootstrap-table.min.css');
echo $this->headScript()->prependFile($this->basePath() . '/js/bootstrap-table-locale-all.min.js');
echo $this->headScript()->prependFile($this->basePath() . '/js/bootstrap-table-cookie.min.js');
echo $this->headScript()->prependFile($this->basePath() . '/js/bootstrap-table.min.js');
?>

<script type="text/javascript">
Expand Down Expand Up @@ -139,69 +140,75 @@ $this->headTitle($title);
}

function getJobsLastStatus() {
table_jobs_last_status = $('#jobs-last-status').DataTable({
"ajax": {
"url": "<?php echo $this->url('dashboard', array('action' => 'getData'), null) . '?data=jobslaststatus'; ?>",
"dataSrc": ""
},
"language": {
"url": "<?php echo $this->basePath() . '/js/dataTables/language/'; ?>" + getLocale('<?php echo $_SESSION['bareos']['locale']; ?>')
},
"columns" : [
{ "data": "name" },
{ "data": "jobstatus" },
{ "data": "jobid" },
{ "data": "client" },
{ "data": "level" },
{ "data": "starttime" },
{ "data": "endtime" },
{ "data": "jobbytes", "type": "file-size" }
],
"paging": true,
"pagingType": "full_numbers",
"lengthMenu": [ <?php echo $_SESSION['bareos']['dt_lengthmenu']; ?> ],
"pageLength": <?php echo $_SESSION['bareos']['dt_pagelength']; ?>,
"stateSave": <?php echo $_SESSION['bareos']['dt_statesave']; ?>,
"ordering": true,
"info": true,
"order": [[2, 'desc']],
"columnDefs": [
table_jobs_last_status = $('#jobs-last-status').bootstrapTable({
locale: '<?php echo str_replace('_','-', $_SESSION['bareos']['locale']); ?>',
cookie: <?php echo $_SESSION['bareos']['dt_statesave']; ?>,
cookieIdTable: 'dashboard_table_jobs_last_status',
url: '<?php echo $this->url('dashboard', array('action' => 'getData'), null) . '?data=jobslaststatus'; ?>',
method: 'get',
dataType: 'json',
pagination : true,
sidePagination: 'client',
pageList: [ <?php echo $_SESSION['bareos']['dt_lengthmenu']; ?> ],
pageSize: <?php echo $_SESSION['bareos']['dt_pagelength']; ?>,
search: true,
showToggle: true,
showPaginationSwitch: true,
showColumns: true,
sortName: 'jobid',
sortOrder: 'desc',
columns: [
{
"targets": 0,
"render": function(data, type, full, meta) {
return '<a href="<?php echo $this->basePath() . '/job/index?jobname='; ?>'+data+'">'+data+'</a>';
field: 'name',
sortable: true,
formatter: function(value){
return '<a href="<?php echo $this->basePath() . '/job/index?jobname='; ?>'+value+'">'+value+'</a>';
}
},
{
"targets": 1,
"render": function(data, type, full, meta) {
return formatJobStatus(data);
field: 'jobstatus',
align: 'center',
sortable: true,
formatter: function(value, row, index) {
return formatJobStatus(value);
}
},
{
"targets": 2,
"render": function(data, type, full, meta) {
return '<a href="<?php echo $this->basePath() . '/job/details/'; ?>'+data+'">'+data+'</a>';
field: 'jobid',
sortable: true,
formatter: function(value) {
return '<a href="<?php echo $this->basePath() . '/job/details/'; ?>'+value+'">'+value+'</a>';
}
},
{
"targets": 3,
"render": function(data, type, full, meta) {
return '<a href="<?php echo $this->basePath() . '/client/details/'; ?>'+data+'">'+data+'</a>';
field: 'client',
sortable: true,
formatter: function(value) {
return '<a href="<?php echo $this->basePath() . '/client/details/'; ?>'+value+'">'+value+'</a>';
}
},
{
"targets": 4,
"render": function(data, type, full, meta) {
return formatJobLevel(data);
field: 'level',
sortable: true,
formatter: function(value) {
return formatJobLevel(value);
}
},
{
"targets": 7,
"render": function(data, type, full, meta) {
return formatBytes(data);
field: 'starttime',
sortable: true,
},
{
field: 'endtime',
sortable: true,
},
{
field: 'jobbytes',
sortable: true,
formatter: function(value) {
return formatBytes(value);
}
}
},
]
});
}
Expand Down Expand Up @@ -260,7 +267,7 @@ $this->headTitle($title);
getRunningJobs();
getJobsPast24h();
getJobTotals();
table_jobs_last_status.ajax.reload( null, false );
$('#jobs-last-status').bootstrapTable('refresh');
}

$(document).ready(
Expand All @@ -278,7 +285,7 @@ $this->headTitle($title);
setInterval('getJobTotals()', <?php echo $_SESSION['bareos']['dashboard_autorefresh_interval']; ?>);

getJobsLastStatus();
setInterval( function () { table_jobs_last_status.ajax.reload( null, false ); }, <?php echo $_SESSION['bareos']['dashboard_autorefresh_interval']; ?>);
setInterval( "$('#jobs-last-status').bootstrapTable('refresh')", <?php echo $_SESSION['bareos']['dashboard_autorefresh_interval']; ?>);
}
);

Expand Down
29 changes: 26 additions & 3 deletions module/Dashboard/view/partial/JobsLastStatus.phtml
View file
Expand Up @@ -5,9 +5,8 @@
* bareos-webui - Bareos Web-Frontend
*
* @link https://github.com/bareos/bareos-webui for the canonical source repository
* @copyright Copyright (c) 2013-2016 Bareos GmbH & Co. KG (http://www.bareos.org/)
* @copyright Copyright (c) 2013-2017 Bareos GmbH & Co. KG (http://www.bareos.org/)
* @license GNU Affero General Public License (http://www.gnu.org/licenses/)
* @author Frank Bergkemper
*
* This program is free software: you can redistribute it and/or modify
* it under the terms of the GNU Affero General Public License as published by
Expand Down Expand Up @@ -35,9 +34,10 @@
</div>

<div class="panel-body">
<table class="table table-hover" id="jobs-last-status">
<table class="table table-no-bordered table-hover" id="jobs-last-status">
<thead class="bg-primary">
<th><?php echo $this->translate("Job name"); ?></th>
<!-- <th data-cell-style="cellStyle"><?php echo $this->translate("Status"); ?></th> -->
<th><?php echo $this->translate("Status"); ?></th>
<th><?php echo $this->translate("Job ID"); ?></th>
<th><?php echo $this->translate("Client"); ?></th>
Expand All @@ -50,3 +50,26 @@
</div>

</div>

<script>

/*
function cellStyle(value, row, index) {
var classes = ['active', 'success', 'info', 'warning', 'danger'];
switch(value) {
case "T":
return { classes: classes[1] };
case "f":
case "E":
return { classes: classes[4] };
case "W":
return { classes: classes[3] };
case "R":
return { classes: classes[2] };
default:
return {};
}
}
*/

</script>

0 comments on commit 19cea23

Please sign in to comment.