From: Marcin Haba Date: Thu, 8 Jul 2021 18:52:23 +0000 (+0200) Subject: baculum: Make job status pie chart clickable and direct to job history page with... X-Git-Tag: Release-11.3.2~194 X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=25515fe455affe37245824418cacddffd4cbed64;p=thirdparty%2Fbacula.git baculum: Make job status pie chart clickable and direct to job history page with filtered results - idea proposed by Bill Arlofski --- diff --git a/gui/baculum/protected/Web/JavaScript/graph.js b/gui/baculum/protected/Web/JavaScript/graph.js index e4655ea6f..3928c0610 100644 --- a/gui/baculum/protected/Web/JavaScript/graph.js +++ b/gui/baculum/protected/Web/JavaScript/graph.js @@ -1247,7 +1247,7 @@ var GraphPieClass = jQuery.klass({ outlineWidth: 0, color: 'black' }, - xaxis: { showLabels : false,}, + xaxis: { showLabels : false }, yaxis: { showLabels : false }, pie: { show : true, @@ -1263,15 +1263,18 @@ var GraphPieClass = jQuery.klass({ position : 'sw' }, legend: { + noColumns: 3, position : 'se', backgroundColor : '#D2E8FF', - margin: 0 + margin: 0, + labelFormatter: PieGraph.pie_legend_formatter.bind(PieGraph) } }, initialize: function(prop) { this.jobs = prop.jobs; this.title = prop.hasOwnProperty('title') ? prop.title : null; this.container = document.getElementById(prop.container_id); + this.legend_container = prop.hasOwnProperty('legend_container_id') ? $('#' + prop.legend_container_id) : null; this.series = this.prepare_series(); this.draw_grah(); }, @@ -1299,7 +1302,15 @@ var GraphPieClass = jQuery.klass({ if (this.title) { graph_options.title = this.title; } + if (this.legend_container) { + graph_options.legend.container = this.legend_container; + } this.pie = Flotr.draw(this.container, this.series, graph_options); + Flotr.EventAdapter.observe(this.container, 'flotr:click', PieGraph.pie_mouse_handler.bind(PieGraph)); + }, + destroy: function() { + Flotr.EventAdapter.stopObserving(this.container, 'flotr:click'); + this.pie.destroy(); } }); diff --git a/gui/baculum/protected/Web/JavaScript/misc.js b/gui/baculum/protected/Web/JavaScript/misc.js index e11b6e5f4..49f505936 100644 --- a/gui/baculum/protected/Web/JavaScript/misc.js +++ b/gui/baculum/protected/Web/JavaScript/misc.js @@ -251,6 +251,23 @@ var PieGraph = { }, pie_track_formatter: function(e) { return e.series.label; + }, + pie_legend_formatter: function(label) { + var type = label.split(' ')[0]; + var a = document.createElement('A'); + a.href = this.get_addr_by_type(type); + a.className = 'raw'; + text = document.createTextNode(label); + a.appendChild(text); + return a.outerHTML; + }, + pie_mouse_handler: function(e) { + var type = e.hit.series.label.split(' ')[0]; + window.location.href = this.get_addr_by_type(type); + return false; + }, + get_addr_by_type: function(type) { + return '/web/job/history/?type=' + type; } } @@ -792,6 +809,7 @@ var Dashboard = { stats: null, txt: null, pie: null, + txt: null, noval: '-', ids: { clients: { @@ -817,7 +835,10 @@ var Dashboard = { most: 'pool_most', jobs: 'pool_jobs' }, - pie_summary: 'jobs_summary_graph' + pie_summary: { + container_id: 'jobs_summary_graph', + legend_container_id: 'jobs_summary_legend' + } }, last_jobs_table: null, dbtype: { @@ -825,6 +846,9 @@ var Dashboard = { mysql: 'MySQL', sqlite: 'SQLite' }, + set_text: function(txt) { + this.txt = txt; + }, update_all: function(statistics) { this.stats = statistics; this.update_pie_jobstatus(); @@ -912,11 +936,13 @@ var Dashboard = { }, update_pie_jobstatus: function() { if (this.pie != null) { - this.pie.pie.destroy(); + this.pie.destroy(); } this.pie = new GraphPieClass({ jobs: this.stats.jobs_summary, - container_id: this.ids.pie_summary + container_id: this.ids.pie_summary.container_id, + legend_container_id: this.ids.pie_summary.legend_container_id, + title: this.txt.js_sum_title }); } }; diff --git a/gui/baculum/protected/Web/Lang/en/messages.mo b/gui/baculum/protected/Web/Lang/en/messages.mo index aedf50ac2..741e68b62 100644 Binary files a/gui/baculum/protected/Web/Lang/en/messages.mo and b/gui/baculum/protected/Web/Lang/en/messages.mo differ diff --git a/gui/baculum/protected/Web/Lang/en/messages.po b/gui/baculum/protected/Web/Lang/en/messages.po index 0932befe9..cfe53407d 100644 --- a/gui/baculum/protected/Web/Lang/en/messages.po +++ b/gui/baculum/protected/Web/Lang/en/messages.po @@ -3397,3 +3397,24 @@ msgstr "Console details" msgid "Configure console" msgstr "Configure console" + +msgid "Mode:" +msgstr "Mode:" + +msgid "Reset table mode" +msgstr "Reset table mode" + +msgid "Jobs terminated normally" +msgstr "Jobs terminated normally" + +msgid "Jobs with warning" +msgstr "Jobs with warning" + +msgid "Jobs finished with error" +msgstr "Jobs finished with error" + +msgid "Jobs running" +msgstr "Jobs running" + +msgid "Jobs canceled" +msgstr "Jobs canceled" diff --git a/gui/baculum/protected/Web/Lang/ja/messages.mo b/gui/baculum/protected/Web/Lang/ja/messages.mo index e3c3064bc..1e93d2ca5 100644 Binary files a/gui/baculum/protected/Web/Lang/ja/messages.mo and b/gui/baculum/protected/Web/Lang/ja/messages.mo differ diff --git a/gui/baculum/protected/Web/Lang/ja/messages.po b/gui/baculum/protected/Web/Lang/ja/messages.po index d639c1fa6..2aa489a0b 100644 --- a/gui/baculum/protected/Web/Lang/ja/messages.po +++ b/gui/baculum/protected/Web/Lang/ja/messages.po @@ -3483,3 +3483,24 @@ msgstr "Console details" msgid "Configure console" msgstr "Configure console" + +msgid "Mode:" +msgstr "Mode:" + +msgid "Reset table mode" +msgstr "Reset table mode" + +msgid "Jobs terminated normally" +msgstr "Jobs terminated normally" + +msgid "Jobs with warning" +msgstr "Jobs with warning" + +msgid "Jobs finished with error" +msgstr "Jobs finished with error" + +msgid "Jobs running" +msgstr "Jobs running" + +msgid "Jobs canceled" +msgstr "Jobs canceled" diff --git a/gui/baculum/protected/Web/Lang/pl/messages.mo b/gui/baculum/protected/Web/Lang/pl/messages.mo index d236c6683..0f1329e84 100644 Binary files a/gui/baculum/protected/Web/Lang/pl/messages.mo and b/gui/baculum/protected/Web/Lang/pl/messages.mo differ diff --git a/gui/baculum/protected/Web/Lang/pl/messages.po b/gui/baculum/protected/Web/Lang/pl/messages.po index 8ad4d3ca6..284a0a93e 100644 --- a/gui/baculum/protected/Web/Lang/pl/messages.po +++ b/gui/baculum/protected/Web/Lang/pl/messages.po @@ -3407,3 +3407,24 @@ msgstr "Szczegóły konsoli" msgid "Configure console" msgstr "Konfiguruj konsolę" + +msgid "Mode:" +msgstr "Tryb:" + +msgid "Reset table mode" +msgstr "Resetuj tryb tabeli" + +msgid "Jobs terminated normally" +msgstr "Zadania zakończone normalnie" + +msgid "Jobs with warning" +msgstr "Zadania z ostrzeżeniami" + +msgid "Jobs finished with error" +msgstr "Zadania zakończone z błędem" + +msgid "Jobs running" +msgstr "Zadania uruchomione" + +msgid "Jobs canceled" +msgstr "Zadania anulowane" diff --git a/gui/baculum/protected/Web/Lang/pt/messages.mo b/gui/baculum/protected/Web/Lang/pt/messages.mo index d68892147..464bbd021 100644 Binary files a/gui/baculum/protected/Web/Lang/pt/messages.mo and b/gui/baculum/protected/Web/Lang/pt/messages.mo differ diff --git a/gui/baculum/protected/Web/Lang/pt/messages.po b/gui/baculum/protected/Web/Lang/pt/messages.po index b541ae360..c29be76d8 100644 --- a/gui/baculum/protected/Web/Lang/pt/messages.po +++ b/gui/baculum/protected/Web/Lang/pt/messages.po @@ -3408,3 +3408,23 @@ msgstr "Detalhes do console" msgid "Configure console" msgstr "Configurar console" +msgid "Mode:" +msgstr "Mode:" + +msgid "Reset table mode" +msgstr "Reset table mode" + +msgid "Jobs terminated normally" +msgstr "Jobs terminated normally" + +msgid "Jobs with warning" +msgstr "Jobs with warning" + +msgid "Jobs finished with error" +msgstr "Jobs finished with error" + +msgid "Jobs running" +msgstr "Jobs running" + +msgid "Jobs canceled" +msgstr "Jobs canceled" diff --git a/gui/baculum/protected/Web/Lang/ru/messages.mo b/gui/baculum/protected/Web/Lang/ru/messages.mo index 445a72cda..daf5f1346 100644 Binary files a/gui/baculum/protected/Web/Lang/ru/messages.mo and b/gui/baculum/protected/Web/Lang/ru/messages.mo differ diff --git a/gui/baculum/protected/Web/Lang/ru/messages.po b/gui/baculum/protected/Web/Lang/ru/messages.po index d613c169d..2e813ffa7 100644 --- a/gui/baculum/protected/Web/Lang/ru/messages.po +++ b/gui/baculum/protected/Web/Lang/ru/messages.po @@ -3399,6 +3399,26 @@ msgstr "Графический статус клиента поддержива msgid "Status request timed out. The most probably the Bacula director is not available or it is not running." msgstr "Истекло время ожидания запроса. Вероятно, клиент Bacula не доступен или не запущен." +msgid "Mode:" +msgstr "Mode:" + +msgid "Reset table mode" +msgstr "Reset table mode" + +msgid "Jobs terminated normally" +msgstr "Jobs terminated normally" + +msgid "Jobs with warning" +msgstr "Jobs with warning" + +msgid "Jobs finished with error" +msgstr "Jobs finished with error" + +msgid "Jobs running" +msgstr "Jobs running" + +msgid "Jobs canceled" +msgstr "Jobs canceled" msgid "To use the console page please configure bbconsjson binary file path on the API side." msgstr "Чтобы использовать страницу консоли, настройте путь к бинарным файлам bbconsjson на стороне API." diff --git a/gui/baculum/protected/Web/Layouts/Main.tpl b/gui/baculum/protected/Web/Layouts/Main.tpl index 2bc50e70d..6dec2ea79 100644 --- a/gui/baculum/protected/Web/Layouts/Main.tpl +++ b/gui/baculum/protected/Web/Layouts/Main.tpl @@ -113,6 +113,9 @@ $(function() { oData = response; if ('<%=get_class($this->Service->getRequestedPage())%>' == 'Dashboard') { Statistics.grab_statistics(oData, JobStatus.get_states()); + Dashboard.set_text({ + js_sum_title: '<%[ Job status summary ]%>' + }); Dashboard.update_all(Statistics); } diff --git a/gui/baculum/protected/Web/Pages/Dashboard.page b/gui/baculum/protected/Web/Pages/Dashboard.page index b2dea844d..af7d017b3 100644 --- a/gui/baculum/protected/Web/Pages/Dashboard.page +++ b/gui/baculum/protected/Web/Pages/Dashboard.page @@ -63,9 +63,9 @@
-
<%[ Job status summary ]%>
+
diff --git a/gui/baculum/protected/Web/Pages/JobHistoryList.page b/gui/baculum/protected/Web/Pages/JobHistoryList.page index 36110e23f..5df42fdd4 100644 --- a/gui/baculum/protected/Web/Pages/JobHistoryList.page +++ b/gui/baculum/protected/Web/Pages/JobHistoryList.page @@ -189,7 +189,8 @@ var oJobHistoryList = { ], ids: { job_list: 'job_list', - job_list_body: 'job_list_body' + job_list_body: 'job_list_body', + table_mode: 'table_mode' }, data: [], table: null, @@ -201,6 +202,7 @@ var oJobHistoryList = { this.set_table(); this.set_bulk_actions(); this.set_events(); + this.set_filters(); } }, set_events: function() { @@ -221,7 +223,7 @@ var oJobHistoryList = { this.table = $('#' + this.ids.job_list).DataTable({ data: this.data, deferRender: true, - dom: 'lB<"table_toolbar">frtip', + dom: 'lB<"table_toolbar"><"#table_mode">frtip', stateSave: true, buttons: [ 'copy', 'csv', 'colvis' @@ -439,7 +441,7 @@ var oJobHistoryList = { .search(val ? '^' + val + '$' : '', true, false) .draw(); }); - if (column[0][0] == 14) { + if (column[0][0] == 14) { // NOTE: this column is used also in filters (@see oJobHistoryList.set_mode()) column.data().unique().sort().each(function (d, j) { if (column.search() == '^' + dtEscapeRegex(d) + '$') { select.append(''); @@ -465,6 +467,80 @@ var oJobHistoryList = { actions: '<%[ Actions ]%>', ok: '<%[ OK ]%>' }); + }, + set_mode: function(type) { + var types = { + ok: '<%[ Jobs terminated normally ]%>', + warning: '<%[ Jobs with warning ]%>', + error: '<%[ Jobs finished with error ]%>', + running: '<%[ Jobs running ]%>', + cancel: '<%[ Jobs canceled ]%>' + } + var container = document.getElementById(this.ids.table_mode); + var mode = document.createTextNode(' <%[ Mode: ]%> ' + types[type] + ' '); + container.appendChild(mode); + var label = document.createTextNode(' <%[ Reset table mode ]%>'); + var a = document.createElement('A'); + a.className = 'w3-button w3-green'; + a.href = 'javascript:void(0)'; + a.addEventListener('click', function(e) { + $.fn.dataTable.ext.search.pop(); + this.table.columns().search('').draw(); + container.style.display = 'none'; + }.bind(this)); + var img = document.createElement('I'); + img.className = 'fas fa-sync-alt'; + a.appendChild(img); + a.appendChild(label); + container.appendChild(a); + }, + set_filters: function() { + var jss = ''; + var type = get_url_param('type'); + var search_func; + switch (type) { + case 'ok': + search_func = function(settings, search_data, index, row_data, counter) { + var jobstatus = search_data[14]; + var joberrors = search_data[18]; + return (JobStatus.is_ok(jobstatus) && joberrors == 0); + }; + break; + case 'error': + search_func = function(settings, search_data, index, row_data, counter) { + var jobstatus = search_data[14]; + return JobStatus.is_error(jobstatus); + }; + break; + case 'warning': + search_func = function(settings, search_data, index, row_data, counter) { + var jobstatus = search_data[14]; + var joberrors = search_data[18]; + return ((JobStatus.is_ok(jobstatus) && joberrors > 0) || JobStatus.is_warning(jobstatus)); + }; + break; + case 'cancel': + search_func = function(settings, search_data, index, row_data, counter) { + var jobstatus = search_data[14]; + return JobStatus.is_cancel(jobstatus); + }; + break; + case 'running': + search_func = function(settings, search_data, index, row_data, counter) { + var jobstatus = search_data[14]; + return (JobStatus.is_running(jobstatus) || JobStatus.is_waiting(jobstatus)); + }; + break; + } + var container = document.getElementById(this.ids.table_mode); + if (search_func) { + $.fn.dataTable.ext.search.push(search_func); + this.table.columns().search('').draw(); + this.set_mode(type); + container.style.display = ''; + } else { + container.style.display = 'none'; + } } }; MonitorParams = {jobs: null}; diff --git a/gui/baculum/themes/Baculum-v2/css/baculum.css b/gui/baculum/themes/Baculum-v2/css/baculum.css index 4eb40e2d6..ed38aeff4 100644 --- a/gui/baculum/themes/Baculum-v2/css/baculum.css +++ b/gui/baculum/themes/Baculum-v2/css/baculum.css @@ -6,6 +6,7 @@ #jobs_summary_graph { height: 380px; z-index: 0; + cursor: pointer; } .monospace {