In order to reuse the zone content panel for future, additional, panels in the SDN browser, move all static configuration properties into the declaration of the ExtJS widget. In particular, make the on_(de)select callbacks configurable, so this panel can be customized to work with a multitude of additional panels.
This is a preparation for extended status reporting for SDN zones, which will add several new panels that want to utilize the content view. The selectionModel uses the default configuration that is included in the GridPanel, so it can be removed. No functional changes intended. Signed-off-by: Stefan Hanreich <[email protected]> --- www/manager6/sdn/ZoneContentPanel.js | 11 +++- www/manager6/sdn/ZoneContentView.js | 75 +++++++++++++++------------- 2 files changed, 49 insertions(+), 37 deletions(-) diff --git a/www/manager6/sdn/ZoneContentPanel.js b/www/manager6/sdn/ZoneContentPanel.js index 76b8500b1..50d2dd741 100644 --- a/www/manager6/sdn/ZoneContentPanel.js +++ b/www/manager6/sdn/ZoneContentPanel.js @@ -18,12 +18,21 @@ Ext.define('PVE.sdn.ZoneContentPanel', { var vnetview_panel = Ext.createWidget('pveSDNZoneContentView', { title: 'VNets', region: 'west', - permissions_panel: permissions_panel, + sub_panel: permissions_panel, nodename: me.nodename, zone: me.zone, width: '50%', border: false, split: true, + + on_select: function (_sm, rec) { + let path = `/sdn/zones/${me.zone}/${rec.data.vnet}`; + permissions_panel.setPath(path); + }, + + on_deselect: function () { + permissions_panel.setPath(undefined); + }, }); Ext.apply(me, { diff --git a/www/manager6/sdn/ZoneContentView.js b/www/manager6/sdn/ZoneContentView.js index 97b3612e1..2243f277f 100644 --- a/www/manager6/sdn/ZoneContentView.js +++ b/www/manager6/sdn/ZoneContentView.js @@ -16,6 +16,43 @@ Ext.define( groupHeaderTpl: '{name} ({rows.length} Item{[values.rows.length > 1 ? "s" : ""]})', }, ], + + sub_panel: null, + + columns: [ + { + header: gettext('VNet'), + width: 100, + sortable: true, + dataIndex: 'vnet', + }, + { + header: gettext('Alias'), + width: 300, + sortable: true, + dataIndex: 'alias', + }, + { + header: gettext('Status'), + width: 100, + sortable: true, + dataIndex: 'status', + }, + { + header: gettext('Details'), + flex: 1, + dataIndex: 'statusmsg', + }, + ], + + on_select: function (selectionModel, record) { + // do nothing by default + }, + + on_deselect: function () { + // do nothing by default + }, + initComponent: function () { var me = this; @@ -44,8 +81,6 @@ Ext.define( }, }); - var sm = Ext.create('Ext.selection.RowModel', {}); - var reload = function () { store.load(); }; @@ -53,43 +88,11 @@ Ext.define( Proxmox.Utils.monStoreErrors(me, store); Ext.apply(me, { store: store, - selModel: sm, - tbar: [], - columns: [ - { - header: 'VNet', - width: 100, - sortable: true, - dataIndex: 'vnet', - }, - { - header: 'Alias', - width: 300, - sortable: true, - dataIndex: 'alias', - }, - { - header: gettext('Status'), - width: 100, - sortable: true, - dataIndex: 'status', - }, - { - header: gettext('Details'), - flex: 1, - dataIndex: 'statusmsg', - }, - ], listeners: { activate: reload, show: reload, - select: function (_sm, rec) { - let path = `/sdn/zones/${me.zone}/${rec.data.vnet}`; - me.permissions_panel.setPath(path); - }, - deselect: function () { - me.permissions_panel.setPath(undefined); - }, + select: me.on_select, + deselect: me.on_deselect, }, }); store.load(); -- 2.47.3 _______________________________________________ pve-devel mailing list [email protected] https://lists.proxmox.com/cgi-bin/mailman/listinfo/pve-devel
