[pve-devel] [PATCH v2 widget-toolkit] add network selector widget

Tim Marx t.marx at proxmox.com
Mon Jun 3 12:06:30 CEST 2019


Signed-off-by: Tim Marx <t.marx at proxmox.com>
---
* changes since v1:
 move from manager to widget-tollkit
 changed prefix from PVE to proxmox

 Makefile                |  1 +
 form/NetworkSelector.js | 77 +++++++++++++++++++++++++++++++++++++++++++++++++
 2 files changed, 78 insertions(+)
 create mode 100644 form/NetworkSelector.js

diff --git a/Makefile b/Makefile
index b9dc8b9..d12a4da 100644
--- a/Makefile
+++ b/Makefile
@@ -34,6 +34,7 @@ JSSRC=					\
 	form/ComboGrid.js		\
 	form/RRDTypeSelector.js		\
 	form/BondModeSelector.js	\
+	form/NetworkSelector.js		\
 	button/Button.js		\
 	button/HelpButton.js		\
 	grid/ObjectGrid.js		\
diff --git a/form/NetworkSelector.js b/form/NetworkSelector.js
new file mode 100644
index 0000000..42ad98c
--- /dev/null
+++ b/form/NetworkSelector.js
@@ -0,0 +1,77 @@
+Ext.define('Proxmox.form.NetworkSelectorController', {
+    extend: 'Ext.app.ViewController',
+    alias: 'controller.proxmoxNetworkSelectorController',
+
+    init: function (view) {
+	var me = this;
+
+	if (!view.nodename) {
+	    throw "missing custom view config: nodename";
+	}
+	view.getStore().getProxy().setUrl('/api2/json/nodes/'+ view.nodename + '/network');
+    },
+    initViewModel: function(vm) {
+	var view = this.getView();
+	vm.set('nodename', view.nodename);
+    }
+});
+
+Ext.define('Proxmox.form.NetworkSelector', {
+    extend: 'Proxmox.form.ComboGrid',
+    alias: 'widget.proxmoxNetworkSelector',
+
+    nodename: undefined,
+    controller: 'proxmoxNetworkSelectorController',
+    viewmodel: {
+	data: {
+	    nodename: undefined
+	}
+    },
+    // set default value to empty array, else it inits it with
+    // null and after the store load it is an empty array,
+    // triggering dirtychange
+    value: [],
+    valueField: 'cidr',
+    displayField: 'cidr',
+    store: {
+	autoLoad: true,
+	fields: [ 'active', 'address', 'cidr', 'comments', 'iface', 'slaves', 'type' ],
+	proxy: {
+	    type: 'proxmox'
+	},
+	sorters: [
+	    {
+		property : 'iface',
+		direction: 'ASC'
+	    }
+	],
+	filters: [
+	    function(item) {
+		return item.data.cidr;
+	    }
+	]
+    },
+    listConfig: {
+	columns: [
+	    {
+		header: gettext('Interface'),
+		sortable: true,
+		width: 70,
+		dataIndex: 'iface'
+	    },
+	    {
+		header: gettext('CIDR'),
+		dataIndex: 'cidr',
+		sortable: true,
+		hideable: false,
+		flex: 1
+	    },
+	    {
+		header: gettext('Comment'),
+		sortable: true,
+		width: 100,
+		dataIndex: 'comments'
+	    }
+	]
+    }
+});
--
2.11.0




More information about the pve-devel mailing list