[pve-devel] [PATCH v4 pve-manager 2/8] add sdn subnets

Alexandre Derumier aderumier at odiso.com
Mon Aug 24 18:48:41 CEST 2020


Signed-off-by: Alexandre Derumier <aderumier at odiso.com>
---
 www/manager6/Makefile          |   2 +
 www/manager6/dc/Config.js      |   8 +++
 www/manager6/sdn/SubnetEdit.js |  95 +++++++++++++++++++++++++++++
 www/manager6/sdn/SubnetView.js | 107 +++++++++++++++++++++++++++++++++
 4 files changed, 212 insertions(+)
 create mode 100644 www/manager6/sdn/SubnetEdit.js
 create mode 100644 www/manager6/sdn/SubnetView.js

diff --git a/www/manager6/Makefile b/www/manager6/Makefile
index a5e908bb..48924674 100644
--- a/www/manager6/Makefile
+++ b/www/manager6/Makefile
@@ -207,6 +207,8 @@ JSSRC= 							\
 	sdn/StatusView.js				\
 	sdn/VnetEdit.js					\
 	sdn/VnetView.js					\
+	sdn/SubnetEdit.js					\
+	sdn/SubnetView.js					\
 	sdn/ZoneContentView.js				\
 	sdn/ZoneView.js					\
 	sdn/controllers/Base.js				\
diff --git a/www/manager6/dc/Config.js b/www/manager6/dc/Config.js
index 905c3dc0..610b38db 100644
--- a/www/manager6/dc/Config.js
+++ b/www/manager6/dc/Config.js
@@ -176,6 +176,14 @@ Ext.define('PVE.dc.Config', {
 		    hidden: true,
 		    iconCls: 'fa fa-network-wired',
 		    itemId: 'sdnvnet'
+		},
+		{
+		    xtype: 'pveSDNSubnetView',
+		    groups: ['sdn'],
+		    title: gettext('Subnets'),
+		    hidden: true,
+		    iconCls: 'fa fa-network-wired',
+		    itemId: 'sdnsubnet'
 		});
 	    }
 
diff --git a/www/manager6/sdn/SubnetEdit.js b/www/manager6/sdn/SubnetEdit.js
new file mode 100644
index 00000000..e165ff73
--- /dev/null
+++ b/www/manager6/sdn/SubnetEdit.js
@@ -0,0 +1,95 @@
+Ext.define('PVE.sdn.SubnetInputPanel', {
+    extend: 'Proxmox.panel.InputPanel',
+    mixins: ['Proxmox.Mixin.CBind'],
+
+    onGetValues: function(values) {
+	let me = this;
+
+	if (me.isCreate) {
+	    values.type = 'subnet';
+	    values.subnet = values.cidr;
+	    delete values.cidr;
+	}
+
+	if (!values.gateway) {
+	    delete values.gateway;
+	}
+	if (!values.snat) {
+	    delete values.snat;
+	}
+
+	return values;
+    },
+
+    items: [
+	{
+	    xtype: 'pmxDisplayEditField',
+	    name: 'cidr',
+	    cbind: {
+		editable: '{isCreate}',
+	    },
+	    flex: 1,
+	    allowBlank: false,
+	    fieldLabel: gettext('Subnet'),
+	},
+	{
+	    xtype: 'textfield',
+	    name: 'gateway',
+	    vtype: 'IP64Address',
+	    fieldLabel: gettext('Gateway'),
+	    allowBlank: true,
+	},
+	{
+	    xtype: 'proxmoxcheckbox',
+	    name: 'snat',
+	    uncheckedValue: 0,
+	    checked: false,
+	    fieldLabel: 'SNAT'
+	},
+    ]
+});
+
+Ext.define('PVE.sdn.SubnetEdit', {
+    extend: 'Proxmox.window.Edit',
+
+    subject: gettext('Subnet'),
+
+    subnet: undefined,
+
+    width: 350,
+
+    initComponent: function() {
+	var me = this;
+
+	me.isCreate = me.subnet === undefined;
+
+	if (me.isCreate) {
+	    me.url = '/api2/extjs/cluster/sdn/subnets';
+	    me.method = 'POST';
+	} else {
+	    me.url = '/api2/extjs/cluster/sdn/subnets/' + me.subnet;
+	    me.method = 'PUT';
+	}
+
+	let ipanel = Ext.create('PVE.sdn.SubnetInputPanel', {
+	    isCreate: me.isCreate,
+	});
+
+	Ext.apply(me, {
+	    items: [
+		ipanel,
+	    ],
+	});
+
+	me.callParent();
+
+	if (!me.isCreate) {
+	    me.load({
+		success: function(response, options) {
+		    let values = response.result.data;
+		    ipanel.setValues(values);
+		},
+	    });
+	}
+    },
+});
diff --git a/www/manager6/sdn/SubnetView.js b/www/manager6/sdn/SubnetView.js
new file mode 100644
index 00000000..e5cc03b7
--- /dev/null
+++ b/www/manager6/sdn/SubnetView.js
@@ -0,0 +1,107 @@
+Ext.define('PVE.sdn.SubnetView', {
+    extend: 'Ext.grid.GridPanel',
+    alias: 'widget.pveSDNSubnetView',
+
+    stateful: true,
+    stateId: 'grid-sdn-subnet',
+
+    initComponent : function() {
+	let me = this;
+
+	let store = new Ext.data.Store({
+	    model: 'pve-sdn-subnet',
+	    proxy: {
+                type: 'proxmox',
+		url: "/api2/json/cluster/sdn/subnets"
+	    },
+	    sorters: {
+		property: 'subnet',
+		order: 'DESC'
+	    }
+	});
+	let reload = () => store.load();
+
+	let sm = Ext.create('Ext.selection.RowModel', {});
+
+        let run_editor = function() {
+	    let rec = sm.getSelection()[0];
+
+	    let win = Ext.create('PVE.sdn.SubnetEdit',{
+		autoShow: true,
+		subnet: rec.data.subnet,
+	    });
+	    win.on('destroy', reload);
+        };
+
+	let edit_btn = new Proxmox.button.Button({
+	    text: gettext('Edit'),
+	    disabled: true,
+	    selModel: sm,
+	    handler: run_editor,
+	});
+
+	let remove_btn = Ext.create('Proxmox.button.StdRemoveButton', {
+	    selModel: sm,
+	    baseurl: '/cluster/sdn/subnets/',
+	    callback: reload
+	});
+
+	Ext.apply(me, {
+	    store: store,
+	    reloadStore: reload,
+	    selModel: sm,
+	    viewConfig: {
+		trackOver: false
+	    },
+	    tbar: [
+		{
+		    text: gettext('Create'),
+		    handler: function() {
+			let win = Ext.create('PVE.sdn.SubnetEdit', {
+			    autoShow: true,
+			    type: 'subnet',
+			});
+			win.on('destroy', reload);
+		    }
+		},
+		remove_btn,
+		edit_btn,
+	    ],
+	    columns: [
+		{
+		    header: 'ID',
+		    flex: 2,
+		    dataIndex: 'cidr'
+		},
+		{
+		    header: gettext('Gateway'),
+		    flex: 1,
+		    dataIndex: 'gateway',
+		},
+		{
+		    header: gettext('Snat'),
+		    flex: 1,
+		    dataIndex: 'snat',
+		}
+	    ],
+	    listeners: {
+		activate: reload,
+		itemdblclick: run_editor
+	    }
+	});
+
+	me.callParent();
+    }
+}, function() {
+
+    Ext.define('pve-sdn-subnet', {
+	extend: 'Ext.data.Model',
+	fields: [
+	    'cidr',
+	    'gateway',
+	    'snat',
+	],
+	idProperty: 'subnet'
+    });
+
+});
-- 
2.20.1





More information about the pve-devel mailing list