[pve-devel] [PATCH pve-manager v4 15/18] sdn: add firewall panel

[Stefan Hanreich]

Expose the ability to create vnet-level firewalls in the PVE UI

Signed-off-by: Stefan Hanreich <s.hanreich at proxmox.com>
Tested-by: Hannes Dürr <h.duerr at proxmox.com>
---
 www/manager6/Makefile                |  2 +
 www/manager6/dc/Config.js            |  8 +++
 www/manager6/sdn/FirewallPanel.js    | 50 ++++++++++++++++++
 www/manager6/sdn/FirewallVnetView.js | 77 ++++++++++++++++++++++++++++
 4 files changed, 137 insertions(+)
 create mode 100644 www/manager6/sdn/FirewallPanel.js
 create mode 100644 www/manager6/sdn/FirewallVnetView.js

diff --git a/www/manager6/Makefile b/www/manager6/Makefile
index d623dfb98..2ad3853d0 100644
--- a/www/manager6/Makefile
+++ b/www/manager6/Makefile
@@ -279,6 +279,8 @@ JSSRC= 							\
 	sdn/SubnetView.js				\
 	sdn/ZoneContentView.js				\
 	sdn/ZoneContentPanel.js				\
+	sdn/FirewallPanel.js				\
+	sdn/FirewallVnetView.js				\
 	sdn/ZoneView.js					\
 	sdn/IpamEdit.js					\
 	sdn/OptionsPanel.js				\
diff --git a/www/manager6/dc/Config.js b/www/manager6/dc/Config.js
index 720edefc6..d44554954 100644
--- a/www/manager6/dc/Config.js
+++ b/www/manager6/dc/Config.js
@@ -221,6 +221,14 @@ Ext.define('PVE.dc.Config', {
 		    hidden: true,
 		    iconCls: 'fa fa-map-signs',
 		    itemId: 'sdnmappings',
+		},
+		{
+		    xtype: 'pveSDNFirewall',
+		    groups: ['sdn'],
+		    title: gettext('Firewall'),
+		    hidden: true,
+		    iconCls: 'fa fa-shield',
+		    itemId: 'sdnfirewall',
 		});
 	    }
 
diff --git a/www/manager6/sdn/FirewallPanel.js b/www/manager6/sdn/FirewallPanel.js
new file mode 100644
index 000000000..0cdf31915
--- /dev/null
+++ b/www/manager6/sdn/FirewallPanel.js
@@ -0,0 +1,50 @@
+
+Ext.define('PVE.sdn.FirewallPanel', {
+    extend: 'Ext.panel.Panel',
+    alias: 'widget.pveSDNFirewall',
+
+    title: 'VNet',
+
+    initComponent: function() {
+	let me = this;
+
+	let tabPanel = Ext.create('Ext.TabPanel', {
+	    fullscreen: true,
+	    region: 'center',
+	    border: false,
+	    split: true,
+	    disabled: true,
+	    flex: 2,
+	    items: [
+		{
+		    xtype: 'pveFirewallRules',
+		    title: gettext('Rules'),
+		    list_refs_url: '/cluster/firewall/refs',
+		    firewall_type: 'vnet',
+		},
+		{
+		    xtype: 'pveFirewallOptions',
+		    title: gettext('Options'),
+		    fwtype: 'vnet',
+		},
+	    ],
+	});
+
+	let vnetPanel = Ext.createWidget('pveSDNFirewallVnetView', {
+	    title: 'VNets',
+	    region: 'west',
+	    border: false,
+	    split: true,
+	    forceFit: true,
+	    flex: 1,
+	    tabPanel,
+	});
+
+	Ext.apply(me, {
+	    layout: 'border',
+	    items: [vnetPanel, tabPanel],
+	});
+
+	me.callParent();
+    },
+});
diff --git a/www/manager6/sdn/FirewallVnetView.js b/www/manager6/sdn/FirewallVnetView.js
new file mode 100644
index 000000000..861d4b5be
--- /dev/null
+++ b/www/manager6/sdn/FirewallVnetView.js
@@ -0,0 +1,77 @@
+Ext.define('PVE.sdn.FirewallVnetView', {
+    extend: 'Ext.grid.GridPanel',
+    alias: 'widget.pveSDNFirewallVnetView',
+
+    stateful: true,
+    stateId: 'grid-sdn-vnet-firewall',
+
+    tabPanel: undefined,
+
+    getRulesPanel: function() {
+	let me = this;
+	return me.tabPanel.items.getAt(0);
+    },
+
+    getOptionsPanel: function() {
+	let me = this;
+	return me.tabPanel.items.getAt(1);
+    },
+
+    initComponent: function() {
+	let me = this;
+
+	let store = new Ext.data.Store({
+	    model: 'pve-sdn-vnet',
+	    proxy: {
+                type: 'proxmox',
+		url: "/api2/json/cluster/sdn/vnets",
+	    },
+	    sorters: {
+		property: ['zone', 'vnet'],
+		direction: 'ASC',
+	    },
+	});
+
+	let reload = () => store.load();
+
+	let sm = Ext.create('Ext.selection.RowModel', {});
+
+	Ext.apply(me, {
+	    store: store,
+	    reloadStore: reload,
+	    selModel: sm,
+	    viewConfig: {
+		trackOver: false,
+	    },
+	    columns: [
+		{
+		    header: 'ID',
+		    flex: 1,
+		    dataIndex: 'vnet',
+		},
+		{
+		    header: gettext('Zone'),
+		    flex: 1,
+		    dataIndex: 'zone',
+		},
+		{
+		    header: gettext('Alias'),
+		    flex: 1,
+		    dataIndex: 'alias',
+		},
+	    ],
+	    listeners: {
+		activate: reload,
+		show: reload,
+		select: function(_sm, rec) {
+		    me.tabPanel.setDisabled(false);
+
+		    me.getRulesPanel().setBaseUrl(`/cluster/sdn/vnets/${rec.id}/firewall/rules`);
+		    me.getOptionsPanel().setBaseUrl(`/cluster/sdn/vnets/${rec.id}/firewall/options`);
+		},
+	    },
+	});
+	store.load();
+	me.callParent();
+    },
+});
-- 
2.39.5