feat: Add SecuBox portal header to luci-app-secubox views
- Added SbHeader require and wrapper pattern to all 11 view files - All views now display SecuBox portal header for consistent navigation - Maintains existing SecuNav tabs for internal navigation Views updated: - dashboard.js - alerts.js - apps.js - modules.js - modules-debug.js - modules-minimal.js - dev-status.js - settings.js - help.js - wizard.js - monitoring.js Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
parent
4b4d1be2f5
commit
666ad23767
@ -5,6 +5,7 @@
|
||||
'require secubox/api as API';
|
||||
'require secubox-theme/theme as Theme';
|
||||
'require secubox/nav as SecuNav';
|
||||
'require secubox-portal/header as SbHeader';
|
||||
'require poll';
|
||||
|
||||
// Load theme resources
|
||||
@ -74,7 +75,10 @@ return view.extend({
|
||||
});
|
||||
}, 30);
|
||||
|
||||
return container;
|
||||
var wrapper = E('div', { 'class': 'secubox-page-wrapper' });
|
||||
wrapper.appendChild(SbHeader.render());
|
||||
wrapper.appendChild(container);
|
||||
return wrapper;
|
||||
},
|
||||
|
||||
renderHeader: function() {
|
||||
|
||||
@ -6,6 +6,7 @@
|
||||
'require secubox-theme/theme as Theme';
|
||||
'require secubox/nav as SecuNav';
|
||||
'require secubox-theme/cascade as Cascade';
|
||||
'require secubox-portal/header as SbHeader';
|
||||
'require poll';
|
||||
|
||||
// Load global theme CSS
|
||||
@ -113,7 +114,10 @@ return view.extend({
|
||||
});
|
||||
}, 10);
|
||||
|
||||
return container;
|
||||
var wrapper = E('div', { 'class': 'secubox-page-wrapper' });
|
||||
wrapper.appendChild(SbHeader.render());
|
||||
wrapper.appendChild(container);
|
||||
return wrapper;
|
||||
},
|
||||
|
||||
renderHeader: function(apps) {
|
||||
|
||||
@ -6,6 +6,7 @@
|
||||
'require secubox/api as API';
|
||||
'require secubox-theme/theme as Theme';
|
||||
'require secubox/nav as SecuNav';
|
||||
'require secubox-portal/header as SbHeader';
|
||||
|
||||
// Load theme resources once
|
||||
document.head.appendChild(E('link', {
|
||||
@ -70,7 +71,10 @@ return view.extend({
|
||||
});
|
||||
}, 30);
|
||||
|
||||
return container;
|
||||
var wrapper = E('div', { 'class': 'secubox-page-wrapper' });
|
||||
wrapper.appendChild(SbHeader.render());
|
||||
wrapper.appendChild(container);
|
||||
return wrapper;
|
||||
},
|
||||
|
||||
renderHeader: function() {
|
||||
|
||||
@ -6,6 +6,7 @@
|
||||
'require secubox/api as API';
|
||||
'require secubox-theme/theme as Theme';
|
||||
'require secubox/nav as SecuNav';
|
||||
'require secubox-portal/header as SbHeader';
|
||||
|
||||
// Load theme resources
|
||||
document.head.appendChild(E('link', {
|
||||
@ -548,13 +549,18 @@ return view.extend({
|
||||
`)
|
||||
]);
|
||||
|
||||
return E('div', { 'class': 'secubox-dev-status-page' }, [
|
||||
var container = E('div', { 'class': 'secubox-dev-status-page' }, [
|
||||
E('link', { 'rel': 'stylesheet', 'href': L.resource('secubox-theme/core/variables.css') }),
|
||||
E('link', { 'rel': 'stylesheet', 'href': L.resource('secubox/common.css') }),
|
||||
SecuNav.renderTabs('dev-status'),
|
||||
this.renderHeader(),
|
||||
main
|
||||
]);
|
||||
|
||||
var wrapper = E('div', { 'class': 'secubox-page-wrapper' });
|
||||
wrapper.appendChild(SbHeader.render());
|
||||
wrapper.appendChild(container);
|
||||
return wrapper;
|
||||
},
|
||||
|
||||
renderHeader: function() {
|
||||
|
||||
@ -5,6 +5,7 @@
|
||||
'require secubox/help as Help';
|
||||
'require secubox-theme/theme as Theme';
|
||||
'require secubox/nav as SecuNav';
|
||||
'require secubox-portal/header as SbHeader';
|
||||
|
||||
// Load theme resources
|
||||
document.head.appendChild(E('link', {
|
||||
@ -43,7 +44,7 @@ return view.extend({
|
||||
var data = status || {};
|
||||
var helpPages = Help.getAllHelpPages();
|
||||
|
||||
return E('div', { 'class': 'secubox-help-page' }, [
|
||||
var container = E('div', { 'class': 'secubox-help-page' }, [
|
||||
E('link', { 'rel': 'stylesheet', 'href': L.resource('secubox-theme/core/variables.css') }),
|
||||
E('link', { 'rel': 'stylesheet', 'href': L.resource('secubox/common.css') }),
|
||||
SecuNav.renderTabs('help'),
|
||||
@ -52,6 +53,11 @@ return view.extend({
|
||||
this.renderSupportSection(),
|
||||
this.renderFooter()
|
||||
]);
|
||||
|
||||
var wrapper = E('div', { 'class': 'secubox-page-wrapper' });
|
||||
wrapper.appendChild(SbHeader.render());
|
||||
wrapper.appendChild(container);
|
||||
return wrapper;
|
||||
},
|
||||
|
||||
renderHeader: function(status) {
|
||||
|
||||
@ -4,6 +4,7 @@
|
||||
'require secubox-theme/theme as Theme';
|
||||
'require secubox/api as API';
|
||||
'require secubox/nav as SecuNav';
|
||||
'require secubox-portal/header as SbHeader';
|
||||
|
||||
// Load theme resources
|
||||
document.head.appendChild(E('link', {
|
||||
@ -49,13 +50,18 @@ return view.extend({
|
||||
var running = modules.filter(function(m) { return m.running; }).length;
|
||||
var installed = modules.filter(function(m) { return m.installed; }).length;
|
||||
|
||||
return E('div', { 'class': 'secubox-modules-debug' }, [
|
||||
var container = E('div', { 'class': 'secubox-modules-debug' }, [
|
||||
E('link', { 'rel': 'stylesheet', 'href': L.resource('secubox/common.css') }),
|
||||
E('link', { 'rel': 'stylesheet', 'href': L.resource('secubox/secubox.css') }),
|
||||
SecuNav.renderTabs('modules'),
|
||||
this.renderHeader(modules.length, running, installed),
|
||||
modules.length ? this.renderModuleGrid(modules) : this.renderEmptyState()
|
||||
]);
|
||||
|
||||
var wrapper = E('div', { 'class': 'secubox-page-wrapper' });
|
||||
wrapper.appendChild(SbHeader.render());
|
||||
wrapper.appendChild(container);
|
||||
return wrapper;
|
||||
},
|
||||
|
||||
renderHeader: function(total, running, installed) {
|
||||
|
||||
@ -3,6 +3,7 @@
|
||||
'require secubox-theme/theme as Theme';
|
||||
'require secubox/api as API';
|
||||
'require secubox/nav as SecuNav';
|
||||
'require secubox-portal/header as SbHeader';
|
||||
|
||||
// Load theme resources
|
||||
document.head.appendChild(E('link', {
|
||||
@ -34,7 +35,7 @@ return view.extend({
|
||||
render: function() {
|
||||
var status = this.statusData || {};
|
||||
|
||||
return E('div', { 'class': 'secubox-modules-minimal' }, [
|
||||
var container = E('div', { 'class': 'secubox-modules-minimal' }, [
|
||||
E('link', { 'rel': 'stylesheet', 'href': L.resource('secubox/common.css') }),
|
||||
E('link', { 'rel': 'stylesheet', 'href': L.resource('secubox/secubox.css') }),
|
||||
SecuNav.renderTabs('modules'),
|
||||
@ -61,6 +62,11 @@ return view.extend({
|
||||
])
|
||||
])
|
||||
]);
|
||||
|
||||
var wrapper = E('div', { 'class': 'secubox-page-wrapper' });
|
||||
wrapper.appendChild(SbHeader.render());
|
||||
wrapper.appendChild(container);
|
||||
return wrapper;
|
||||
},
|
||||
|
||||
renderHeaderChip: function(icon, label, value) {
|
||||
|
||||
@ -6,6 +6,7 @@
|
||||
'require secubox-theme/theme as Theme';
|
||||
'require secubox/nav as SecuNav';
|
||||
'require secubox-theme/cascade as Cascade';
|
||||
'require secubox-portal/header as SbHeader';
|
||||
'require poll';
|
||||
|
||||
// Load global theme CSS
|
||||
@ -106,7 +107,10 @@ return view.extend({
|
||||
});
|
||||
}, 30);
|
||||
|
||||
return container;
|
||||
var wrapper = E('div', { 'class': 'secubox-page-wrapper' });
|
||||
wrapper.appendChild(SbHeader.render());
|
||||
wrapper.appendChild(container);
|
||||
return wrapper;
|
||||
},
|
||||
|
||||
renderHeader: function(modules) {
|
||||
|
||||
@ -6,6 +6,7 @@
|
||||
'require secubox/api as API';
|
||||
'require secubox-theme/theme as Theme';
|
||||
'require secubox/nav as SecuNav';
|
||||
'require secubox-portal/header as SbHeader';
|
||||
|
||||
// Load theme resources
|
||||
document.head.appendChild(E('link', {
|
||||
@ -99,7 +100,10 @@ return view.extend({
|
||||
|
||||
this.hideLegacyTabMenu();
|
||||
|
||||
return container;
|
||||
var wrapper = E('div', { 'class': 'secubox-page-wrapper' });
|
||||
wrapper.appendChild(SbHeader.render());
|
||||
wrapper.appendChild(container);
|
||||
return wrapper;
|
||||
},
|
||||
|
||||
renderHeader: function() {
|
||||
|
||||
@ -6,6 +6,7 @@
|
||||
'require secubox/api as API';
|
||||
'require secubox-theme/theme as Theme';
|
||||
'require secubox/nav as SecuNav';
|
||||
'require secubox-portal/header as SbHeader';
|
||||
|
||||
// Load theme resources
|
||||
document.head.appendChild(E('link', {
|
||||
@ -444,7 +445,10 @@ return view.extend({
|
||||
}
|
||||
});
|
||||
|
||||
return container;
|
||||
var wrapper = E('div', { 'class': 'secubox-page-wrapper' });
|
||||
wrapper.appendChild(SbHeader.render());
|
||||
wrapper.appendChild(container);
|
||||
return wrapper;
|
||||
}, this));
|
||||
},
|
||||
|
||||
|
||||
@ -4,6 +4,7 @@
|
||||
'require secubox/api as API';
|
||||
'require secubox-theme/theme as Theme';
|
||||
'require secubox/nav as SecuNav';
|
||||
'require secubox-portal/header as SbHeader';
|
||||
|
||||
// Load theme resources
|
||||
document.head.appendChild(E('link', {
|
||||
@ -61,7 +62,11 @@ return view.extend({
|
||||
this.renderProfilesCard(),
|
||||
this.renderAppsCard()
|
||||
]);
|
||||
return container;
|
||||
|
||||
var wrapper = E('div', { 'class': 'secubox-page-wrapper' });
|
||||
wrapper.appendChild(SbHeader.render());
|
||||
wrapper.appendChild(container);
|
||||
return wrapper;
|
||||
},
|
||||
|
||||
renderHeader: function() {
|
||||
|
||||
Loading…
Reference in New Issue
Block a user