Merge pull request #5129 from TDT-AG/pr/20210616-luci-app-nlbwmon

luci-app-nlbwmon: fix url and clean up the ui buttons

3 files changed, 60 insertions, 37 deletions

diff --git a/applications/luci-app-nlbwmon/htdocs/luci-static/resources/view/nlbw/backup.js b/applications/luci-app-nlbwmon/htdocs/luci-static/resources/view/nlbw/backup.js
index c5fcfe5cf8..0b13e6fdf2 100644
--- a/applications/luci-app-nlbwmon/htdocs/luci-static/resources/view/nlbw/backup.js
+++ b/applications/luci-app-nlbwmon/htdocs/luci-static/resources/view/nlbw/backup.js
@@ -52,12 +52,14 @@ return view.extend({
 			E('h5', [ _('Restore Database Backup') ]),
 			E('p', [
 				E('button', {
+					'class': 'cbi-button',
 					'click': ui.createHandlerFn(this, 'handleArchiveUpload')
 				}, [ _('Restore') ])
 			]),
 			E('h5', [ _('Download Database Backup') ]),
 			E('p', [
 				E('button', {
+					'class': 'cbi-button',
 					'click': ui.createHandlerFn(this, 'handleArchiveDownload', hostname)
 				}, [ _('Generate Backup') ])
 			])
diff --git a/applications/luci-app-nlbwmon/htdocs/luci-static/resources/view/nlbw/config.js b/applications/luci-app-nlbwmon/htdocs/luci-static/resources/view/nlbw/config.js
index cb13eeccec..3f0a4c969f 100644
--- a/applications/luci-app-nlbwmon/htdocs/luci-static/resources/view/nlbw/config.js
+++ b/applications/luci-app-nlbwmon/htdocs/luci-static/resources/view/nlbw/config.js
@@ -73,7 +73,7 @@ return view.extend({
 		o.value('absolute', _('Fixed interval'));
 
 		o = s.taboption('general', form.DummyValue, '_warning', _('Warning'));
-		o.default = _('Changing the accounting interval type will invalidate existing databases!<br /><strong><a href="%s">Download backup</a></strong>.').format(L.url('admin/nlbw/backup'));
+		o.default = _('Changing the accounting interval type will invalidate existing databases!<br /><strong><a href="%s">Download backup</a></strong>.').format(L.url('admin/services/nlbw/backup'));
 		o.rawhtml = true;
 		if (/^[0-9]{4}-[0-9]{2}-[0-9]{2}\/[0-9]+$/.test(uci.get_first('nlbwmon', 'nlbwmon', 'database_interval')))
 			o.depends('_period', 'relative');
diff --git a/applications/luci-app-nlbwmon/htdocs/luci-static/resources/view/nlbw/display.js b/applications/luci-app-nlbwmon/htdocs/luci-static/resources/view/nlbw/display.js
index ccef949fb0..a13c86b29b 100644
--- a/applications/luci-app-nlbwmon/htdocs/luci-static/resources/view/nlbw/display.js
+++ b/applications/luci-app-nlbwmon/htdocs/luci-static/resources/view/nlbw/display.js
@@ -359,13 +359,7 @@ return view.extend({
 			conn_total += rec.conns;
 		}
 
-		cbi_update_table('#host-data', rows, E('em', [
-			_('No data recorded yet.'), ' ',
-			E('a', {
-				'href': '#',
-				'click': ui.createHandlerFn(this, 'handleCommit')
-			}, _('Force reload…'))
-		]));
+		cbi_update_table('#host-data', rows, E('em', _('No data recorded yet.')));
 
 		this.pie('traf-pie', trafData);
 		this.pie('conn-pie', connData);
@@ -419,10 +413,7 @@ return view.extend({
 			}
 		}
 
-		cbi_update_table('#layer7-data', rows, E('em', [
-			_('No data recorded yet.'), ' ',
-			E('a', { 'href': L.url('admin/nlbw/commit') }, _('Force reload…'))
-		]));
+		cbi_update_table('#layer7-data', rows, E('em', 	_('No data recorded yet.')));
 
 		this.pie('layer7-rx-pie', rxData);
 		this.pie('layer7-tx-pie', txData);
@@ -523,10 +514,7 @@ return view.extend({
 			]);
 		}
 
-		cbi_update_table('#ipv6-data', rows, E('em', [
-			_('No data recorded yet.'), ' ',
-			E('a', { 'href': L.url('admin/nlbw/commit') }, _('Force reload…'))
-		]));
+		cbi_update_table('#ipv6-data', rows, E('em', _('No data recorded yet.')));
 
 		var shareData = [], hostsData = [];
 
@@ -856,6 +844,13 @@ return view.extend({
 								E('em', { 'class': 'spinning' }, [ _('Collecting data...') ])
 							])
 						])
+					]),
+					E('div', { 'class': 'right' }, [
+						E('button', {
+							'class': 'cbi-button',
+							'click': ui.createHandlerFn(this, 'handleCommit')
+							}, _('Force reload…')
+						)
 					])
 				]),
 
@@ -895,6 +890,13 @@ return view.extend({
 								E('em', { 'class': 'spinning' }, [ _('Collecting data...') ])
 							])
 						])
+					]),
+					E('div', { 'class': 'right' }, [
+						E('button', {
+							'class': 'cbi-button',
+							'click': ui.createHandlerFn(this, 'handleCommit')
+							}, _('Force reload…')
+						)
 					])
 				]),
 
@@ -935,34 +937,53 @@ return view.extend({
 								E('em', { 'class': 'spinning' }, [ _('Collecting data...') ])
 							])
 						])
+					]),
+					E('div', { 'class': 'right' }, [
+						E('button', {
+							'class': 'cbi-button',
+							'click': ui.createHandlerFn(this, 'handleCommit')
+							}, _('Force reload…')
+						)
 					])
 				]),
 
 				E('div', { 'class': 'cbi-section', 'data-tab': 'export', 'data-tab-title': _('Export') }, [
-					E('ul', [
-						E('li', [
-							E('a', {
-								'href': '#',
-								'click': ui.createHandlerFn(this, 'handleDownload', 'csv', 'mac', '-rx,-tx')
-							}, [ _('CSV, grouped by MAC') ])
+					E('div', { 'class': 'cbi-section-node cbi-sction-node-tabbed' }, [
+						E('div', { 'class': 'cbi-value' }, [
+							E('label', { 'class': 'cbi-value-title' }, _('Grouped by MAC (CSV)')),
+							E('div', { 'class': 'cbi-value-field' }, [
+								E('button', {
+									'class': 'cbi-button',
+									'click': ui.createHandlerFn(this, 'handleDownload', 'csv', 'mac', '-rx,-tx')
+								}, [ _('Export') ])
+							])
 						]),
-						E('li', [
-							E('a', {
-								'href': '#',
-								'click': ui.createHandlerFn(this, 'handleDownload', 'csv', 'ip', '-rx,-tx')
-							}, [ _('CSV, grouped by IP') ])
+						E('div', { 'class': 'cbi-value' }, [
+							E('label', { 'class': 'cbi-value-title' }, _('Grouped by IP (CSV)')),
+							E('div', { 'class': 'cbi-value-field' }, [
+								E('button', {
+									'class': 'cbi-button',
+									'click': ui.createHandlerFn(this, 'handleDownload', 'csv', 'ip', '-rx,-tx')
+								}, [ _('Export') ])
+							])
 						]),
-						E('li', [
-							E('a', {
-								'href': '#',
-								'click': ui.createHandlerFn(this, 'handleDownload', 'csv', 'layer7', '-rx,-tx')
-							}, [ _('CSV, grouped by protocol') ])
+						E('div', { 'class': 'cbi-value' }, [
+							E('label', { 'class': 'cbi-value-title' }, _('Grouped by protocol (CSV)')),
+							E('div', { 'class': 'cbi-value-field' }, [
+								E('button', {
+									'class': 'cbi-button',
+									'click': ui.createHandlerFn(this, 'handleDownload', 'csv', 'layer7', '-rx,-tx')
+								}, [ _('Export') ])
+							])
 						]),
-						E('li', [
-							E('a', {
-								'href': '#',
-								'click': ui.createHandlerFn(this, 'handleDownload', 'json', null, null)
-							}, [ _('JSON dump') ])
+						E('div', { 'class': 'cbi-value' }, [
+							E('label', { 'class': 'cbi-value-title' }, _('Dump (JSON)')),
+							E('div', { 'class': 'cbi-value-field' }, [
+								E('button', {
+									'class': 'cbi-button',
+									'click': ui.createHandlerFn(this, 'handleDownload', 'json', null, null)
+								}, [ _('Export') ])
+							])
 						])
 					])
 				])