[pve-devel] [PATCH manager v2 06/22] use NetworkView/NetworkEdit from widget toolkit

Dominik Csapak d.csapak at proxmox.com
Mon Jan 15 15:17:54 CET 2018


Signed-off-by: Dominik Csapak <d.csapak at proxmox.com>
---
 www/manager6/Makefile            |   2 -
 www/manager6/node/Config.js      |   4 +-
 www/manager6/node/NetworkEdit.js | 325 ------------------------------------
 www/manager6/node/NetworkView.js | 351 ---------------------------------------
 4 files changed, 3 insertions(+), 679 deletions(-)
 delete mode 100644 www/manager6/node/NetworkEdit.js
 delete mode 100644 www/manager6/node/NetworkView.js

diff --git a/www/manager6/Makefile b/www/manager6/Makefile
index da01f71c..63e48f7d 100644
--- a/www/manager6/Makefile
+++ b/www/manager6/Makefile
@@ -123,8 +123,6 @@ JSSRC= 				                 	\
 	node/StatusView.js				\
 	node/Summary.js					\
 	node/ServiceView.js				\
-	node/NetworkEdit.js				\
-	node/NetworkView.js				\
 	node/Tasks.js					\
 	node/Subscription.js				\
 	node/APT.js					\
diff --git a/www/manager6/node/Config.js b/www/manager6/node/Config.js
index 5ead4878..32d5721b 100644
--- a/www/manager6/node/Config.js
+++ b/www/manager6/node/Config.js
@@ -165,7 +165,9 @@ Ext.define('PVE.node.Config', {
 		    iconCls: 'fa fa-exchange',
 		    itemId: 'network',
 		    groups: ['services'],
-		    xtype: 'pveNodeNetworkView'
+		    nodename: nodename,
+		    onlineHelp: 'sysadmin_network_configuration',
+		    xtype: 'proxmoxNodeNetworkView'
 		},
 		{
 		    title: gettext('DNS'),
diff --git a/www/manager6/node/NetworkEdit.js b/www/manager6/node/NetworkEdit.js
deleted file mode 100644
index de8b65d9..00000000
--- a/www/manager6/node/NetworkEdit.js
+++ /dev/null
@@ -1,325 +0,0 @@
-Ext.define('PVE.node.NetworkEdit', {
-    extend: 'PVE.window.Edit',
-    alias: ['widget.pveNodeNetworkEdit'],
-
-    initComponent : function() {
-	var me = this;
-
-	var nodename = me.pveSelNode.data.node;
-	if (!nodename) {
-	    throw "no node name specified";
-	}
-
-	if (!me.iftype) {
-	    throw "no network device type specified";
-	}
-
-	me.isCreate = !me.iface;
-
-	var iface_vtype;
-
-	if (me.iftype === 'bridge') {
-	    iface_vtype = 'BridgeName';
-	} else if (me.iftype === 'bond') {
-	    iface_vtype = 'BondName';
-	} else if (me.iftype === 'eth' && !me.isCreate) {
-	    iface_vtype = 'InterfaceName';
-	} else if (me.iftype === 'vlan' && !me.isCreate) {
-	    iface_vtype = 'InterfaceName';
-	} else if (me.iftype === 'OVSBridge') {
-	    iface_vtype = 'BridgeName';
-	} else if (me.iftype === 'OVSBond') {
-	    iface_vtype = 'BondName';
-	} else if (me.iftype === 'OVSIntPort') {
-	    iface_vtype = 'InterfaceName';
-	} else if (me.iftype === 'OVSPort') {
-	    iface_vtype = 'InterfaceName';
-	} else {
-	    console.log(me.iftype);
-	    throw "unknown network device type specified";
-	}
-
-	me.subject = PVE.Utils.render_network_iface_type(me.iftype);
-
-	var column2 = [];
-
-	if (!(me.iftype === 'OVSIntPort' || me.iftype === 'OVSPort' ||
-	      me.iftype === 'OVSBond')) {
-	    column2.push({
-		xtype: 'pvecheckbox',
-		fieldLabel: gettext('Autostart'),
-		name: 'autostart',
-		uncheckedValue: 0,
-		checked: me.isCreate ? true : undefined
-	    });
-	}
-
-	if (me.iftype === 'bridge') {
-	    column2.push({
-		xtype: 'pvecheckbox',
-		fieldLabel: gettext('VLAN aware'),
-		name: 'bridge_vlan_aware',
-		deleteEmpty: !me.isCreate
-	    });
-	    column2.push({
-		xtype: 'textfield',
-		fieldLabel: gettext('Bridge ports'),
-		name: 'bridge_ports'
-	    });	  
-	} else if (me.iftype === 'OVSBridge') {
-	    column2.push({
-		xtype: 'textfield',
-		fieldLabel: gettext('Bridge ports'),
-		name: 'ovs_ports'
-	    });	  
-	    column2.push({
-		xtype: 'textfield',
-		fieldLabel: gettext('OVS options'),
-		name: 'ovs_options'
-	    });	  
-	} else if (me.iftype === 'OVSPort' || me.iftype === 'OVSIntPort') {
-	    column2.push({
-		xtype: me.isCreate ? 'PVE.form.BridgeSelector' : 'displayfield',
-		fieldLabel: PVE.Utils.render_network_iface_type('OVSBridge'),
-		allowBlank: false,
-		nodename: nodename,
-		bridgeType: 'OVSBridge',
-		name: 'ovs_bridge'
-	    });
-	    column2.push({
-		xtype: 'pveVlanField',
-		deleteEmpty: !me.isCreate,
-		name: 'ovs_tag',
-		value: ''
-	    });
-	    column2.push({
-		xtype: 'textfield',
-		fieldLabel: gettext('OVS options'),
-		name: 'ovs_options'
-	    });
-	} else if (me.iftype === 'bond') {
-	    column2.push({
-		xtype: 'textfield',
-		fieldLabel: gettext('Slaves'),
-		name: 'slaves'
-	    });
-
-	    var policySelector = Ext.createWidget('bondPolicySelector', {
-		fieldLabel: gettext('Hash policy'),
-		name: 'bond_xmit_hash_policy',
-		deleteEmpty: !me.isCreate,
-		disabled: true
-	    });
-
-	    column2.push({
-		xtype: 'bondModeSelector',
-		fieldLabel: gettext('Mode'),
-		name: 'bond_mode',
-		value: me.isCreate ? 'balance-rr' : undefined,
-		listeners: {
-		    change: function(f, value) {
-			if (value === 'balance-xor' ||
-			    value === '802.3ad') {
-			    policySelector.setDisabled(false);
-			} else {
-			    policySelector.setDisabled(true);
-			    policySelector.setValue('');
-			}
-		    }
-		},
-		allowBlank: false
-	    });
-
-	    column2.push(policySelector);
-
-	} else if (me.iftype === 'OVSBond') {
-	    column2.push({
-		xtype: me.isCreate ? 'PVE.form.BridgeSelector' : 'displayfield',
-		fieldLabel: PVE.Utils.render_network_iface_type('OVSBridge'),
-		allowBlank: false,
-		nodename: nodename,
-		bridgeType: 'OVSBridge',
-		name: 'ovs_bridge'
-	    });
-	    column2.push({
-		xtype: 'pveVlanField',
-		deleteEmpty: !me.isCreate,
-		name: 'ovs_tag',
-		value: ''
-	    });
-	    column2.push({
-		xtype: 'textfield',
-		fieldLabel: gettext('OVS options'),
-		name: 'ovs_options'
-	    });
-	}
-
-	column2.push({
-	    xtype: 'textfield',
-	    fieldLabel: gettext('Comment'),
-	    allowBlank: true,
-	    nodename: nodename,
-	    name: 'comments'
-	});
-
-	var url;
-	var method;
-
-	if (me.isCreate) {
-	    url = "/api2/extjs/nodes/" + nodename + "/network";
-	    method = 'POST';
-	} else {
-	    url = "/api2/extjs/nodes/" + nodename + "/network/" + me.iface;
-	    method = 'PUT';
-	}
-
-	var column1 = [
-	    { 
-		xtype: 'hiddenfield',
-		name: 'type',
-		value: me.iftype
-	    },
-	    {
-		xtype: me.isCreate ? 'textfield' : 'displayfield',
-		fieldLabel: gettext('Name'),
-		name: 'iface',
-		value: me.iface,
-		vtype: iface_vtype,
-		allowBlank: false
-	    }
-	];
-
-	if (me.iftype === 'OVSBond') {
-	    column1.push(
-		{
-		    xtype: 'bondModeSelector',
-		    fieldLabel: gettext('Mode'),
-		    name: 'bond_mode',
-		    openvswitch: true,
-		    value: me.isCreate ? 'active-backup' : undefined,
-		    allowBlank: false
-		},
-		{
-		    xtype: 'textfield',
-		    fieldLabel: gettext('Slaves'),
-		    name: 'ovs_bonds'
-		}
-	    );
-	} else {
-
-	    column1.push(
-		{
-		    xtype: 'proxmoxtextfield',
-		    deleteEmpty: !me.isCreate,
-		    fieldLabel: gettext('IP address'),
-		    vtype: 'IPAddress',
-		    name: 'address'
-		},
-		{
-		    xtype: 'proxmoxtextfield',
-		    deleteEmpty: !me.isCreate,
-		    fieldLabel: gettext('Subnet mask'),
-		    vtype: 'IPAddress',
-		    name: 'netmask',
-		    validator: function(value) {
-			/*jslint confusion: true */
-			if (!me.items) {
-			    return true;
-			}
-			var address = me.down('field[name=address]').getValue();
-			if (value !== '') {
-			    if (address === '') {
-				return "Subnet mask requires option 'IP address'";
-			    }
-			} else {
-			    if (address !== '') {
-				return "Option 'IP address' requires a subnet mask";
-			    }
-			}
-		    
-			return true;
-		    }
-		},
-		{
-		    xtype: 'proxmoxtextfield',
-		    deleteEmpty: !me.isCreate,
-		    fieldLabel: gettext('Gateway'),
-		    vtype: 'IPAddress',
-		    name: 'gateway'
-		},
-		{
-		    xtype: 'proxmoxtextfield',
-		    deleteEmpty: !me.isCreate,
-		    fieldLabel: gettext('IPv6 address'),
-		    vtype: 'IP6Address',
-		    name: 'address6'
-		},
-		{
-		    xtype: 'proxmoxtextfield',
-		    deleteEmpty: !me.isCreate,
-		    fieldLabel: gettext('Prefix length'),
-		    vtype: 'IP6PrefixLength',
-		    name: 'netmask6',
-		    value: '',
-		    allowBlank: true,
-		    validator: function(value) {
-			/*jslint confusion: true */
-			if (!me.items) {
-			    return true;
-			}
-			var address = me.down('field[name=address6]').getValue();
-			if (value !== '') {
-			    if (address === '') {
-				return "IPv6 prefix length requires option 'IPv6 address'";
-			    }
-			} else {
-			    if (address !== '') {
-				return "Option 'IPv6 address' requires an IPv6 prefix length";
-			    }
-			}
-
-			return true;
-		    }
-		},
-		{
-		    xtype: 'proxmoxtextfield',
-		    deleteEmpty: !me.isCreate,
-		    fieldLabel: gettext('Gateway'),
-		    vtype: 'IP6Address',
-		    name: 'gateway6'
-		}
-	    );
-	}
-
-	Ext.applyIf(me, {
-	    url: url,
-	    method: method,
-	    items: {
-                xtype: 'inputpanel',
-		column1: column1,
-		column2: column2
-	    }
-	});
-
-	me.callParent();
-
-	if (me.isCreate) {
-	    me.down('field[name=iface]').setValue(me.iface_default);
-	} else {
-	    me.load({
-		success: function(response, options) {
-		    var data = response.result.data;
-		    if (data.type !== me.iftype) {
-			var msg = "Got unexpected device type";
-			Ext.Msg.alert(gettext('Error'), msg, function() {
-			    me.close();
-			});
-			return;
-		    }
-		    me.setValues(data);
-		    me.isValid(); // trigger validation
-		}
-	    });
-	}
-    }
-});
diff --git a/www/manager6/node/NetworkView.js b/www/manager6/node/NetworkView.js
deleted file mode 100644
index 848aa7b5..00000000
--- a/www/manager6/node/NetworkView.js
+++ /dev/null
@@ -1,351 +0,0 @@
-Ext.define('PVE.node.NetworkView', {
-    extend: 'Ext.panel.Panel',
-
-    alias: ['widget.pveNodeNetworkView'],
-
-    onlineHelp: 'sysadmin_network_configuration',
-
-    initComponent : function() {
-	var me = this;
-
-	var nodename = me.pveSelNode.data.node;
-	if (!nodename) {
-	    throw "no node name specified";
-	}
-
-	var store = Ext.create('Ext.data.Store', {
-	    model: 'pve-networks',
-	    proxy: {
-                type: 'pve',
-                url: "/api2/json/nodes/" + nodename + "/network"
-	    },
-	    sorters: [
-		{
-		    property : 'iface',
-		    direction: 'ASC'
-		}
-	    ]
-	});
-
-	var reload = function() {
-	    var changeitem = me.down('#changes');
-	    PVE.Utils.API2Request({
-		url: '/nodes/' + nodename + '/network',
-		failure: function(response, opts) {
-		    changeitem.update(gettext('Error') + ': ' + response.htmlStatus);
-		    store.loadData({});
-		},
-		success: function(response, opts) {
-		    var result = Ext.decode(response.responseText);
-		    store.loadData(result.data);
-		    var changes = result.changes;
-		    if (changes === undefined || changes === '') {
-			changes = gettext("No changes");
-		    }
-		    changeitem.update("<pre>" + Ext.htmlEncode(changes) + "</pre>");
-		}
-	    });
-	};
-
-	var run_editor = function() {
-	    var grid = me.down('gridpanel');
-	    var sm = grid.getSelectionModel();
-	    var rec = sm.getSelection()[0];
-	    if (!rec) {
-		return;
-	    }
-
-	    var win = Ext.create('PVE.node.NetworkEdit', {
-		pveSelNode: me.pveSelNode,
-		iface: rec.data.iface,
-		iftype: rec.data.type
-	    });
-	    win.show();
-	    win.on('destroy', reload);
-	};
-
-	var edit_btn = new Ext.Button({
-	    text: gettext('Edit'),
-	    disabled: true,
-	    handler: run_editor
-	});
-
-	var del_btn = new Ext.Button({
-	    text: gettext('Remove'),
-	    disabled: true,
-	    handler: function(){
-		var grid = me.down('gridpanel');
-		var sm = grid.getSelectionModel();
-		var rec = sm.getSelection()[0];
-		if (!rec) {
-		    return;
-		}
-
-		var iface = rec.data.iface;
-
-		PVE.Utils.API2Request({
-		    url: '/nodes/' + nodename + '/network/' + iface,
-		    method: 'DELETE',
-		    waitMsgTarget: me,
-		    callback: function() {
-			reload();
-		    },
-		    failure: function(response, opts) {
-			Ext.Msg.alert(gettext('Error'), response.htmlStatus);
-		    }
-		});
-	    }
-	});
-
-	var set_button_status = function() {
-	    var grid = me.down('gridpanel');
-	    var sm = grid.getSelectionModel();
-	    var rec = sm.getSelection()[0];
-
-	    edit_btn.setDisabled(!rec);
-	    del_btn.setDisabled(!rec);
-	};
-
-	PVE.Utils.monStoreErrors(me, store);
-
-	var render_ports = function(value, metaData, record) {
-	    if (value === 'bridge') {
-		return record.data.bridge_ports;
-	    } else if (value === 'bond') {
-		return record.data.slaves;
-	    } else if (value === 'OVSBridge') {
-		return record.data.ovs_ports;
-	    } else if (value === 'OVSBond') {
-		return record.data.ovs_bonds;
-	    }
-	};
-
-	var find_next_iface_id = function(prefix) {
-	    var next;
-	    for (next = 0; next <= 9999; next++) {
-		if (!store.getById(prefix + next.toString())) {
-		    break;
-		}
-	    }
-	    return prefix + next.toString();
-	};
-
-	Ext.apply(me, {
-	    layout: 'border',
-	    tbar: [
-		{
-		    text: gettext('Create'),
-		    menu: new Ext.menu.Menu({
-			plain: true,
-			items: [
-			    {
-				text: PVE.Utils.render_network_iface_type('bridge'),
-				handler: function() {
-				    var win = Ext.create('PVE.node.NetworkEdit', {
-					pveSelNode: me.pveSelNode,
-					iftype: 'bridge',
-					iface_default: find_next_iface_id('vmbr')
-				    });
-				    win.on('destroy', reload);
-				    win.show();
-				}
-			    },
-			    {
-				text: PVE.Utils.render_network_iface_type('bond'),
-				handler: function() {
-				    var win = Ext.create('PVE.node.NetworkEdit', {
-					pveSelNode: me.pveSelNode,
-					iftype: 'bond',
-					iface_default: find_next_iface_id('bond')
-				    });
-				    win.on('destroy', reload);
-				    win.show();
-				}
-			    }, '-',
-			    {
-				text: PVE.Utils.render_network_iface_type('OVSBridge'),
-				handler: function() {
-				    var win = Ext.create('PVE.node.NetworkEdit', {
-					pveSelNode: me.pveSelNode,
-					iftype: 'OVSBridge',
-					iface_default: find_next_iface_id('vmbr')
-				    });
-				    win.on('destroy', reload);
-				    win.show();
-				}
-			    },
-			    {
-				text: PVE.Utils.render_network_iface_type('OVSBond'),
-				handler: function() {
-				    var win = Ext.create('PVE.node.NetworkEdit', {
-					pveSelNode: me.pveSelNode,
-					iftype: 'OVSBond',
-					iface_default: find_next_iface_id('bond')
-				    });
-				    win.on('destroy', reload);
-				    win.show();
-				}
-			    },
-			    {
-				text: PVE.Utils.render_network_iface_type('OVSIntPort'),
-				handler: function() {
-				    var win = Ext.create('PVE.node.NetworkEdit', {
-					pveSelNode: me.pveSelNode,
-					iftype: 'OVSIntPort'
-				    });
-				    win.on('destroy', reload);
-				    win.show();
-				}
-			    }
-			]
-		    })
-		}, ' ', 
-		{
-		    text: gettext('Revert'),
-		    handler: function() {
-			PVE.Utils.API2Request({
-			    url: '/nodes/' + nodename + '/network',
-			    method: 'DELETE',
-			    waitMsgTarget: me,
-			    callback: function() {
-				reload();
-			    },
-			    failure: function(response, opts) {
-				Ext.Msg.alert(gettext('Error'), response.htmlStatus);
-			    }
-			});
-		    }
-		},
-		edit_btn, 
-		del_btn
-	    ],
-	    items: [
-		{
-		    xtype: 'gridpanel',
-		    stateful: true,
-		    stateId: 'grid-node-network',
-		    store: store,
-		    region: 'center',
-		    border: false,
-		    columns: [
-			{
-			    header: gettext('Name'),
-			    width: 100,
-			    sortable: true,
-			    dataIndex: 'iface'
-			},
-			{
-			    header: gettext('Type'),
-			    width: 100,
-			    sortable: true,
-			    renderer: PVE.Utils.render_network_iface_type,
-			    dataIndex: 'type'
-			},
-			{
-			    xtype: 'booleancolumn', 
-			    header: gettext('Active'),
-			    width: 80,
-			    sortable: true,
-			    dataIndex: 'active',
-			    trueText: 'Yes',
-			    falseText: 'No',
-			    undefinedText: 'No'
-			},
-			{
-			    xtype: 'booleancolumn', 
-			    header: gettext('Autostart'),
-			    width: 80,
-			    sortable: true,
-			    dataIndex: 'autostart',
-			    trueText: 'Yes',
-			    falseText: 'No',
-			    undefinedText: 'No'
-			},
-			{
-			    header: gettext('Ports/Slaves'),
-			    dataIndex: 'type',
-			    renderer: render_ports
-			},
-			{
-			    header: gettext('IP address'),
-			    sortable: true,
-			    dataIndex: 'address',
-			    renderer: function(value, metaData, rec) {
-				if (rec.data.address && rec.data.address6) {
-				    return rec.data.address + "<br>"
-				           + rec.data.address6 + '/' + rec.data.netmask6;
-				} else if (rec.data.address6) {
-				    return rec.data.address6 + '/' + rec.data.netmask6;
-				} else {
-				    return rec.data.address;
-				}
-			    }
-			},
-			{
-			    header: gettext('Subnet mask'),
-			    sortable: true,
-			    dataIndex: 'netmask'
-			},
-			{
-			    header: gettext('Gateway'),
-			    sortable: true,
-			    dataIndex: 'gateway',
-			    renderer: function(value, metaData, rec) {
-				if (rec.data.gateway && rec.data.gateway6) {
-				    return rec.data.gateway + "<br>" + rec.data.gateway6;
-				} else if (rec.data.gateway6) {
-				    return rec.data.gateway6;
-				} else {
-				    return rec.data.gateway;
-				}
-			    }
-			},
-			{
-			    header: gettext('Comment'),
-			    dataIndex: 'comments',
-			    renderer: Ext.String.htmlEncode
-			}
-		    ],
-		    listeners: {
-			selectionchange: set_button_status,
-			itemdblclick: run_editor
-		    }
-		},
-		{
-		    border: false,
-		    region: 'south',
-		    autoScroll: true,
-		    itemId: 'changes',
-		    tbar: [ 
-			gettext('Pending changes') + ' (' +
-			    gettext('Please reboot to activate changes') + ')'
-		    ],
-		    split: true, 
-		    bodyPadding: 5,
-		    flex: 0.6,
-		    html: gettext("No changes")
-		}
-	    ],
-	    listeners: {
-		activate: reload
-	    }
-	});
-
-	me.callParent();
-    }
-}, function() {
-
-    Ext.define('pve-networks', {
-	extend: 'Ext.data.Model',
-	fields: [ 
-	    'iface', 'type', 'active', 'autostart',
-	    'bridge_ports', 'slaves',
-	    'address', 'netmask', 'gateway',
-	    'address6', 'netmask6', 'gateway6',
-	    'comments'
-	],
-	idProperty: 'iface'
-    });
-
-});
-    
-- 
2.11.0





More information about the pve-devel mailing list