proxmox-mirrors/pve-manager
1
0
Fork 0
mirror of https://git.proxmox.com/git/pve-manager synced 2025-08-07 08:16:25 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

ui/sdn: better spelling and code cleanup

Browse Source 
Signed-off-by: Thomas Lamprecht <t.lamprecht@proxmox.com>
This commit is contained in:
Thomas Lamprecht 2020-04-22 15:06:30 +02:00
parent 485b2cd10a
commit 68dc909220
6 changed files with 199 additions and 215 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

33
www/manager6/sdn/ControllerView.js
View File

@ -1,6 +1,5 @@
Ext.define('PVE.sdn.ControllerView', { Ext.define('PVE.sdn.ControllerView', {
extend: 'Ext.grid.GridPanel', extend: 'Ext.grid.GridPanel',
alias: ['widget.pveSDNControllerView'], alias: ['widget.pveSDNControllerView'],
stateful: true, stateful: true,
@ -103,22 +102,22 @@ Ext.define('PVE.sdn.ControllerView', {
}, },
remove_btn, remove_btn,
edit_btn, edit_btn,
{ {
text: gettext('Revert'), text: gettext('Revert'),
handler: function() { handler: function() {
Proxmox.Utils.API2Request({ Proxmox.Utils.API2Request({
url: '/cluster/sdn/controllers/', url: '/cluster/sdn/controllers/',
method: 'DELETE', method: 'DELETE',
waitMsgTarget: me, waitMsgTarget: me,
callback: function() { callback: function() {
reload(); reload();
}, },
failure: function(response, opts) { failure: function(response, opts) {
Ext.Msg.alert(gettext('Error'), response.htmlStatus); Ext.Msg.alert(gettext('Error'), response.htmlStatus);
} }
}); });
} }
}, },
], ],
columns: [ columns: [
{ {

34
www/manager6/sdn/StatusView.js
View File

@ -38,32 +38,32 @@ Ext.define('PVE.sdn.StatusView', {
Ext.apply(me, { Ext.apply(me, {
store: store, store: store,
stateful: false, stateful: false,
tbar: [ tbar: [
{ {
text: gettext('Apply'), text: gettext('Apply'),
handler: function() { handler: function() {
Proxmox.Utils.API2Request({ Proxmox.Utils.API2Request({
url: '/cluster/sdn/', url: '/cluster/sdn/',
method: 'PUT', method: 'PUT',
waitMsgTarget: me, waitMsgTarget: me,
failure: function(response, opts) { failure: function(response, opts) {
Ext.Msg.alert(gettext('Error'), response.htmlStatus); Ext.Msg.alert(gettext('Error'), response.htmlStatus);
} }
}); });
} }
}, },
], ],
viewConfig: { viewConfig: {
trackOver: false trackOver: false
}, },
columns: [ columns: [
{ {
header: gettext('sdn'), header: 'SDN',
width: 80, width: 80,
dataIndex: 'sdn' dataIndex: 'sdn'
}, },
{ {
header: gettext('node'), header: gettext('Node'),
width: 80, width: 80,
dataIndex: 'node' dataIndex: 'node'
}, },

165
www/manager6/sdn/VnetEdit.js
View File

@ -1,10 +1,9 @@
Ext.define('PVE.sdn.VnetInputPanel', { Ext.define('PVE.sdn.VnetInputPanel', {
extend: 'Proxmox.panel.InputPanel', extend: 'Proxmox.panel.InputPanel',
mixins: ['Proxmox.Mixin.CBind'],
vnet: undefined,
onGetValues: function(values) { onGetValues: function(values) {
var me = this; let me = this;
if (me.isCreate) { if (me.isCreate) {
values.type = 'vnet'; values.type = 'vnet';
@ -13,11 +12,9 @@ Ext.define('PVE.sdn.VnetInputPanel', {
if (!values.ipv6) { if (!values.ipv6) {
delete values.ipv6; delete values.ipv6;
} }
if (!values.ipv4) { if (!values.ipv4) {
delete values.ipv4; delete values.ipv4;
} }
if (!values.mac) { if (!values.mac) {
delete values.mac; delete values.mac;
} }
@ -25,109 +22,105 @@ Ext.define('PVE.sdn.VnetInputPanel', {
return values; return values;
}, },
initComponent : function() { items: [
var me = this; {
xtype: 'pmxDisplayEditField',
me.items = [ name: 'vnet',
{ cbind: {
xtype: me.isCreate ? 'proxmoxtextfield' : 'displayfield', editable: '{isCreate}',
name: 'vnet', },
value: me.vnet, maxLength: 10,
maxLength: 10, allowBlank: false,
allowBlank: false, fieldLabel: gettext('Name'),
fieldLabel: gettext('Name') },
}, {
{ xtype: 'textfield',
xtype: 'textfield', name: 'alias',
name: 'alias', fieldLabel: gettext('Alias'),
fieldLabel: gettext('alias'), allowBlank: true,
allowBlank: true },
}, {
{ xtype: 'pveSDNZoneSelector',
xtype: 'pveSDNZoneSelector', fieldLabel: gettext('Zone'),
fieldLabel: gettext('Zone'), name: 'zone',
name: 'zone', value: '',
value: '', allowBlank: false,
allowBlank: false },
}, {
{ xtype: 'proxmoxintegerfield',
xtype: 'proxmoxintegerfield', name: 'tag',
name: 'tag', minValue: 1,
minValue: 1, maxValue: 16000000,
maxValue: 16000000, fieldLabel: gettext('Tag'),
fieldLabel: gettext('tag'), allowBlank: false,
allowBlank: false },
}, {
{ xtype: 'textfield',
xtype: 'textfield', name: 'ipv4',
name: 'ipv4', vtype: 'IPCIDRAddress',
vtype: 'IPCIDRAddress', fieldLabel: 'IPv4/CIDR', // do not localize
fieldLabel: gettext('ipv4'), skipEmptyText: true,
fieldLabel: 'IPv4/CIDR', // do not localize allowBlank: true,
skipEmptyText: true, },
allowBlank: true, {
}, xtype: 'textfield',
{ name: 'ipv6',
xtype: 'textfield', vtype: 'IP6CIDRAddress',
name: 'ipv6', fieldLabel: 'IPv6/CIDR', // do not localize
vtype: 'IP6CIDRAddress', skipEmptyText: true,
fieldLabel: 'IPv6/CIDR', // do not localize allowBlank: true,
skipEmptyText: true, },
allowBlank: true, {
}, xtype: 'textfield',
{ name: 'mac',
xtype: 'textfield', fieldLabel: gettext('MAC Address'),
name: 'mac', vtype: 'MacAddress',
fieldLabel: gettext('MAC address'), skipEmptyText: true,
vtype: 'MacAddress', allowBlank: true,
skipEmptyText: true, emptyText: 'auto',
allowBlank: true, },
emptyText: 'auto' ],
},
];
me.callParent();
}
}); });
Ext.define('PVE.sdn.VnetEdit', { Ext.define('PVE.sdn.VnetEdit', {
extend: 'Proxmox.window.Edit', extend: 'Proxmox.window.Edit',
subject: gettext('VNet'),
vnet: undefined, vnet: undefined,
initComponent : function() { initComponent: function() {
var me = this; var me = this;
me.isCreate = !me.vnet; me.isCreate = me.vnet === undefined;
if (me.isCreate) { if (me.isCreate) {
me.url = '/api2/extjs/cluster/sdn/vnets'; me.url = '/api2/extjs/cluster/sdn/vnets';
me.method = 'POST'; me.method = 'POST';
} else { } else {
me.url = '/api2/extjs/cluster/sdn/vnets/' + me.vnet; me.url = '/api2/extjs/cluster/sdn/vnets/' + me.vnet;
me.method = 'PUT'; me.method = 'PUT';
} }
var ipanel = Ext.create('PVE.sdn.VnetInputPanel', { let ipanel = Ext.create('PVE.sdn.VnetInputPanel', {
isCreate: me.isCreate, isCreate: me.isCreate,
vnet: me.vnet
}); });
Ext.apply(me, { Ext.apply(me, {
subject: gettext('Vnet'), items: [
items: [ ipanel ] ipanel,
],
}); });
me.callParent(); me.callParent();
if (!me.isCreate) { if (!me.isCreate) {
me.load({ me.load({
success: function(response, options) { success: function(response, options) {
var values = response.result.data; let values = response.result.data;
ipanel.setValues(values); ipanel.setValues(values);
} },
}); });
} }
} },
}); });

114
www/manager6/sdn/VnetView.js
View File

@ -7,9 +7,9 @@ Ext.define('PVE.sdn.VnetView', {
stateId: 'grid-sdn-vnet', stateId: 'grid-sdn-vnet',
initComponent : function() { initComponent : function() {
var me = this; let me = this;
var store = new Ext.data.Store({ let store = new Ext.data.Store({
model: 'pve-sdn-vnet', model: 'pve-sdn-vnet',
proxy: { proxy: {
type: 'proxmox', type: 'proxmox',
@ -20,31 +20,28 @@ Ext.define('PVE.sdn.VnetView', {
order: 'DESC' order: 'DESC'
} }
}); });
let reload = () => store.load();
var reload = function() { let sm = Ext.create('Ext.selection.RowModel', {});
store.load();
};
var sm = Ext.create('Ext.selection.RowModel', {}); let run_editor = function() {
let rec = sm.getSelection()[0];
var run_editor = function() { let win = Ext.create('PVE.sdn.VnetEdit',{
var rec = sm.getSelection()[0]; autoShow: true,
vnet: rec.data.vnet,
var win = Ext.create('PVE.sdn.VnetEdit',{ });
vnet: rec.data.vnet win.on('destroy', reload);
});
win.on('destroy', reload);
win.show();
}; };
var edit_btn = new Proxmox.button.Button({ let edit_btn = new Proxmox.button.Button({
text: gettext('Edit'), text: gettext('Edit'),
disabled: true, disabled: true,
selModel: sm, selModel: sm,
handler: run_editor handler: run_editor,
}); });
var remove_btn = Ext.create('Proxmox.button.StdRemoveButton', { let remove_btn = Ext.create('Proxmox.button.StdRemoveButton', {
selModel: sm, selModel: sm,
baseurl: '/cluster/sdn/vnets/', baseurl: '/cluster/sdn/vnets/',
callback: reload callback: reload
@ -58,83 +55,74 @@ Ext.define('PVE.sdn.VnetView', {
trackOver: false trackOver: false
}, },
tbar: [ tbar: [
{ {
text: gettext('Create'), text: gettext('Create'),
handler: function() { handler: function() {
var win = Ext.create('PVE.sdn.VnetEdit',{ let win = Ext.create('PVE.sdn.VnetEdit', {
type: 'vnet' autoShow: true,
type: 'vnet',
}); });
win.on('destroy', reload); win.on('destroy', reload);
win.show(); }
} },
},
remove_btn, remove_btn,
edit_btn, edit_btn,
{ {
text: gettext('Revert'), text: gettext('Revert'),
handler: function() { handler: function() {
Proxmox.Utils.API2Request({ Proxmox.Utils.API2Request({
url: '/cluster/sdn/vnets/', url: '/cluster/sdn/vnets/',
method: 'DELETE', method: 'DELETE',
waitMsgTarget: me, waitMsgTarget: me,
callback: function() { callback: function() {
reload(); reload();
}, },
failure: function(response, opts) { failure: function(response, opts) {
Ext.Msg.alert(gettext('Error'), response.htmlStatus); Ext.Msg.alert(gettext('Error'), response.htmlStatus);
} }
}); });
} }
}, },
], ],
columns: [ columns: [
{ {
header: 'ID', header: 'ID',
flex: 2, flex: 2,
sortable: true,
dataIndex: 'vnet' dataIndex: 'vnet'
}, },
{ {
header: gettext('alias'), header: gettext('Alias'),
flex: 1, flex: 1,
sortable: true,
dataIndex: 'alias', dataIndex: 'alias',
}, },
{ {
header: gettext('zone'), header: gettext('Zone'),
flex: 1, flex: 1,
sortable: true,
dataIndex: 'zone', dataIndex: 'zone',
}, },
{ {
header: gettext('tag'), header: gettext('Tag'),
flex: 1, flex: 1,
sortable: true,
dataIndex: 'tag', dataIndex: 'tag',
}, },
{ {
header: gettext('ipv4'), header: 'IPv4/CIDR',
flex: 1, flex: 1,
sortable: true,
dataIndex: 'ipv4', dataIndex: 'ipv4',
}, },
{ {
header: gettext('ipv6'), header: 'IPv6/CIDR',
flex: 1, flex: 1,
sortable: true,
dataIndex: 'ipv6', dataIndex: 'ipv6',
}, },
{ {
header: gettext('mac'), header: 'MAC',
flex: 1, flex: 1,
sortable: true,
dataIndex: 'mac', dataIndex: 'mac',
}, },
{ {
header: gettext('mtu'), header: 'MTU',
flex: 1, flex: 1,
sortable: true,
dataIndex: 'mtu', dataIndex: 'mtu',
}, },
], ],
@ -151,7 +139,15 @@ Ext.define('PVE.sdn.VnetView', {
Ext.define('pve-sdn-vnet', { Ext.define('pve-sdn-vnet', {
extend: 'Ext.data.Model', extend: 'Ext.data.Model',
fields: [ fields: [
'type' 'alias',
'ipv4',
'ipv6',
'mac',
'mtu',
'tag',
'type',
'vnet',
'zone',
], ],
idProperty: 'vnet' idProperty: 'vnet'
}); });

5
www/manager6/sdn/ZoneContentView.js
View File

@ -1,6 +1,5 @@
Ext.define('PVE.sdn.ZoneContentView', { Ext.define('PVE.sdn.ZoneContentView', {
extend: 'Ext.grid.GridPanel', extend: 'Ext.grid.GridPanel',
alias: 'widget.pveSDNZoneContentView', alias: 'widget.pveSDNZoneContentView',
stateful: true, stateful: true,
@ -57,7 +56,7 @@ Ext.define('PVE.sdn.ZoneContentView', {
], ],
columns: [ columns: [
{ {
header: gettext('Vnet'), header: 'VNet',
flex: 1, flex: 1,
sortable: true, sortable: true,
dataIndex: 'vnet' dataIndex: 'vnet'
@ -68,7 +67,7 @@ Ext.define('PVE.sdn.ZoneContentView', {
dataIndex: 'status', dataIndex: 'status',
}, },
{ {
header: gettext('Status details'), header: gettext('Details'),
width: 20, width: 20,
dataIndex: 'statusmsg', dataIndex: 'statusmsg',
}, },

63
www/manager6/sdn/ZoneView.js
View File

@ -7,7 +7,7 @@ Ext.define('PVE.sdn.ZoneView', {
stateId: 'grid-sdn-zone', stateId: 'grid-sdn-zone',
createSDNEditWindow: function(type, sid) { createSDNEditWindow: function(type, sid) {
var schema = PVE.Utils.sdnzoneSchema[type]; let schema = PVE.Utils.sdnzoneSchema[type];
if (!schema || !schema.ipanel) { if (!schema || !schema.ipanel) {
throw "no editor registered for zone type: " + type; throw "no editor registered for zone type: " + type;
} }
@ -24,9 +24,9 @@ Ext.define('PVE.sdn.ZoneView', {
}, },
initComponent : function() { initComponent : function() {
var me = this; let me = this;
var store = new Ext.data.Store({ let store = new Ext.data.Store({
model: 'pve-sdn-zone', model: 'pve-sdn-zone',
proxy: { proxy: {
type: 'proxmox', type: 'proxmox',
@ -38,45 +38,45 @@ Ext.define('PVE.sdn.ZoneView', {
}, },
}); });
var reload = function() { let reload = function() {
store.load(); store.load();
}; };
var sm = Ext.create('Ext.selection.RowModel', {}); let sm = Ext.create('Ext.selection.RowModel', {});
var run_editor = function() { let run_editor = function() {
var rec = sm.getSelection()[0]; let rec = sm.getSelection()[0];
if (!rec) { if (!rec) {
return; return;
} }
var type = rec.data.type, let type = rec.data.type,
zone = rec.data.zone; zone = rec.data.zone;
me.createSDNEditWindow(type, zone); me.createSDNEditWindow(type, zone);
}; };
var edit_btn = new Proxmox.button.Button({ let edit_btn = new Proxmox.button.Button({
text: gettext('Edit'), text: gettext('Edit'),
disabled: true, disabled: true,
selModel: sm, selModel: sm,
handler: run_editor handler: run_editor
}); });
var remove_btn = Ext.create('Proxmox.button.StdRemoveButton', { let remove_btn = Ext.create('Proxmox.button.StdRemoveButton', {
selModel: sm, selModel: sm,
baseurl: '/cluster/sdn/zones/', baseurl: '/cluster/sdn/zones/',
callback: reload callback: reload
}); });
// else we cannot dynamically generate the add menu handlers // else we cannot dynamically generate the add menu handlers
var addHandleGenerator = function(type) { let addHandleGenerator = function(type) {
return function() { me.createSDNEditWindow(type); }; return function() { me.createSDNEditWindow(type); };
}; };
var addMenuItems = [], type; let addMenuItems = [], type;
/*jslint forin: true */ /*jslint forin: true */
for (type in PVE.Utils.sdnzoneSchema) { for (type in PVE.Utils.sdnzoneSchema) {
var zone = PVE.Utils.sdnzoneSchema[type]; let zone = PVE.Utils.sdnzoneSchema[type];
if (zone.hideAdd) { if (zone.hideAdd) {
continue; continue;
} }
@ -103,41 +103,38 @@ Ext.define('PVE.sdn.ZoneView', {
}, },
remove_btn, remove_btn,
edit_btn, edit_btn,
{ {
text: gettext('Revert'), text: gettext('Revert'),
handler: function() { handler: function() {
Proxmox.Utils.API2Request({ Proxmox.Utils.API2Request({
url: '/cluster/sdn/zones/', url: '/cluster/sdn/zones/',
method: 'DELETE', method: 'DELETE',
waitMsgTarget: me, waitMsgTarget: me,
callback: function() { callback: function() {
reload(); reload();
}, },
failure: function(response, opts) { failure: function(response, opts) {
Ext.Msg.alert(gettext('Error'), response.htmlStatus); Ext.Msg.alert(gettext('Error'), response.htmlStatus);
} }
}); });
} }
}, },
], ],
columns: [ columns: [
{ {
header: 'ID', header: 'ID',
flex: 2, flex: 2,
sortable: true,
dataIndex: 'zone' dataIndex: 'zone'
}, },
{ {
header: gettext('Type'), header: gettext('Type'),
flex: 1, flex: 1,
sortable: true,
dataIndex: 'type', dataIndex: 'type',
renderer: PVE.Utils.format_sdnzone_type renderer: PVE.Utils.format_sdnzone_type
}, },
{ {
header: gettext('Nodes'), header: gettext('Nodes'),
flex: 1, flex: 3,
sortable: true,
dataIndex: 'nodes', dataIndex: 'nodes',
}, },
], ],