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/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 e4655ea6f8..3928c06102 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 e11b6e5f47..49f505936e 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 aedf50ac24..741e68b627 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 0932befe97..cfe53407db 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 e3c3064bc9..1e93d2ca56 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 d639c1fa6d..2aa489a0b3 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 d236c66836..0f1329e846 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 8ad4d3ca67..284a0a93e9 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 d688921473..464bbd0212 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 b541ae3604..c29be76d8d 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 445a72cdaf..daf5f13463 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 d613c169dc..2e813ffa7c 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 2bc50e70dd..6dec2ea794 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 b2dea844d6..af7d017b36 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 36110e23f9..5df42fdd46 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 4eb40e2d60..ed38aeff4c 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 {