feat: Integrate mitmproxy and vhost-manager into SecuBox portal

Portal Integration:
- Add mitmproxy to Security section with service status tracking
- Add vhost-manager to new Services section
- Add Services section to portal navigation header
- Update path detection for security/mitmproxy and services/vhosts

mitmproxy Changes:
- Move menu from admin/secubox/mitmproxy to admin/secubox/security/mitmproxy
- Update view navigation links to use new path structure

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

package/secubox/luci-app-mitmproxy/htdocs/luci-static/resources/view/mitmproxy/dashboard.js

@@ -22,7 +22,7 @@ function renderMitmproxyNav(activeId) {
 	return E('div', { 'class': 'mp-app-nav' }, MITMPROXY_NAV.map(function(item) {
 		var isActive = activeId === item.id;
 		return E('a', {
-			'href': L.url('admin', 'secubox', 'mitmproxy', item.id),
+			'href': L.url('admin', 'secubox', 'security', 'mitmproxy', item.id),
 			'class': isActive ? 'active' : ''
 		}, [
 			E('span', {}, item.icon),

package/secubox/luci-app-mitmproxy/htdocs/luci-static/resources/view/mitmproxy/requests.js

@@ -22,7 +22,7 @@ function renderMitmproxyNav(activeId) {
 	return E('div', { 'class': 'mp-app-nav' }, MITMPROXY_NAV.map(function(item) {
 		var isActive = activeId === item.id;
 		return E('a', {
-			'href': L.url('admin', 'secubox', 'mitmproxy', item.id),
+			'href': L.url('admin', 'secubox', 'security', 'mitmproxy', item.id),
 			'class': isActive ? 'active' : ''
 		}, [
 			E('span', {}, item.icon),

package/secubox/luci-app-mitmproxy/htdocs/luci-static/resources/view/mitmproxy/settings.js

@@ -24,7 +24,7 @@ function renderMitmproxyNav(activeId) {
 	}, MITMPROXY_NAV.map(function(item) {
 		var isActive = activeId === item.id;
 		return E('a', {
-			'href': L.url('admin', 'secubox', 'mitmproxy', item.id),
+			'href': L.url('admin', 'secubox', 'security', 'mitmproxy', item.id),
 			'style': 'display:flex;align-items:center;gap:8px;padding:10px 16px;border-radius:8px;text-decoration:none;font-size:14px;font-weight:500;transition:all 0.2s;' +
 				(isActive ? 'background:linear-gradient(135deg,#e74c3c,#c0392b);color:white;' : 'color:#a0a0b0;background:transparent;')
 		}, [

package/secubox/luci-app-mitmproxy/root/usr/share/luci/menu.d/luci-app-mitmproxy.json

@@ -1,17 +1,16 @@
 {
-	"admin/secubox/mitmproxy": {
+	"admin/secubox/security/mitmproxy": {
 		"title": "mitmproxy",
-		"order": 45,
+		"order": 50,
 		"action": {
-			"type": "view",
-			"path": "mitmproxy/dashboard"
+			"type": "firstchild"
 		},
 		"depends": {
 			"acl": ["luci-app-mitmproxy"],
 			"uci": {"mitmproxy": true}
 		}
 	},
-	"admin/secubox/mitmproxy/dashboard": {
+	"admin/secubox/security/mitmproxy/dashboard": {
 		"title": "Dashboard",
 		"order": 10,
 		"action": {
@@ -19,7 +18,7 @@
 			"path": "mitmproxy/dashboard"
 		}
 	},
-	"admin/secubox/mitmproxy/requests": {
+	"admin/secubox/security/mitmproxy/requests": {
 		"title": "Requests",
 		"order": 20,
 		"action": {
@@ -27,7 +26,7 @@
 			"path": "mitmproxy/requests"
 		}
 	},
-	"admin/secubox/mitmproxy/settings": {
+	"admin/secubox/security/mitmproxy/settings": {
 		"title": "Settings",
 		"order": 30,
 		"action": {

package/secubox/luci-app-secubox-portal/htdocs/luci-static/resources/secubox-portal/header.js

@@ -243,7 +243,8 @@ var sections = [
 	{ id: 'security', name: 'Security', icon: '\ud83d\udee1\ufe0f', path: 'admin/secubox/security' },
 	{ id: 'network', name: 'Network', icon: '\ud83c\udf10', path: 'admin/secubox/network' },
 	{ id: 'monitoring', name: 'Monitoring', icon: '\ud83d\udcca', path: 'admin/secubox/monitoring' },
-	{ id: 'system', name: 'System', icon: '\u2699\ufe0f', path: 'admin/secubox/system' }
+	{ id: 'system', name: 'System', icon: '\u2699\ufe0f', path: 'admin/secubox/system' },
+	{ id: 'services', name: 'Services', icon: '\ud83d\udce6', path: 'admin/secubox/services' }
 ];
 
 function injectCSS() {
@@ -358,6 +359,7 @@ function detectActiveSection() {
 	if (path.indexOf('/secubox/crowdsec') !== -1) return 'security';
 	if (path.indexOf('/secubox/auth-guardian') !== -1) return 'security';
 	if (path.indexOf('/secubox/client-guardian') !== -1) return 'security';
+	if (path.indexOf('/secubox/mitmproxy') !== -1) return 'security';
 	// Network section
 	if (path.indexOf('/secubox/network') !== -1) return 'network';
 	if (path.indexOf('/secubox/bandwidth') !== -1) return 'network';
@@ -372,6 +374,9 @@ function detectActiveSection() {
 	// System section
 	if (path.indexOf('/secubox/system') !== -1) return 'system';
 	if (path.indexOf('/secubox/system-hub') !== -1) return 'system';
+	// Services section
+	if (path.indexOf('/secubox/services') !== -1) return 'services';
+	if (path.indexOf('/secubox/vhosts') !== -1) return 'services';
 	// Hub (main SecuBox app)
 	if (path.indexOf('/secubox/dashboard') !== -1) return 'hub';
 	if (path.indexOf('/secubox/modules') !== -1) return 'hub';

package/secubox/luci-app-secubox-portal/htdocs/luci-static/resources/secubox-portal/portal.js

@@ -48,6 +48,18 @@ return baseclass.extend({
 			service: 'auth-guardian',
 			version: '0.3.0'
 		},
+		'mitmproxy': {
+			id: 'mitmproxy',
+			name: 'mitmproxy',
+			desc: 'Interactive HTTPS proxy for traffic inspection, debugging, and security testing',
+			icon: '\ud83d\udd0d',
+			iconBg: 'rgba(231, 76, 60, 0.15)',
+			iconColor: '#e74c3c',
+			section: 'security',
+			path: 'admin/secubox/security/mitmproxy/dashboard',
+			service: 'mitmproxy',
+			version: '10.4.2'
+		},
 
 		// Network Apps
 		'bandwidth-manager': {
@@ -185,6 +197,20 @@ return baseclass.extend({
 			path: 'admin/secubox/settings',
 			service: null,
 			version: null
+		},
+
+		// Services Apps
+		'vhost-manager': {
+			id: 'vhost-manager',
+			name: 'VHost Manager',
+			desc: 'Manage virtual hosts, SSL certificates, and reverse proxy configurations',
+			icon: '\ud83c\udf10',
+			iconBg: 'rgba(102, 126, 234, 0.15)',
+			iconColor: '#667eea',
+			section: 'services',
+			path: 'admin/secubox/services/vhosts/overview',
+			service: 'nginx',
+			version: '0.5.0'
 		}
 	},
 
@@ -238,6 +264,13 @@ return baseclass.extend({
 			icon: '\u2699\ufe0f',
 			path: 'admin/secubox/system',
 			order: 7
+		},
+		'services': {
+			id: 'services',
+			name: 'Services',
+			icon: '\ud83d\udce6',
+			path: 'admin/secubox/services',
+			order: 8
 		}
 	},